scu-web-components 1.3.21 → 1.3.22

package/dist/tokens/source/scssVariables.json

@@ -348458,8 +348458,8 @@
       "outputSegmentRef": "shape-pill-vars.$corner-radius-bottom-left"
     },
     "shadow-color": {
-      "output": "$comp-scw-floating-button-shape-pill-shadow-color: rgba(0,0,0,0.2);",
-      "outputSegment": "$shadow-color: rgba(0,0,0,0.2);",
+      "output": "$comp-scw-floating-button-shape-pill-shadow-color: rgba(0,0,0,0.28);",
+      "outputSegment": "$shadow-color: rgba(0,0,0,0.28);",
       "outputSegmentRef": "shape-pill-vars.$shadow-color"
     },
     "shadow-offset-x": {
@@ -348468,13 +348468,13 @@
       "outputSegmentRef": "shape-pill-vars.$shadow-offset-x"
     },
     "shadow-offset-y": {
-      "output": "$comp-scw-floating-button-shape-pill-shadow-offset-y: 1px;",
-      "outputSegment": "$shadow-offset-y: 1px;",
+      "output": "$comp-scw-floating-button-shape-pill-shadow-offset-y: 7px;",
+      "outputSegment": "$shadow-offset-y: 7px;",
       "outputSegmentRef": "shape-pill-vars.$shadow-offset-y"
     },
     "shadow-radius": {
-      "output": "$comp-scw-floating-button-shape-pill-shadow-radius: 3px;",
-      "outputSegment": "$shadow-radius: 3px;",
+      "output": "$comp-scw-floating-button-shape-pill-shadow-radius: 22px;",
+      "outputSegment": "$shadow-radius: 22px;",
       "outputSegmentRef": "shape-pill-vars.$shadow-radius"
     },
     "shadow-spread": {
@@ -348483,8 +348483,8 @@
       "outputSegmentRef": "shape-pill-vars.$shadow-spread"
     },
     "shadow": {
-      "output": "$comp-scw-floating-button-shape-pill-shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);",
-      "outputSegment": "$shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);",
+      "output": "$comp-scw-floating-button-shape-pill-shadow: 0px 7px 22px 0px rgba(0,0,0,0.28);",
+      "outputSegment": "$shadow: 0px 7px 22px 0px rgba(0,0,0,0.28);",
       "outputSegmentRef": "shape-pill-vars.$shadow"
     },
     "width": {
@@ -348548,33 +348548,33 @@
       "outputSegmentRef": "shape-pill-vars.$layout-grow"
     },
     "top": {
-      "output": "$comp-scw-floating-button-shape-pill-top: calc( var( --scw-spacing-1 ) * 19.9 );",
-      "outputSegment": "$top: calc( var( --scw-spacing-1 ) * 19.9 );",
+      "output": "$comp-scw-floating-button-shape-pill-top: calc( var( --scw-spacing-1 ) * 21.1 );",
+      "outputSegment": "$top: calc( var( --scw-spacing-1 ) * 21.1 );",
       "outputSegmentRef": "shape-pill-vars.$top"
     },
     "top-percent": {
-      "output": "$comp-scw-floating-button-shape-pill-top-percent: 45.91%;",
-      "outputSegment": "$top-percent: 45.91%;",
+      "output": "$comp-scw-floating-button-shape-pill-top-percent: 48.3%;",
+      "outputSegment": "$top-percent: 48.3%;",
       "outputSegmentRef": "shape-pill-vars.$top-percent"
     },
     "bottom": {
-      "output": "$comp-scw-floating-button-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 24 );",
-      "outputSegment": "$bottom: calc( var( --scw-spacing-1 ) * 24 );",
+      "output": "$comp-scw-floating-button-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 22.8 );",
+      "outputSegment": "$bottom: calc( var( --scw-spacing-1 ) * 22.8 );",
       "outputSegmentRef": "shape-pill-vars.$bottom"
     },
     "left": {
-      "output": "$comp-scw-floating-button-shape-pill-left: var( --scw-spacing-2 );",
-      "outputSegment": "$left: var( --scw-spacing-2 );",
+      "output": "$comp-scw-floating-button-shape-pill-left: var( --scw-spacing-3 );",
+      "outputSegment": "$left: var( --scw-spacing-3 );",
       "outputSegmentRef": "shape-pill-vars.$left"
     },
     "left-percent": {
-      "output": "$comp-scw-floating-button-shape-pill-left-percent: 35.02%;",
-      "outputSegment": "$left-percent: 35.02%;",
+      "output": "$comp-scw-floating-button-shape-pill-left-percent: 37.05%;",
+      "outputSegment": "$left-percent: 37.05%;",
       "outputSegmentRef": "shape-pill-vars.$left-percent"
     },
     "right": {
-      "output": "$comp-scw-floating-button-shape-pill-right: calc( var( --scw-spacing-1 ) * 16.76600036621094 );",
-      "outputSegment": "$right: calc( var( --scw-spacing-1 ) * 16.76600036621094 );",
+      "output": "$comp-scw-floating-button-shape-pill-right: calc( var( --scw-spacing-1 ) * 15.766000366210937 );",
+      "outputSegment": "$right: calc( var( --scw-spacing-1 ) * 15.766000366210937 );",
       "outputSegmentRef": "shape-pill-vars.$right"
     },
     "padding-left": {
@@ -349300,8 +349300,8 @@
       "outputSegmentRef": "size-small-shape-pill-vars.$corner-radius-bottom-left"
     },
     "shadow-color": {
-      "output": "$comp-scw-floating-button-size-small-shape-pill-shadow-color: rgba(0,0,0,0.2);",
-      "outputSegment": "$shadow-color: rgba(0,0,0,0.2);",
+      "output": "$comp-scw-floating-button-size-small-shape-pill-shadow-color: rgba(0,0,0,0.28);",
+      "outputSegment": "$shadow-color: rgba(0,0,0,0.28);",
       "outputSegmentRef": "size-small-shape-pill-vars.$shadow-color"
     },
     "shadow-offset-x": {
@@ -349310,13 +349310,13 @@
       "outputSegmentRef": "size-small-shape-pill-vars.$shadow-offset-x"
     },
     "shadow-offset-y": {
-      "output": "$comp-scw-floating-button-size-small-shape-pill-shadow-offset-y: 1px;",
-      "outputSegment": "$shadow-offset-y: 1px;",
+      "output": "$comp-scw-floating-button-size-small-shape-pill-shadow-offset-y: 7px;",
+      "outputSegment": "$shadow-offset-y: 7px;",
       "outputSegmentRef": "size-small-shape-pill-vars.$shadow-offset-y"
     },
     "shadow-radius": {
-      "output": "$comp-scw-floating-button-size-small-shape-pill-shadow-radius: 3px;",
-      "outputSegment": "$shadow-radius: 3px;",
+      "output": "$comp-scw-floating-button-size-small-shape-pill-shadow-radius: 22px;",
+      "outputSegment": "$shadow-radius: 22px;",
       "outputSegmentRef": "size-small-shape-pill-vars.$shadow-radius"
     },
     "shadow-spread": {
@@ -349325,8 +349325,8 @@
       "outputSegmentRef": "size-small-shape-pill-vars.$shadow-spread"
     },
     "shadow": {
-      "output": "$comp-scw-floating-button-size-small-shape-pill-shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);",
-      "outputSegment": "$shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);",
+      "output": "$comp-scw-floating-button-size-small-shape-pill-shadow: 0px 7px 22px 0px rgba(0,0,0,0.28);",
+      "outputSegment": "$shadow: 0px 7px 22px 0px rgba(0,0,0,0.28);",
       "outputSegmentRef": "size-small-shape-pill-vars.$shadow"
     },
     "width": {
@@ -349390,33 +349390,33 @@
       "outputSegmentRef": "size-small-shape-pill-vars.$layout-grow"
     },
     "top": {
-      "output": "$comp-scw-floating-button-size-small-shape-pill-top: calc( var( --scw-spacing-1 ) * 36.3 );",
-      "outputSegment": "$top: calc( var( --scw-spacing-1 ) * 36.3 );",
+      "output": "$comp-scw-floating-button-size-small-shape-pill-top: calc( var( --scw-spacing-1 ) * 42.6 );",
+      "outputSegment": "$top: calc( var( --scw-spacing-1 ) * 42.6 );",
       "outputSegmentRef": "size-small-shape-pill-vars.$top"
     },
     "top-percent": {
-      "output": "$comp-scw-floating-button-size-small-shape-pill-top-percent: 78.28%;",
-      "outputSegment": "$top-percent: 78.28%;",
+      "output": "$comp-scw-floating-button-size-small-shape-pill-top-percent: 90.85%;",
+      "outputSegment": "$top-percent: 90.85%;",
       "outputSegmentRef": "size-small-shape-pill-vars.$top-percent"
     },
     "bottom": {
-      "output": "$comp-scw-floating-button-size-small-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 7.965999984741211 );",
-      "outputSegment": "$bottom: calc( var( --scw-spacing-1 ) * 7.965999984741211 );",
+      "output": "$comp-scw-floating-button-size-small-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 1.665999984741211 );",
+      "outputSegment": "$bottom: calc( var( --scw-spacing-1 ) * 1.665999984741211 );",
       "outputSegmentRef": "size-small-shape-pill-vars.$bottom"
     },
     "left": {
-      "output": "$comp-scw-floating-button-size-small-shape-pill-left: var( --scw-spacing-2 );",
-      "outputSegment": "$left: var( --scw-spacing-2 );",
+      "output": "$comp-scw-floating-button-size-small-shape-pill-left: calc( var( --scw-spacing-1 ) * 3.3 );",
+      "outputSegment": "$left: calc( var( --scw-spacing-1 ) * 3.3 );",
       "outputSegmentRef": "size-small-shape-pill-vars.$left"
     },
     "left-percent": {
-      "output": "$comp-scw-floating-button-size-small-shape-pill-left-percent: 9.97%;",
-      "outputSegment": "$left-percent: 9.97%;",
+      "output": "$comp-scw-floating-button-size-small-shape-pill-left-percent: 12.61%;",
+      "outputSegment": "$left-percent: 12.61%;",
       "outputSegmentRef": "size-small-shape-pill-vars.$left-percent"
     },
     "right": {
-      "output": "$comp-scw-floating-button-size-small-shape-pill-right: calc( var( --scw-spacing-1 ) * 41.46599998474121 );",
-      "outputSegment": "$right: calc( var( --scw-spacing-1 ) * 41.46599998474121 );",
+      "output": "$comp-scw-floating-button-size-small-shape-pill-right: calc( var( --scw-spacing-1 ) * 40.16599998474121 );",
+      "outputSegment": "$right: calc( var( --scw-spacing-1 ) * 40.16599998474121 );",
       "outputSegmentRef": "size-small-shape-pill-vars.$right"
     },
     "padding-left": {
@@ -349818,8 +349818,8 @@
       "namespace": "state-hover-size-small-shape-pill-vars"
     },
     "background-color": {
-      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-background-color: var( --scw-color-grey-092 );",
-      "outputSegment": "$background-color: var( --scw-color-grey-092 );",
+      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-background-color: var( --scw-color-grey-10 );",
+      "outputSegment": "$background-color: var( --scw-color-grey-10 );",
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$background-color"
     },
     "blend-mode": {
@@ -349828,8 +349828,8 @@
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$blend-mode"
     },
     "stroke-color": {
-      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-stroke-color: var( --scw-color-grey-09 );",
-      "outputSegment": "$stroke-color: var( --scw-color-grey-09 );",
+      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-stroke-color: var( --scw-color-grey-10 );",
+      "outputSegment": "$stroke-color: var( --scw-color-grey-10 );",
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$stroke-color"
     },
     "stroke-weight": {
@@ -349863,8 +349863,8 @@
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$corner-radius-bottom-left"
     },
     "shadow-color": {
-      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-color: rgba(0,0,0,0.2);",
-      "outputSegment": "$shadow-color: rgba(0,0,0,0.2);",
+      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-color: rgba(0,0,0,0.28);",
+      "outputSegment": "$shadow-color: rgba(0,0,0,0.28);",
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$shadow-color"
     },
     "shadow-offset-x": {
@@ -349873,13 +349873,13 @@
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$shadow-offset-x"
     },
     "shadow-offset-y": {
-      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-offset-y: 1px;",
-      "outputSegment": "$shadow-offset-y: 1px;",
+      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-offset-y: 7px;",
+      "outputSegment": "$shadow-offset-y: 7px;",
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$shadow-offset-y"
     },
     "shadow-radius": {
-      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-radius: 3px;",
-      "outputSegment": "$shadow-radius: 3px;",
+      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-radius: 22px;",
+      "outputSegment": "$shadow-radius: 22px;",
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$shadow-radius"
     },
     "shadow-spread": {
@@ -349888,8 +349888,8 @@
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$shadow-spread"
     },
     "shadow": {
-      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);",
-      "outputSegment": "$shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);",
+      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow: 0px 7px 22px 0px rgba(0,0,0,0.28);",
+      "outputSegment": "$shadow: 0px 7px 22px 0px rgba(0,0,0,0.28);",
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$shadow"
     },
     "width": {
@@ -349953,33 +349953,33 @@
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$layout-grow"
     },
     "top": {
-      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-top: calc( var( --scw-spacing-1 ) * 36.3 );",
-      "outputSegment": "$top: calc( var( --scw-spacing-1 ) * 36.3 );",
+      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-top: calc( var( --scw-spacing-1 ) * 42.6 );",
+      "outputSegment": "$top: calc( var( --scw-spacing-1 ) * 42.6 );",
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$top"
     },
     "top-percent": {
-      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-top-percent: 78.28%;",
-      "outputSegment": "$top-percent: 78.28%;",
+      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-top-percent: 90.85%;",
+      "outputSegment": "$top-percent: 90.85%;",
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$top-percent"
     },
     "bottom": {
-      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 7.965999984741211 );",
-      "outputSegment": "$bottom: calc( var( --scw-spacing-1 ) * 7.965999984741211 );",
+      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 1.665999984741211 );",
+      "outputSegment": "$bottom: calc( var( --scw-spacing-1 ) * 1.665999984741211 );",
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$bottom"
     },
     "left": {
-      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-left: calc( var( --scw-spacing-1 ) * 10.9 );",
-      "outputSegment": "$left: calc( var( --scw-spacing-1 ) * 10.9 );",
+      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-left: calc( var( --scw-spacing-1 ) * 18.4 );",
+      "outputSegment": "$left: calc( var( --scw-spacing-1 ) * 18.4 );",
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$left"
     },
     "left-percent": {
-      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-left-percent: 28.03%;",
-      "outputSegment": "$left-percent: 28.03%;",
+      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-left-percent: 43.24%;",
+      "outputSegment": "$left-percent: 43.24%;",
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$left-percent"
     },
     "right": {
-      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-right: calc( var( --scw-spacing-1 ) * 32.56599998474121 );",
-      "outputSegment": "$right: calc( var( --scw-spacing-1 ) * 32.56599998474121 );",
+      "output": "$comp-scw-floating-button-state-hover-size-small-shape-pill-right: calc( var( --scw-spacing-1 ) * 25.06599998474121 );",
+      "outputSegment": "$right: calc( var( --scw-spacing-1 ) * 25.06599998474121 );",
       "outputSegmentRef": "state-hover-size-small-shape-pill-vars.$right"
     },
     "padding-left": {
@@ -350381,8 +350381,8 @@
       "namespace": "state-hover-shape-pill-vars"
     },
     "background-color": {
-      "output": "$comp-scw-floating-button-state-hover-shape-pill-background-color: var( --scw-color-grey-092 );",
-      "outputSegment": "$background-color: var( --scw-color-grey-092 );",
+      "output": "$comp-scw-floating-button-state-hover-shape-pill-background-color: var( --scw-color-grey-10 );",
+      "outputSegment": "$background-color: var( --scw-color-grey-10 );",
       "outputSegmentRef": "state-hover-shape-pill-vars.$background-color"
     },
     "blend-mode": {
@@ -350391,8 +350391,8 @@
       "outputSegmentRef": "state-hover-shape-pill-vars.$blend-mode"
     },
     "stroke-color": {
-      "output": "$comp-scw-floating-button-state-hover-shape-pill-stroke-color: var( --scw-color-grey-09 );",
-      "outputSegment": "$stroke-color: var( --scw-color-grey-09 );",
+      "output": "$comp-scw-floating-button-state-hover-shape-pill-stroke-color: var( --scw-color-grey-10 );",
+      "outputSegment": "$stroke-color: var( --scw-color-grey-10 );",
       "outputSegmentRef": "state-hover-shape-pill-vars.$stroke-color"
     },
     "stroke-weight": {
@@ -350426,8 +350426,8 @@
       "outputSegmentRef": "state-hover-shape-pill-vars.$corner-radius-bottom-left"
     },
     "shadow-color": {
-      "output": "$comp-scw-floating-button-state-hover-shape-pill-shadow-color: rgba(0,0,0,0.2);",
-      "outputSegment": "$shadow-color: rgba(0,0,0,0.2);",
+      "output": "$comp-scw-floating-button-state-hover-shape-pill-shadow-color: rgba(0,0,0,0.42);",
+      "outputSegment": "$shadow-color: rgba(0,0,0,0.42);",
       "outputSegmentRef": "state-hover-shape-pill-vars.$shadow-color"
     },
     "shadow-offset-x": {
@@ -350436,13 +350436,13 @@
       "outputSegmentRef": "state-hover-shape-pill-vars.$shadow-offset-x"
     },
     "shadow-offset-y": {
-      "output": "$comp-scw-floating-button-state-hover-shape-pill-shadow-offset-y: 1px;",
-      "outputSegment": "$shadow-offset-y: 1px;",
+      "output": "$comp-scw-floating-button-state-hover-shape-pill-shadow-offset-y: 8px;",
+      "outputSegment": "$shadow-offset-y: 8px;",
       "outputSegmentRef": "state-hover-shape-pill-vars.$shadow-offset-y"
     },
     "shadow-radius": {
-      "output": "$comp-scw-floating-button-state-hover-shape-pill-shadow-radius: 3px;",
-      "outputSegment": "$shadow-radius: 3px;",
+      "output": "$comp-scw-floating-button-state-hover-shape-pill-shadow-radius: 24px;",
+      "outputSegment": "$shadow-radius: 24px;",
       "outputSegmentRef": "state-hover-shape-pill-vars.$shadow-radius"
     },
     "shadow-spread": {
@@ -350451,8 +350451,8 @@
       "outputSegmentRef": "state-hover-shape-pill-vars.$shadow-spread"
     },
     "shadow": {
-      "output": "$comp-scw-floating-button-state-hover-shape-pill-shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);",
-      "outputSegment": "$shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);",
+      "output": "$comp-scw-floating-button-state-hover-shape-pill-shadow: 0px 8px 24px 0px rgba(0,0,0,0.42);",
+      "outputSegment": "$shadow: 0px 8px 24px 0px rgba(0,0,0,0.42);",
       "outputSegmentRef": "state-hover-shape-pill-vars.$shadow"
     },
     "width": {
@@ -350516,33 +350516,33 @@
       "outputSegmentRef": "state-hover-shape-pill-vars.$layout-grow"
     },
     "top": {
-      "output": "$comp-scw-floating-button-state-hover-shape-pill-top: calc( var( --scw-spacing-1 ) * 28.1 );",
-      "outputSegment": "$top: calc( var( --scw-spacing-1 ) * 28.1 );",
+      "output": "$comp-scw-floating-button-state-hover-shape-pill-top: calc( var( --scw-spacing-1 ) * 32.8 );",
+      "outputSegment": "$top: calc( var( --scw-spacing-1 ) * 32.8 );",
       "outputSegmentRef": "state-hover-shape-pill-vars.$top"
     },
     "top-percent": {
-      "output": "$comp-scw-floating-button-state-hover-shape-pill-top-percent: 62.28%;",
-      "outputSegment": "$top-percent: 62.28%;",
+      "output": "$comp-scw-floating-button-state-hover-shape-pill-top-percent: 71.66%;",
+      "outputSegment": "$top-percent: 71.66%;",
       "outputSegmentRef": "state-hover-shape-pill-vars.$top-percent"
     },
     "bottom": {
-      "output": "$comp-scw-floating-button-state-hover-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 15.8 );",
-      "outputSegment": "$bottom: calc( var( --scw-spacing-1 ) * 15.8 );",
+      "output": "$comp-scw-floating-button-state-hover-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 11.1 );",
+      "outputSegment": "$bottom: calc( var( --scw-spacing-1 ) * 11.1 );",
       "outputSegmentRef": "state-hover-shape-pill-vars.$bottom"
     },
     "left": {
-      "output": "$comp-scw-floating-button-state-hover-shape-pill-left: var( --scw-spacing-2 );",
-      "outputSegment": "$left: var( --scw-spacing-2 );",
+      "output": "$comp-scw-floating-button-state-hover-shape-pill-left: calc( var( --scw-spacing-1 ) * 3.1 );",
+      "outputSegment": "$left: calc( var( --scw-spacing-1 ) * 3.1 );",
       "outputSegmentRef": "state-hover-shape-pill-vars.$left"
     },
     "left-percent": {
-      "output": "$comp-scw-floating-button-state-hover-shape-pill-left-percent: 35.02%;",
-      "outputSegment": "$left-percent: 35.02%;",
+      "output": "$comp-scw-floating-button-state-hover-shape-pill-left-percent: 37.26%;",
+      "outputSegment": "$left-percent: 37.26%;",
       "outputSegmentRef": "state-hover-shape-pill-vars.$left-percent"
     },
     "right": {
-      "output": "$comp-scw-floating-button-state-hover-shape-pill-right: calc( var( --scw-spacing-1 ) * 16.76600036621094 );",
-      "outputSegment": "$right: calc( var( --scw-spacing-1 ) * 16.76600036621094 );",
+      "output": "$comp-scw-floating-button-state-hover-shape-pill-right: calc( var( --scw-spacing-1 ) * 15.666000366210938 );",
+      "outputSegment": "$right: calc( var( --scw-spacing-1 ) * 15.666000366210938 );",
       "outputSegmentRef": "state-hover-shape-pill-vars.$right"
     },
     "padding-left": {

package/dist/tokens/source/scssVariables.scss

@@ -68618,12 +68618,12 @@ $comp-scw-floating-button-shape-pill-corner-radius-top-left: 30px;
 $comp-scw-floating-button-shape-pill-corner-radius-top-right: 30px;
 $comp-scw-floating-button-shape-pill-corner-radius-bottom-right: 30px;
 $comp-scw-floating-button-shape-pill-corner-radius-bottom-left: 30px;
-$comp-scw-floating-button-shape-pill-shadow-color: rgba(0,0,0,0.2);
+$comp-scw-floating-button-shape-pill-shadow-color: rgba(0,0,0,0.28);
 $comp-scw-floating-button-shape-pill-shadow-offset-x: 0px;
-$comp-scw-floating-button-shape-pill-shadow-offset-y: 1px;
-$comp-scw-floating-button-shape-pill-shadow-radius: 3px;
+$comp-scw-floating-button-shape-pill-shadow-offset-y: 7px;
+$comp-scw-floating-button-shape-pill-shadow-radius: 22px;
 $comp-scw-floating-button-shape-pill-shadow-spread: 0px;
-$comp-scw-floating-button-shape-pill-shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);
+$comp-scw-floating-button-shape-pill-shadow: 0px 7px 22px 0px rgba(0,0,0,0.28);
 $comp-scw-floating-button-shape-pill-width: 305.34px;
 $comp-scw-floating-button-shape-pill-height: 62px;
 $comp-scw-floating-button-shape-pill-constraint-horizontal: MIN;
