@sbb-esta/lyne-elements-dev 5.7.0-dev.1788783153 → 5.8.0-dev.1788796432

package/lean-off-brand-theme.css

@@ -2,24 +2,6 @@
 /**
  * Do not edit directly, this file was auto-generated.
  */
-@font-face {
-  font-family: SBB;
-  src: url("https://cdn.app.sbb.ch/fonts/v1_9_subset/SBBWeb-Roman.woff2") format("woff2");
-  font-display: fallback;
-  font-weight: 400;
-}
-@font-face {
-  font-family: SBB;
-  src: url("https://cdn.app.sbb.ch/fonts/v1_9_subset/SBBWeb-Bold.woff2") format("woff2");
-  font-display: swap;
-  font-weight: 700;
-}
-@font-face {
-  font-family: SBB;
-  src: url("https://cdn.app.sbb.ch/fonts/v1_9_subset/SBBWeb-Light.woff2") format("woff2");
-  font-display: swap;
-  font-weight: 300;
-}
 html {
   text-size-adjust: 100%;
   tab-size: 4;
@@ -124,7 +106,7 @@ summary {
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
   color-scheme: light dark;
   color: var(--sbb-font-color-default);
@@ -1495,7 +1477,7 @@ summary {
   --sbb-navigation-action-color: var(--sbb-color-4-negative);
   --sbb-navigation-action-icon-display: none;
   --sbb-navigation-action-font-size: var(--sbb-text-font-size-xl);
-  --sbb-navigation-action-letter-spacing: var(--sbb-typo-letter-spacing-heading);
+  --sbb-navigation-action-letter-spacing: var(--sbb-letter-spacing-heading);
   --sbb-navigation-action-line-height: var(--sbb-typo-line-height-heading);
   --sbb-navigation-action-gap: var(--sbb-spacing-responsive-xs);
   --sbb-navigation-grid-column: 1 / -1;
@@ -1527,7 +1509,7 @@ summary {
   --sbb-navigation-marker-typo-line-height: var(--sbb-typo-line-height-heading);
   --sbb-navigation-margin-inline-start: var(--sbb-spacing-fixed-3x);
   --sbb-navigation-marker-font-size: var(--sbb-text-font-size-xl);
-  --sbb-navigation-marker-letter-spacing: var(--sbb-typo-letter-spacing-heading);
+  --sbb-navigation-marker-letter-spacing: var(--sbb-letter-spacing-heading);
   --sbb-navigation-marker-line-height: var(--sbb-typo-line-height-heading);
   --sbb-navigation-section-column: 1 / -1;
   --sbb-navigation-section-position: fixed;
@@ -2250,7 +2232,7 @@ img {
   min-width: var(--sbb-spacing-fixed-4x);
   max-height: var(--sbb-spacing-fixed-4x);
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-xxs);
   font-weight: bold;
   outline: var(--sbb-border-width-1x) solid transparent;
@@ -2338,7 +2320,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
   opacity: 1;
   background-color: transparent;
   font-size: var(--sbb-form-field-input-text-size) !important;
-  letter-spacing: var(--sbb-typo-letter-spacing-text) !important;
+  letter-spacing: var(--sbb-letter-spacing-text) !important;
   font-family: var(--sbb-typo-font-family) !important;
   line-height: var(--sbb-typo-line-height-text) !important;
 }
@@ -2501,11 +2483,11 @@ sbb-header + :where(sbb-sidebar-container, sbb-icon-sidebar-container) {
   align-items: baseline;
   color: var(--sbb-color-1);
   font-size: var(--sbb-text-font-size-xs);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
 }
 .sbb-header-info strong + * {
   font-size: var(--sbb-text-font-size-xxs);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   color: var(--sbb-color-granite);
   color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));
 }
@@ -2590,7 +2572,7 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
 }
 :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) th {
   font-size: var(--sbb-table-header-cell-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-weight: bold;
   background-color: var(--sbb-table-background-color);
   border-block-end: var(--sbb-table-border);
@@ -2600,7 +2582,7 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
 }
 :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) td {
   font-size: var(--sbb-table-data-cell-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   background-color: var(--sbb-table-background-color);
   border-block-end: var(--sbb-table-border);
   border-inline-end: var(--sbb-table-border);
@@ -2628,7 +2610,7 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
     var(--sbb-color-cement)
   );
   font-size: var(--sbb-text-font-size-xs);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   color: var(--sbb-table-caption-color, var(--sbb-table-caption-color-fallback));
   margin-block-start: var(--sbb-table-caption-margin-block-start, var(--sbb-spacing-fixed-4x));
   text-align: left;
@@ -2727,7 +2709,7 @@ sbb-table-wrapper[negative] .sbb-table--theme-iron, .sbb-table--theme-iron.sbb-t
     var(--sbb-color-cement)
   );
   font-size: var(--sbb-text-font-size-xs);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   color: var(--sbb-table-caption-color, var(--sbb-table-caption-color-fallback));
   margin-block-start: var(--sbb-table-caption-margin-block-start, var(--sbb-spacing-fixed-4x));
   text-align: left;
@@ -3007,7 +2989,7 @@ sbb-toggle:has(:focus-visible) {
   color: var(--sbb-color-granite);
   color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-xs);
 }
 
@@ -3217,7 +3199,7 @@ sbb-toggle:has(:focus-visible) {
 
 .sbb-list:where(dl) {
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-s);
   margin: 0;
   padding: 0;
@@ -3290,7 +3272,7 @@ sbb-toggle:has(:focus-visible) {
   border: var(--sbb-border-width-1x) solid light-dark(var(--sbb-color-cement), var(--sbb-color-smoke));
   border-radius: 50%;
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-xxs);
   font-weight: bold;
 }
@@ -3528,7 +3510,7 @@ sup {
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
 }
 
