@m3e/web 2.0.3 → 2.0.4

package/dist/css-custom-data.json

@@ -3642,6 +3642,31 @@
       "description": "Font size of the avatar slot content.",
       "values": []
     },
+    {
+      "name": "--m3e-chip-avatar-icon-size",
+      "description": "Size of the icon displayed inside the avatar when used in a chip.",
+      "values": []
+    },
+    {
+      "name": "--m3e-chip-avatar-font-size",
+      "description": "Font size of text initials inside the avatar when used in a chip.",
+      "values": []
+    },
+    {
+      "name": "--m3e-chip-avatar-font-weight",
+      "description": "Font weight of text initials inside the avatar when used in a chip.",
+      "values": []
+    },
+    {
+      "name": "--m3e-chip-avatar-line-height",
+      "description": "Line height of text initials inside the avatar when used in a chip.",
+      "values": []
+    },
+    {
+      "name": "--m3e-chip-avatar-tracking",
+      "description": "Letter spacing (tracking) of text initials inside the avatar when used in a chip.",
+      "values": []
+    },
     {
       "name": "--m3e-chip-disabled-avatar-opacity",
       "description": "Opacity applied to the avatar when disabled.",
@@ -8612,241 +8637,6 @@
       "description": "Horizontal gap between elements.",
       "values": []
     },