@@ -68636,12 +68636,12 @@ $comp-scw-floating-button-shape-pill-counter-axis-align-items: CENTER;
 $comp-scw-floating-button-shape-pill-item-spacing: calc( var( --scw-spacing-1 ) * 1.5 );
 $comp-scw-floating-button-shape-pill-layout-align: MIN;
 $comp-scw-floating-button-shape-pill-layout-grow: 0;
-$comp-scw-floating-button-shape-pill-top: calc( var( --scw-spacing-1 ) * 19.9 );
-$comp-scw-floating-button-shape-pill-top-percent: 45.91%;
-$comp-scw-floating-button-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 24 );
-$comp-scw-floating-button-shape-pill-left: var( --scw-spacing-2 );
-$comp-scw-floating-button-shape-pill-left-percent: 35.02%;
-$comp-scw-floating-button-shape-pill-right: calc( var( --scw-spacing-1 ) * 16.76600036621094 );
+$comp-scw-floating-button-shape-pill-top: calc( var( --scw-spacing-1 ) * 21.1 );
+$comp-scw-floating-button-shape-pill-top-percent: 48.3%;
+$comp-scw-floating-button-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 22.8 );
+$comp-scw-floating-button-shape-pill-left: var( --scw-spacing-3 );
+$comp-scw-floating-button-shape-pill-left-percent: 37.05%;
+$comp-scw-floating-button-shape-pill-right: calc( var( --scw-spacing-1 ) * 15.766000366210937 );
 $comp-scw-floating-button-shape-pill-padding-left: calc( var( --scw-spacing-1 ) * 1.6670000076293945 );
 $comp-scw-floating-button-shape-pill-padding-right: calc( var( --scw-spacing-1 ) * 1.6670000076293945 );
 $comp-scw-floating-button-shape-pill-padding-top: calc( var( --scw-spacing-1 ) * 1.6670000076293945 );