@@ -3562,7 +3544,7 @@ sup {
 
 .sbb-legend {
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-xs);
   padding: 0;
   color: var(--sbb-color-granite);

package/lean-safety-theme.css

@@ -124,11 +124,13 @@ summary {
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
   color-scheme: light dark;
   color: var(--sbb-font-color-default);
   background-color: var(--sbb-background-color-1);
+  --sbb-letter-spacing-heading: var(--sbb-typo-letter-spacing-heading);
+  --sbb-letter-spacing-text: var(--sbb-typo-letter-spacing-text);
   --sbb-animation-duration-1x: 0.04s;
   --sbb-animation-duration-2x: 0.08s;
   --sbb-animation-duration-3x: 0.12s;
@@ -1495,7 +1497,7 @@ summary {
   --sbb-navigation-action-color: var(--sbb-color-4-negative);
   --sbb-navigation-action-icon-display: none;
   --sbb-navigation-action-font-size: var(--sbb-text-font-size-xl);
-  --sbb-navigation-action-letter-spacing: var(--sbb-typo-letter-spacing-heading);
+  --sbb-navigation-action-letter-spacing: var(--sbb-letter-spacing-heading);
   --sbb-navigation-action-line-height: var(--sbb-typo-line-height-heading);
   --sbb-navigation-action-gap: var(--sbb-spacing-responsive-xs);
   --sbb-navigation-grid-column: 1 / -1;
@@ -1527,7 +1529,7 @@ summary {
   --sbb-navigation-marker-typo-line-height: var(--sbb-typo-line-height-heading);
   --sbb-navigation-margin-inline-start: var(--sbb-spacing-fixed-3x);
   --sbb-navigation-marker-font-size: var(--sbb-text-font-size-xl);
-  --sbb-navigation-marker-letter-spacing: var(--sbb-typo-letter-spacing-heading);
+  --sbb-navigation-marker-letter-spacing: var(--sbb-letter-spacing-heading);
   --sbb-navigation-marker-line-height: var(--sbb-typo-line-height-heading);
   --sbb-navigation-section-column: 1 / -1;
   --sbb-navigation-section-position: fixed;
@@ -2250,7 +2252,7 @@ img {
   min-width: var(--sbb-spacing-fixed-4x);
   max-height: var(--sbb-spacing-fixed-4x);
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-xxs);
   font-weight: bold;
   outline: var(--sbb-border-width-1x) solid transparent;
@@ -2338,7 +2340,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
   opacity: 1;
   background-color: transparent;
   font-size: var(--sbb-form-field-input-text-size) !important;
-  letter-spacing: var(--sbb-typo-letter-spacing-text) !important;
+  letter-spacing: var(--sbb-letter-spacing-text) !important;
   font-family: var(--sbb-typo-font-family) !important;
   line-height: var(--sbb-typo-line-height-text) !important;
 }
@@ -2501,11 +2503,11 @@ sbb-header + :where(sbb-sidebar-container, sbb-icon-sidebar-container) {
   align-items: baseline;
   color: var(--sbb-color-1);
   font-size: var(--sbb-text-font-size-xs);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
 }
 .sbb-header-info strong + * {
   font-size: var(--sbb-text-font-size-xxs);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   color: var(--sbb-color-granite);
   color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));
 }
@@ -2590,7 +2592,7 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
 }
 :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) th {
   font-size: var(--sbb-table-header-cell-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-weight: bold;
   background-color: var(--sbb-table-background-color);
   border-block-end: var(--sbb-table-border);
@@ -2600,7 +2602,7 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
 }
 :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) td {
   font-size: var(--sbb-table-data-cell-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   background-color: var(--sbb-table-background-color);
   border-block-end: var(--sbb-table-border);
   border-inline-end: var(--sbb-table-border);
@@ -2628,7 +2630,7 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
     var(--sbb-color-cement)
   );
   font-size: var(--sbb-text-font-size-xs);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   color: var(--sbb-table-caption-color, var(--sbb-table-caption-color-fallback));
   margin-block-start: var(--sbb-table-caption-margin-block-start, var(--sbb-spacing-fixed-4x));
   text-align: left;
@@ -2727,7 +2729,7 @@ sbb-table-wrapper[negative] .sbb-table--theme-iron, .sbb-table--theme-iron.sbb-t
     var(--sbb-color-cement)
   );
   font-size: var(--sbb-text-font-size-xs);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   color: var(--sbb-table-caption-color, var(--sbb-table-caption-color-fallback));
   margin-block-start: var(--sbb-table-caption-margin-block-start, var(--sbb-spacing-fixed-4x));
   text-align: left;
@@ -3007,7 +3009,7 @@ sbb-toggle:has(:focus-visible) {
   color: var(--sbb-color-granite);
   color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-xs);
 }
 
@@ -3217,7 +3219,7 @@ sbb-toggle:has(:focus-visible) {
 
 .sbb-list:where(dl) {
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-s);
   margin: 0;
   padding: 0;
@@ -3290,7 +3292,7 @@ sbb-toggle:has(:focus-visible) {
   border: var(--sbb-border-width-1x) solid light-dark(var(--sbb-color-cement), var(--sbb-color-smoke));
   border-radius: 50%;
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-xxs);
   font-weight: bold;
 }
@@ -3528,7 +3530,7 @@ sup {
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
 }
 