-    {
-      "name": "--m3e-list-item-leading-space",
-      "description": "Horizontal padding for the leading side.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-trailing-space",
-      "description": "Horizontal padding for the trailing side.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-padding-inline",
-      "description": "Horizontal padding for the list item.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-padding-block",
-      "description": "Vertical padding for the list item.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-one-line-top-space",
-      "description": "Top padding for one-line items.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-one-line-bottom-space",
-      "description": "Bottom padding for one-line items.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-two-line-top-space",
-      "description": "Top padding for two-line items.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-two-line-bottom-space",
-      "description": "Bottom padding for two-line items.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-three-line-top-space",
-      "description": "Top padding for three-line items.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-three-line-bottom-space",
-      "description": "Bottom padding for three-line items.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-font-size",
-      "description": "Font size for main content.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-font-weight",
-      "description": "Font weight for main content.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-line-height",
-      "description": "Line height for main content.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-tracking",
-      "description": "Letter spacing for main content.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-overline-font-size",
-      "description": "Font size for overline slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-overline-font-weight",
-      "description": "Font weight for overline slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-overline-line-height",
-      "description": "Line height for overline slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-overline-tracking",
-      "description": "Letter spacing for overline slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-supporting-text-font-size",
-      "description": "Font size for supporting text slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-supporting-text-font-weight",
-      "description": "Font weight for supporting text slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-supporting-text-line-height",
-      "description": "Line height for supporting text slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-supporting-text-tracking",
-      "description": "Letter spacing for supporting text slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-trailing-text-font-size",
-      "description": "Font size for trailing supporting text slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-trailing-text-font-weight",
-      "description": "Font weight for trailing supporting text slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-trailing-text-line-height",
-      "description": "Line height for trailing supporting text slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-trailing-text-tracking",
-      "description": "Letter spacing for trailing supporting text slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-icon-size",
-      "description": "Size for leading/trailing icons.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-label-text-color",
-      "description": "Color for the main content.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-overline-color",
-      "description": "Color for the overline slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-supporting-text-color",
-      "description": "Color for the supporting text slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-leading-color",
-      "description": "Color for the leading content.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-trailing-color",
-      "description": "Color for the trailing content.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-container-color",
-      "description": "Background color of the list item.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-container-shape",
-      "description": "Border radius of the list item.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-hover-container-shape",
-      "description": "Border radius of the list item on hover.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-focus-container-shape",
-      "description": "Border radius of the list item on focus.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-video-width",
-      "description": "Width of the video slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-video-height",
-      "description": "Height of the video slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-video-shape",
-      "description": "Border radius of the video slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-image-width",
-      "description": "Width of the image slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-image-height",
-      "description": "Height of the image slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-image-shape",
-      "description": "Border radius of the image slot.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-three-line-top-offset",
-      "description": "Top offset for media in three line items.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-one-line-height",
-      "description": "Minimum height of a one line list item.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-two-line-height",
-      "description": "Minimum height of a two line list item.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-three-line-height",
-      "description": "Minimum height of a three line list item.",
-      "values": []
-    },
-    {
-      "name": "--m3e-list-item-between-space",
-      "description": "Horizontal gap between elements.",
-      "values": []
-    },
     {
       "name": "--m3e-list-item-padding-inline",
       "description": "Horizontal padding for the list item.",
@@ -10613,148 +10403,148 @@
       "values": []
     },
     {
-      "name": "--m3e-circular-flat-progress-indicator-diameter",
-      "description": "Diameter of the `flat` variant.",
+      "name": "--m3e-radio-container-size",
+      "description": "Base size of the radio button container.",
       "values": []
     },
     {
-      "name": "--m3e-circular-wavy-progress-indicator-diameter",
-      "description": "Diameter of the `wavy` variant.",
+      "name": "--m3e-radio-icon-size",
+      "description": "Size of the radio icon inside the wrapper.",
       "values": []
     },
     {
-      "name": "--m3e-circular-wavy-progress-indicator-amplitude",
-      "description": "Amplitude of the `wavy` variant.",
+      "name": "--m3e-radio-unselected-hover-color",
+      "description": "Hover state layer color when radio is not selected.",
       "values": []
     },
     {
-      "name": "--m3e-circular-wavy-progress-indicator-wavelength",
-      "description": "Wavelength of the `wavy` variant.",
+      "name": "--m3e-radio-unselected-focus-color",
+      "description": "Focus state layer color when radio is not selected.",
       "values": []
     },
     {
-      "name": "--m3e-circular-progress-indicator-thickness",
-      "description": "Thickness of the progress indicator.",
+      "name": "--m3e-radio-unselected-ripple-color",
+      "description": "Ripple color when radio is not selected.",
       "values": []
     },
     {
-      "name": "--m3e-progress-indicator-track-color",
-      "description": "Track color of the progress indicator (background).",
+      "name": "--m3e-radio-unselected-icon-color",
+      "description": "Icon color when radio is not selected.",
       "values": []
     },
     {
-      "name": "--m3e-progress-indicator-color",
-      "description": "Color of the progress indicator (foreground).",
+      "name": "--m3e-radio-selected-hover-color",
+      "description": "Hover state layer color when radio is selected.",
       "values": []
     },
     {
-      "name": "--m3e-linear-progress-indicator-thickness",
-      "description": "Thickness (height) of the progress bar.",
+      "name": "--m3e-radio-selected-focus-color",
+      "description": "Focus state layer color when radio is selected.",
       "values": []
     },
     {
-      "name": "--m3e-linear-progress-indicator-shape",
-      "description": "Border radius of the progress bar.",
+      "name": "--m3e-radio-selected-ripple-color",
+      "description": "Ripple color when radio is selected.",
       "values": []
     },
     {
-      "name": "--m3e-progress-indicator-track-color",
-      "description": "Track color of the progress bar (background/buffer).",
+      "name": "--m3e-radio-selected-icon-color",
+      "description": "Icon color when radio is selected.",
       "values": []
     },
     {
-      "name": "--m3e-progress-indicator-color",
-      "description": "Color of the progress indicator (foreground).",
+      "name": "--m3e-radio-disabled-icon-color",
+      "description": "Icon color when radio is disabled.",
       "values": []
     },
     {
-      "name": "--m3e-linear-wavy-progress-indicator-amplitude",
-      "description": "Amplitude of the `wavy` variant.",
+      "name": "--m3e-radio-error-hover-color",
+      "description": "Fallback hover color used when the radio is invalid and touched.",
       "values": []
     },
     {
-      "name": "--m3e-linear-wavy-progress-indicator-wavelength",
-      "description": "Wavelength of the `wavy` variant.",
+      "name": "--m3e-radio-error-focus-color",
+      "description": "Fallback focus color used when the radio is invalid and touched.",
       "values": []
     },
     {
-      "name": "--m3e-linear-wavy-indeterminate-progress-indicator-wavelength",
-      "description": "Wavelength of the indeterminate/query `wavy` variant.",
+      "name": "--m3e-radio-error-ripple-color",
+      "description": "Fallback ripple color used when the radio is invalid and touched.",
       "values": []
     },
     {
-      "name": "--m3e-radio-container-size",
-      "description": "Base size of the radio button container.",
+      "name": "--m3e-radio-error-icon-color",
+      "description": "Fallback icon color used when the radio is invalid and touched.",
       "values": []
     },
     {
-      "name": "--m3e-radio-icon-size",
-      "description": "Size of the radio icon inside the wrapper.",
+      "name": "--m3e-circular-flat-progress-indicator-diameter",
+      "description": "Diameter of the `flat` variant.",
       "values": []
     },
     {
-      "name": "--m3e-radio-unselected-hover-color",
-      "description": "Hover state layer color when radio is not selected.",
+      "name": "--m3e-circular-wavy-progress-indicator-diameter",
+      "description": "Diameter of the `wavy` variant.",
       "values": []
     },
     {
-      "name": "--m3e-radio-unselected-focus-color",
-      "description": "Focus state layer color when radio is not selected.",
+      "name": "--m3e-circular-wavy-progress-indicator-amplitude",
+      "description": "Amplitude of the `wavy` variant.",
       "values": []
     },
     {
-      "name": "--m3e-radio-unselected-ripple-color",
-      "description": "Ripple color when radio is not selected.",
+      "name": "--m3e-circular-wavy-progress-indicator-wavelength",
+      "description": "Wavelength of the `wavy` variant.",
       "values": []
     },
     {
-      "name": "--m3e-radio-unselected-icon-color",
-      "description": "Icon color when radio is not selected.",
+      "name": "--m3e-circular-progress-indicator-thickness",
+      "description": "Thickness of the progress indicator.",
       "values": []
     },
     {
-      "name": "--m3e-radio-selected-hover-color",
-      "description": "Hover state layer color when radio is selected.",
+      "name": "--m3e-progress-indicator-track-color",
+      "description": "Track color of the progress indicator (background).",
       "values": []
     },
     {
-      "name": "--m3e-radio-selected-focus-color",
-      "description": "Focus state layer color when radio is selected.",
+      "name": "--m3e-progress-indicator-color",
+      "description": "Color of the progress indicator (foreground).",
       "values": []
     },
     {
-      "name": "--m3e-radio-selected-ripple-color",
-      "description": "Ripple color when radio is selected.",
+      "name": "--m3e-linear-progress-indicator-thickness",
+      "description": "Thickness (height) of the progress bar.",
       "values": []
     },
     {
-      "name": "--m3e-radio-selected-icon-color",
-      "description": "Icon color when radio is selected.",
+      "name": "--m3e-linear-progress-indicator-shape",
+      "description": "Border radius of the progress bar.",
       "values": []
     },
     {
-      "name": "--m3e-radio-disabled-icon-color",
-      "description": "Icon color when radio is disabled.",
+      "name": "--m3e-progress-indicator-track-color",
+      "description": "Track color of the progress bar (background/buffer).",
       "values": []
     },
     {
-      "name": "--m3e-radio-error-hover-color",
-      "description": "Fallback hover color used when the radio is invalid and touched.",
+      "name": "--m3e-progress-indicator-color",
+      "description": "Color of the progress indicator (foreground).",
       "values": []
     },
     {
-      "name": "--m3e-radio-error-focus-color",
-      "description": "Fallback focus color used when the radio is invalid and touched.",
+      "name": "--m3e-linear-wavy-progress-indicator-amplitude",
+      "description": "Amplitude of the `wavy` variant.",
       "values": []
     },
     {
-      "name": "--m3e-radio-error-ripple-color",
-      "description": "Fallback ripple color used when the radio is invalid and touched.",
+      "name": "--m3e-linear-wavy-progress-indicator-wavelength",
+      "description": "Wavelength of the `wavy` variant.",
       "values": []
     },
     {
-      "name": "--m3e-radio-error-icon-color",
-      "description": "Fallback icon color used when the radio is invalid and touched.",
+      "name": "--m3e-linear-wavy-indeterminate-progress-indicator-wavelength",
+      "description": "Wavelength of the indeterminate/query `wavy` variant.",
       "values": []
     },
     {
@@ -11453,513 +11243,513 @@
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-icon-color",
-      "description": "Color of the icon when the switch is selected.",
+      "name": "--m3e-step-shape",
+      "description": "Border radius of the step container, defining its visual shape.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-icon-size",
-      "description": "Size of the icon in the selected state.",
+      "name": "--m3e-step-padding",
+      "description": "Internal padding of the step container, used for layout spacing.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-icon-color",
-      "description": "Color of the icon when the switch is unselected.",
+      "name": "--m3e-step-icon-shape",
+      "description": "Border radius of the icon container, controlling its geometric form.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-icon-size",
-      "description": "Size of the icon in the unselected state.",
+      "name": "--m3e-step-icon-size",
+      "description": "Width and height of the icon container and icon glyph.",
       "values": []
     },
     {
-      "name": "--m3e-switch-track-height",
-      "description": "Height of the switch track.",
+      "name": "--m3e-step-selected-icon-container-color",
+      "description": "Background color of the icon when the step is selected.",
       "values": []
     },
     {
-      "name": "--m3e-switch-track-width",
-      "description": "Width of the switch track.",
+      "name": "--m3e-step-selected-icon-color",
+      "description": "Foreground color of the icon when the step is selected.",
       "values": []
     },
     {
-      "name": "--m3e-switch-track-outline-color",
-      "description": "Color of the track’s outline.",
+      "name": "--m3e-step-completed-icon-container-color",
+      "description": "Background color of the icon when the step is completed.",
       "values": []
     },
     {
-      "name": "--m3e-switch-track-outline-width",
-      "description": "Thickness of the track’s outline.",
+      "name": "--m3e-step-completed-icon-color",
+      "description": "Foreground color of the icon when the step is completed.",
       "values": []
     },
     {
-      "name": "--m3e-switch-track-shape",
-      "description": "Corner shape of the track.",
+      "name": "--m3e-step-unselected-icon-container-color",
+      "description": "Background color of the icon when the step is inactive.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-track-color",
-      "description": "Track color when selected.",
+      "name": "--m3e-step-unselected-icon-color",
+      "description": "Foreground color of the icon when the step is inactive.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-track-color",
-      "description": "Track color when unselected.",
+      "name": "--m3e-step-icon-error-color",
+      "description": "Foreground color of the icon when the step is invalid.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-handle-height",
-      "description": "Height of the handle when unselected.",
+      "name": "--m3e-step-disabled-icon-container-color",
+      "description": "Base color used to mix the disabled icon background.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-handle-width",
-      "description": "Width of the handle when unselected.",
+      "name": "--m3e-step-disabled-icon-color",
+      "description": "Base color used to mix the disabled icon foreground.",
       "values": []
     },
     {
-      "name": "--m3e-switch-with-icon-handle-height",
-      "description": "Height of the handle when icons are present.",
+      "name": "--m3e-step-label-color",
+      "description": "Text color of the step label in its default state.",
       "values": []
     },
     {
-      "name": "--m3e-switch-with-icon-handle-width",
-      "description": "Width of the handle when icons are present.",
+      "name": "--m3e-step-label-error-color",
+      "description": "Text color of the step label when the step is invalid.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-handle-height",
-      "description": "Height of the handle when selected.",
+      "name": "--m3e-step-disabled-label-color",
+      "description": "Base color used to mix the disabled label foreground.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-handle-width",
-      "description": "Width of the handle when selected.",
+      "name": "--m3e-step-font-size",
+      "description": "Font size of the step label.",
       "values": []
     },
     {
-      "name": "--m3e-switch-pressed-handle-height",
-      "description": "Height of the handle during press.",
+      "name": "--m3e-step-font-weight",
+      "description": "Font weight of the step label.",
       "values": []
     },
     {
-      "name": "--m3e-switch-pressed-handle-width",
-      "description": "Width of the handle during press.",
+      "name": "--m3e-step-line-height",
+      "description": "Line height of the step label.",
       "values": []
     },
     {
-      "name": "--m3e-switch-handle-shape",
-      "description": "Corner shape of the handle.",
+      "name": "--m3e-step-tracking",
+      "description": "Letter spacing of the step label.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-handle-color",
-      "description": "Handle color when selected.",
+      "name": "--m3e-step-icon-label-space",
+      "description": "Gap between icon and label.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-handle-color",
-      "description": "Handle color when unselected.",
+      "name": "--m3e-step-hint-font-size",
+      "description": "Font size of hint and error messages.",
       "values": []
     },
     {
-      "name": "--m3e-switch-state-layer-size",
-      "description": "Diameter of the state layer overlay.",
+      "name": "--m3e-step-hint-font-weight",
+      "description": "Font weight of hint and error messages.",
       "values": []
     },
     {
-      "name": "--m3e-switch-state-layer-shape",
-      "description": "Corner shape of the state layer.",
+      "name": "--m3e-step-hint-line-height",
+      "description": "Line height of hint and error messages.",
       "values": []
     },
     {
-      "name": "--m3e-switch-disabled-selected-icon-color",
-      "description": "Icon color when selected and disabled.",
+      "name": "--m3e-step-hint-tracking",
+      "description": "Letter spacing of hint and error messages.",
       "values": []
     },
     {
-      "name": "--m3e-switch-disabled-selected-icon-opacity",
-      "description": "Icon opacity when selected and disabled.",
+      "name": "--m3e-step-hint-color",
+      "description": "Text color of hint messages in valid state.",
       "values": []
     },
     {
-      "name": "--m3e-switch-disabled-unselected-icon-color",
-      "description": "Icon color when unselected and disabled.",
+      "name": "--m3e-step-disabled-hint-color",
+      "description": "Base color used to mix the disabled hint foreground.",
       "values": []
     },
     {
-      "name": "--m3e-switch-disabled-unselected-icon-opacity",
-      "description": "Icon opacity when unselected and disabled.",
+      "name": "--m3e-step-panel-padding",
+      "description": "Padding inside the step panel container, defining internal spacing around content.",
       "values": []
     },
     {
-      "name": "--m3e-switch-disabled-track-opacity",
-      "description": "Track opacity when disabled.",
+      "name": "--m3e-step-panel-spacing",
+      "description": "Vertical gap between stacked elements within the step panel.",
       "values": []
     },
     {
-      "name": "--m3e-switch-disabled-selected-track-color",
-      "description": "Track color when selected and disabled.",
+      "name": "--m3e-step-panel-actions-height",
+      "description": "Minimum height of the slotted actions container.",
       "values": []
     },
     {
-      "name": "--m3e-switch-disabled-unselected-track-color",
-      "description": "Track color when unselected and disabled.",
+      "name": "--m3e-step-divider-thickness",
+      "description": "Thickness of the divider line between steps.",
       "values": []
     },
     {
-      "name": "--m3e-switch-disabled-unselected-track-outline-color",
-      "description": "Outline color when unselected and disabled.",
+      "name": "--m3e-step-divider-color",
+      "description": "Color of the divider line between steps.",
       "values": []
     },
     {
-      "name": "--m3e-switch-disabled-unselected-handle-opacity",
-      "description": "Handle opacity when unselected and disabled.",
+      "name": "--m3e-step-divider-inset",
+      "description": "Inset offset for divider alignment within step layout.",
       "values": []
     },
     {
-      "name": "--m3e-switch-disabled-selected-handle-opacity",
-      "description": "Handle opacity when selected and disabled.",
+      "name": "--m3e-switch-selected-icon-color",
+      "description": "Color of the icon when the switch is selected.",
       "values": []
     },
     {
-      "name": "--m3e-switch-disabled-selected-handle-color",
-      "description": "Handle color when selected and disabled.",
+      "name": "--m3e-switch-selected-icon-size",
+      "description": "Size of the icon in the selected state.",
       "values": []
     },
     {
-      "name": "--m3e-switch-disabled-unselected-handle-color",
-      "description": "Handle color when unselected and disabled.",
+      "name": "--m3e-switch-unselected-icon-color",
+      "description": "Color of the icon when the switch is unselected.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-hover-icon-color",
-      "description": "Icon color when selected and hovered.",
+      "name": "--m3e-switch-unselected-icon-size",
+      "description": "Size of the icon in the unselected state.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-hover-icon-color",
-      "description": "Icon color when unselected and hovered.",
+      "name": "--m3e-switch-track-height",
+      "description": "Height of the switch track.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-hover-track-color",
-      "description": "Track color when selected and hovered.",
+      "name": "--m3e-switch-track-width",
+      "description": "Width of the switch track.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-hover-state-layer-color",
-      "description": "State layer color when selected and hovered.",
+      "name": "--m3e-switch-track-outline-color",
+      "description": "Color of the track’s outline.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-hover-state-layer-opacity",
-      "description": "State layer opacity when selected and hovered.",
+      "name": "--m3e-switch-track-outline-width",
+      "description": "Thickness of the track’s outline.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-hover-track-color",
-      "description": "Track color when unselected and hovered.",
+      "name": "--m3e-switch-track-shape",
+      "description": "Corner shape of the track.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-hover-track-outline-color",
-      "description": "Outline color when unselected and hovered.",
+      "name": "--m3e-switch-selected-track-color",
+      "description": "Track color when selected.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-hover-state-layer-color",
-      "description": "State layer color when unselected and hovered.",
+      "name": "--m3e-switch-unselected-track-color",
+      "description": "Track color when unselected.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-hover-state-layer-opacity",
-      "description": "State layer opacity when unselected and hovered.",
+      "name": "--m3e-switch-unselected-handle-height",
+      "description": "Height of the handle when unselected.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-hover-handle-color",
-      "description": "Handle color when selected and hovered.",
+      "name": "--m3e-switch-unselected-handle-width",
+      "description": "Width of the handle when unselected.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-hover-handle-color",
-      "description": "Handle color when unselected and hovered.",
+      "name": "--m3e-switch-with-icon-handle-height",
+      "description": "Height of the handle when icons are present.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-focus-icon-color",
-      "description": "Icon color when selected and focused.",
+      "name": "--m3e-switch-with-icon-handle-width",
+      "description": "Width of the handle when icons are present.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-focus-icon-color",
-      "description": "Icon color when unselected and focused.",
+      "name": "--m3e-switch-selected-handle-height",
+      "description": "Height of the handle when selected.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-focus-track-color",
-      "description": "Track color when selected and focused.",
+      "name": "--m3e-switch-selected-handle-width",
+      "description": "Width of the handle when selected.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-focus-state-layer-color",
-      "description": "State layer color when selected and focused.",
+      "name": "--m3e-switch-pressed-handle-height",
+      "description": "Height of the handle during press.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-focus-state-layer-opacity",
-      "description": "State layer opacity when selected and focused.",
+      "name": "--m3e-switch-pressed-handle-width",
+      "description": "Width of the handle during press.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-focus-track-color",
-      "description": "Track color when unselected and focused.",
+      "name": "--m3e-switch-handle-shape",
+      "description": "Corner shape of the handle.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-focus-track-outline-color",
-      "description": "Outline color when unselected and focused.",
+      "name": "--m3e-switch-selected-handle-color",
+      "description": "Handle color when selected.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-focus-state-layer-color",
-      "description": "State layer color when unselected and focused.",
+      "name": "--m3e-switch-unselected-handle-color",
+      "description": "Handle color when unselected.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-focus-state-layer-opacity",
-      "description": "State layer opacity when unselected and focused.",
+      "name": "--m3e-switch-state-layer-size",
+      "description": "Diameter of the state layer overlay.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-focus-handle-color",
-      "description": "Handle color when selected and focused.",
+      "name": "--m3e-switch-state-layer-shape",
+      "description": "Corner shape of the state layer.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-focus-handle-color",
-      "description": "Handle color when unselected and focused.",
+      "name": "--m3e-switch-disabled-selected-icon-color",
+      "description": "Icon color when selected and disabled.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-pressed-icon-color",
-      "description": "Icon color when selected and pressed.",
+      "name": "--m3e-switch-disabled-selected-icon-opacity",
+      "description": "Icon opacity when selected and disabled.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-pressed-icon-color",
-      "description": "Icon color when unselected and pressed.",
+      "name": "--m3e-switch-disabled-unselected-icon-color",
+      "description": "Icon color when unselected and disabled.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-pressed-track-color",
-      "description": "Track color when selected and pressed.",
+      "name": "--m3e-switch-disabled-unselected-icon-opacity",
+      "description": "Icon opacity when unselected and disabled.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-pressed-state-layer-color",
-      "description": "State layer color when selected and pressed.",
+      "name": "--m3e-switch-disabled-track-opacity",
+      "description": "Track opacity when disabled.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-pressed-state-layer-opacity",
-      "description": "State layer opacity when selected and pressed.",
+      "name": "--m3e-switch-disabled-selected-track-color",
+      "description": "Track color when selected and disabled.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-pressed-track-color",
-      "description": "Track color when unselected and pressed.",
+      "name": "--m3e-switch-disabled-unselected-track-color",
+      "description": "Track color when unselected and disabled.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-pressed-track-outline-color",
-      "description": "Outline color when unselected and pressed.",
+      "name": "--m3e-switch-disabled-unselected-track-outline-color",
+      "description": "Outline color when unselected and disabled.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-pressed-state-layer-color",
-      "description": "State layer color when unselected and pressed.",
+      "name": "--m3e-switch-disabled-unselected-handle-opacity",
+      "description": "Handle opacity when unselected and disabled.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-pressed-state-layer-opacity",
-      "description": "State layer opacity when unselected and pressed.",
+      "name": "--m3e-switch-disabled-selected-handle-opacity",
+      "description": "Handle opacity when selected and disabled.",
       "values": []
     },
     {
-      "name": "--m3e-switch-selected-pressed-handle-color",
-      "description": "Handle color when selected and pressed.",
+      "name": "--m3e-switch-disabled-selected-handle-color",
+      "description": "Handle color when selected and disabled.",
       "values": []
     },
     {
-      "name": "--m3e-switch-unselected-pressed-handle-color",
-      "description": "Handle color when unselected and pressed.",
+      "name": "--m3e-switch-disabled-unselected-handle-color",
+      "description": "Handle color when unselected and disabled.",
       "values": []
     },
     {
-      "name": "--m3e-step-shape",
-      "description": "Border radius of the step container, defining its visual shape.",
+      "name": "--m3e-switch-selected-hover-icon-color",
+      "description": "Icon color when selected and hovered.",
       "values": []
     },
     {
-      "name": "--m3e-step-padding",
-      "description": "Internal padding of the step container, used for layout spacing.",
+      "name": "--m3e-switch-unselected-hover-icon-color",
+      "description": "Icon color when unselected and hovered.",
       "values": []
     },
     {
-      "name": "--m3e-step-icon-shape",
-      "description": "Border radius of the icon container, controlling its geometric form.",
+      "name": "--m3e-switch-selected-hover-track-color",
+      "description": "Track color when selected and hovered.",
       "values": []
     },
     {
-      "name": "--m3e-step-icon-size",
-      "description": "Width and height of the icon container and icon glyph.",
+      "name": "--m3e-switch-selected-hover-state-layer-color",
+      "description": "State layer color when selected and hovered.",
       "values": []
     },
     {
-      "name": "--m3e-step-selected-icon-container-color",
-      "description": "Background color of the icon when the step is selected.",
+      "name": "--m3e-switch-selected-hover-state-layer-opacity",
+      "description": "State layer opacity when selected and hovered.",
       "values": []
     },
     {
-      "name": "--m3e-step-selected-icon-color",
-      "description": "Foreground color of the icon when the step is selected.",
+      "name": "--m3e-switch-unselected-hover-track-color",
+      "description": "Track color when unselected and hovered.",
       "values": []
     },
     {
-      "name": "--m3e-step-completed-icon-container-color",
-      "description": "Background color of the icon when the step is completed.",
+      "name": "--m3e-switch-unselected-hover-track-outline-color",
+      "description": "Outline color when unselected and hovered.",
       "values": []
     },
     {
-      "name": "--m3e-step-completed-icon-color",
-      "description": "Foreground color of the icon when the step is completed.",
+      "name": "--m3e-switch-unselected-hover-state-layer-color",
+      "description": "State layer color when unselected and hovered.",
       "values": []
     },
     {
-      "name": "--m3e-step-unselected-icon-container-color",
-      "description": "Background color of the icon when the step is inactive.",
+      "name": "--m3e-switch-unselected-hover-state-layer-opacity",
+      "description": "State layer opacity when unselected and hovered.",
       "values": []
     },
     {
-      "name": "--m3e-step-unselected-icon-color",
-      "description": "Foreground color of the icon when the step is inactive.",
+      "name": "--m3e-switch-selected-hover-handle-color",
+      "description": "Handle color when selected and hovered.",
       "values": []
     },
     {
-      "name": "--m3e-step-icon-error-color",
-      "description": "Foreground color of the icon when the step is invalid.",
+      "name": "--m3e-switch-unselected-hover-handle-color",
+      "description": "Handle color when unselected and hovered.",
       "values": []
     },
     {
-      "name": "--m3e-step-disabled-icon-container-color",
-      "description": "Base color used to mix the disabled icon background.",
+      "name": "--m3e-switch-selected-focus-icon-color",
+      "description": "Icon color when selected and focused.",
       "values": []
     },
     {
-      "name": "--m3e-step-disabled-icon-color",
-      "description": "Base color used to mix the disabled icon foreground.",
+      "name": "--m3e-switch-unselected-focus-icon-color",
+      "description": "Icon color when unselected and focused.",
       "values": []
     },
     {
-      "name": "--m3e-step-label-color",
-      "description": "Text color of the step label in its default state.",
+      "name": "--m3e-switch-selected-focus-track-color",
+      "description": "Track color when selected and focused.",
       "values": []
     },
     {
-      "name": "--m3e-step-label-error-color",
-      "description": "Text color of the step label when the step is invalid.",
+      "name": "--m3e-switch-selected-focus-state-layer-color",
+      "description": "State layer color when selected and focused.",
       "values": []
     },
     {
-      "name": "--m3e-step-disabled-label-color",
-      "description": "Base color used to mix the disabled label foreground.",
+      "name": "--m3e-switch-selected-focus-state-layer-opacity",
+      "description": "State layer opacity when selected and focused.",
       "values": []
     },
     {
-      "name": "--m3e-step-font-size",
-      "description": "Font size of the step label.",
+      "name": "--m3e-switch-unselected-focus-track-color",
+      "description": "Track color when unselected and focused.",
       "values": []
     },
     {
-      "name": "--m3e-step-font-weight",
-      "description": "Font weight of the step label.",
+      "name": "--m3e-switch-unselected-focus-track-outline-color",
+      "description": "Outline color when unselected and focused.",
       "values": []
     },
     {
-      "name": "--m3e-step-line-height",
-      "description": "Line height of the step label.",
+      "name": "--m3e-switch-unselected-focus-state-layer-color",
+      "description": "State layer color when unselected and focused.",
       "values": []
     },
     {
-      "name": "--m3e-step-tracking",
-      "description": "Letter spacing of the step label.",
+      "name": "--m3e-switch-unselected-focus-state-layer-opacity",
+      "description": "State layer opacity when unselected and focused.",
       "values": []
     },
     {
-      "name": "--m3e-step-icon-label-space",
-      "description": "Gap between icon and label.",
+      "name": "--m3e-switch-selected-focus-handle-color",
+      "description": "Handle color when selected and focused.",
       "values": []
     },
     {
-      "name": "--m3e-step-hint-font-size",
-      "description": "Font size of hint and error messages.",
+      "name": "--m3e-switch-unselected-focus-handle-color",
+      "description": "Handle color when unselected and focused.",
       "values": []
     },
     {
-      "name": "--m3e-step-hint-font-weight",
-      "description": "Font weight of hint and error messages.",
+      "name": "--m3e-switch-selected-pressed-icon-color",
+      "description": "Icon color when selected and pressed.",
       "values": []
     },
     {
-      "name": "--m3e-step-hint-line-height",
-      "description": "Line height of hint and error messages.",
+      "name": "--m3e-switch-unselected-pressed-icon-color",
+      "description": "Icon color when unselected and pressed.",
       "values": []
     },
     {
-      "name": "--m3e-step-hint-tracking",
-      "description": "Letter spacing of hint and error messages.",
+      "name": "--m3e-switch-selected-pressed-track-color",
+      "description": "Track color when selected and pressed.",
       "values": []
     },
     {
-      "name": "--m3e-step-hint-color",
-      "description": "Text color of hint messages in valid state.",
+      "name": "--m3e-switch-selected-pressed-state-layer-color",
+      "description": "State layer color when selected and pressed.",
       "values": []
     },
     {
-      "name": "--m3e-step-disabled-hint-color",
-      "description": "Base color used to mix the disabled hint foreground.",
+      "name": "--m3e-switch-selected-pressed-state-layer-opacity",
+      "description": "State layer opacity when selected and pressed.",
       "values": []
     },
     {
-      "name": "--m3e-step-panel-padding",
-      "description": "Padding inside the step panel container, defining internal spacing around content.",
+      "name": "--m3e-switch-unselected-pressed-track-color",
+      "description": "Track color when unselected and pressed.",
       "values": []
     },
     {
-      "name": "--m3e-step-panel-spacing",
-      "description": "Vertical gap between stacked elements within the step panel.",
+      "name": "--m3e-switch-unselected-pressed-track-outline-color",
+      "description": "Outline color when unselected and pressed.",
       "values": []
     },
     {
-      "name": "--m3e-step-panel-actions-height",
-      "description": "Minimum height of the slotted actions container.",
+      "name": "--m3e-switch-unselected-pressed-state-layer-color",
+      "description": "State layer color when unselected and pressed.",
       "values": []
     },
     {
-      "name": "--m3e-step-divider-thickness",
-      "description": "Thickness of the divider line between steps.",
+      "name": "--m3e-switch-unselected-pressed-state-layer-opacity",
+      "description": "State layer opacity when unselected and pressed.",
       "values": []
     },
     {
-      "name": "--m3e-step-divider-color",
-      "description": "Color of the divider line between steps.",
+      "name": "--m3e-switch-selected-pressed-handle-color",
+      "description": "Handle color when selected and pressed.",
       "values": []
     },
     {
-      "name": "--m3e-step-divider-inset",
-      "description": "Inset offset for divider alignment within step layout.",
+      "name": "--m3e-switch-unselected-pressed-handle-color",
+      "description": "Handle color when unselected and pressed.",
       "values": []
     },
     {
@@ -12092,51 +11882,6 @@
       "description": "Thickness for secondary variant's active indicator.",
       "values": []
     },