@@ -68784,12 +68784,12 @@ $comp-scw-floating-button-size-small-shape-pill-corner-radius-top-left: 30px;
 $comp-scw-floating-button-size-small-shape-pill-corner-radius-top-right: 30px;
 $comp-scw-floating-button-size-small-shape-pill-corner-radius-bottom-right: 30px;
 $comp-scw-floating-button-size-small-shape-pill-corner-radius-bottom-left: 30px;
-$comp-scw-floating-button-size-small-shape-pill-shadow-color: rgba(0,0,0,0.2);
+$comp-scw-floating-button-size-small-shape-pill-shadow-color: rgba(0,0,0,0.28);
 $comp-scw-floating-button-size-small-shape-pill-shadow-offset-x: 0px;
-$comp-scw-floating-button-size-small-shape-pill-shadow-offset-y: 1px;
-$comp-scw-floating-button-size-small-shape-pill-shadow-radius: 3px;
+$comp-scw-floating-button-size-small-shape-pill-shadow-offset-y: 7px;
+$comp-scw-floating-button-size-small-shape-pill-shadow-radius: 22px;
 $comp-scw-floating-button-size-small-shape-pill-shadow-spread: 0px;
-$comp-scw-floating-button-size-small-shape-pill-shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);
+$comp-scw-floating-button-size-small-shape-pill-shadow: 0px 7px 22px 0px rgba(0,0,0,0.28);
 $comp-scw-floating-button-size-small-shape-pill-width: 58.34px;
 $comp-scw-floating-button-size-small-shape-pill-height: 58.34px;
 $comp-scw-floating-button-size-small-shape-pill-constraint-horizontal: MIN;
