@solid-design-system/styles 6.13.1 → 6.14.0

package/dist/modules/chip.css

@@ -9,12 +9,9 @@
   border-radius: var(--sd-chip-border-radius, var(--sd-spacing-1));
   border-style: var(--tw-border-style);
   border-width: 1px;
-  border-width: var(--sd-chip-border-width, 0);
   border-color: rgba(var(--sd-chip--primary-200-color-border, rgba(255, 255, 255, 0)));
   background-color: rgba(var(--sd-chip--primary-200-color-background, rgba(var(--sd-color-primary-200))));
   padding-inline: var(--sd-spacing-2);
-  font-size: var(--sd-chip-font-size, 0.875rem);
-  font-weight: var(--sd-chip-font-weight, var(--sd-font-weight-normal));
   white-space: nowrap;
   color: rgba(var(--sd-color-text-black));
 }
@@ -31,8 +28,10 @@
     border-color: rgba(var(--sd-chip--white-color-border, rgba(255, 255, 255, 0)));
     background-color: rgba(var(--sd-chip--white-color-background, rgba(var(--sd-color-white))));
   }
-.sd-theme-kid .sd-chip {
-  box-shadow: var(--sd-shadow-sm);
+.sd-chip{
+  font-size: var(--sd-chip-font-size);
+  border-width: var(--sd-chip-border-width);
+  font-weight: var(--sd-chip-font-weight);
 }
 @property --tw-border-style {
   syntax: "*";

package/dist/modules/container.css

@@ -27,7 +27,7 @@
     padding-block: var(--sd-spacing-4);
   }
 .sd-container{
-  --triangle-background: rgba(var(--sd-color-white));
+  --triangle-background: rgba(var(--sd-color-background-white));
 }
 .sd-container--triangle-top::before, .sd-container--triangle-right::before, .sd-container--triangle-bottom::before, .sd-container--triangle-left::before {
     position: absolute;

package/dist/modules/copyright.css

@@ -23,8 +23,8 @@
     font-size: var(--sd-text-sm);
     line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
     color: rgba(var(--sd-color-text-white));
-    --tw-drop-shadow-size: drop-shadow(var(--sd-drop-shadow-sm));
-    --tw-drop-shadow: drop-shadow(var(--sd-drop-shadow-sm));
+    --tw-drop-shadow-size: drop-shadow(var(--sd-drop-shadow-xs));
+    --tw-drop-shadow: drop-shadow(var(--sd-drop-shadow-xs));
     filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
     content: var(--copyright);
   }

package/dist/modules/flag.css

@@ -9,12 +9,11 @@
   border-radius: var(--sd-flag-border-radius, 0);
   border-style: var(--tw-border-style);
   border-width: 1px;
-  border-width: var(--sd-flag-border-width, 0);
   border-color: rgba(var(--sd-flag--neutral-200-color-border, rgba(255, 255, 255, 0)));
   background-color: rgba(var(--sd-flag--neutral-200-color-background, rgba(var(--sd-color-neutral-200))));
   padding-inline: var(--sd-spacing-3);
-  font-size: var(--sd-text-sm);
-  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
+  font-size: var(--sd-marker-font-size, 0.875rem);
+  font-weight: var(--sd-marker-font-weight, var(--sd-font-weight-normal));
   white-space: nowrap;
   color: rgba(var(--sd-color-text-black));
 }
@@ -31,6 +30,9 @@
     border-color: rgba(var(--sd-flag--white-color-border, rgba(255, 255, 255, 0)));
     background-color: rgba(var(--sd-flag--white-color-background, rgba(var(--sd-color-white))));
   }