-    {
-      "name": "--m3e-toolbar-size",
-      "description": "The size (height or width) of the toolbar.",
-      "values": []
-    },
-    {
-      "name": "--m3e-toolbar-spacing",
-      "description": "The gap between toolbar items.",
-      "values": []
-    },
-    {
-      "name": "--m3e-toolbar-rounded-shape",
-      "description": "Border radius for rounded shape.",
-      "values": []
-    },
-    {
-      "name": "--m3e-toolbar-rounded-padding",
-      "description": "Padding for rounded shape.",
-      "values": []
-    },
-    {
-      "name": "--m3e-toolbar-square-padding",
-      "description": "Padding for square shape.",
-      "values": []
-    },
-    {
-      "name": "--m3e-toolbar-standard-container-color",
-      "description": "Container color for the standard variant.",
-      "values": []
-    },
-    {
-      "name": "--m3e-toolbar-standard-color",
-      "description": "Foreground color for the standard variant.",
-      "values": []
-    },
-    {
-      "name": "--m3e-toolbar-vibrant-container-color",
-      "description": "Container color for the vibrant variant.",
-      "values": []
-    },
-    {
-      "name": "--m3e-toolbar-vibrant-color",
-      "description": "Foreground color for the vibrant variant.",
-      "values": []
-    },
     {
       "name": "--m3e-toc-width",
       "description": "Width of the table of contents.",
@@ -12452,6 +12197,51 @@
       "description": "Letter spacing of supporting text.",
       "values": []
     },