@@ -68802,12 +68802,12 @@ $comp-scw-floating-button-size-small-shape-pill-counter-axis-align-items: CENTER
 $comp-scw-floating-button-size-small-shape-pill-item-spacing: calc( var( --scw-spacing-1 ) * 1.5 );
 $comp-scw-floating-button-size-small-shape-pill-layout-align: MIN;
 $comp-scw-floating-button-size-small-shape-pill-layout-grow: 0;
-$comp-scw-floating-button-size-small-shape-pill-top: calc( var( --scw-spacing-1 ) * 36.3 );
-$comp-scw-floating-button-size-small-shape-pill-top-percent: 78.28%;
-$comp-scw-floating-button-size-small-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 7.965999984741211 );
-$comp-scw-floating-button-size-small-shape-pill-left: var( --scw-spacing-2 );
-$comp-scw-floating-button-size-small-shape-pill-left-percent: 9.97%;
-$comp-scw-floating-button-size-small-shape-pill-right: calc( var( --scw-spacing-1 ) * 41.46599998474121 );
+$comp-scw-floating-button-size-small-shape-pill-top: calc( var( --scw-spacing-1 ) * 42.6 );
+$comp-scw-floating-button-size-small-shape-pill-top-percent: 90.85%;
+$comp-scw-floating-button-size-small-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 1.665999984741211 );
+$comp-scw-floating-button-size-small-shape-pill-left: calc( var( --scw-spacing-1 ) * 3.3 );
+$comp-scw-floating-button-size-small-shape-pill-left-percent: 12.61%;
+$comp-scw-floating-button-size-small-shape-pill-right: calc( var( --scw-spacing-1 ) * 40.16599998474121 );
 $comp-scw-floating-button-size-small-shape-pill-padding-left: calc( var( --scw-spacing-1 ) * 1.6670000076293945 );
 $comp-scw-floating-button-size-small-shape-pill-padding-right: calc( var( --scw-spacing-1 ) * 1.6670000076293945 );
 $comp-scw-floating-button-size-small-shape-pill-padding-top: calc( var( --scw-spacing-1 ) * 1.6670000076293945 );