+.sd-flag{
+  border-width: var(--sd-flag-border-width);
+}
 @property --tw-border-style {
   syntax: "*";
   inherits: false;

package/dist/modules/footnotes.css

@@ -85,6 +85,9 @@
 .sd-footnotes--inverted:is(.sd-footnotes--marker):target {
         background-color: rgba(var(--sd-footnotes--target--inverted-color-background, rgba(var(--sd-color-primary-800))));
       }
+.sd-footnotes--inverted:is(ol) li .sd-footnotes--marker::before, .sd-footnotes--inverted:is(ol) li::before {
+          color: rgba(var(--sd-color-text-white)) !important;
+        }
 .sd-footnotes--marker {
     position: relative;
     bottom: var(--sd-spacing-2);
@@ -129,9 +132,6 @@
         outline-offset: 2px;
         outline-color: var(--sd-color-border-primary, var(--sd-color-primary));
       }
-.sd-footnotes--marker :is(a):link {
-        color: rgba(var(--sd-color-text-primary));
-      }
 .sd-footnotes--marker:link, .sd-footnotes--marker:visited {
       color: rgba(var(--sd-color-text-primary));
     }

package/dist/modules/headline.css

@@ -23,6 +23,7 @@
     line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
     --tw-leading: var(--leading-tight, 1.25);
     line-height: var(--leading-tight, 1.25);
+    color: rgba(var(--sd-headline--3xl-onwards-color-text, rgba(var(--sd-color-primary))));
   }
 @media (width >= 40rem) {
 .sd-headline.sd-headline, .sd-headline:is(h1):not(.sd-headline), .sd-prose :is(h1, h2, h3, h4, h5).sd-headline, .sd-prose :is(h1, h2, h3, h4, h5):is(h1):not(.sd-headline) {
@@ -44,6 +45,7 @@
     line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
     --tw-leading: var(--leading-tight, 1.25);
     line-height: var(--leading-tight, 1.25);
+    color: rgba(var(--sd-headline--3xl-onwards-color-text, rgba(var(--sd-color-primary))));
   }
 @media (width >= 40rem) {
 .sd-headline.sd-headline--size-3xl, .sd-headline:is(h2):not(.sd-headline), .sd-prose :is(h1, h2, h3, h4, h5).sd-headline--size-3xl, .sd-prose :is(h1, h2, h3, h4, h5):is(h2):not(.sd-headline) {

package/dist/modules/hidden-links.css

@@ -22,6 +22,9 @@
   position: absolute;
   top: var(--sd-spacing-6);
   left: var(--sd-spacing-6);
+  border-style: var(--tw-border-style);
+  border-width: 1px;
+  border-color: rgba(var(--sd-panel-color-border, rgba(255, 255, 255, 0)));
 }
 .sd-hidden-links--multiple {
     display: flex;
@@ -39,6 +42,11 @@
       font-weight: var(--sd-font-weight-bold);
       content: var(--sd-hidden-links-title);
     }
+@property --tw-border-style {
+  syntax: "*";
+  inherits: false;
+  initial-value: solid;
+}
 @property --tw-shadow {
   syntax: "*";
   inherits: false;
@@ -111,6 +119,7 @@
 @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%;

package/dist/modules/list.css

@@ -95,7 +95,7 @@
       left: calc(var(--sd-spacing-1) * 0);
       font-size: var(--sd-text-3xl);
       line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
-      color: rgba(var(--sd-color-text-primary));
+      color: rgb(var(--sd-color-icon-fill-primary));
     }
 .sd-list--icon.sd-list--horizontal {
     display: flex;

package/dist/modules/pagination.css

@@ -75,7 +75,7 @@
           border-bottom-color: transparent;
         }
 .sd-pagination ul li:not(:first-child):not(:last-child) a[aria-current], .sd-pagination ul li:not(:first-child):not(:last-child) button[aria-current] {
-            border-bottom-color: rgba(var(--sd-color-border-accent));
+            border-color: rgba(var(--sd-pagination--default-border, rgba(var(--sd-color-accent))));
           }
 .sd-pagination ul li a[aria-current], .sd-pagination ul li button[aria-current] {
         color: rgba(var(--sd-color-text-black));
@@ -193,7 +193,7 @@
         width: var(--sd-spacing-8);
         border-bottom-style: var(--tw-border-style);
         border-bottom-width: var(--sd-border-width-2);
-        border-bottom-color: rgba(var(--sd-color-border-accent));
+        border-color: rgba(var(--sd-pagination--default-border, rgba(var(--sd-color-accent))));
       }
 .sd-pagination--simple ul li:nth-child(2)::after {
           content: var(--tw-content);
@@ -242,6 +242,9 @@
 .sd-pagination--inverted ul li a:focus-visible, .sd-pagination--inverted ul li a[aria-current]:focus-visible, .sd-pagination--inverted ul li button:focus-visible, .sd-pagination--inverted ul li button[aria-current]:focus-visible {
           outline-color: var(--color-white, #fff);
         }
+.sd-pagination--inverted ul li:not(:first-child):not(:last-child) a[aria-current], .sd-pagination--inverted ul li:not(:first-child):not(:last-child) button[aria-current] {
+            border-color: rgba(var(--sd-pagination--inverted-border, rgba(var(--sd-color-accent))));
+          }
 .sd-pagination--inverted.sd-pagination--simple ul li {
       color: rgba(var(--sd-color-text-white));
     }
@@ -249,6 +252,9 @@
         content: var(--tw-content);
         color: rgba(var(--sd-color-text-white));
       }
+.sd-pagination--inverted.sd-pagination--simple ul li:nth-child(2) {
+        border-color: rgba(var(--sd-pagination--inverted-border, rgba(var(--sd-color-accent))));
+      }
 @property --tw-border-style {
   syntax: "*";
   inherits: false;

package/dist/modules/prose.css

@@ -65,6 +65,7 @@
     line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
     --tw-leading: var(--leading-tight, 1.25);
     line-height: var(--leading-tight, 1.25);
+    color: rgba(var(--sd-headline--3xl-onwards-color-text, rgba(var(--sd-color-primary))));
   }
 @media (width >= 40rem) {
 .sd-headline.sd-headline, .sd-headline:is(h1):not(.sd-headline), .sd-prose :is(h1, h2, h3, h4, h5).sd-headline, .sd-prose :is(h1, h2, h3, h4, h5):is(h1):not(.sd-headline) {
@@ -86,6 +87,7 @@
     line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
     --tw-leading: var(--leading-tight, 1.25);
     line-height: var(--leading-tight, 1.25);
+    color: rgba(var(--sd-headline--3xl-onwards-color-text, rgba(var(--sd-color-primary))));
   }
 @media (width >= 40rem) {
 .sd-headline.sd-headline--size-3xl, .sd-headline:is(h2):not(.sd-headline), .sd-prose :is(h1, h2, h3, h4, h5).sd-headline--size-3xl, .sd-prose :is(h1, h2, h3, h4, h5):is(h2):not(.sd-headline) {
@@ -343,7 +345,7 @@
       left: calc(var(--sd-spacing-1) * 0);
       font-size: var(--sd-text-3xl);
       line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
-      color: rgba(var(--sd-color-text-primary));
+      color: rgb(var(--sd-color-icon-fill-primary));
     }
 .sd-list--icon.sd-list--horizontal {
     display: flex;
@@ -431,7 +433,7 @@
 .sd-table-cell--shadow-top:after, .sd-table-cell--shadow-bottom:after {
       right: calc(var(--sd-spacing-1) * 0);
       left: calc(var(--sd-spacing-1) * 0);
-      height: calc(var(--sd-spacing-1) * 2.5);
+      height: var(--sd-spacing-2\.5);
     }
 .sd-table-cell--shadow-top:before, .sd-table-cell--shadow-bottom:before {
       position: absolute;
@@ -448,7 +450,7 @@
 .sd-table-cell--shadow-left:after, .sd-table-cell--shadow-right:after {
       top: calc(var(--sd-spacing-1) * 0);
       bottom: calc(var(--sd-spacing-1) * 0);
-      width: calc(var(--sd-spacing-1) * 2.5);
+      width: var(--sd-spacing-2\.5);
     }
 .sd-table-cell.sd-table-cell--shadow-active:after {
     opacity: 100%;

package/dist/modules/status-badge.css

@@ -14,13 +14,13 @@
     color: rgba(var(--sd-color-text-white)) !important;
   }
 .sd-status-badge--success sd-icon {
-      background-color: rgba(var(--sd-color-background-success));
+      background-color: rgba(var(--sd-badge--green-color-background, rgba(var(--sd-color-success))));
     }
 .sd-status-badge--warning sd-icon {
       background-color: rgba(var(--sd-color-background-warning));
     }
 .sd-status-badge--error sd-icon {
-      background-color: rgba(var(--sd-color-background-error));
+      background-color: rgba(var(--sd-badge--red-color-background, rgba(var(--sd-color-error))));
     }
 .sd-status-badge--info sd-icon {
       background-color: rgba(var(--sd-color-background-info));

package/dist/modules/table-cell.css

@@ -38,7 +38,7 @@
 .sd-table-cell--shadow-top:after, .sd-table-cell--shadow-bottom:after {
       right: calc(var(--sd-spacing-1) * 0);
       left: calc(var(--sd-spacing-1) * 0);
-      height: calc(var(--sd-spacing-1) * 2.5);
+      height: var(--sd-spacing-2\.5);
     }
 .sd-table-cell--shadow-top:before, .sd-table-cell--shadow-bottom:before {
       position: absolute;
@@ -55,7 +55,7 @@
 .sd-table-cell--shadow-left:after, .sd-table-cell--shadow-right:after {
       top: calc(var(--sd-spacing-1) * 0);
       bottom: calc(var(--sd-spacing-1) * 0);
-      width: calc(var(--sd-spacing-1) * 2.5);
+      width: var(--sd-spacing-2\.5);
     }
 .sd-table-cell.sd-table-cell--shadow-active:after {
     opacity: 100%;

package/dist/solid-styles.css

@@ -9,12 +9,9 @@
   border-radius: var(--sd-chip-border-radius, var(--sd-spacing-1));
   border-style: var(--tw-border-style);
   border-width: 1px;
-  border-width: var(--sd-chip-border-width, 0);
   border-color: rgba(var(--sd-chip--primary-200-color-border, rgba(255, 255, 255, 0)));
   background-color: rgba(var(--sd-chip--primary-200-color-background, rgba(var(--sd-color-primary-200))));
   padding-inline: var(--sd-spacing-2);
-  font-size: var(--sd-chip-font-size, 0.875rem);
-  font-weight: var(--sd-chip-font-weight, var(--sd-font-weight-normal));
   white-space: nowrap;
   color: rgba(var(--sd-color-text-black));
 }
@@ -31,8 +28,10 @@
     border-color: rgba(var(--sd-chip--white-color-border, rgba(255, 255, 255, 0)));
     background-color: rgba(var(--sd-chip--white-color-background, rgba(var(--sd-color-white))));
   }
-.sd-theme-kid .sd-chip {
-  box-shadow: var(--sd-shadow-sm);
+.sd-chip{
+  font-size: var(--sd-chip-font-size);
+  border-width: var(--sd-chip-border-width);
+  font-weight: var(--sd-chip-font-weight);
 }
 .sd-container {
   position: relative;
@@ -61,7 +60,7 @@
     padding-block: var(--sd-spacing-4);
   }
 .sd-container{
-  --triangle-background: rgba(var(--sd-color-white));
+  --triangle-background: rgba(var(--sd-color-background-white));
 }
 .sd-container--triangle-top::before, .sd-container--triangle-right::before, .sd-container--triangle-bottom::before, .sd-container--triangle-left::before {
     position: absolute;
@@ -172,8 +171,8 @@
     font-size: var(--sd-text-sm);
     line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
     color: rgba(var(--sd-color-text-white));
-    --tw-drop-shadow-size: drop-shadow(var(--sd-drop-shadow-sm));
-    --tw-drop-shadow: drop-shadow(var(--sd-drop-shadow-sm));
+    --tw-drop-shadow-size: drop-shadow(var(--sd-drop-shadow-xs));
+    --tw-drop-shadow: drop-shadow(var(--sd-drop-shadow-xs));
     filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
     content: var(--copyright);
   }
@@ -213,12 +212,11 @@
   border-radius: var(--sd-flag-border-radius, 0);
   border-style: var(--tw-border-style);
   border-width: 1px;
-  border-width: var(--sd-flag-border-width, 0);
   border-color: rgba(var(--sd-flag--neutral-200-color-border, rgba(255, 255, 255, 0)));
   background-color: rgba(var(--sd-flag--neutral-200-color-background, rgba(var(--sd-color-neutral-200))));
   padding-inline: var(--sd-spacing-3);
-  font-size: var(--sd-text-sm);
-  line-height: var(--tw-leading, var(--text-sm--line-height, calc(1.25 / 0.875)));
+  font-size: var(--sd-marker-font-size, 0.875rem);
+  font-weight: var(--sd-marker-font-weight, var(--sd-font-weight-normal));
   white-space: nowrap;
   color: rgba(var(--sd-color-text-black));
 }
@@ -235,6 +233,9 @@
     border-color: rgba(var(--sd-flag--white-color-border, rgba(255, 255, 255, 0)));
     background-color: rgba(var(--sd-flag--white-color-background, rgba(var(--sd-color-white))));
   }
+.sd-flag{
+  border-width: var(--sd-flag-border-width);
+}
 .sd-footnotes {
   margin-block: calc(var(--sd-spacing-1) * 0);
   padding: calc(var(--sd-spacing-1) * 0);
@@ -319,6 +320,9 @@
 .sd-footnotes--inverted:is(.sd-footnotes--marker):target {
         background-color: rgba(var(--sd-footnotes--target--inverted-color-background, rgba(var(--sd-color-primary-800))));
       }
+.sd-footnotes--inverted:is(ol) li .sd-footnotes--marker::before, .sd-footnotes--inverted:is(ol) li::before {
+          color: rgba(var(--sd-color-text-white)) !important;
+        }
 .sd-footnotes--marker {
     position: relative;
     bottom: var(--sd-spacing-2);
@@ -363,9 +367,6 @@
         outline-offset: 2px;
         outline-color: var(--sd-color-border-primary, var(--sd-color-primary));
       }
-.sd-footnotes--marker :is(a):link {
-        color: rgba(var(--sd-color-text-primary));
-      }
 .sd-footnotes--marker:link, .sd-footnotes--marker:visited {
       color: rgba(var(--sd-color-text-primary));
     }
@@ -398,6 +399,9 @@
   position: absolute;
   top: var(--sd-spacing-6);
   left: var(--sd-spacing-6);
+  border-style: var(--tw-border-style);
+  border-width: 1px;
+  border-color: rgba(var(--sd-panel-color-border, rgba(255, 255, 255, 0)));
 }
 .sd-hidden-links--multiple {
     display: flex;
@@ -522,7 +526,7 @@ mark.sd-mark {
           border-bottom-color: transparent;
         }
 .sd-pagination ul li:not(:first-child):not(:last-child) a[aria-current], .sd-pagination ul li:not(:first-child):not(:last-child) button[aria-current] {
-            border-bottom-color: rgba(var(--sd-color-border-accent));
+            border-color: rgba(var(--sd-pagination--default-border, rgba(var(--sd-color-accent))));
           }
 .sd-pagination ul li a[aria-current], .sd-pagination ul li button[aria-current] {
         color: rgba(var(--sd-color-text-black));
@@ -640,7 +644,7 @@ mark.sd-mark {
         width: var(--sd-spacing-8);
         border-bottom-style: var(--tw-border-style);
         border-bottom-width: var(--sd-border-width-2);
-        border-bottom-color: rgba(var(--sd-color-border-accent));
+        border-color: rgba(var(--sd-pagination--default-border, rgba(var(--sd-color-accent))));
       }
 .sd-pagination--simple ul li:nth-child(2)::after {
           content: var(--tw-content);
@@ -689,6 +693,9 @@ mark.sd-mark {
 .sd-pagination--inverted ul li a:focus-visible, .sd-pagination--inverted ul li a[aria-current]:focus-visible, .sd-pagination--inverted ul li button:focus-visible, .sd-pagination--inverted ul li button[aria-current]:focus-visible {
           outline-color: var(--color-white, #fff);
         }
+.sd-pagination--inverted ul li:not(:first-child):not(:last-child) a[aria-current], .sd-pagination--inverted ul li:not(:first-child):not(:last-child) button[aria-current] {
+            border-color: rgba(var(--sd-pagination--inverted-border, rgba(var(--sd-color-accent))));
+          }
 .sd-pagination--inverted.sd-pagination--simple ul li {
       color: rgba(var(--sd-color-text-white));
     }
@@ -696,6 +703,9 @@ mark.sd-mark {
         content: var(--tw-content);
         color: rgba(var(--sd-color-text-white));
       }
+.sd-pagination--inverted.sd-pagination--simple ul li:nth-child(2) {
+        border-color: rgba(var(--sd-pagination--inverted-border, rgba(var(--sd-color-accent))));
+      }
 .sd-status-badge {
   display: inline-flex;
   align-items: center;
@@ -710,13 +720,13 @@ mark.sd-mark {
     color: rgba(var(--sd-color-text-white)) !important;
   }
 .sd-status-badge--success sd-icon {
-      background-color: rgba(var(--sd-color-background-success));
+      background-color: rgba(var(--sd-badge--green-color-background, rgba(var(--sd-color-success))));
     }
 .sd-status-badge--warning sd-icon {
       background-color: rgba(var(--sd-color-background-warning));
     }
 .sd-status-badge--error sd-icon {
-      background-color: rgba(var(--sd-color-background-error));
+      background-color: rgba(var(--sd-badge--red-color-background, rgba(var(--sd-color-error))));
     }
 .sd-status-badge--info sd-icon {
       background-color: rgba(var(--sd-color-background-info));
@@ -785,6 +795,7 @@ mark.sd-mark {
     line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
     --tw-leading: var(--leading-tight, 1.25);
     line-height: var(--leading-tight, 1.25);
+    color: rgba(var(--sd-headline--3xl-onwards-color-text, rgba(var(--sd-color-primary))));
   }
 @media (width >= 40rem) {
 .sd-headline.sd-headline, .sd-headline:is(h1):not(.sd-headline), .sd-prose :is(h1, h2, h3, h4, h5).sd-headline, .sd-prose :is(h1, h2, h3, h4, h5):is(h1):not(.sd-headline) {
@@ -806,6 +817,7 @@ mark.sd-mark {
     line-height: var(--tw-leading, var(--text-2xl--line-height, calc(2 / 1.5)));
     --tw-leading: var(--leading-tight, 1.25);
     line-height: var(--leading-tight, 1.25);
+    color: rgba(var(--sd-headline--3xl-onwards-color-text, rgba(var(--sd-color-primary))));
   }
 @media (width >= 40rem) {
 .sd-headline.sd-headline--size-3xl, .sd-headline:is(h2):not(.sd-headline), .sd-prose :is(h1, h2, h3, h4, h5).sd-headline--size-3xl, .sd-prose :is(h1, h2, h3, h4, h5):is(h2):not(.sd-headline) {
@@ -1063,7 +1075,7 @@ mark.sd-mark {
       left: calc(var(--sd-spacing-1) * 0);
       font-size: var(--sd-text-3xl);
       line-height: var(--tw-leading, var(--text-3xl--line-height, calc(2.25 / 1.875)));
-      color: rgba(var(--sd-color-text-primary));
+      color: rgb(var(--sd-color-icon-fill-primary));
     }
 .sd-list--icon.sd-list--horizontal {
     display: flex;
@@ -1151,7 +1163,7 @@ mark.sd-mark {
 .sd-table-cell--shadow-top:after, .sd-table-cell--shadow-bottom:after {
       right: calc(var(--sd-spacing-1) * 0);
       left: calc(var(--sd-spacing-1) * 0);
-      height: calc(var(--sd-spacing-1) * 2.5);
+      height: var(--sd-spacing-2\.5);
     }
 .sd-table-cell--shadow-top:before, .sd-table-cell--shadow-bottom:before {
       position: absolute;
@@ -1168,7 +1180,7 @@ mark.sd-mark {
 .sd-table-cell--shadow-left:after, .sd-table-cell--shadow-right:after {
       top: calc(var(--sd-spacing-1) * 0);
       bottom: calc(var(--sd-spacing-1) * 0);
-      width: calc(var(--sd-spacing-1) * 2.5);
+      width: var(--sd-spacing-2\.5);
     }
 .sd-table-cell.sd-table-cell--shadow-active:after {
     opacity: 100%;

package/dist-versioned/modules/chip.css

@@ -1,7 +1,7 @@
 /*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
 @layer properties;
 @layer theme, base, components, utilities;
-.sd-6-13-1-chip {
+.sd-6-14-0-chip {
   display: inline-flex;
   height: var(--sd-spacing-6);
   align-items: center;
@@ -9,30 +9,29 @@
   border-radius: var(--sd-chip-border-radius, var(--sd-spacing-1));
   border-style: var(--tw-border-style);
   border-width: 1px;
-  border-width: var(--sd-chip-border-width, 0);
   border-color: rgba(var(--sd-chip--primary-200-color-border, rgba(255, 255, 255, 0)));
   background-color: rgba(var(--sd-chip--primary-200-color-background, rgba(var(--sd-color-primary-200))));
   padding-inline: var(--sd-spacing-2);
-  font-size: var(--sd-chip-font-size, 0.875rem);
-  font-weight: var(--sd-chip-font-weight, var(--sd-font-weight-normal));
   white-space: nowrap;
   color: rgba(var(--sd-color-text-black));
 }
-.sd-6-13-1-chip--primary-500 {
+.sd-6-14-0-chip--primary-500 {
     border-color: rgba(var(--sd-chip--primary-500-color-border, rgba(255, 255, 255, 0)));
     background-color: rgba(var(--sd-chip--primary-500-color-background, rgba(var(--sd-color-primary-500))));
     color: rgba(var(--sd-chip--primary-500-color-text, rgba(var(--sd-color-white))));
   }
-.sd-6-13-1-chip--primary-300 {
+.sd-6-14-0-chip--primary-300 {
     border-color: rgba(var(--sd-chip--primary-300-color-border, rgba(255, 255, 255, 0)));
     background-color: rgba(var(--sd-chip--primary-300-color-background, rgba(var(--sd-color-primary-300))));
   }
-.sd-6-13-1-chip--white {
+.sd-6-14-0-chip--white {
     border-color: rgba(var(--sd-chip--white-color-border, rgba(255, 255, 255, 0)));
     background-color: rgba(var(--sd-chip--white-color-background, rgba(var(--sd-color-white))));
   }
-.sd-theme-kid .sd-6-13-1-chip {
-  box-shadow: var(--sd-shadow-sm);
+.sd-6-14-0-chip{
+  font-size: var(--sd-chip-font-size);
+  border-width: var(--sd-chip-border-width);
+  font-weight: var(--sd-chip-font-weight);
 }
 @property --tw-border-style {
   syntax: "*";

package/dist-versioned/modules/container.css

@@ -1,35 +1,35 @@
 /*! tailwindcss v4.2.1 | MIT License | https://tailwindcss.com */
 @layer theme, base, components, utilities;
-.sd-6-13-1-container {
+.sd-6-14-0-container {
   position: relative;
   background-color: rgba(var(--sd-color-background-neutral-100));
   padding-inline: var(--sd-spacing-10);
   padding-block: var(--sd-spacing-8);
 }
-.sd-6-13-1-container--variant-primary-100 {
+.sd-6-14-0-container--variant-primary-100 {
     background-color: rgba(var(--sd-color-background-primary-100));
   }
-.sd-6-13-1-container--variant-primary {
+.sd-6-14-0-container--variant-primary {
     background-color: rgba(var(--sd-color-background-primary));
   }
-.sd-6-13-1-container--variant-border-neutral-400 {
+.sd-6-14-0-container--variant-border-neutral-400 {
     --tw-border-style: solid;
     border-style: solid;
     border-color: rgba(var(--sd-color-border-neutral-400));
     background-color: rgba(var(--sd-color-background-white));
     border-width: 1px;
   }
-.sd-6-13-1-container--variant-white {
+.sd-6-14-0-container--variant-white {
     background-color: rgba(var(--sd-color-background-white));
   }
-.sd-6-13-1-container--padding-sm {
+.sd-6-14-0-container--padding-sm {
     padding-inline: var(--sd-spacing-6);
     padding-block: var(--sd-spacing-4);
   }
-.sd-6-13-1-container{
-  --triangle-background: rgba(var(--sd-color-white));
+.sd-6-14-0-container{
+  --triangle-background: rgba(var(--sd-color-background-white));
 }
-.sd-6-13-1-container--triangle-top::before, .sd-6-13-1-container--triangle-right::before, .sd-6-13-1-container--triangle-bottom::before, .sd-6-13-1-container--triangle-left::before {
+.sd-6-14-0-container--triangle-top::before, .sd-6-14-0-container--triangle-right::before, .sd-6-14-0-container--triangle-bottom::before, .sd-6-14-0-container--triangle-left::before {
     position: absolute;
     display: block;
     --tw-border-style: solid;
@@ -38,27 +38,27 @@
     border-width: 14px;
     content: '';
   }
-.sd-6-13-1-container--triangle-top::before {
+.sd-6-14-0-container--triangle-top::before {
     top: calc(var(--sd-spacing-1) * 0);
     left: calc(50% - 14px);
     border-top-color: var(--triangle-background);
   }
-.sd-6-13-1-container--triangle-right::before {
+.sd-6-14-0-container--triangle-right::before {
     right: calc(var(--sd-spacing-1) * 0);
     top: calc(50% - 14px);
     border-right-color: var(--triangle-background);
   }
-.sd-6-13-1-container--triangle-bottom::before {
+.sd-6-14-0-container--triangle-bottom::before {
     bottom: calc(var(--sd-spacing-1) * 0);
     left: calc(50% - 14px);
     border-bottom-color: var(--triangle-background);
   }
-.sd-6-13-1-container--triangle-left::before {
+.sd-6-14-0-container--triangle-left::before {
     left: calc(var(--sd-spacing-1) * 0);
     top: calc(50% - 14px);
     border-left-color: var(--triangle-background);
   }
-.sd-6-13-1-container--triangle-top-border::after, .sd-6-13-1-container--triangle-top-border::before, .sd-6-13-1-container--triangle-right-border::after, .sd-6-13-1-container--triangle-right-border::before, .sd-6-13-1-container--triangle-bottom-border::after, .sd-6-13-1-container--triangle-bottom-border::before, .sd-6-13-1-container--triangle-left-border::after, .sd-6-13-1-container--triangle-left-border::before {
+.sd-6-14-0-container--triangle-top-border::after, .sd-6-14-0-container--triangle-top-border::before, .sd-6-14-0-container--triangle-right-border::after, .sd-6-14-0-container--triangle-right-border::before, .sd-6-14-0-container--triangle-bottom-border::after, .sd-6-14-0-container--triangle-bottom-border::before, .sd-6-14-0-container--triangle-left-border::after, .sd-6-14-0-container--triangle-left-border::before {
       position: absolute;
       display: block;
       --tw-border-style: solid;
@@ -66,53 +66,53 @@
       border-color: transparent;
       content: '';
     }
-.sd-6-13-1-container--triangle-top-border::after, .sd-6-13-1-container--triangle-right-border::after, .sd-6-13-1-container--triangle-bottom-border::after, .sd-6-13-1-container--triangle-left-border::after {
+.sd-6-14-0-container--triangle-top-border::after, .sd-6-14-0-container--triangle-right-border::after, .sd-6-14-0-container--triangle-bottom-border::after, .sd-6-14-0-container--triangle-left-border::after {
       border-width: 14px;
     }
-.sd-6-13-1-container--triangle-top-border::before, .sd-6-13-1-container--triangle-right-border::before, .sd-6-13-1-container--triangle-bottom-border::before, .sd-6-13-1-container--triangle-left-border::before {
+.sd-6-14-0-container--triangle-top-border::before, .sd-6-14-0-container--triangle-right-border::before, .sd-6-14-0-container--triangle-bottom-border::before, .sd-6-14-0-container--triangle-left-border::before {
       border-width: 15px;
     }
-.sd-6-13-1-container--triangle-top-border::after, .sd-6-13-1-container--triangle-top-border::before {
+.sd-6-14-0-container--triangle-top-border::after, .sd-6-14-0-container--triangle-top-border::before {
       top: -1px;
     }
-.sd-6-13-1-container--triangle-top-border::before {
+.sd-6-14-0-container--triangle-top-border::before {
       border-top-color: rgba(var(--sd-color-border-neutral-400));
       left: calc(50% - 15px);
     }
-.sd-6-13-1-container--triangle-top-border::after {
+.sd-6-14-0-container--triangle-top-border::after {
       left: calc(50% - 14px);
       border-top-color: var(--triangle-background);
     }
-.sd-6-13-1-container--triangle-right-border::after, .sd-6-13-1-container--triangle-right-border::before {
+.sd-6-14-0-container--triangle-right-border::after, .sd-6-14-0-container--triangle-right-border::before {
       right: -1px;
     }
-.sd-6-13-1-container--triangle-right-border::before {
+.sd-6-14-0-container--triangle-right-border::before {
       border-right-color: rgba(var(--sd-color-border-neutral-400));
       top: calc(50% - 15px);
     }
-.sd-6-13-1-container--triangle-right-border::after {
+.sd-6-14-0-container--triangle-right-border::after {
       top: calc(50% - 14px);
       border-right-color: var(--triangle-background);
     }
-.sd-6-13-1-container--triangle-bottom-border::after, .sd-6-13-1-container--triangle-bottom-border::before {
+.sd-6-14-0-container--triangle-bottom-border::after, .sd-6-14-0-container--triangle-bottom-border::before {
       bottom: -1px;
     }
-.sd-6-13-1-container--triangle-bottom-border::before {
+.sd-6-14-0-container--triangle-bottom-border::before {
       border-bottom-color: rgba(var(--sd-color-border-neutral-400));
       left: calc(50% - 15px);
     }
-.sd-6-13-1-container--triangle-bottom-border::after {
+.sd-6-14-0-container--triangle-bottom-border::after {
       left: calc(50% - 14px);
       border-bottom-color: var(--triangle-background);
     }
-.sd-6-13-1-container--triangle-left-border::after, .sd-6-13-1-container--triangle-left-border::before {
+.sd-6-14-0-container--triangle-left-border::after, .sd-6-14-0-container--triangle-left-border::before {
       left: -1px;
     }
-.sd-6-13-1-container--triangle-left-border::before {
+.sd-6-14-0-container--triangle-left-border::before {
       border-left-color: rgba(var(--sd-color-border-neutral-400));
       top: calc(50% - 15px);
     }
-.sd-6-13-1-container--triangle-left-border::after {
+.sd-6-14-0-container--triangle-left-border::after {
       top: calc(50% - 14px);
       border-left-color: var(--triangle-background);
     }