+    {
+      "name": "--m3e-toolbar-size",
+      "description": "The size (height or width) of the toolbar.",
+      "values": []
+    },
+    {
+      "name": "--m3e-toolbar-spacing",
+      "description": "The gap between toolbar items.",
+      "values": []
+    },
+    {
+      "name": "--m3e-toolbar-rounded-shape",
+      "description": "Border radius for rounded shape.",
+      "values": []
+    },
+    {
+      "name": "--m3e-toolbar-rounded-padding",
+      "description": "Padding for rounded shape.",
+      "values": []
+    },
+    {
+      "name": "--m3e-toolbar-square-padding",
+      "description": "Padding for square shape.",
+      "values": []
+    },
+    {
+      "name": "--m3e-toolbar-standard-container-color",
+      "description": "Container color for the standard variant.",
+      "values": []
+    },
+    {
+      "name": "--m3e-toolbar-standard-color",
+      "description": "Foreground color for the standard variant.",
+      "values": []
+    },
+    {
+      "name": "--m3e-toolbar-vibrant-container-color",
+      "description": "Container color for the vibrant variant.",
+      "values": []
+    },
+    {
+      "name": "--m3e-toolbar-vibrant-color",
+      "description": "Foreground color for the vibrant variant.",
+      "values": []
+    },
     {
       "name": "--m3e-collapsible-animation-duration",
       "description": "The duration of the expand / collapse animation.",