@@ -68886,21 +68886,21 @@ $comp-scw-floating-button-size-small-shape-pill-icon-icon-vector-padding-right:
 $comp-scw-floating-button-size-small-shape-pill-icon-icon-vector-padding-top: 0px;
 $comp-scw-floating-button-size-small-shape-pill-icon-icon-vector-padding-bottom: 0px;
 
-$comp-scw-floating-button-state-hover-size-small-shape-pill-background-color: var( --scw-color-grey-092 );
+$comp-scw-floating-button-state-hover-size-small-shape-pill-background-color: var( --scw-color-grey-10 );
 $comp-scw-floating-button-state-hover-size-small-shape-pill-blend-mode: NORMAL;
-$comp-scw-floating-button-state-hover-size-small-shape-pill-stroke-color: var( --scw-color-grey-09 );
+$comp-scw-floating-button-state-hover-size-small-shape-pill-stroke-color: var( --scw-color-grey-10 );
 $comp-scw-floating-button-state-hover-size-small-shape-pill-stroke-weight: 1px;
 $comp-scw-floating-button-state-hover-size-small-shape-pill-stroke-align: OUTSIDE;
 $comp-scw-floating-button-state-hover-size-small-shape-pill-corner-radius-top-left: 30px;
 $comp-scw-floating-button-state-hover-size-small-shape-pill-corner-radius-top-right: 30px;
 $comp-scw-floating-button-state-hover-size-small-shape-pill-corner-radius-bottom-right: 30px;
 $comp-scw-floating-button-state-hover-size-small-shape-pill-corner-radius-bottom-left: 30px;
