@vsn-ux/gaia-styles 0.5.19 → 0.6.1

package/dist/components/dropdown.css

@@ -1,4 +1,5 @@
-/*! tailwindcss v4.0.17 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
+@layer properties;
 .ga-dropdown {
   display: flex;
   max-height: calc(0.25rem * 81);
@@ -18,8 +19,10 @@
     var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
   ));
   letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-md-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
+  --tw-shadow: var(--ga-shadow-north);
+  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   --tw-outline-style: none;
   outline-style: none;
   @supports (scroll-timeline: --dropdown-scroll block) {
@@ -38,7 +41,6 @@
       --tw-gradient-position: to bottom in oklab;
       background-image: linear-gradient(var(--tw-gradient-stops));
       --tw-gradient-from: transparent;
-      --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
       --tw-gradient-to: var(--ga-color-surface-primary);
       --tw-gradient-stops: var(--tw-gradient-via-stops, var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position));
       opacity: 0%;
@@ -68,9 +70,14 @@
     var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
   ));
     letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-md-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
     color: var(--ga-color-text-action);
+    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
+    transition-timing-function: var(--tw-ease, ease);
+    transition-duration: var(--tw-duration, 0s);
+    transition-duration: var(--ga-duration-instant);
+    transition-timing-function: var(--ga-easing-standard);
     &:first-child {
       border-top-left-radius: var(--ga-radius);
       border-top-right-radius: var(--ga-radius);
@@ -179,6 +186,71 @@
   inherits: false;
   initial-value: solid;
 }
+@property --tw-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-inset-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-inset-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-inset-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-ring-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-ring-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-inset-ring-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-inset-ring-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-ring-inset {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-ring-offset-width {
+  syntax: "<length>";
+  inherits: false;
+  initial-value: 0px;
+}
+@property --tw-ring-offset-color {
+  syntax: "*";
+  inherits: false;
+  initial-value: #fff;
+}
+@property --tw-ring-offset-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
 @property --tw-gradient-position {
   syntax: "*";
   inherits: false;
@@ -230,3 +302,35 @@
   syntax: "*";
   inherits: false;
 }
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    *, ::before, ::after, ::backdrop {
+      --tw-border-style: solid;
+      --tw-shadow: 0 0 #0000;
+      --tw-shadow-color: initial;
+      --tw-shadow-alpha: 100%;
+      --tw-inset-shadow: 0 0 #0000;
+      --tw-inset-shadow-color: initial;
+      --tw-inset-shadow-alpha: 100%;
+      --tw-ring-color: initial;
+      --tw-ring-shadow: 0 0 #0000;
+      --tw-inset-ring-color: initial;
+      --tw-inset-ring-shadow: 0 0 #0000;
+      --tw-ring-inset: initial;
+      --tw-ring-offset-width: 0px;
+      --tw-ring-offset-color: #fff;
+      --tw-ring-offset-shadow: 0 0 #0000;
+      --tw-gradient-position: initial;
+      --tw-gradient-from: #0000;
+      --tw-gradient-via: #0000;
+      --tw-gradient-to: #0000;
+      --tw-gradient-stops: initial;
+      --tw-gradient-via-stops: initial;
+      --tw-gradient-from-position: 0%;
+      --tw-gradient-via-position: 50%;
+      --tw-gradient-to-position: 100%;
+      --tw-content: "";
+      --tw-font-weight: initial;
+    }
+  }
+}

package/dist/components/form-field.css

@@ -1,4 +1,5 @@
-/*! tailwindcss v4.0.17 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
+@layer properties;
 .ga-form-field {
   display: flex;
   flex-direction: column;
@@ -37,10 +38,15 @@
     var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
   ));
     letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-md-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
     --tw-font-weight: 500;
     font-weight: 500;
+    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
+    transition-timing-function: var(--tw-ease, ease);
+    transition-duration: var(--tw-duration, 0s);
+    transition-duration: var(--ga-duration-instant);
+    transition-timing-function: var(--ga-easing-standard);
   }
   .ga-form-field__label-state {
     font-size: calc(
@@ -83,7 +89,7 @@
     var(--ga-text-xs-line-height) * var(--ga-base-scaling-factor, 1)
   ));
     letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-xs-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-xs-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
     .ga-icon {
       flex-shrink: 0;
@@ -108,3 +114,13 @@
   inherits: false;
   initial-value: solid;
 }
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    *, ::before, ::after, ::backdrop {
+      --tw-leading: initial;
+      --tw-outline-style: solid;
+      --tw-font-weight: initial;
+      --tw-border-style: solid;
+    }
+  }
+}

package/dist/components/input.css

@@ -1,4 +1,5 @@
-/*! tailwindcss v4.0.17 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
+@layer properties;
 .ga-input {
   display: flex;
   height: calc(0.25rem * 10);
@@ -20,8 +21,13 @@
     var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
   ));
   letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-md-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
+  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
+  transition-timing-function: var(--tw-ease, ease);
+  transition-duration: var(--tw-duration, 0s);
+  transition-duration: var(--ga-duration-instant);
+  transition-timing-function: var(--ga-easing-standard);
   &:hover {
     border-color: var(--ga-color-border-action-hover);
     &:has(input:not(:placeholder-shown)), &:is(input:not(:placeholder-shown)) {
@@ -93,3 +99,12 @@
   syntax: "*";
   inherits: false;
 }
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    *, ::before, ::after, ::backdrop {
+      --tw-border-style: solid;
+      --tw-outline-style: solid;
+      --tw-leading: initial;
+    }
+  }
+}

package/dist/components/link.css

@@ -1,4 +1,5 @@
-/*! tailwindcss v4.0.17 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
+@layer properties;
 .ga-link {
   display: inline-flex;
   height: calc(0.25rem * 5);
@@ -16,7 +17,7 @@
     var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
   ));
   letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-md-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
   --tw-font-weight: 500;
   font-weight: 500;
@@ -24,6 +25,11 @@
   color: var(--ga-color-text-action);
   --tw-numeric-spacing: tabular-nums;
   font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
+  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
+  transition-timing-function: var(--tw-ease, ease);
+  transition-duration: var(--tw-duration, 0s);
+  transition-duration: var(--ga-duration-instant);
+  transition-timing-function: var(--ga-easing-standard);
   &.ga-link--inline {
     text-decoration-line: underline;
     text-decoration-color: var(--ga-color-primary-90);
@@ -48,7 +54,7 @@
     var(--ga-text-lg-line-height) * var(--ga-base-scaling-factor, 1)
   ));
     letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-lg-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-lg-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
   }
   &.ga-link--disabled {
@@ -113,3 +119,16 @@
   inherits: false;
   initial-value: solid;
 }
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    *, ::before, ::after, ::backdrop {
+      --tw-font-weight: initial;
+      --tw-ordinal: initial;
+      --tw-slashed-zero: initial;
+      --tw-numeric-figure: initial;
+      --tw-numeric-spacing: initial;
+      --tw-numeric-fraction: initial;
+      --tw-outline-style: solid;
+    }
+  }
+}

package/dist/components/menu.css

@@ -1,4 +1,5 @@
-/*! tailwindcss v4.0.17 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
+@layer properties;
 .ga-menu {
   display: flex;
   max-height: calc(0.25rem * 81);
@@ -18,8 +19,10 @@
     var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
   ));
   letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-md-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
+  --tw-shadow: var(--ga-shadow-north);
+  box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   .ga-menu__item {
     position: relative;
     display: flex;
@@ -33,6 +36,11 @@
     text-align: left;
     --tw-leading: 1;
     line-height: 1;
+    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
+    transition-timing-function: var(--tw-ease, ease);
+    transition-duration: var(--tw-duration, 0s);
+    transition-duration: var(--ga-duration-instant);
+    transition-timing-function: var(--ga-easing-standard);
     &:first-child {
       border-top-left-radius: var(--ga-radius);
       border-top-right-radius: var(--ga-radius);
@@ -135,7 +143,7 @@
     var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
   ));
     letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-md-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
     --tw-font-weight: 500;
     font-weight: 500;
@@ -156,7 +164,7 @@
     var(--ga-text-xs-line-height) * var(--ga-base-scaling-factor, 1)
   ));
     letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-xs-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-xs-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
     --tw-font-weight: 500;
     font-weight: 500;
@@ -170,7 +178,7 @@
     var(--ga-text-xs-line-height) * var(--ga-base-scaling-factor, 1)
   ));
     letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-xs-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-xs-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
     color: var(--ga-color-text-disable-selected);
   }
@@ -200,6 +208,71 @@
   inherits: false;
   initial-value: solid;
 }
+@property --tw-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-inset-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-inset-shadow-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-inset-shadow-alpha {
+  syntax: "<percentage>";
+  inherits: false;
+  initial-value: 100%;
+}
+@property --tw-ring-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-ring-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-inset-ring-color {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-inset-ring-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
+@property --tw-ring-inset {
+  syntax: "*";
+  inherits: false;
+}
+@property --tw-ring-offset-width {
+  syntax: "<length>";
+  inherits: false;
+  initial-value: 0px;
+}
+@property --tw-ring-offset-color {
+  syntax: "*";
+  inherits: false;
+  initial-value: #fff;
+}
+@property --tw-ring-offset-shadow {
+  syntax: "*";
+  inherits: false;
+  initial-value: 0 0 #0000;
+}
 @property --tw-leading {
   syntax: "*";
   inherits: false;
@@ -213,3 +286,27 @@
   syntax: "*";
   inherits: false;
 }
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    *, ::before, ::after, ::backdrop {
+      --tw-border-style: solid;
+      --tw-shadow: 0 0 #0000;
+      --tw-shadow-color: initial;
+      --tw-shadow-alpha: 100%;
+      --tw-inset-shadow: 0 0 #0000;
+      --tw-inset-shadow-color: initial;
+      --tw-inset-shadow-alpha: 100%;
+      --tw-ring-color: initial;
+      --tw-ring-shadow: 0 0 #0000;
+      --tw-inset-ring-color: initial;
+      --tw-inset-ring-shadow: 0 0 #0000;
+      --tw-ring-inset: initial;
+      --tw-ring-offset-width: 0px;
+      --tw-ring-offset-color: #fff;
+      --tw-ring-offset-shadow: 0 0 #0000;
+      --tw-leading: initial;
+      --tw-content: "";
+      --tw-font-weight: initial;
+    }
+  }
+}

package/dist/components/modal.css

@@ -1,4 +1,5 @@
-/*! tailwindcss v4.0.17 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
+@layer properties;
 .ga-modal__backdrop {
   position: fixed;
   inset: calc(0.25rem * 0);
@@ -37,7 +38,7 @@
     var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
   ));
   letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-md-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
   scrollbar-width: thin;
   &.ga-modal--small {
@@ -97,7 +98,7 @@
     var(--ga-text-xl-line-height) * var(--ga-base-scaling-factor, 1)
   ));
     letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-xl-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-xl-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
     --tw-font-weight: 600;
     font-weight: 600;
@@ -141,3 +142,11 @@
   syntax: "*";
   inherits: false;
 }
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    *, ::before, ::after, ::backdrop {
+      --tw-border-style: solid;
+      --tw-font-weight: initial;
+    }
+  }
+}

package/dist/components/notification.css

@@ -1,4 +1,5 @@
-/*! tailwindcss v4.0.17 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
+@layer properties;
 .ga-notification {
   position: relative;
   display: inline-flex;
@@ -21,7 +22,7 @@
     var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
   ));
   letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-md-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
   &.ga-notification--information {
     border-color: var(--ga-color-border-information);
@@ -117,12 +118,12 @@
     .ga-notification__progress-bar {
       position: absolute;
       height: 100%;
-      transform-origin: top left;
+      transform-origin: 0 0;
       border-radius: var(--ga-radius);
-      background-color: var(--ga-color-primary-70);
+      background-color: var(--ga-color-surface-progress);
     }
     &.ga-notification__progress--indeterminate .ga-notification__progress-bar {
-      width: calc(1/5 * 100%);
+      width: calc(1 / 5 * 100%);
       animation: ga-notification-progress-animation 1400ms linear infinite;
     }
   }
@@ -144,3 +145,11 @@
   syntax: "*";
   inherits: false;
 }
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    *, ::before, ::after, ::backdrop {
+      --tw-border-style: solid;
+      --tw-font-weight: initial;
+    }
+  }
+}

package/dist/components/progress-bar.css

@@ -1,4 +1,4 @@
-/*! tailwindcss v4.0.17 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
 .ga-progress {
   display: flex;
   flex-direction: column;
@@ -22,7 +22,7 @@
     var(--ga-text-xs-line-height) * var(--ga-base-scaling-factor, 1)
   ));
     letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-xs-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-xs-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
     color: var(--ga-color-text-body);
   }
@@ -38,9 +38,9 @@
     position: absolute;
     height: 100%;
     width: 100%;
-    transform-origin: top left;
+    transform-origin: 0 0;
     border-radius: var(--ga-radius);
-    background-color: var(--ga-color-primary-70);
+    background-color: var(--ga-color-surface-progress);
   }
   &.ga-progress--success {
     .ga-progress__bar {
@@ -60,7 +60,7 @@
   }
   &.ga-progress--indeterminate {
     .ga-progress__bar {
-      width: calc(1/5 * 100%);
+      width: calc(1 / 5 * 100%);
       animation: ga-progress-animation 1400ms linear infinite;
     }
   }

package/dist/components/progress-indicator.css

@@ -1,4 +1,5 @@
-/*! tailwindcss v4.0.17 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
+@layer properties;
 .ga-progress-indicator {
   display: flex;
   .ga-progress-indicator__item {
@@ -69,11 +70,16 @@
     var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
   ));
     letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-md-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
     --tw-font-weight: 500;
     font-weight: 500;
     color: var(--ga-color-text-action);
+    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
+    transition-timing-function: var(--tw-ease, ease);
+    transition-duration: var(--tw-duration, 0s);
+    transition-duration: var(--ga-duration-instant);
+    transition-timing-function: var(--ga-easing-standard);
   }
   .ga-progress-indicator__label-state {
     font-size: calc(
@@ -83,7 +89,7 @@
     var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
   ));
     letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-md-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
     --tw-font-weight: 400;
     font-weight: 400;
@@ -116,7 +122,7 @@
     var(--ga-text-xs-line-height) * var(--ga-base-scaling-factor, 1)
   ));
     letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-xs-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-xs-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
     color: var(--ga-color-text-body);
   }
@@ -218,3 +224,12 @@
   syntax: "*";
   inherits: false;
 }
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    *, ::before, ::after, ::backdrop {
+      --tw-border-style: solid;
+      --tw-outline-style: solid;
+      --tw-font-weight: initial;
+    }
+  }
+}

package/dist/components/quick-filter-button.css

@@ -1,4 +1,5 @@
-/*! tailwindcss v4.0.17 | MIT License | https://tailwindcss.com */
+/*! tailwindcss v4.2.2 | MIT License | https://tailwindcss.com */
+@layer properties;
 .ga-quick-filter-button {
   display: inline-flex;
   height: calc(0.25rem * 10);
@@ -16,13 +17,18 @@
     var(--ga-text-md-line-height) * var(--ga-base-scaling-factor, 1)
   ));
   letter-spacing: var(--tw-tracking, calc(
-    var(--ga-text-md-tracking) * var(--ga-base-scaling-factor, 1)
+    var(--ga-text-md-letter-spacing) * var(--ga-base-scaling-factor, 1)
   ));
   --tw-leading: calc(0.25rem * 1);
   line-height: calc(0.25rem * 1);
   --tw-font-weight: 500;
   font-weight: 500;
   white-space: nowrap;
+  transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
+  transition-timing-function: var(--tw-ease, ease);
+  transition-duration: var(--tw-duration, 0s);
+  transition-duration: var(--ga-duration-instant);
+  transition-timing-function: var(--ga-easing-standard);
   border-style: var(--tw-border-style);
   border-width: 1px;
   border-color: var(--ga-color-border-action);
@@ -101,3 +107,13 @@
   inherits: false;
   initial-value: solid;
 }
+@layer properties {
+  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
+    *, ::before, ::after, ::backdrop {
+      --tw-leading: initial;
+      --tw-font-weight: initial;
+      --tw-border-style: solid;
+      --tw-outline-style: solid;
+    }
+  }
+}