@m3-baseui/react-vanilla-extract 3.0.0 → 5.0.0

package/dist/index.css

@@ -1,31 +1,123 @@
-/* vanilla-extract-css-ns:src/components/button/button.css.ts.vanilla.css?source=#H4sIAAAAAAAAA81YXW_aMBR951dYPBWp7pKUTZWr7WU_Y6omJ75JvBo7sm-gbOp_n2zzlQBtCkjlCcW599yvcw-Gu9_ps0hnLknIvxEhjXESpdGMWFAc5RweR4QI6RrFl4xIraQGWip48edcyUpTiTBzjBSgEaw__tM6lOWSFkYjaNx9VfGGkYcmeNcgqxoZmSbxueFCSF3RGISRbBrPc2MFWEa00bB9ppYL2TpG5tzeUDoT1C0ddTVvgJatUhNvauZgS2UWjNRSCND-rGitM5aRxsh1Vq0DSx0oKHAbpjQaaclnUi17QXDZgCu4Aqp4Dooqbiug3n6ycVysihvgGE23rk7-hUGO3jC4haHUwyPu2Ed_QPQdaHghdTUIAi0vnqWugj9ariNvaGNNAxaXjOTmxY9DmMUtyXnxXFnTakELo4y9JauP1SzDUw9JtJZHKnbSmZnOW-pqY3HaTwPlzFOpbHVxHAO480YOuRbcisnj6HV0t9kHxnIojYWwFxsqj8ePnTXhuTOqxcAYqR0gI8kBkkpdg5UY3mx6wTwXLWj8uS7f-An45iUxSmAohTlodFtmbutka48BPcompzSh9ivUacUmx-7iIUegwboPUZqidXQuncwVDIYKXj2oX4Ijp40F50A8DYZaOfTz4oXXtzNRYkpCOp4rEE8rET08t-1GrM86-axBzsDoZXO4tuRI3GHWnWlG0xajYN83L8QZJQWxVX7TaWFYcOqgMJ5ly0lU5-hITVmGxcm83u-Xs5BY-xlYpLIwetXj1ZeFghIZSb-94QpaHHC0US33PNNgtbukR4pprJxtSglHR02DLm6sd4PF_YohdybbwQAF87jHCuag0j5E5PGHMJIeRnexzoLq0nhAH70-tbbkBUzIF5Lcpdmwjnac7h8OVtTdy89KJhsafbMf4erEpQY7kF5HPHeTOJ9q2QWoll2Oatl1UC27Jqrd70UPl4WG-2vG-_AdTVvfu9P3ZH2l4z3C3XfHc0JdpHM9_FgjdxM5NKDPS2c6WA0iynajqTKLIXrQm-JJuz49QS76hZ4iF_00zpCLvYquQi6m1yQXXy8oF_2f72n_Ovf1bEHYBbvQUr-OIpBTBr-P8xbR6HBbHEfIS_318VacH8TNqxBtIQXWjKS9f0ji8-t_2Tsh26wRAAA */
+/* vanilla-extract-css-ns:src/components/button/button.css.ts.vanilla.css?source=#H4sIAAAAAAAAA-2Z33KbOBTG7_MUmlzVM1XW2OQfmd2bfYydzo4MB6xGSKwkcNxO330HMAQpkApBt73YqyRY36ejo5_OkcnN38FzEuRqu0VfrxA6As2OOkL7XfHydIVQQZKE8gxTziiHCAWX5xkpIhS2v6eCa5ySnLJzhCoiP2CcJ1idFdbnAlRMGGBGDsAwIzIDXI_f9MLTZUYHYTv0VaroF3AS1gMbWb0IfHSfcTC-1YPWILEqSEx55mShJYmfKc82T1ffrm76bP-VEE1wIUEpSD41uT8ImYDEkiS0VJa3OpICsMoJY5ZRRGJNK1jggNpYFBP69-tDqbXgmMaCX39CfyBVZY31iSb6GKHdtt3zLoft3wO3wMAo3E5gdDfA6OF_jHwxCtbCKFiMUbAqRjsDo9u7cYx2oR9GmmoGOIeElvk8jgzlLJAM5SySDKUnSobHOEs7L5ZaS8tpHkyjFrNoCi2aQoumvUHT4wRN4cOApq7RueB0BJI0-9Ici3lAWdpZSFnaWVBZWk-sLJdxsPZeYDVlzzKax9WYwxysujuQeScauIUGVsF-gqu7YZXqOt8srjwanqX148qj7VnapVy91_zCtbgKF3MVzuEqtJpfaDe_22Z0IRTVVPAISWCkjq8WJVQVjJwj1NKFUwaNGWE045hqyFWEYuAaZP34c6k0Tc84FlwD18OP2oVGiAveOIsKZMrEKUJHmiTA62dxKZWQESoE7WSlqvcPGMT6Vasl4W20uJCiAKnPETqIlzpjiTh9RAcSP2dSlDzBsWBCfkSXH5d0m3-1ybeMk1KSNh_GnuTC-BSro5A63FhiTfP6SKYlj6c9gKh6kCpk_QPSFGKtcAIpKZk2N_w2ig6QCtky02f3-vrJ2DlyUIKVuskR5Qp0hLZPbyGj_AiS6uaTPlFRnX0JXP9Z56bZofrU1JndtrM0e4KhAq7V2F5EncIhY7vNuynRhCdEJnYSjjU0Rir6GM2Do4kG3Iy2LVIRlwpXVNEDA2erRmVZmeXA2eoisONqS8JClzakhCpyYF2Jmtq31-PSPTPi6UwWeFjRjK9tOzGv22hjN9uhpW7b4L54QUowmiCZHT4YKWxOP1YQi5qy86Y5vRchFmnaHBy7-9615XpwXiZ8C0nz3rV5NDm0qV_96OFkLeqXDvGaZMMDGFTtkWJQAQtsC6PLuHlsLY_RludnZRLlkMe6VJQyJTFs0G9oexO4JfSiwRWRlHDdavcPowszT8pPjuneNYge3KbNEspBOsI2oRwGsRy8-xXAu18PvPvl4O1m7fLE7q5F3BrBPLyZveniBan7vxfRm-EVL_he6e1q7UA9jM7csQWnCxn3vWkPK5z-aA-DGtu_XyO0R-fCcYmmP_yYiZNL6TBammdZePSoLDvbwqOy2GEsqCxvVvQrtbTHX7ClkR9RZ4b-q1WKoenKJ31gnTl-5U9L-3X384KXm2yBNvd_ScEdpfCiJRkzEEsNigUL_2eBVvonTS1ds15qUHozWnkrT97KF2_l2Vv5Zajs_idg_19yOzJobw8KvDu364X_3fIZ7H7y_Pv_8jt1EP7we9L3V3zrGgPlFUgFfW92mL2TDDr6yEXT6MBGaCtdZ1ynW_W-4jjpnUMzN-iZfs_-dcW349_-BQXr8DkXIwAA */
 ._1kd1ms00 {
+  height: 32px;
+  padding-inline: 12px;
+  gap: 4px;
+  font-family: var(--md-sys-typescale-label-large-font);
+  font-weight: var(--md-sys-typescale-label-large-weight);
+  font-size: var(--md-sys-typescale-label-large-size);
+  line-height: var(--md-sys-typescale-label-large-line-height);
+  letter-spacing: var(--md-sys-typescale-label-large-tracking);
+}
+._1kd1ms00[data-pressed] {
+  border-radius: var(--md-sys-shape-small);
+}
+._1kd1ms00:active {
+  border-radius: var(--md-sys-shape-small);
+}
+._1kd1ms00 [data-slot=button-icon] > svg {
+  width: 20px;
+  height: 20px;
+}
+._1kd1ms01 {
+  height: 40px;
+  padding-inline: 16px;
+  gap: 8px;
+  font-family: var(--md-sys-typescale-label-large-font);
+  font-weight: var(--md-sys-typescale-label-large-weight);
+  font-size: var(--md-sys-typescale-label-large-size);
+  line-height: var(--md-sys-typescale-label-large-line-height);
+  letter-spacing: var(--md-sys-typescale-label-large-tracking);
+}
+._1kd1ms01[data-pressed] {
+  border-radius: var(--md-sys-shape-small);
+}
+._1kd1ms01:active {
+  border-radius: var(--md-sys-shape-small);
+}
+._1kd1ms01 [data-slot=button-icon] > svg {
+  width: 20px;
+  height: 20px;
+}
+._1kd1ms02 {
+  height: 56px;
+  padding-inline: 24px;
+  gap: 8px;
+  font-family: var(--md-sys-typescale-title-medium-font);
+  font-weight: var(--md-sys-typescale-title-medium-weight);
+  font-size: var(--md-sys-typescale-title-medium-size);
+  line-height: var(--md-sys-typescale-title-medium-line-height);
+  letter-spacing: var(--md-sys-typescale-title-medium-tracking);
+}
+._1kd1ms02[data-pressed] {
+  border-radius: var(--md-sys-shape-medium);
+}
+._1kd1ms02:active {
+  border-radius: var(--md-sys-shape-medium);
+}
+._1kd1ms02 [data-slot=button-icon] > svg {
+  width: 24px;
+  height: 24px;
+}
+._1kd1ms03 {
+  height: 96px;
+  padding-inline: 48px;
+  gap: 12px;
+  font-family: var(--md-sys-typescale-headline-small-font);
+  font-weight: var(--md-sys-typescale-headline-small-weight);
+  font-size: var(--md-sys-typescale-headline-small-size);
+  line-height: var(--md-sys-typescale-headline-small-line-height);
+  letter-spacing: var(--md-sys-typescale-headline-small-tracking);
+}
+._1kd1ms03[data-pressed] {
+  border-radius: var(--md-sys-shape-large);
+}
+._1kd1ms03:active {
+  border-radius: var(--md-sys-shape-large);
+}
+._1kd1ms03 [data-slot=button-icon] > svg {
+  width: 32px;
+  height: 32px;
+}
+._1kd1ms04 {
+  height: 136px;
+  padding-inline: 64px;
+  gap: 16px;
+  font-family: var(--md-sys-typescale-headline-large-font);
+  font-weight: var(--md-sys-typescale-headline-large-weight);
+  font-size: var(--md-sys-typescale-headline-large-size);
+  line-height: var(--md-sys-typescale-headline-large-line-height);
+  letter-spacing: var(--md-sys-typescale-headline-large-tracking);
+}
+._1kd1ms04[data-pressed] {
+  border-radius: var(--md-sys-shape-large);
+}
+._1kd1ms04:active {
+  border-radius: var(--md-sys-shape-large);
+}
+._1kd1ms04 [data-slot=button-icon] > svg {
+  width: 40px;
+  height: 40px;
+}
+._1kd1ms05 {
   position: relative;
   display: inline-flex;
   align-items: center;
   justify-content: center;
-  gap: 8px;
-  height: 40px;
-  padding-inline: 24px;
   border: none;
-  border-radius: var(--md-sys-shape-full);
   overflow: hidden;
   cursor: pointer;
   user-select: none;
-  font-family: var(--md-sys-typescale-label-large-font);
-  font-weight: var(--md-sys-typescale-label-large-weight);
-  font-size: var(--md-sys-typescale-label-large-size);
-  line-height: var(--md-sys-typescale-label-large-line-height);
-  letter-spacing: var(--md-sys-typescale-label-large-tracking);
   transition-property:
     box-shadow,
     background-color,
     color,
-    border-color;
+    border-color,
+    border-radius;
   transition-duration: var(--md-sys-motion-duration-short4);
-  transition-timing-function: var(--md-sys-motion-easing-standard);
+  transition-timing-function: var(--md-sys-motion-easing-spring-effects-default);
 }