-$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-color: rgba(0,0,0,0.2);
+$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-color: rgba(0,0,0,0.28);
 $comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-offset-x: 0px;
-$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-offset-y: 1px;
-$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-radius: 3px;
+$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-offset-y: 7px;
+$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-radius: 22px;
 $comp-scw-floating-button-state-hover-size-small-shape-pill-shadow-spread: 0px;
-$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);
+$comp-scw-floating-button-state-hover-size-small-shape-pill-shadow: 0px 7px 22px 0px rgba(0,0,0,0.28);
 $comp-scw-floating-button-state-hover-size-small-shape-pill-width: 58.34px;
 $comp-scw-floating-button-state-hover-size-small-shape-pill-height: 58.34px;
 $comp-scw-floating-button-state-hover-size-small-shape-pill-constraint-horizontal: MIN;
@@ -68913,12 +68913,12 @@ $comp-scw-floating-button-state-hover-size-small-shape-pill-counter-axis-align-i
 $comp-scw-floating-button-state-hover-size-small-shape-pill-item-spacing: calc( var( --scw-spacing-1 ) * 1.5 );
 $comp-scw-floating-button-state-hover-size-small-shape-pill-layout-align: MIN;
 $comp-scw-floating-button-state-hover-size-small-shape-pill-layout-grow: 0;