@@ -3562,7 +3564,7 @@ sup {
 
 .sbb-legend {
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-xs);
   padding: 0;
   color: var(--sbb-color-granite);

package/lean-theme.css

@@ -124,11 +124,13 @@ summary {
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
   color-scheme: light dark;
   color: var(--sbb-font-color-default);
   background-color: var(--sbb-background-color-1);
+  --sbb-letter-spacing-heading: var(--sbb-typo-letter-spacing-heading);
+  --sbb-letter-spacing-text: var(--sbb-typo-letter-spacing-text);
   --sbb-animation-duration-1x: 0.04s;
   --sbb-animation-duration-2x: 0.08s;
   --sbb-animation-duration-3x: 0.12s;
@@ -1495,7 +1497,7 @@ summary {
   --sbb-navigation-action-color: var(--sbb-color-4-negative);
   --sbb-navigation-action-icon-display: none;
   --sbb-navigation-action-font-size: var(--sbb-text-font-size-xl);
-  --sbb-navigation-action-letter-spacing: var(--sbb-typo-letter-spacing-heading);
+  --sbb-navigation-action-letter-spacing: var(--sbb-letter-spacing-heading);
   --sbb-navigation-action-line-height: var(--sbb-typo-line-height-heading);
   --sbb-navigation-action-gap: var(--sbb-spacing-responsive-xs);
   --sbb-navigation-grid-column: 1 / -1;
@@ -1527,7 +1529,7 @@ summary {
   --sbb-navigation-marker-typo-line-height: var(--sbb-typo-line-height-heading);
   --sbb-navigation-margin-inline-start: var(--sbb-spacing-fixed-3x);
   --sbb-navigation-marker-font-size: var(--sbb-text-font-size-xl);
-  --sbb-navigation-marker-letter-spacing: var(--sbb-typo-letter-spacing-heading);
+  --sbb-navigation-marker-letter-spacing: var(--sbb-letter-spacing-heading);
   --sbb-navigation-marker-line-height: var(--sbb-typo-line-height-heading);
   --sbb-navigation-section-column: 1 / -1;
   --sbb-navigation-section-position: fixed;
@@ -2250,7 +2252,7 @@ img {
   min-width: var(--sbb-spacing-fixed-4x);
   max-height: var(--sbb-spacing-fixed-4x);
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-xxs);
   font-weight: bold;
   outline: var(--sbb-border-width-1x) solid transparent;
@@ -2338,7 +2340,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
   opacity: 1;
   background-color: transparent;
   font-size: var(--sbb-form-field-input-text-size) !important;
-  letter-spacing: var(--sbb-typo-letter-spacing-text) !important;
+  letter-spacing: var(--sbb-letter-spacing-text) !important;
   font-family: var(--sbb-typo-font-family) !important;
   line-height: var(--sbb-typo-line-height-text) !important;
 }
@@ -2501,11 +2503,11 @@ sbb-header + :where(sbb-sidebar-container, sbb-icon-sidebar-container) {
   align-items: baseline;
   color: var(--sbb-color-1);
   font-size: var(--sbb-text-font-size-xs);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
 }
 .sbb-header-info strong + * {
   font-size: var(--sbb-text-font-size-xxs);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   color: var(--sbb-color-granite);
   color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));
 }
@@ -2590,7 +2592,7 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
 }
 :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) th {
   font-size: var(--sbb-table-header-cell-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-weight: bold;
   background-color: var(--sbb-table-background-color);
   border-block-end: var(--sbb-table-border);
@@ -2600,7 +2602,7 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
 }
 :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) td {
   font-size: var(--sbb-table-data-cell-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   background-color: var(--sbb-table-background-color);
   border-block-end: var(--sbb-table-border);
   border-inline-end: var(--sbb-table-border);
@@ -2628,7 +2630,7 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
     var(--sbb-color-cement)
   );
   font-size: var(--sbb-text-font-size-xs);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   color: var(--sbb-table-caption-color, var(--sbb-table-caption-color-fallback));
   margin-block-start: var(--sbb-table-caption-margin-block-start, var(--sbb-spacing-fixed-4x));
   text-align: left;
@@ -2727,7 +2729,7 @@ sbb-table-wrapper[negative] .sbb-table--theme-iron, .sbb-table--theme-iron.sbb-t
     var(--sbb-color-cement)
   );
   font-size: var(--sbb-text-font-size-xs);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   color: var(--sbb-table-caption-color, var(--sbb-table-caption-color-fallback));
   margin-block-start: var(--sbb-table-caption-margin-block-start, var(--sbb-spacing-fixed-4x));
   text-align: left;
@@ -3007,7 +3009,7 @@ sbb-toggle:has(:focus-visible) {
   color: var(--sbb-color-granite);
   color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-xs);
 }
 
@@ -3217,7 +3219,7 @@ sbb-toggle:has(:focus-visible) {
 
 .sbb-list:where(dl) {
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-s);
   margin: 0;
   padding: 0;
@@ -3290,7 +3292,7 @@ sbb-toggle:has(:focus-visible) {
   border: var(--sbb-border-width-1x) solid light-dark(var(--sbb-color-cement), var(--sbb-color-smoke));
   border-radius: 50%;
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-xxs);
   font-weight: bold;
 }
@@ -3528,7 +3530,7 @@ sup {
   font-family: var(--sbb-typo-font-family);
   font-weight: normal;
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size);
 }
 