-._1kd1ms00::before {
+._1kd1ms05::before {
   content: "";
   position: absolute;
   inset: 0;
@@ -35,144 +127,225 @@
   pointer-events: none;
   transition: opacity var(--md-sys-motion-duration-short2) var(--md-sys-motion-easing-standard);
 }
-._1kd1ms00:hover::before {
+._1kd1ms05:hover::before {
   opacity: var(--md-sys-state-hover);
 }
-._1kd1ms00:focus-visible::before {
+._1kd1ms05:focus-visible::before {
   opacity: var(--md-sys-state-focus);
 }
-._1kd1ms00[data-pressed]::before {
+._1kd1ms05[data-pressed]::before {
   opacity: var(--md-sys-state-pressed);
 }
-._1kd1ms00:active::before {
+._1kd1ms05:active::before {
   opacity: var(--md-sys-state-pressed);
 }
-._1kd1ms00[data-disabled] {
+._1kd1ms05[data-disabled] {
   pointer-events: none;
   box-shadow: none;
 }
-._1kd1ms00:disabled {
+._1kd1ms05:disabled {
   pointer-events: none;
   box-shadow: none;
 }
-._1kd1ms00[data-disabled]::before {
+._1kd1ms05[data-disabled]::before {
   opacity: 0;
 }
-._1kd1ms00:disabled::before {
+._1kd1ms05:disabled::before {
   opacity: 0;
 }
-._1kd1ms00:focus-visible {
+._1kd1ms05:focus-visible {
   outline: 3px solid rgb(var(--md-sys-color-secondary));
   outline-offset: 2px;
 }
-._1kd1ms00[data-with-start-icon] {
-  padding-left: 16px;
-}
-._1kd1ms00[data-with-end-icon] {
-  padding-right: 16px;
-}
-._1kd1ms01 {
+._1kd1ms06 {
   background: rgb(var(--md-sys-color-primary));
   color: rgb(var(--md-sys-color-on-primary));
 }
-._1kd1ms01:hover {
+._1kd1ms06:hover {
   box-shadow: var(--md-sys-elevation-level1);
 }
-._1kd1ms01:active {
+._1kd1ms06:active {
   box-shadow: var(--md-sys-elevation-level0);
 }
-._1kd1ms01[data-pressed] {
+._1kd1ms06[data-pressed] {
   box-shadow: var(--md-sys-elevation-level0);
 }
-._1kd1ms01:disabled {
-  background: rgb(var(--md-sys-color-on-surface) / 0.12);
-  color: rgb(var(--md-sys-color-on-surface) / 0.38);
+._1kd1ms06:disabled {
+  background: rgb(var(--md-sys-color-on-surface) / 0.1);
+  color: rgb(var(--md-sys-color-on-surface-variant) / 0.38);
 }
-._1kd1ms01[data-disabled] {
-  background: rgb(var(--md-sys-color-on-surface) / 0.12);
-  color: rgb(var(--md-sys-color-on-surface) / 0.38);
+._1kd1ms06[data-disabled] {
+  background: rgb(var(--md-sys-color-on-surface) / 0.1);
+  color: rgb(var(--md-sys-color-on-surface-variant) / 0.38);
 }
-._1kd1ms02 {
+._1kd1ms07 {
   background: rgb(var(--md-sys-color-secondary-container));
   color: rgb(var(--md-sys-color-on-secondary-container));
 }
-._1kd1ms02:hover {
+._1kd1ms07:hover {
   box-shadow: var(--md-sys-elevation-level1);
 }
-._1kd1ms02:active {
+._1kd1ms07:active {
   box-shadow: var(--md-sys-elevation-level0);
 }
-._1kd1ms02[data-pressed] {
+._1kd1ms07[data-pressed] {
   box-shadow: var(--md-sys-elevation-level0);
 }
-._1kd1ms02:disabled {
+._1kd1ms07:disabled {
   background: rgb(var(--md-sys-color-on-surface) / 0.12);
   color: rgb(var(--md-sys-color-on-surface) / 0.38);
 }
-._1kd1ms02[data-disabled] {
+._1kd1ms07[data-disabled] {
   background: rgb(var(--md-sys-color-on-surface) / 0.12);
   color: rgb(var(--md-sys-color-on-surface) / 0.38);
 }
-._1kd1ms03 {
+._1kd1ms08 {
   background: transparent;
-  color: rgb(var(--md-sys-color-primary));
-  border: 1px solid rgb(var(--md-sys-color-outline));
+  color: rgb(var(--md-sys-color-on-surface-variant));
+  border: 1px solid rgb(var(--md-sys-color-outline-variant));
 }
-._1kd1ms03:disabled {
-  color: rgb(var(--md-sys-color-on-surface) / 0.38);
-  border-color: rgb(var(--md-sys-color-on-surface) / 0.12);
+._1kd1ms08:disabled {
+  color: rgb(var(--md-sys-color-on-surface-variant) / 0.38);
+  border-color: rgb(var(--md-sys-color-outline-variant) / 0.1);
 }
-._1kd1ms03[data-disabled] {
-  color: rgb(var(--md-sys-color-on-surface) / 0.38);
-  border-color: rgb(var(--md-sys-color-on-surface) / 0.12);
+._1kd1ms08[data-disabled] {
+  color: rgb(var(--md-sys-color-on-surface-variant) / 0.38);
+  border-color: rgb(var(--md-sys-color-outline-variant) / 0.1);
 }
-._1kd1ms04 {
+._1kd1ms09 {
   background: rgb(var(--md-sys-color-surface-container-low));
   color: rgb(var(--md-sys-color-primary));
   box-shadow: var(--md-sys-elevation-level1);
 }
-._1kd1ms04:hover {
+._1kd1ms09:hover {
   box-shadow: var(--md-sys-elevation-level2);
 }
-._1kd1ms04:active {
+._1kd1ms09:active {
   box-shadow: var(--md-sys-elevation-level1);
 }
-._1kd1ms04[data-pressed] {
+._1kd1ms09[data-pressed] {
   box-shadow: var(--md-sys-elevation-level1);
 }
-._1kd1ms04:disabled {
-  background: rgb(var(--md-sys-color-on-surface) / 0.12);
-  color: rgb(var(--md-sys-color-on-surface) / 0.38);
+._1kd1ms09:disabled {
+  background: rgb(var(--md-sys-color-on-surface) / 0.1);
+  color: rgb(var(--md-sys-color-on-surface-variant) / 0.38);
 }
-._1kd1ms04[data-disabled] {
-  background: rgb(var(--md-sys-color-on-surface) / 0.12);
-  color: rgb(var(--md-sys-color-on-surface) / 0.38);
+._1kd1ms09[data-disabled] {
+  background: rgb(var(--md-sys-color-on-surface) / 0.1);
+  color: rgb(var(--md-sys-color-on-surface-variant) / 0.38);
 }
-._1kd1ms05 {
+._1kd1ms0a {
   background: transparent;
-  color: rgb(var(--md-sys-color-primary));
-  padding-inline: 12px;
+  color: rgb(var(--md-sys-color-on-surface-variant));
 }
-._1kd1ms05:disabled {
-  color: rgb(var(--md-sys-color-on-surface) / 0.38);
+._1kd1ms0a:disabled {
+  color: rgb(var(--md-sys-color-on-surface-variant) / 0.38);
 }
-._1kd1ms05[data-disabled] {
-  color: rgb(var(--md-sys-color-on-surface) / 0.38);
+._1kd1ms0a[data-disabled] {
+  color: rgb(var(--md-sys-color-on-surface-variant) / 0.38);
+}
+._1kd1ms0g {
+  border-radius: var(--md-sys-shape-full);
+}
+._1kd1ms0k {
+  border-radius: var(--md-sys-shape-medium);
+}
+._1kd1ms0l {
+  border-radius: var(--md-sys-shape-medium);
+}
+._1kd1ms0m {
+  border-radius: var(--md-sys-shape-large);
+}
+._1kd1ms0n {
+  border-radius: var(--md-sys-shape-extra-large);
+}
+._1kd1ms0o {
+  border-radius: var(--md-sys-shape-extra-large);
+}
+._1kd1ms0p {
+  border-radius: var(--md-sys-shape-medium);
+}
+._1kd1ms0q {
+  border-radius: var(--md-sys-shape-medium);
+}
+._1kd1ms0r {
+  border-radius: var(--md-sys-shape-large);
+}
+._1kd1ms0s {
+  border-radius: var(--md-sys-shape-extra-large);
+}
+._1kd1ms0t {
+  border-radius: var(--md-sys-shape-extra-large);
+}
+._1kd1ms0u {
+  border-radius: var(--md-sys-shape-full);
+}
+._1kd1ms0v {
+  border-radius: var(--md-sys-shape-full);
+}
+._1kd1ms0w {
+  border-radius: var(--md-sys-shape-full);
+}
+._1kd1ms0x {
+  border-radius: var(--md-sys-shape-full);
+}
+._1kd1ms0y {
+  border-radius: var(--md-sys-shape-full);
+}
+._1kd1ms0z {
+  border-width: 2px;
+}
+._1kd1ms010 {
+  border-width: 3px;
+}
+._1kd1ms011 {
+  background: rgb(var(--md-sys-color-surface-container));
+  color: rgb(var(--md-sys-color-on-surface-variant));
+}
+._1kd1ms012 {
+  background: rgb(var(--md-sys-color-surface-container));
+  color: rgb(var(--md-sys-color-on-surface-variant));
+}
+._1kd1ms013 {
+  background: rgb(var(--md-sys-color-primary));
+  color: rgb(var(--md-sys-color-on-primary));
+}
+._1kd1ms014 {
+  background: rgb(var(--md-sys-color-surface-container-low));
+  color: rgb(var(--md-sys-color-on-surface-variant));
+}
+._1kd1ms015 {
+  background: rgb(var(--md-sys-color-inverse-surface));
+  color: rgb(var(--md-sys-color-inverse-on-surface));
+  border-color: transparent;
+}
+._1kd1ms015:disabled {
+  background: rgb(var(--md-sys-color-on-surface) / 0.1);
+  border-color: transparent;
+}
+._1kd1ms015[data-disabled] {
+  background: rgb(var(--md-sys-color-on-surface) / 0.1);
+  border-color: transparent;
+}
+._1kd1ms016 {
+  color: rgb(var(--md-sys-color-primary));
 }
 [data-slot=button-icon] {
   display: inline-flex;
   align-items: center;
   justify-content: center;
 }
-[data-slot=button-icon] > svg {
-  width: 18px;
-  height: 18px;
-}
 
-/* vanilla-extract-css-ns:src/components/icon-button/icon-button.css.ts.vanilla.css?source=#H4sIAAAAAAAAA81X227bMAx971cIfWqAqrNzaVMX2Ms-YygG2aZjrY7kibLbbNi_D5YTR5KTVF2DrY82ec6hSJGSbr7FT4sG9CIivy4IKYGvSp2Q2bR-ebj4fXGzN38m2K6M0zPPdZmQadT57DH9t4WJHcr52DymnHuUcw8zdSgXtyPz2ylnDuW9TzkbU_bJOZGsuUMZz3zO-Zhz7iVzlK2F8a4lcs2lSIiCimneQgfKOdYV2ySEi4oLoEUFhoxVfCUo17DGhGQgNKju9_cGNS82NJNCg9C2qUNSLBUXTwmJuj-pVDmohAgpjFbKsqeVko3IE6IVE1gzBULvXaliOW8wIS1TV5Suc4obpFiyGmjRVNWkc80ahVIlpJZ8J90gKIpQQab3apmsOje1Sq8cOvOfSkGxUQXLgLZMcSb0xLCbuEyeaK1kDUpvEpLKbmUsl8_X1iJ6puteyMPmjWJ9sh3ttXSsFEup9NwX1nzNxYoWjciOcwDDzgk1EzlT-cSteJKkUEgFpvJDsS4vH5yNwFKUVaNNurhA0E7hhmpwUYLi2i9h1qiufF92y5c1y3iXrqhXMeWh0ILQuC_Lfp3JDhGQo-nkb5JQyhaUk4ohRneHaaaBGm-fopBZg7TlyNMKgqkMyqP6mjPNaK0AEfLHYKotwI-LZV0Hv5OlDynnyNIK8sftmDhUN0d7Bwj091QOxxwd0QjzdqrUuza6m2cJmdUvBGXF82OTACGT3e7Z9ANgC6SyKExD-AP6dttSbx8uNombw1C2CflEopvZ0iM7VMb3Ud4ZDrvZjxDViq-H1L2qaXnbYm4yAlT98ONpmP7pNR9K4_8KZhmqPuxecyQzLkAFFuMI0g7iYxRm-ZEKc9-rb2828WvDZTtNQktycmjcv3toDCf727AmcXYgZxo4ZwrnybmzL715XY2v35Z1Pb5IW1ZxEitPYmvbuvCxPxysH7NysP4TAG3rnc-sbeut_2JpbOvowdLa1niUymfHHPncL4559HLZOOalj_4ZsIsOnx9xFDwst_01DDxa8lUJqEP684h4_E_EXx0O8TQ0Di5aUAhDTwWo7yBWJx5oX-dJ54R2rnMkVO-8B8Yp1T-XMR-gBBEAAA */
+/* vanilla-extract-css-ns:src/components/icon-button/icon-button.css.ts.vanilla.css?source=#H4sIAAAAAAAAA81Y0Y7bKhB9369AfepKZRvHzm6Wle7L_YyrqsJmHNPY4AvYu2nVf69sJ1nATkriSO1TlAznzJwZGIY8fI22qwbMaoF-3CFUAN8UhqB4Wb-93P28ezia_2PUUFwr0BrYl35xKhUDhRVlvNEEtVR9xLhiWO801gWtAeuKluW9S0RoZngLMxjQP0i3m57glTNTELRcdOG-hz98tzCRoy4ZmW-lLpqtLppQl3jqEi_8paNu9eibr1JXAeNN5Qa3vEzeJMUV-mJH37OvL75KX0nVBtzY4svkTTGM1Q1H6czRShx1UezLS24lL5ktLxnLS7yjNzpbq351LTU3XAqCFJS0i6IDMa7rku4I4qLkAnBeQk9GS74RmBuoNEEZCAOq-_lbow3PdziTwoAwtqlDYl0oLrYELV6OAgkSUvS-UpptN0o2ghFkFBW6pgqEeQnKRd705xShrFFaKoJqyQ-uGw0KayghM-_eMll2y9Qm_ejQ9b9jKbBuVE4zwC1VnApz37P3cfV5wrWSNSizIyiVnTLK5OsnS8TA9AntP_YS3G-DII-YNYoOlXACq6RjxbqQyiR-VIZXXGxw3ojsNAdQ3S3Steo-IM8hMxozyGlTGndDrQhJIZdq2JPHun748OLsGZpqWTamzywXGoxT42PhuChAceNXO2tUV-l_u9x0NlnTjHeZXQxe-kpiaEEY_V7Bd9XkgAjI2PL-bEoMFYwq5iehkC0oJxXHGN3NaKgB3K_2KXKZNRq3XPO0hGCqHuVRue0mmGoP8OMaWs5MliEkxjVNy0MLnK6b4_sACFzveZmOeXHCR9hqp0rD0sZ0rY-guH5DWpacnWoaGjLZ7Z7d0Cv2QCzzvD8Q_rXyuD9Sl_chm8TNYSjbPfqMFg_x2iObKuM8yqfhLrMO-wmiWvHqmLrf-rRW287cZAR49cOPwtyflzyVxT8UyzrU-XHv9nc35QJUYClOIO0g_oqyrP-isjxbEx5B0e8ay6GTOKPIzMbxPLtxIGemOY0dB2-HcaOWc5NgtoGD937YtJCV81xae51ejJ8bllWOp3XLWp_F_n8Wq2zrysdqB-vHbBys_-RpbOuTz9za1kf_sfhqW0dvxTfbGo1SuXPMC5_7u2MevdSihWNf-_AomvFwjpZzwPH1j74oCcTCm1F0kmE1m-FxjvinOeD1jMw9z9ZNZzOkV3edKLseyq6Hhv4_MQHNr4dubOih0_rnt5hYFPuLeMAlMz1gRt-C56n95XvxNHX20o62F89zl05xvscy1CMXLSgNx7s5wO8BYt3oE1e581-QE9qN5spQdzcdIM85_QUA34qV9BcAAA */
 ._1k5uet50 {
   height: 32px;
 }
+._1k5uet50[data-pressed] {
+  border-radius: var(--md-sys-shape-small);
+}
+._1k5uet50:active {
+  border-radius: var(--md-sys-shape-small);
+}
 ._1k5uet50 > svg {
   width: 20px;
   height: 20px;
@@ -180,6 +353,12 @@
 ._1k5uet51 {
   height: 40px;
 }
+._1k5uet51[data-pressed] {
+  border-radius: var(--md-sys-shape-small);
+}
+._1k5uet51:active {
+  border-radius: var(--md-sys-shape-small);
+}
 ._1k5uet51 > svg {
   width: 24px;
   height: 24px;
@@ -187,6 +366,12 @@
 ._1k5uet52 {
   height: 56px;
 }
+._1k5uet52[data-pressed] {
+  border-radius: var(--md-sys-shape-medium);
+}
+._1k5uet52:active {
+  border-radius: var(--md-sys-shape-medium);
+}
 ._1k5uet52 > svg {
   width: 24px;
   height: 24px;
@@ -194,6 +379,12 @@
 ._1k5uet53 {
   height: 96px;
 }
+._1k5uet53[data-pressed] {
+  border-radius: var(--md-sys-shape-large);
+}
+._1k5uet53:active {
+  border-radius: var(--md-sys-shape-large);
+}
 ._1k5uet53 > svg {
   width: 32px;
   height: 32px;
@@ -201,6 +392,12 @@
 ._1k5uet54 {
   height: 136px;
 }
+._1k5uet54[data-pressed] {
+  border-radius: var(--md-sys-shape-large);
+}
+._1k5uet54:active {
+  border-radius: var(--md-sys-shape-large);
+}
 ._1k5uet54 > svg {
   width: 40px;
   height: 40px;
@@ -220,9 +417,11 @@
   transition-property:
     box-shadow,
     background-color,
-    color;
+    color,
+    border-color,
+    border-radius;
   transition-duration: var(--md-sys-motion-duration-short4);
-  transition-timing-function: var(--md-sys-motion-easing-standard);
+  transition-timing-function: var(--md-sys-motion-easing-spring-effects-default);
 }
 ._1k5uet55::before {
   content: "";
@@ -276,11 +475,11 @@
   color: rgb(var(--md-sys-color-on-primary));
 }
 ._1k5uet57:disabled {
-  background: rgb(var(--md-sys-color-on-surface) / 0.12);
+  background: rgb(var(--md-sys-color-on-surface) / 0.1);
   color: rgb(var(--md-sys-color-on-surface) / 0.38);
 }
 ._1k5uet57[data-disabled] {
-  background: rgb(var(--md-sys-color-on-surface) / 0.12);
+  background: rgb(var(--md-sys-color-on-surface) / 0.1);
   color: rgb(var(--md-sys-color-on-surface) / 0.38);
 }
 ._1k5uet58 {
@@ -288,33 +487,30 @@
   color: rgb(var(--md-sys-color-on-secondary-container));
 }
 ._1k5uet58:disabled {
-  background: rgb(var(--md-sys-color-on-surface) / 0.12);
+  background: rgb(var(--md-sys-color-on-surface) / 0.1);
   color: rgb(var(--md-sys-color-on-surface) / 0.38);
 }
 ._1k5uet58[data-disabled] {
-  background: rgb(var(--md-sys-color-on-surface) / 0.12);
+  background: rgb(var(--md-sys-color-on-surface) / 0.1);
   color: rgb(var(--md-sys-color-on-surface) / 0.38);
 }
 ._1k5uet59 {
-  border: 1px solid rgb(var(--md-sys-color-outline));
+  border: 1px solid rgb(var(--md-sys-color-outline-variant));
   color: rgb(var(--md-sys-color-on-surface-variant));
 }
 ._1k5uet59:disabled {
   color: rgb(var(--md-sys-color-on-surface) / 0.38);
-  border-color: rgb(var(--md-sys-color-on-surface) / 0.12);
+  border-color: rgb(var(--md-sys-color-outline-variant));
 }
 ._1k5uet59[data-disabled] {
   color: rgb(var(--md-sys-color-on-surface) / 0.38);
-  border-color: rgb(var(--md-sys-color-on-surface) / 0.12);
+  border-color: rgb(var(--md-sys-color-outline-variant));
 }
 ._1k5uet5k {
-  width: 28px;
-}
-._1k5uet5l {
-  width: 32px;
+  border-radius: var(--md-sys-shape-full);
 }
 ._1k5uet5m {
-  width: 40px;
+  width: 28px;
 }
 ._1k5uet5n {
   width: 32px;
@@ -323,57 +519,114 @@
   width: 40px;
 }
 ._1k5uet5p {
-  width: 52px;
+  width: 32px;
 }
 ._1k5uet5q {
-  width: 48px;
+  width: 40px;
 }
 ._1k5uet5r {
-  width: 56px;
+  width: 52px;
 }
 ._1k5uet5s {
-  width: 72px;
+  width: 48px;
 }
 ._1k5uet5t {
-  width: 64px;
+  width: 56px;
 }
 ._1k5uet5u {
-  width: 96px;
+  width: 72px;
 }
 ._1k5uet5v {
-  width: 128px;
+  width: 64px;
 }
 ._1k5uet5w {
-  width: 104px;
+  width: 96px;
 }
 ._1k5uet5x {
-  width: 136px;
+  width: 128px;
 }
 ._1k5uet5y {
-  width: 184px;
+  width: 104px;
 }
 ._1k5uet5z {
-  color: rgb(var(--md-sys-color-primary));
+  width: 136px;
 }
 ._1k5uet510 {
-  background: rgb(var(--md-sys-color-surface-container-highest));
-  color: rgb(var(--md-sys-color-primary));
+  width: 184px;
 }
 ._1k5uet511 {
-  background: rgb(var(--md-sys-color-surface-container-highest));
-  color: rgb(var(--md-sys-color-on-surface-variant));
+  border-radius: var(--md-sys-shape-medium);
 }
 ._1k5uet512 {
+  border-radius: var(--md-sys-shape-medium);
+}
+._1k5uet513 {
+  border-radius: var(--md-sys-shape-large);
+}
+._1k5uet514 {
+  border-radius: var(--md-sys-shape-extra-large);
+}
+._1k5uet515 {
+  border-radius: var(--md-sys-shape-extra-large);
+}
+._1k5uet516 {
+  border-radius: var(--md-sys-shape-medium);
+}
+._1k5uet517 {
+  border-radius: var(--md-sys-shape-medium);
+}
+._1k5uet518 {
+  border-radius: var(--md-sys-shape-large);
+}
+._1k5uet519 {
+  border-radius: var(--md-sys-shape-extra-large);
+}
+._1k5uet51a {
+  border-radius: var(--md-sys-shape-extra-large);
+}
+._1k5uet51b {
+  border-radius: var(--md-sys-shape-full);
+}
+._1k5uet51c {
+  border-radius: var(--md-sys-shape-full);
+}
+._1k5uet51d {
+  border-radius: var(--md-sys-shape-full);
+}
+._1k5uet51e {
+  border-radius: var(--md-sys-shape-full);
+}
+._1k5uet51f {
+  border-radius: var(--md-sys-shape-full);
+}
+._1k5uet51g {
+  border-width: 2px;
+}
+._1k5uet51h {
+  border-width: 3px;
+}
+._1k5uet51i {
+  color: rgb(var(--md-sys-color-primary));
+}
+._1k5uet51j {
+  background: rgb(var(--md-sys-color-surface-container));
+  color: rgb(var(--md-sys-color-on-surface-variant));
+}
+._1k5uet51k {
+  background: rgb(var(--md-sys-color-secondary));
+  color: rgb(var(--md-sys-color-on-secondary));
+}
+._1k5uet51l {
   background: rgb(var(--md-sys-color-inverse-surface));
   color: rgb(var(--md-sys-color-inverse-on-surface));
   border-color: transparent;
 }
-._1k5uet512:disabled {
-  background: rgb(var(--md-sys-color-on-surface) / 0.12);
+._1k5uet51l:disabled {
+  background: rgb(var(--md-sys-color-on-surface) / 0.1);
   border-color: transparent;
 }
-._1k5uet512[data-disabled] {
-  background: rgb(var(--md-sys-color-on-surface) / 0.12);
+._1k5uet51l[data-disabled] {
+  background: rgb(var(--md-sys-color-on-surface) / 0.1);
   border-color: transparent;
 }
 
@@ -1597,7 +1850,7 @@ button:disabled ._1140318,
   height: 24px;
 }
 
-/* vanilla-extract-css-ns:src/components/slider/slider.css.ts.vanilla.css?source=#H4sIAAAAAAAAA-1W227bMAx9z1cIAwokwNQ5abIF6o8MGPJA27QsVJYMic5lQ_99kGwncZY2btG-7cWwBR5Sh5dD38uV1_N1wv5MGKutV6SsEcyhBlJbfJwwlitfazgIVmjchwPQShquCCsvWIaG0IXjxqPjHjVmJJixJoJ3KqdSsHmS3IVPsk1WcsjaKK3R8-S-vcT8Ay5xEa9EJUsSbJnU-7NIi1civeShjmFT63J03EGuGi_YFtyU8yrn_uC5L6FGXjRaz6IpZE_S2cbkgjmZTge2mdXWcd-4AjLkmTUEyqDjpZIleprNzm6b_MqBgOfKQ6ox37ABixFhrOkjzdg3ltzPF-fuHy6SAam3uiH8dPa1UxW4wyiuD-_l-rA-d7-8XfhF0nLtqfffn8adMduQVgb_GYilECkW1mG8dWgSNCTYly-PLxZMY0GCrfppq4_vHbvlBbvldXYd6M1EasgUHQRLYngHxhfWVaJ91UA45avk7isLz9nRpuPRocPoVX6Y4MoGE47glZHcE5gcXD6orCjtFt0gY8frDItFQMij9dBBYbPG863yKtU42lFEDRx1LexASmXkZrSniMB8zDgsP2YcVtFNYQ3xAiqlL-9Fhxp9Bhq5hhQ11-BkYGwoFi8Cd10njQC2pieoV79xFDAYRlgYE16Oj3hm3-KRKGypUAUjR7kgB9mTMjLiY1JHJJtvwSkwNDuR7U64aSp0KhOMIG00uHDgz2ryvZMoFVYaxy0a8qd9en3qlfFIceqObn68ouq9FlxIwWfo3Espua0NJybtDISfhi1u3tD4vTRdafz1O5KcWiJbnf4MBlJbgZPK8N5m3ebyGsuf06P43U417skB9xV0Ga8hz2PjLup9H-StIn2zhwfW_8VhtDiMGXPGdqUijEHiwt85qC9X56lN29bvVtJmuEHmj5Pnv2bsOG6_CwAA */
+/* vanilla-extract-css-ns:src/components/slider/slider.css.ts.vanilla.css?source=#H4sIAAAAAAAAA-1W227bMAx9z1cIAwokWNUlbdoG6o8MGPrA2LQjVJYMik6TDf33QZKTOGnSupcNGLAXJ5bIQ_ocUtRFee3NZDYWvwZC1M5r1s4qQWiA9RLvBkLk2tcG1koUBldhAYwurdSMlVciQ8tIYbnxSNKjwYyVsM5G50ed80KJyXh8Fl7ZNdlCQpaiJKOnwUVKYvIJSRzEW6AuF6zEdFqvOpEuX4h0AmFys4-g1BwLRxiRMmcZLSvx5cvdHjDMvTMNY_r2Wolx-Dd3zK5qX7T1yFJboy1KtPmxZc9ArEQGJhsugYZSVlfSG50jBZdzMT4bia9iVq9GER-yh5JcE8ConG9ccunXXmbOuKBT5mwOtJYhd9AWaZR8HQXUGLF9EuS68Upc1quOBdr8xf20F6w2-3tp-AXUKIvGmNEBaD-XrhJQMNLnCtEyfkKhKESoECHFoR7R8y8p0pPRNzs91-659s92t4qMf-TAIHPtYW4wvxdHe6YHJc5K31ABGY7ENzG-mFyO-oXZFcSHo1z1halJV0Drf1szAlvilsn22z94IrwqWG-KD5W6mnWVmr5-qE9TvvtTYZt_L7LfWAiu4XBs7AYiE9iUoazJ1Ui8Vim9g13WlbalLBrbTsu9UJWLRgg-GPma0g-wBiML8Dw6gMsbgtM4m90TSDuOVeGyxsul9npuUiO33O5rPW21JihLbcv705anqmL6OVVxHWEKZ1kWUGmzPiCA1zX6DAxKA3M00gCVKIN9ZDA6Prb10sMxme5cvf6JvRyDYXSLU2bRP2LHPvkjc2jXGjJty14QTJA9aFtG_0hqD7LlEkiD5dHuY9sVaZsKSWdKMMwbAxQWfEeTm7ZTdbi1SVyiZb_rkONDOw7hOJC3MLcHDd81P9Hwf7zfY8cVjiqV_hpgHMrr8dm5CM9uZd6mwg-X4SXe9632E9eEV9vp9h3t1MWdvUOzzfVqc5c2WLAS1-mlAiq1lVubdpYcI_D7sOWuj3S4YgLpK2gVrCHPYyNc1qtwH-upqrZLJI9dLl7rjY3LPoP_D583HD59jhEhHheaMQaJg_WRoI6zNkQN47R7SMxSP7QDK7XZ1nByN3j6DUpU8ncCDwAA */
 .g5sl180 {
   position: relative;
   display: flex;
@@ -1611,56 +1864,75 @@ button:disabled ._1140318,
   display: flex;
   align-items: center;
   width: 100%;
-  height: 40px;
+  height: 44px;
 }
 .g5sl182 {
   position: relative;
   width: 100%;
-  height: 4px;
-  border-radius: var(--md-sys-shape-full);
-  background: rgb(var(--md-sys-color-surface-container-highest));
+  height: 16px;
 }
-.g5sl180[data-disabled] .g5sl182 {
+.g5sl182::before {
+  content: "";
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  inset-inline-end: 0;
+  inset-inline-start: calc(var(--m3-slider-end, 0%) + 8px);
+  background: rgb(var(--md-sys-color-secondary-container));
+  border-start-start-radius: 2px;
+  border-end-start-radius: 2px;
+  border-start-end-radius: var(--md-sys-shape-full);
+  border-end-end-radius: var(--md-sys-shape-full);
+}
+.g5sl182::after {
+  content: "";
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  inset-inline-start: 0;
+  inset-inline-end: calc(100% - var(--m3-slider-start, 0%) + 8px);
+  background: rgb(var(--md-sys-color-secondary-container));
+  border-start-start-radius: var(--md-sys-shape-full);
+  border-end-start-radius: var(--md-sys-shape-full);
+  border-start-end-radius: 2px;
+  border-end-end-radius: 2px;
+}
+.g5sl180[data-disabled] .g5sl182::before {
+  background: rgb(var(--md-sys-color-on-surface) / 0.12);
+}
+.g5sl180[data-disabled] .g5sl182::after {
   background: rgb(var(--md-sys-color-on-surface) / 0.12);
 }
 .g5sl183 {
-  position: absolute;
-  height: 4px;
-  border-radius: var(--md-sys-shape-full);
   background: rgb(var(--md-sys-color-primary));
+  border-start-start-radius: var(--md-sys-shape-full);
+  border-end-start-radius: var(--md-sys-shape-full);
+  border-start-end-radius: 2px;
+  border-end-end-radius: 2px;
+}
+.g5sl180[data-range] .g5sl183 {
+  border-start-start-radius: 2px;
+  border-end-start-radius: 2px;
 }
 .g5sl180[data-disabled] .g5sl183 {
   background: rgb(var(--md-sys-color-on-surface) / 0.38);
 }
 .g5sl184 {
   position: relative;
-  width: 20px;
-  height: 20px;
+  width: 4px;
+  height: 44px;
   border-radius: var(--md-sys-shape-full);
   background: rgb(var(--md-sys-color-primary));
   outline: none;
+  transition-property: width;
+  transition-timing-function: var(--md-sys-motion-easing-spring-spatial-fast);
+  transition-duration: var(--md-sys-motion-duration-spring-spatial-fast);
 }
-.g5sl184::before {
-  content: "";
-  position: absolute;
-  left: 50%;
-  top: 50%;
-  width: 40px;
-  height: 40px;
-  border-radius: 50%;
-  background: rgb(var(--md-sys-color-primary));
-  opacity: 0;
-  transform: translate(-50%, -50%);
-  transition: opacity 100ms var(--md-sys-motion-easing-standard);
-}
-.g5sl184:hover::before {
-  opacity: var(--md-sys-state-hover);
-}
-.g5sl184:focus-visible::before {
-  opacity: var(--md-sys-state-focus);
+.g5sl184:focus-visible {
+  width: 2px;
 }
-.g5sl184[data-dragging]::before {
-  opacity: var(--md-sys-state-dragged);
+.g5sl184[data-dragging] {
+  width: 2px;
 }
 .g5sl180[data-disabled] .g5sl184 {
   background: rgb(var(--md-sys-color-on-surface) / 0.38);
@@ -1684,23 +1956,26 @@ button:disabled ._1140318,
   width: 4px;
   height: 4px;
   border-radius: var(--md-sys-shape-full);
-  background: rgb(var(--md-sys-color-on-surface-variant));
+  background: rgb(var(--md-sys-color-primary));
   transform: translate(-50%, -50%);
 }
 .g5sl187[data-active] {
-  background: rgb(var(--md-sys-color-on-primary) / 0.38);
+  background: rgb(var(--md-sys-color-secondary-container));
+}
+.g5sl180[data-disabled] .g5sl187 {
+  background: rgb(var(--md-sys-color-on-surface));
 }
 .g5sl188 {
   pointer-events: none;
   position: absolute;
   bottom: 100%;
   left: 50%;
-  margin-bottom: 8px;
+  margin-bottom: 12px;
   transform: translateX(-50%);
   border-radius: var(--md-sys-shape-extra-small);
   padding: 2px 8px;
-  background: rgb(var(--md-sys-color-primary));
-  color: rgb(var(--md-sys-color-on-primary));
+  background: rgb(var(--md-sys-color-inverse-surface));
+  color: rgb(var(--md-sys-color-inverse-on-surface));
   font-family: var(--md-sys-typescale-label-large-font);
   font-weight: var(--md-sys-typescale-label-large-weight);
   font-size: var(--md-sys-typescale-label-large-size);