-$comp-scw-floating-button-state-hover-size-small-shape-pill-top: calc( var( --scw-spacing-1 ) * 36.3 );
-$comp-scw-floating-button-state-hover-size-small-shape-pill-top-percent: 78.28%;
-$comp-scw-floating-button-state-hover-size-small-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 7.965999984741211 );
-$comp-scw-floating-button-state-hover-size-small-shape-pill-left: calc( var( --scw-spacing-1 ) * 10.9 );
-$comp-scw-floating-button-state-hover-size-small-shape-pill-left-percent: 28.03%;
-$comp-scw-floating-button-state-hover-size-small-shape-pill-right: calc( var( --scw-spacing-1 ) * 32.56599998474121 );
+$comp-scw-floating-button-state-hover-size-small-shape-pill-top: calc( var( --scw-spacing-1 ) * 42.6 );
+$comp-scw-floating-button-state-hover-size-small-shape-pill-top-percent: 90.85%;
+$comp-scw-floating-button-state-hover-size-small-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 1.665999984741211 );
+$comp-scw-floating-button-state-hover-size-small-shape-pill-left: calc( var( --scw-spacing-1 ) * 18.4 );
+$comp-scw-floating-button-state-hover-size-small-shape-pill-left-percent: 43.24%;
+$comp-scw-floating-button-state-hover-size-small-shape-pill-right: calc( var( --scw-spacing-1 ) * 25.06599998474121 );
 $comp-scw-floating-button-state-hover-size-small-shape-pill-padding-left: calc( var( --scw-spacing-1 ) * 1.6670000076293945 );
 $comp-scw-floating-button-state-hover-size-small-shape-pill-padding-right: calc( var( --scw-spacing-1 ) * 1.6670000076293945 );
 $comp-scw-floating-button-state-hover-size-small-shape-pill-padding-top: calc( var( --scw-spacing-1 ) * 1.6670000076293945 );