@@ -3562,7 +3564,7 @@ sup {
 
 .sbb-legend {
   line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+  letter-spacing: var(--sbb-letter-spacing-text);
   font-size: var(--sbb-text-font-size-xs);
   padding: 0;
   color: var(--sbb-color-granite);

package/link.pure.js

@@ -1,5 +1,5 @@
 import{SbbActionBaseElement as e,SbbButtonBaseElement as t,SbbDisabledMixin as n,SbbDisabledTabIndexActionMixin as r,SbbLinkBaseElement as i,SbbNegativeMixin as a}from"./core.js";import{__esDecorate as o,__runInitializers as s}from"tslib";import{html as c,unsafeCSS as l}from"lit";import{property as u}from"lit/decorators.js";import{SbbIconNameMixin as d}from"./icon.pure.js";import{html as f}from"lit/static-html.js";var p=`:host{outline:none!important}@media (forced-colors:active){:host(:is(:state(button),[state--button])){--sbb-link-color-normal:ButtonText;--sbb-link-color-hover:ButtonText;--sbb-link-color-active:ButtonText}}.sbb-action-base{color:var(--sbb-link-color-normal);text-decoration-line:var(--sbb-link-text-decoration-line,underline);text-underline-offset:.3125em;text-decoration-thickness:.0625rem}@media (forced-colors:active){.sbb-action-base{text-decoration:underline}}.sbb-action-base{width:100%;cursor:var(--sbb-cursor-pointer);padding:var(--sbb-link-padding,0);outline:none;align-items:center;display:flex}:host(:is([disabled],:disabled,[disabled-interactive])) .sbb-action-base{pointer-events:none;cursor:var(--sbb-cursor-default)}@media (forced-colors:active){:host(:is([disabled],:disabled,[disabled-interactive])) .sbb-action-base{color:graytext}}:host(:focus-visible) .sbb-action-base,.sbb-action-base:focus-visible{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);border-radius:calc(var(--sbb-border-radius-4x) - var(--sbb-focus-outline-offset))}@media (any-hover:hover){:host(:hover:not([disabled],:disabled,[disabled-interactive])) .sbb-action-base{color:var(--sbb-link-color-hover);text-decoration-line:var(--sbb-link-hover-text-decoration,underline)}}:host(:is(:active,:is(:state(active),[state--active])):not([disabled],:disabled,[disabled-interactive])) .sbb-action-base{color:var(--sbb-link-color-active)}
-`;const m=e=>{class t extends a(e){static{this.styles=[l(p)]}constructor(){super(),this.internals.states.add(`sbb-link`)}renderTemplate(){return f`<slot></slot>`}}return t};var h=`:host{--sbb-link-color-hover:light-dark(var(--sbb-color-primary125),var(--sbb-color-cloud));--sbb-link-color-active:light-dark(var(--sbb-color-primary150),var(--sbb-color-silver));--sbb-link-color-normal:light-dark(var(--sbb-color-granite),var(--sbb-color-white));display:block}:host([negative]){--sbb-focus-outline-color:var(--sbb-focus-outline-color-dark);--sbb-link-color-normal:var(--sbb-color-1-negative);--sbb-link-color-hover:var(--sbb-color-4-negative);--sbb-link-color-active:var(--sbb-color-silver)}:host(.sbb-active){--sbb-link-color-normal:light-dark(var(--sbb-color-black),var(--sbb-color-cement));--sbb-link-text-decoration-line:underline}:host(.sbb-active[negative]){--sbb-link-color-normal:var(--sbb-color-cement);--sbb-link-text-decoration-line:underline}:host([size=xs]){--sbb-block-link-font-size:var(--sbb-text-font-size-xs)}:host([size=s]){--sbb-block-link-font-size:var(--sbb-text-font-size-s)}:host([size=m]){--sbb-block-link-font-size:var(--sbb-text-font-size-m)}.sbb-action-base{gap:var(--sbb-block-link-gap);font-size:var(--sbb-block-link-font-size);letter-spacing:var(--sbb-typo-letter-spacing-text);line-height:var(--sbb-typo-line-height-text)}.sbb-link__icon{height:calc(var(--sbb-typo-line-height-text) * 1em);width:var(--sbb-block-link-icon-size);flex:none;align-self:start;position:relative}:host(:not(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-link__icon{display:none}:host([icon-placement=end]) .sbb-link__icon{order:2}.sbb-link__icon ::slotted([slot=icon]),.sbb-link__icon sbb-icon{--sbb-icon-svg-display:block;position:absolute;top:50%;translate:0 -50%}
+`;const m=e=>{class t extends a(e){static{this.styles=[l(p)]}constructor(){super(),this.internals.states.add(`sbb-link`)}renderTemplate(){return f`<slot></slot>`}}return t};var h=`:host{--sbb-link-color-hover:light-dark(var(--sbb-color-primary125),var(--sbb-color-cloud));--sbb-link-color-active:light-dark(var(--sbb-color-primary150),var(--sbb-color-silver));--sbb-link-color-normal:light-dark(var(--sbb-color-granite),var(--sbb-color-white));display:block}:host([negative]){--sbb-focus-outline-color:var(--sbb-focus-outline-color-dark);--sbb-link-color-normal:var(--sbb-color-1-negative);--sbb-link-color-hover:var(--sbb-color-4-negative);--sbb-link-color-active:var(--sbb-color-silver)}:host(.sbb-active){--sbb-link-color-normal:light-dark(var(--sbb-color-black),var(--sbb-color-cement));--sbb-link-text-decoration-line:underline}:host(.sbb-active[negative]){--sbb-link-color-normal:var(--sbb-color-cement);--sbb-link-text-decoration-line:underline}:host([size=xs]){--sbb-block-link-font-size:var(--sbb-text-font-size-xs)}:host([size=s]){--sbb-block-link-font-size:var(--sbb-text-font-size-s)}:host([size=m]){--sbb-block-link-font-size:var(--sbb-text-font-size-m)}.sbb-action-base{gap:var(--sbb-block-link-gap);font-size:var(--sbb-block-link-font-size);letter-spacing:var(--sbb-letter-spacing-text);line-height:var(--sbb-typo-line-height-text)}.sbb-link__icon{height:calc(var(--sbb-typo-line-height-text) * 1em);width:var(--sbb-block-link-icon-size);flex:none;align-self:start;position:relative}:host(:not(:is(:state(slotted-icon),[state--slotted-icon]),:is(:state(has-icon-name),[state--has-icon-name]))) .sbb-link__icon{display:none}:host([icon-placement=end]) .sbb-link__icon{order:2}.sbb-link__icon ::slotted([slot=icon]),.sbb-link__icon sbb-icon{--sbb-icon-svg-display:block;position:absolute;top:50%;translate:0 -50%}
 `;const g=e=>(()=>{let t=m(d(e)),n,r=[],i=[],a,f=[],p=[];return class extends t{static{let e=typeof Symbol==`function`&&Symbol.metadata?Object.create(t[Symbol.metadata]??null):void 0;n=[u({reflect:!0})],a=[u({attribute:`icon-placement`,reflect:!0})],o(this,null,n,{kind:`accessor`,name:`size`,static:!1,private:!1,access:{has:e=>`size`in e,get:e=>e.size,set:(e,t)=>{e.size=t}},metadata:e},r,i),o(this,null,a,{kind:`accessor`,name:`iconPlacement`,static:!1,private:!1,access:{has:e=>`iconPlacement`in e,get:e=>e.iconPlacement,set:(e,t)=>{e.iconPlacement=t}},metadata:e},f,p),e&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:e})}static{this.styles=[l(h)]}#e=s(this,r,null);get size(){return this.#e}set size(e){this.#e=e}#t=(s(this,i),s(this,f,`start`));get iconPlacement(){return this.#t}set iconPlacement(e){this.#t=e}renderTemplate(){return c`
         <span class="sbb-link__icon">${super.renderIconSlot()}</span>
         <slot></slot>

package/menu.pure.js

@@ -1,4 +1,4 @@
-import{html as e,isServer as t,unsafeCSS as n}from"lit";import{SbbButtonBaseElement as r,SbbDarkModeController as i,SbbDisabledInteractiveMixin as a,SbbDisabledMixin as o,SbbDisabledTabIndexActionMixin as s,SbbEscapableOverlayController as c,SbbFocusTrapController as l,SbbInertController as u,SbbLanguageController as d,SbbLinkBaseElement as f,SbbMediaMatcherController as p,SbbMediaQueryBreakpointSmallAndBelow as m,SbbOpenCloseBaseElement as h,SbbScrollHandler as g,forwardEvent as _,getElementPosition as v,getElementPositionHorizontal as y,getNextElementIndex as b,i18nGoBack as x,idReference as S,interactivityChecker as C,isArrowKeyOrPageKeysPressed as w,isEventOnElement as T,isZeroAnimationDuration as E,popoverResetStyles as D,removeAriaOverlayTriggerProperties as O,scrollbarStyles as k,setAriaOverlayTriggerProperties as A,ɵstateController as j}from"./core.js";import{SbbIconNameMixin as M}from"./icon.pure.js";import{__esDecorate as N,__runInitializers as P}from"tslib";import{property as F}from"lit/decorators.js";import{ref as I}from"lit/directives/ref.js";import{SbbDividerElement as L}from"./divider.pure.js";var R=`:host{--sbb-menu-action-cursor:var(--sbb-cursor-pointer);display:block;outline:none!important}@media (any-hover:hover){:host(:is(:hover:not([disabled],:disabled,[disabled-interactive]),[aria-expanded=true])){--sbb-menu-background-color:light-dark(var(--sbb-color-iron),var(--sbb-color-milk));--sbb-menu-action-forced-color-border-color:Highlight}}:host(:is([disabled],:disabled,[disabled-interactive])){--sbb-menu-action-cursor:var(--sbb-cursor-default);--sbb-menu-action-color:light-dark(var(--sbb-color-graphite),var(--sbb-color-granite));--sbb-menu-action-forced-color-border-color:GrayText;pointer-events:none;cursor:var(--sbb-cursor-default)}@media (forced-colors:active){:host(:is([disabled],:disabled,[disabled-interactive])){--sbb-menu-action-color:GrayText}}:host(:is(:state(sbb-menu-trigger),[state--sbb-menu-trigger])){--sbb-menu-action-cursor:var(--sbb-cursor-default)}@media (forced-colors:active){:host(:is(:state(button),[state--button])){--sbb-menu-action-color:ButtonText}}:host([sbb-badge]:not(:is(:state(has-icon-name),[state--has-icon-name]),:is(:state(slotted-icon),[state--slotted-icon]))):after{translate:50% -50%;inset:50% calc(100% - var(--sbb-menu-action-outer-horizontal-padding) - var(--sbb-menu-action-content-padding-inline) - .5 * var(--sbb-size-icon-ui-small)) auto auto!important}:host([sbb-badge]:is(:is(:state(has-icon-name),[state--has-icon-name]),:is(:state(slotted-icon),[state--slotted-icon]))):after{inset:calc(var(--sbb-menu-action-outer-vertical-padding) + var(--sbb-menu-action-content-padding-block) + var(--sbb-badge-position-offset)) calc(100% - var(--sbb-menu-action-outer-horizontal-padding) - var(--sbb-menu-action-content-padding-inline) - var(--sbb-size-icon-ui-small) + var(--sbb-badge-position-offset)) auto auto!important}:host([aria-controls]){--sbb-menu-action-submenu-icon-display:flex}:is(.sbb-menu-button,.sbb-menu-link){width:100%;color:var(--sbb-menu-action-color);padding:var(--sbb-menu-action-outer-vertical-padding) var(--sbb-menu-action-outer-horizontal-padding);cursor:var(--sbb-menu-action-cursor);outline:none;text-decoration:none;display:block}.sbb-menu-action__content{align-items:center;gap:var(--sbb-menu-action-gap);padding:var(--sbb-menu-action-content-padding-block) var(--sbb-menu-action-content-padding-inline);border-radius:var(--sbb-menu-action-border-radius);user-select:none;-webkit-tap-highlight-color:transparent;background-color:var(--sbb-menu-background-color);line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size-xs);display:flex}:host(:focus-visible) .sbb-menu-action__content,:focus-visible .sbb-menu-action__content{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width)}@media (forced-colors:active){.sbb-menu-action__content{border:var(--sbb-border-width-2x) solid var(--sbb-menu-action-forced-color-border-color)}}.sbb-menu-action__icon,.sbb-menu-submenu__icon{min-width:var(--sbb-size-icon-ui-small);min-height:var(--sbb-size-icon-ui-small);display:flex}.sbb-menu-submenu__icon{display:var(--sbb-menu-action-submenu-icon-display,none);margin-inline-start:auto}.sbb-menu-action__label{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host(:is([disabled],:disabled,[disabled-interactive])) .sbb-menu-action__label{text-decoration:line-through}
+import{html as e,isServer as t,unsafeCSS as n}from"lit";import{SbbButtonBaseElement as r,SbbDarkModeController as i,SbbDisabledInteractiveMixin as a,SbbDisabledMixin as o,SbbDisabledTabIndexActionMixin as s,SbbEscapableOverlayController as c,SbbFocusTrapController as l,SbbInertController as u,SbbLanguageController as d,SbbLinkBaseElement as f,SbbMediaMatcherController as p,SbbMediaQueryBreakpointSmallAndBelow as m,SbbOpenCloseBaseElement as h,SbbScrollHandler as g,forwardEvent as _,getElementPosition as v,getElementPositionHorizontal as y,getNextElementIndex as b,i18nGoBack as x,idReference as S,interactivityChecker as C,isArrowKeyOrPageKeysPressed as w,isEventOnElement as T,isZeroAnimationDuration as E,popoverResetStyles as D,removeAriaOverlayTriggerProperties as O,scrollbarStyles as k,setAriaOverlayTriggerProperties as A,ɵstateController as j}from"./core.js";import{SbbIconNameMixin as M}from"./icon.pure.js";import{__esDecorate as N,__runInitializers as P}from"tslib";import{property as F}from"lit/decorators.js";import{ref as I}from"lit/directives/ref.js";import{SbbDividerElement as L}from"./divider.pure.js";var R=`:host{--sbb-menu-action-cursor:var(--sbb-cursor-pointer);display:block;outline:none!important}@media (any-hover:hover){:host(:is(:hover:not([disabled],:disabled,[disabled-interactive]),[aria-expanded=true])){--sbb-menu-background-color:light-dark(var(--sbb-color-iron),var(--sbb-color-milk));--sbb-menu-action-forced-color-border-color:Highlight}}:host(:is([disabled],:disabled,[disabled-interactive])){--sbb-menu-action-cursor:var(--sbb-cursor-default);--sbb-menu-action-color:light-dark(var(--sbb-color-graphite),var(--sbb-color-granite));--sbb-menu-action-forced-color-border-color:GrayText;pointer-events:none;cursor:var(--sbb-cursor-default)}@media (forced-colors:active){:host(:is([disabled],:disabled,[disabled-interactive])){--sbb-menu-action-color:GrayText}}:host(:is(:state(sbb-menu-trigger),[state--sbb-menu-trigger])){--sbb-menu-action-cursor:var(--sbb-cursor-default)}@media (forced-colors:active){:host(:is(:state(button),[state--button])){--sbb-menu-action-color:ButtonText}}:host([sbb-badge]:not(:is(:state(has-icon-name),[state--has-icon-name]),:is(:state(slotted-icon),[state--slotted-icon]))):after{translate:50% -50%;inset:50% calc(100% - var(--sbb-menu-action-outer-horizontal-padding) - var(--sbb-menu-action-content-padding-inline) - .5 * var(--sbb-size-icon-ui-small)) auto auto!important}:host([sbb-badge]:is(:is(:state(has-icon-name),[state--has-icon-name]),:is(:state(slotted-icon),[state--slotted-icon]))):after{inset:calc(var(--sbb-menu-action-outer-vertical-padding) + var(--sbb-menu-action-content-padding-block) + var(--sbb-badge-position-offset)) calc(100% - var(--sbb-menu-action-outer-horizontal-padding) - var(--sbb-menu-action-content-padding-inline) - var(--sbb-size-icon-ui-small) + var(--sbb-badge-position-offset)) auto auto!important}:host([aria-controls]){--sbb-menu-action-submenu-icon-display:flex}:is(.sbb-menu-button,.sbb-menu-link){width:100%;color:var(--sbb-menu-action-color);padding:var(--sbb-menu-action-outer-vertical-padding) var(--sbb-menu-action-outer-horizontal-padding);cursor:var(--sbb-menu-action-cursor);outline:none;text-decoration:none;display:block}.sbb-menu-action__content{align-items:center;gap:var(--sbb-menu-action-gap);padding:var(--sbb-menu-action-content-padding-block) var(--sbb-menu-action-content-padding-inline);border-radius:var(--sbb-menu-action-border-radius);user-select:none;-webkit-tap-highlight-color:transparent;background-color:var(--sbb-menu-background-color);line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-letter-spacing-text);font-size:var(--sbb-text-font-size-xs);display:flex}:host(:focus-visible) .sbb-menu-action__content,:focus-visible .sbb-menu-action__content{outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width)}@media (forced-colors:active){.sbb-menu-action__content{border:var(--sbb-border-width-2x) solid var(--sbb-menu-action-forced-color-border-color)}}.sbb-menu-action__icon,.sbb-menu-submenu__icon{min-width:var(--sbb-size-icon-ui-small);min-height:var(--sbb-size-icon-ui-small);display:flex}.sbb-menu-submenu__icon{display:var(--sbb-menu-action-submenu-icon-display,none);margin-inline-start:auto}.sbb-menu-action__label{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}:host(:is([disabled],:disabled,[disabled-interactive])) .sbb-menu-action__label{text-decoration:line-through}
 `;const z=t=>{class r extends M(o(t)){static{this.styles=[n(R)]}renderTemplate(){return e`
         <span class="sbb-menu-action__content">
           <span class="sbb-menu-action__icon"> ${super.renderIconSlot()} </span>

package/message.pure.js

@@ -1,4 +1,4 @@
-import{html as e,unsafeCSS as t}from"lit";import{SbbElement as n}from"./core.js";var r=`:host{text-align:center;line-height:var(--sbb-typo-line-height-text);display:block}::slotted(sbb-title[slot=title]){margin:0}::slotted([slot=image]){width:100%;display:block;margin-inline:auto!important;margin-block:var(--sbb-message-image-margin-block)!important}::slotted([slot=subtitle]){color:var(--sbb-message-subtitle-color);font-size:var(--sbb-text-font-size-s);letter-spacing:var(--sbb-typo-letter-spacing-text);margin:0}::slotted([slot=legend]){line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-typo-letter-spacing-text);font-size:var(--sbb-text-font-size-xs);color:light-dark(var(--sbb-color-granite),var(--sbb-color-cement));margin-block:var(--sbb-message-legend-margin-block);padding:0}::slotted([slot=action]){margin-block:var(--sbb-message-action-margin-block)}
+import{html as e,unsafeCSS as t}from"lit";import{SbbElement as n}from"./core.js";var r=`:host{text-align:center;line-height:var(--sbb-typo-line-height-text);display:block}::slotted(sbb-title[slot=title]){margin:0}::slotted([slot=image]){width:100%;display:block;margin-inline:auto!important;margin-block:var(--sbb-message-image-margin-block)!important}::slotted([slot=subtitle]){color:var(--sbb-message-subtitle-color);font-size:var(--sbb-text-font-size-s);letter-spacing:var(--sbb-letter-spacing-text);margin:0}::slotted([slot=legend]){line-height:var(--sbb-typo-line-height-text);letter-spacing:var(--sbb-letter-spacing-text);font-size:var(--sbb-text-font-size-xs);color:light-dark(var(--sbb-color-granite),var(--sbb-color-cement));margin-block:var(--sbb-message-legend-margin-block);padding:0}::slotted([slot=action]){margin-block:var(--sbb-message-action-margin-block)}
 `,i=class extends n{static{this.elementName=`sbb-message`}static{this.styles=[t(r)]}_configureTitle(e){let t=e.target.assignedElements().find(e=>e.localName===`sbb-title`);t&&(customElements.upgrade(t),t.visualLevel=`5`)}render(){return e`
       <slot name="image"></slot>
       <slot name="title" @slotchange=${this._configureTitle}></slot>

package/mini-calendar.pure.js

@@ -1,5 +1,5 @@
 import{__esDecorate as e,__runInitializers as t}from"tslib";import{html as n,unsafeCSS as r}from"lit";import{property as i}from"lit/decorators.js";import{SbbButtonBaseElement as a,SbbElement as o,SbbPropertyWatcherController as s,defaultDateAdapter as c,forceType as l,isArrowKeyOrPageKeysPressed as u,omitEmptyConverter as d,readConfig as f,ɵstateController as p}from"./core.js";import{MutationController as m}from"@lit-labs/observers/mutation-controller.js";var h=`:host{--sbb-mini-calendar-day-animation-duration:var(--sbb-disable-animation-duration,var(--sbb-animation-duration-2x));height:var(--sbb-mini-calendar-day-dimensions);width:var(--sbb-mini-calendar-day-dimensions);border-radius:var(--sbb-border-radius-infinity);color:light-dark(var(--sbb-color-storm),var(--sbb-color-smoke));background-color:currentColor;margin:.0625rem;display:block}@media (any-hover:hover){:host(:hover){scale:var(--sbb-mini-calendar-day-scale);transition:scale var(--sbb-mini-calendar-day-animation-easing) var(--sbb-mini-calendar-day-animation-duration)}}:host(:focus-visible){outline-offset:var(--sbb-focus-outline-offset);outline:var(--sbb-focus-outline-color) var(--sbb-focus-outline-style,solid) var(--sbb-focus-outline-width);outline-offset:.125rem}:host([color=charcoal]){color:var(--sbb-background-color-2-inverted)}:host([color=cloud]){color:var(--sbb-background-color-4)}:host([color=orange]){color:var(--sbb-color-orange-light)}:host([color=red]){color:var(--sbb-color-error)}:host([color=sky]){color:var(--sbb-color-sky-light)}:host([marker=circle]){background-color:var(--sbb-color-1-inverted);border:.0625rem solid}:host([marker=target]){background:radial-gradient(circle, currentcolor 0%, currentcolor 25%, var(--sbb-color-1-inverted) 25%, var(--sbb-color-1-inverted) 50%, currentcolor 50%, currentcolor 100%)}:host([marker=slash]){position:relative}:host([marker=slash]):before{content:"";background-image:linear-gradient(-45deg, transparent 45%, var(--sbb-color-1-inverted) 45%, var(--sbb-color-1-inverted) 55%, transparent 55%);position:absolute;inset:0}:host([marker=cross]){position:relative}:host([marker=cross]):before{content:"";background-image:linear-gradient(-45deg, transparent 45%, var(--sbb-color-1-inverted) 45%, var(--sbb-color-1-inverted) 55%, transparent 55%), linear-gradient(45deg, transparent 45%, var(--sbb-color-1-inverted) 45%, var(--sbb-color-1-inverted) 55%, transparent 55%);position:absolute;inset:0}
-`;let g=(()=>{let o=a,s,u=[],p=[],m,g=[],_=[],v,y=[],b=[];return class extends o{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(o[Symbol.metadata]??null):void 0;s=[l(),i()],m=[l(),i({reflect:!0,converter:d})],v=[l(),i({reflect:!0,converter:d})],e(this,null,s,{kind:`accessor`,name:`date`,static:!1,private:!1,access:{has:e=>`date`in e,get:e=>e.date,set:(e,t)=>{e.date=t}},metadata:t},u,p),e(this,null,m,{kind:`accessor`,name:`marker`,static:!1,private:!1,access:{has:e=>`marker`in e,get:e=>e.marker,set:(e,t)=>{e.marker=t}},metadata:t},g,_),e(this,null,v,{kind:`accessor`,name:`color`,static:!1,private:!1,access:{has:e=>`color`in e,get:e=>e.color,set:(e,t)=>{e.color=t}},metadata:t},y,b),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-mini-calendar-day`}static{this.styles=[r(h)]}#e;get date(){return this.#e}set date(e){this.#e=e}#t;get marker(){return this.#t}set marker(e){this.#t=e}#n;get color(){return this.#n}set color(e){this.#n=e}willUpdate(e){super.willUpdate(e),e.has(`date`)&&this.date&&(this.internals.ariaLabel=this._dateAdapter.getAccessibilityFormatDate(this.date))}renderTemplate(){return n``}constructor(){super(...arguments),this._dateAdapter=f().datetime?.dateAdapter??c,this.#e=t(this,u,``),this.#t=(t(this,p),t(this,g,``)),this.#n=(t(this,_),t(this,y,``)),t(this,b)}}})();var _=`:host{display:inline-block}:host(:is(:state(show-year),[state--show-year])){--sbb-mini-calendar-month-visibilty-year:visible}:host(:is(:state(orientation-horizontal),[state--orientation-horizontal])){--sbb-mini-calendar-month-grid-auto-flow:row;--sbb-mini-calendar-month-height:3rem;--sbb-mini-calendar-month-grid-template-rows:none;--sbb-mini-calendar-month-grid-template-columns:repeat(7, 1fr)}:host(:is(:state(orientation-horizontal),[state--orientation-horizontal])) ::slotted(sbb-mini-calendar-day:first-child){grid-column-start:var(--sbb-mini-calendar-month-offset)}:host(:is(:state(orientation-vertical),[state--orientation-vertical])){--sbb-mini-calendar-month-grid-auto-flow:column;--sbb-mini-calendar-month-height:auto;--sbb-mini-calendar-month-grid-template-rows:repeat(7, 1fr);--sbb-mini-calendar-month-grid-template-columns:none}:host(:is(:state(orientation-vertical),[state--orientation-vertical])) ::slotted(sbb-mini-calendar-day:first-child){grid-row-start:var(--sbb-mini-calendar-month-offset)}.sbb-mini-calendar-month-wrapper{height:var(--sbb-mini-calendar-month-height);grid-auto-flow:var(--sbb-mini-calendar-month-grid-auto-flow);grid-auto-rows:.5rem;grid-template-columns:var(--sbb-mini-calendar-month-grid-template-columns);grid-template-rows:var(--sbb-mini-calendar-month-grid-template-rows);display:grid}.sbb-mini-calendar-month-label-year,.sbb-mini-calendar-month-label-month{font-size:var(--sbb-text-font-size-xxs);letter-spacing:var(--sbb-typo-letter-spacing-text);color:var(--sbb-mini-calendar-month-label-color)}.sbb-mini-calendar-month-label-year{visibility:var(--sbb-mini-calendar-month-visibilty-year)}
+`;let g=(()=>{let o=a,s,u=[],p=[],m,g=[],_=[],v,y=[],b=[];return class extends o{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(o[Symbol.metadata]??null):void 0;s=[l(),i()],m=[l(),i({reflect:!0,converter:d})],v=[l(),i({reflect:!0,converter:d})],e(this,null,s,{kind:`accessor`,name:`date`,static:!1,private:!1,access:{has:e=>`date`in e,get:e=>e.date,set:(e,t)=>{e.date=t}},metadata:t},u,p),e(this,null,m,{kind:`accessor`,name:`marker`,static:!1,private:!1,access:{has:e=>`marker`in e,get:e=>e.marker,set:(e,t)=>{e.marker=t}},metadata:t},g,_),e(this,null,v,{kind:`accessor`,name:`color`,static:!1,private:!1,access:{has:e=>`color`in e,get:e=>e.color,set:(e,t)=>{e.color=t}},metadata:t},y,b),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-mini-calendar-day`}static{this.styles=[r(h)]}#e;get date(){return this.#e}set date(e){this.#e=e}#t;get marker(){return this.#t}set marker(e){this.#t=e}#n;get color(){return this.#n}set color(e){this.#n=e}willUpdate(e){super.willUpdate(e),e.has(`date`)&&this.date&&(this.internals.ariaLabel=this._dateAdapter.getAccessibilityFormatDate(this.date))}renderTemplate(){return n``}constructor(){super(...arguments),this._dateAdapter=f().datetime?.dateAdapter??c,this.#e=t(this,u,``),this.#t=(t(this,p),t(this,g,``)),this.#n=(t(this,_),t(this,y,``)),t(this,b)}}})();var _=`:host{display:inline-block}:host(:is(:state(show-year),[state--show-year])){--sbb-mini-calendar-month-visibilty-year:visible}:host(:is(:state(orientation-horizontal),[state--orientation-horizontal])){--sbb-mini-calendar-month-grid-auto-flow:row;--sbb-mini-calendar-month-height:3rem;--sbb-mini-calendar-month-grid-template-rows:none;--sbb-mini-calendar-month-grid-template-columns:repeat(7, 1fr)}:host(:is(:state(orientation-horizontal),[state--orientation-horizontal])) ::slotted(sbb-mini-calendar-day:first-child){grid-column-start:var(--sbb-mini-calendar-month-offset)}:host(:is(:state(orientation-vertical),[state--orientation-vertical])){--sbb-mini-calendar-month-grid-auto-flow:column;--sbb-mini-calendar-month-height:auto;--sbb-mini-calendar-month-grid-template-rows:repeat(7, 1fr);--sbb-mini-calendar-month-grid-template-columns:none}:host(:is(:state(orientation-vertical),[state--orientation-vertical])) ::slotted(sbb-mini-calendar-day:first-child){grid-row-start:var(--sbb-mini-calendar-month-offset)}.sbb-mini-calendar-month-wrapper{height:var(--sbb-mini-calendar-month-height);grid-auto-flow:var(--sbb-mini-calendar-month-grid-auto-flow);grid-auto-rows:.5rem;grid-template-columns:var(--sbb-mini-calendar-month-grid-template-columns);grid-template-rows:var(--sbb-mini-calendar-month-grid-template-rows);display:grid}.sbb-mini-calendar-month-label-year,.sbb-mini-calendar-month-label-month{font-size:var(--sbb-text-font-size-xxs);letter-spacing:var(--sbb-letter-spacing-text);color:var(--sbb-mini-calendar-month-label-color)}.sbb-mini-calendar-month-label-year{visibility:var(--sbb-mini-calendar-month-visibilty-year)}
 `;let v=(()=>{let a=o,u,d=[],p=[];return class extends a{static{let t=typeof Symbol==`function`&&Symbol.metadata?Object.create(a[Symbol.metadata]??null):void 0;u=[l(),i()],e(this,null,u,{kind:`accessor`,name:`date`,static:!1,private:!1,access:{has:e=>`date`in e,get:e=>e.date,set:(e,t)=>{e.date=t}},metadata:t},d,p),t&&Object.defineProperty(this,Symbol.metadata,{enumerable:!0,configurable:!0,writable:!0,value:t})}static{this.elementName=`sbb-mini-calendar-month`}static{this.styles=[r(_)]}#e;get date(){return this.#e}set date(e){this.#e=e}constructor(){super(),this.#e=t(this,d,``),this._dateAdapter=(t(this,p),f().datetime?.dateAdapter??c),this._monthNames=this._dateAdapter.getMonthNames(`short`),this._monthLabel=null,this._yearLabel=null,this._previousOrientation=null,this.addController(new s(this,()=>this.closest(`sbb-mini-calendar`),{orientation:e=>{this._previousOrientation&&this.internals.states.delete(`orientation-${this._previousOrientation}`),this._previousOrientation=e.orientation,this._previousOrientation&&this.internals.states.add(`orientation-${this._previousOrientation}`)}}))}willUpdate(e){if(super.willUpdate(e),e.has(`date`)&&this.date){if(!this.date.match(/^\d{4}-(0[1-9]|1[0-2])$/))return;let e=this.date.split(`-`),t=this._dateAdapter.createDate(+e[0],+e[1],1),n=this._dateAdapter.getFirstWeekOffset(t);this.style?.setProperty(`--sbb-mini-calendar-month-offset`,`${n+1}`),this._monthLabel=`${this._monthNames[e[1]-1]}.`,this._yearLabel=String(this._dateAdapter.getYear(t))}}render(){return n`
       <div class="sbb-mini-calendar-month-label-year">${this._yearLabel}</div>
       <div class="sbb-mini-calendar-month-wrapper">

package/navigation/_navigation.global.scss

@@ -6,7 +6,7 @@ $theme: 'standard' !default;
   --sbb-navigation-action-color: var(--sbb-color-4-negative);
   --sbb-navigation-action-icon-display: none;
   --sbb-navigation-action-font-size: var(--sbb-text-font-size-xl);
-  --sbb-navigation-action-letter-spacing: var(--sbb-typo-letter-spacing-heading);
+  --sbb-navigation-action-letter-spacing: var(--sbb-letter-spacing-heading);
   --sbb-navigation-action-line-height: var(--sbb-typo-line-height-heading);
   --sbb-navigation-action-gap: var(--sbb-spacing-responsive-xs);
   --sbb-navigation-grid-column: 1 / -1;
@@ -38,7 +38,7 @@ $theme: 'standard' !default;
   --sbb-navigation-marker-typo-line-height: var(--sbb-typo-line-height-heading);
   --sbb-navigation-margin-inline-start: var(--sbb-spacing-fixed-3x);
   --sbb-navigation-marker-font-size: var(--sbb-text-font-size-xl);
-  --sbb-navigation-marker-letter-spacing: var(--sbb-typo-letter-spacing-heading);
+  --sbb-navigation-marker-letter-spacing: var(--sbb-letter-spacing-heading);
   --sbb-navigation-marker-line-height: var(--sbb-typo-line-height-heading);
   --sbb-navigation-section-column: 1 / -1;
   --sbb-navigation-section-position: fixed;