@@ -68997,21 +68997,21 @@ $comp-scw-floating-button-state-hover-size-small-shape-pill-icon-icon-vector-pad
 $comp-scw-floating-button-state-hover-size-small-shape-pill-icon-icon-vector-padding-top: 0px;
 $comp-scw-floating-button-state-hover-size-small-shape-pill-icon-icon-vector-padding-bottom: 0px;
 
-$comp-scw-floating-button-state-hover-shape-pill-background-color: var( --scw-color-grey-092 );
+$comp-scw-floating-button-state-hover-shape-pill-background-color: var( --scw-color-grey-10 );
 $comp-scw-floating-button-state-hover-shape-pill-blend-mode: NORMAL;
-$comp-scw-floating-button-state-hover-shape-pill-stroke-color: var( --scw-color-grey-09 );
+$comp-scw-floating-button-state-hover-shape-pill-stroke-color: var( --scw-color-grey-10 );
 $comp-scw-floating-button-state-hover-shape-pill-stroke-weight: 1px;
 $comp-scw-floating-button-state-hover-shape-pill-stroke-align: OUTSIDE;
 $comp-scw-floating-button-state-hover-shape-pill-corner-radius-top-left: 30px;
 $comp-scw-floating-button-state-hover-shape-pill-corner-radius-top-right: 30px;
 $comp-scw-floating-button-state-hover-shape-pill-corner-radius-bottom-right: 30px;
 $comp-scw-floating-button-state-hover-shape-pill-corner-radius-bottom-left: 30px;
-$comp-scw-floating-button-state-hover-shape-pill-shadow-color: rgba(0,0,0,0.2);
+$comp-scw-floating-button-state-hover-shape-pill-shadow-color: rgba(0,0,0,0.42);
 $comp-scw-floating-button-state-hover-shape-pill-shadow-offset-x: 0px;
-$comp-scw-floating-button-state-hover-shape-pill-shadow-offset-y: 1px;
-$comp-scw-floating-button-state-hover-shape-pill-shadow-radius: 3px;
+$comp-scw-floating-button-state-hover-shape-pill-shadow-offset-y: 8px;
+$comp-scw-floating-button-state-hover-shape-pill-shadow-radius: 24px;
 $comp-scw-floating-button-state-hover-shape-pill-shadow-spread: 0px;
-$comp-scw-floating-button-state-hover-shape-pill-shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);
+$comp-scw-floating-button-state-hover-shape-pill-shadow: 0px 8px 24px 0px rgba(0,0,0,0.42);
 $comp-scw-floating-button-state-hover-shape-pill-width: 305.34px;
 $comp-scw-floating-button-state-hover-shape-pill-height: 62px;
 $comp-scw-floating-button-state-hover-shape-pill-constraint-horizontal: MIN;
@@ -69024,12 +69024,12 @@ $comp-scw-floating-button-state-hover-shape-pill-counter-axis-align-items: CENTE
 $comp-scw-floating-button-state-hover-shape-pill-item-spacing: calc( var( --scw-spacing-1 ) * 1.5 );
 $comp-scw-floating-button-state-hover-shape-pill-layout-align: MIN;
 $comp-scw-floating-button-state-hover-shape-pill-layout-grow: 0;
-$comp-scw-floating-button-state-hover-shape-pill-top: calc( var( --scw-spacing-1 ) * 28.1 );
-$comp-scw-floating-button-state-hover-shape-pill-top-percent: 62.28%;
-$comp-scw-floating-button-state-hover-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 15.8 );
-$comp-scw-floating-button-state-hover-shape-pill-left: var( --scw-spacing-2 );
-$comp-scw-floating-button-state-hover-shape-pill-left-percent: 35.02%;
-$comp-scw-floating-button-state-hover-shape-pill-right: calc( var( --scw-spacing-1 ) * 16.76600036621094 );
+$comp-scw-floating-button-state-hover-shape-pill-top: calc( var( --scw-spacing-1 ) * 32.8 );
+$comp-scw-floating-button-state-hover-shape-pill-top-percent: 71.66%;
+$comp-scw-floating-button-state-hover-shape-pill-bottom: calc( var( --scw-spacing-1 ) * 11.1 );
+$comp-scw-floating-button-state-hover-shape-pill-left: calc( var( --scw-spacing-1 ) * 3.1 );
+$comp-scw-floating-button-state-hover-shape-pill-left-percent: 37.26%;
+$comp-scw-floating-button-state-hover-shape-pill-right: calc( var( --scw-spacing-1 ) * 15.666000366210938 );
 $comp-scw-floating-button-state-hover-shape-pill-padding-left: calc( var( --scw-spacing-1 ) * 1.6670000076293945 );
 $comp-scw-floating-button-state-hover-shape-pill-padding-right: calc( var( --scw-spacing-1 ) * 1.6670000076293945 );
 $comp-scw-floating-button-state-hover-shape-pill-padding-top: calc( var( --scw-spacing-1 ) * 1.6670000076293945 );