@sbb-esta/lyne-elements-dev 4.13.1-dev.1781017607 → 5.0.0-dev.1781076451

package/standard-theme.css

@@ -1,11 +1,25 @@
 @charset "UTF-8";
-sub, sup {
-  font-size: 60%;
-  line-height: 0;
-  position: relative;
-  vertical-align: baseline;
+/**
+ * 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;
@@ -102,225 +116,19 @@ summary {
   display: list-item;
 }
 
-/**
- * Do not edit directly, this file was auto-generated.
- */
-:host {
-  display: flex;
-  flex-flow: var(--sbb-selection-group-orientation) wrap;
-  gap: var(--sbb-selection-group-gap);
-  align-items: flex-start;
-  width: var(--sbb-selection-group-width);
-}
-
-:host([orientation=vertical]) {
-  --sbb-selection-group-orientation: column;
-  --sbb-selection-group-width: 100%;
-  --sbb-selection-group-elements-width: 100%;
-}
-
-:host(:is(:state(has-panel),[state--has-panel])) {
-  --sbb-selection-group-width: 100%;
-  --sbb-selection-group-gap: var(--sbb-spacing-fixed-2x) var(--sbb-spacing-fixed-4x);
-  --sbb-selection-group-elements-flex: auto;
-}
-
-@media (min-width: calc(0rem)) {
-  :host([orientation=vertical][horizontal-from=zero]) {
-    --sbb-selection-group-orientation: row;
-    --sbb-selection-group-elements-width: auto;
-  }
-  :host([orientation=vertical][horizontal-from=zero]:not(:is(:state(has-panel),[state--has-panel]))) {
-    --sbb-selection-group-width: auto;
-  }
-}
-@media (min-width: calc(37.5rem)) {
-  :host([orientation=vertical][horizontal-from=small]) {
-    --sbb-selection-group-orientation: row;
-    --sbb-selection-group-elements-width: auto;
-  }
-  :host([orientation=vertical][horizontal-from=small]:not(:is(:state(has-panel),[state--has-panel]))) {
-    --sbb-selection-group-width: auto;
-  }
-}
-@media (min-width: calc(64rem)) {
-  :host([orientation=vertical][horizontal-from=large]) {
-    --sbb-selection-group-orientation: row;
-    --sbb-selection-group-elements-width: auto;
-  }
-  :host([orientation=vertical][horizontal-from=large]:not(:is(:state(has-panel),[state--has-panel]))) {
-    --sbb-selection-group-width: auto;
-  }
-}
-@media (min-width: calc(90rem)) {
-  :host([orientation=vertical][horizontal-from=ultra]) {
-    --sbb-selection-group-orientation: row;
-    --sbb-selection-group-elements-width: auto;
-  }
-  :host([orientation=vertical][horizontal-from=ultra]:not(:is(:state(has-panel),[state--has-panel]))) {
-    --sbb-selection-group-width: auto;
-  }
-}
-slot[name=error]::slotted(*) {
-  flex-basis: 100%;
-}
-
-::slotted(:is(sbb-checkbox-panel, sbb-radio-button-panel)) {
-  flex: var(--sbb-selection-group-elements-flex);
-}
-
-::slotted(:is(sbb-checkbox, sbb-checkbox-panel, sbb-radio-button-panel)) {
-  width: var(--sbb-selection-group-elements-width);
-}
-
-:host {
-  --sbb-tab-label-animation-duration: var(
-    --sbb-disable-animation-duration,
-    var(--sbb-animation-duration-2x)
-  );
-  --sbb-tab-label-outline-border-radius-internal: calc(
-    var(--sbb-tab-label-outline-border-radius) - var(--sbb-focus-outline-offset)
-  );
-}
-
-:host(:is(:is(:state(size-s),[state--size-s]), [size=s])) {
-  --sbb-tab-label-height: var(--sbb-size-element-xs);
-  --sbb-tab-label-inline-padding: var(--sbb-spacing-responsive-xxxs);
-  --sbb-tab-label-font-size: var(--sbb-text-font-size-s);
-}
-
-:host(:is(:is(:state(size-l),[state--size-l]), [size=l])) {
-  --sbb-tab-label-height: var(--sbb-size-element-m);
-  --sbb-tab-label-inline-padding: var(--sbb-spacing-responsive-xs);
-  --sbb-tab-label-font-size: var(--sbb-text-font-size-m);
-}
-
-:host(:is(:is(:state(size-xl),[state--size-xl]), [size=xl])) {
-  --sbb-tab-label-height: var(--sbb-size-element-m);
-  --sbb-tab-label-inline-padding: var(--sbb-spacing-responsive-xs);
-  --sbb-tab-label-font-size: var(--sbb-text-font-size-xl);
-}
-
-:host(sbb-tab-label),
-:host(sbb-tab-nav-bar) ::slotted(a) {
-  pointer-events: var(--sbb-tab-label-pointer-events, unset);
-}
-@media (forced-colors: active) {
-  :host(sbb-tab-label),
-  :host(sbb-tab-nav-bar) ::slotted(a) {
-    --sbb-tab-label-color: ButtonText;
-    --sbb-tab-label-amount-color: ButtonText;
-  }
-}
-
-:host(sbb-tab-nav-bar) ::slotted(a),
-:host(sbb-tab-label) .sbb-tab-label {
-  position: relative;
-  display: flex;
-  align-items: center;
-  gap: var(--sbb-tab-label-gap);
-  color: var(--sbb-tab-label-color);
-  margin: 0;
-  padding-inline: var(--sbb-tab-label-inline-padding);
-  min-height: var(--sbb-tab-label-height);
-  transition: color var(--sbb-tab-label-animation-duration) var(--sbb-tab-label-animation-easing);
-  font-size: var(--sbb-tab-label-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
-  line-height: var(--sbb-typo-line-height-text);
-  font-weight: var(--sbb-tab-label-font-weight);
-  text-decoration: var(--sbb-tab-label-text-decoration);
-}
-:host(sbb-tab-nav-bar) ::slotted(a)::after,
-:host(sbb-tab-label) .sbb-tab-label::after {
-  position: absolute;
-  content: "";
-  inset-inline: 0;
-  inset-block-end: 0;
-  height: var(--sbb-tab-label-marker-thickness);
-  background-color: var(--sbb-tab-label-color);
-  scale: var(--sbb-tab-label-marker-scale, 0);
-  transition-duration: var(--sbb-tab-label-animation-duration);
-  transition-timing-function: var(--sbb-tab-label-animation-easing);
-  transition-property: scale, background-color;
-}
-
-:host(sbb-tab-nav-bar) .sbb-tab-nav-bar > [data-has-divider],
-:host(sbb-tab-label:is(:state(has-divider),[state--has-divider])) {
-  position: relative;
-}
-:host(sbb-tab-nav-bar) .sbb-tab-nav-bar > [data-has-divider]::before,
-:host(sbb-tab-label:is(:state(has-divider),[state--has-divider]))::before {
-  content: "";
-  position: absolute;
-  inset-inline-start: 0;
-  inset-block-end: 0;
-  width: var(--sbb-tab-group-width);
-  height: var(--sbb-border-width-1x);
-  background-color: var(--sbb-tab-label-line-color);
-}
-
-:host(sbb-tab-nav-bar) ::slotted(a.sbb-disabled),
-:host(sbb-tab-label[disabled]) {
-  --sbb-tab-label-cursor: unset;
-  --sbb-tab-label-pointer-events: none;
-  --sbb-tab-label-text-decoration: line-through;
-}
-@media (forced-colors: active) {
-  :host(sbb-tab-nav-bar) ::slotted(a.sbb-disabled),
-  :host(sbb-tab-label[disabled]) {
-    --sbb-tab-label-color: GrayText;
-    --sbb-tab-label-amount-color: GrayText;
-  }
-}
-
-:host(sbb-tab-nav-bar) ::slotted(a.sbb-active:not(.sbb-disabled)),
-:host(sbb-tab-label[active]:not([disabled])) {
-  --sbb-tab-label-color: var(--sbb-color-3);
-  --sbb-tab-label-cursor: unset;
-  --sbb-tab-label-pointer-events: none;
-  --sbb-tab-label-marker-scale: 1;
-}
-@media (forced-colors: active) {
-  :host(sbb-tab-nav-bar) ::slotted(a.sbb-active:not(.sbb-disabled)),
-  :host(sbb-tab-label[active]:not([disabled])) {
-    --sbb-tab-label-color: ButtonText;
-    --sbb-tab-label-amount-color: ButtonText;
-  }
-}
-
-@media (any-hover: hover) {
-  :host(sbb-tab-nav-bar) ::slotted(a:hover:not(.sbb-disabled)),
-  :host(sbb-tab-label:hover:not([disabled])) {
-    --sbb-tab-label-marker-scale: 1;
-  }
-}
-
-:host(sbb-tab-nav-bar) ::slotted(a:active:not(.sbb-disabled)),
-:host(sbb-tab-label:active) {
-  --sbb-tab-label-color: var(--sbb-color-3);
-}
-@media (forced-colors: active) {
-  :host(sbb-tab-nav-bar) ::slotted(a:active:not(.sbb-disabled)),
-  :host(sbb-tab-label:active) {
-    --sbb-tab-label-color: ButtonText;
-    --sbb-tab-label-amount-color: ButtonText;
-  }
-}
-
-:host(sbb-tab-nav-bar) ::slotted(a:focus-visible),
-:host(sbb-tab-label:focus-visible) .sbb-tab-label {
-  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: var(--sbb-tab-label-outline-border-radius-internal);
-}
-
-*,
-::before,
-::after {
-  box-sizing: border-box;
-}
-
 :root {
+  --sbb-overlay-default-z-index: 1000;
+  --sbb-cursor-default: default;
+  --sbb-cursor-pointer: pointer;
+  --sbb-border-radius-infinity: calc(infinity * 1px);
+  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);
+  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-animation-duration-1x: 0.04s;
   --sbb-animation-duration-2x: 0.08s;
   --sbb-animation-duration-3x: 0.12s;
@@ -1279,6 +1087,21 @@ slot[name=error]::slotted(*) {
   --sbb-size-element-s: var(--sbb-size-element-s-zero);
   --sbb-size-element-m: var(--sbb-size-element-m-zero);
   --sbb-size-element-l: var(--sbb-size-element-l-zero);
+  --sbb-action-group-gap: var(--sbb-spacing-fixed-2x) var(--sbb-spacing-fixed-4x);
+  --sbb-alert-group-gap: var(--sbb-spacing-fixed-3x);
+  --sbb-alert-group-border-radius: var(--sbb-border-radius-4x);
+  --sbb-alert-background-color: var(--sbb-background-color-1-inverted);
+  --sbb-alert-border-radius: var(--sbb-border-radius-4x);
+  --sbb-alert-color: var(--sbb-color-aluminium);
+  --sbb-alert-color: light-dark(var(--sbb-color-aluminium), var(--sbb-color-anthracite));
+  --sbb-alert-padding: var(--sbb-spacing-responsive-xxs) var(--sbb-spacing-responsive-xs);
+  --sbb-alert-timing-function: ease-in;
+  --sbb-alert-icon-size: 1.25rem;
+  --sbb-alert-icon-size-l: var(--sbb-size-icon-ui-small);
+  --sbb-alert-title-margin-block: 0;
+  --sbb-alert-font-size: var(--sbb-text-font-size-s);
+  --sbb-alert-gap: var(--sbb-spacing-fixed-2x) var(--sbb-spacing-responsive-xs);
+  --sbb-alert-close-icon-margin: var(--sbb-spacing-responsive-xxs);
   --sbb-breadcrumb-color: var(--sbb-color-granite);
   --sbb-breadcrumb-color: light-dark(var(--sbb-color-granite), var(--sbb-color-aluminium));
   --sbb-breadcrumb-color-hover: var(--sbb-color-charcoal);
@@ -1319,12 +1142,12 @@ slot[name=error]::slotted(*) {
   --sbb-button-min-height-size-l: var(--sbb-size-element-m);
   --sbb-button-min-height-size-m: var(--sbb-size-element-s);
   --sbb-button-min-height-size-s: var(--sbb-size-element-xs);
-  --sbb-button-min-height: var(--sbb-button-min-height-size-l);
+  --sbb-button-min-height: var(--sbb-button-min-height-size-m);
   --sbb-button-padding-block-min: var(--sbb-spacing-fixed-1x);
   --sbb-button-padding-inline-size-l: var(--sbb-spacing-fixed-8x);
   --sbb-button-padding-inline-size-m: var(--sbb-spacing-fixed-5x);
   --sbb-button-padding-inline-size-s: var(--sbb-spacing-fixed-4x);
-  --sbb-button-padding-inline: var(--sbb-button-padding-inline-size-l);
+  --sbb-button-padding-inline: var(--sbb-button-padding-inline-size-m);
   --sbb-button-shadow-1-offset-y: var(--sbb-shadow-elevation-level-3-shadow-1-offset-y);
   --sbb-button-shadow-2-offset-y: var(--sbb-shadow-elevation-level-3-shadow-2-offset-y);
   --sbb-button-shadow-1-blur: var(--sbb-shadow-elevation-level-3-shadow-1-blur);
@@ -1348,50 +1171,47 @@ slot[name=error]::slotted(*) {
   --sbb-mini-button-group-border-width: var(--sbb-border-width-2x);
   --sbb-mini-button-group-border-radius: var(--sbb-border-radius-infinity);
   --sbb-mini-button-group-gap: var(--sbb-spacing-fixed-2x);
-  --sbb-mini-button-group-min-height: var(--sbb-size-element-s);
-  --sbb-mini-button-group-padding-inline: var(--sbb-spacing-fixed-3x);
   --sbb-mini-button-group-divider-height: var(--sbb-size-icon-ui-small);
   --sbb-mini-button-group-divider-padding: var(--sbb-spacing-fixed-1x);
-  --sbb-calendar-cell-background-color: transparent;
+  --sbb-mini-button-group-min-height-s: var(--sbb-size-element-xs);
+  --sbb-mini-button-group-min-height-m: var(--sbb-size-element-s);
+  --sbb-mini-button-group-min-height-l: var(--sbb-size-element-m);
+  --sbb-mini-button-group-min-height-xl: var(--sbb-size-element-l);
+  --sbb-mini-button-group-min-height: var(--sbb-mini-button-group-min-height-m);
+  --sbb-mini-button-group-padding-inline-s: var(--sbb-spacing-fixed-2x);
+  --sbb-mini-button-group-padding-inline-m: var(--sbb-spacing-fixed-3x);
+  --sbb-mini-button-group-padding-inline-l: var(--sbb-spacing-fixed-3x);
+  --sbb-mini-button-group-padding-inline-xl: var(--sbb-spacing-fixed-4x);
+  --sbb-mini-button-group-padding-inline: var(--sbb-mini-button-group-padding-inline-m);
   --sbb-calendar-cell-background-color-hover: var(--sbb-background-color-3);
   --sbb-calendar-cell-background-color-active: var(--sbb-background-color-4);
   --sbb-calendar-cell-padding: 0.125rem;
   --sbb-calendar-cell-border-width: var(--sbb-border-width-2x);
+  --sbb-calendar-cell-border-color-selected: var(--sbb-border-color-2);
   --sbb-calendar-cell-disabled-height: 0.09375rem;
   --sbb-calendar-cell-disabled-width: 1.59375rem;
   --sbb-calendar-cell-disabled-color: var(--sbb-color-granite);
   --sbb-calendar-cell-disabled-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));
   --sbb-calendar-cell-transition-easing-function: var(--sbb-animation-easing);
-  --sbb-calendar-control-gap: var(--sbb-spacing-fixed-2x);
-  --sbb-calendar-control-margin-block-end: var(--sbb-spacing-fixed-4x);
-  --sbb-calendar-control-view-change-height: 2.75rem;
+  --sbb-calendar-cell-color: var(--sbb-color-2);
+  --sbb-calendar-cell-cursor: var(--sbb-cursor-pointer);
+  --sbb-calendar-cell-font-size: var(--sbb-text-font-size-s);
+  --sbb-calendar-cell-margin: 0.0625rem;
+  --sbb-calendar-cell-size: 2.75rem;
+  --sbb-calendar-cell-year-month-width: 4.4375rem;
+  --sbb-calendar-cell-year-month-height: 2.375rem;
+  --sbb-calendar-control-gap: var(--sbb-spacing-fixed-1x);
   --sbb-calendar-control-view-change-color: var(--sbb-color-3);
-  --sbb-calendar-control-view-change-background: var(--sbb-background-color-1);
-  --sbb-calendar-control-view-change-padding-inline: var(--sbb-spacing-fixed-5x)
-    var(--sbb-spacing-fixed-2x);
   --sbb-calendar-header-color: var(--sbb-color-granite);
   --sbb-calendar-header-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));
-  --sbb-calendar-table-animation-shift: 0.00625rem;
-  --sbb-calendar-table-column-spaces: 12;
   --sbb-calendar-tables-gap: var(--sbb-spacing-fixed-10x);
-  --sbb-calendar-table-animation-duration: 0.1ms;
-  --sbb-calendar-cell-border: var(--sbb-calendar-cell-border-width) solid
-    var(--sbb-border-color-1-inverted);
-  --sbb-calendar-cell-color: var(--sbb-color-2);
-  --sbb-calendar-cell-cursor: var(--sbb-cursor-pointer);
-  --sbb-calendar-cell-justify-content: normal;
-  --sbb-calendar-cell-inset: 0.0625rem;
-  --sbb-calendar-cell-font-size: var(--sbb-text-font-size-s);
-  --sbb-calendar-cell-font-weight: unset;
-  --sbb-calendar-cell-transition-easing-function: var(--sbb-animation-easing);
-  --sbb-calendar-cell-year-month-width: 4.8125rem;
-  --sbb-calendar-cell-year-month-height: 2.75rem;
-  --sbb-calendar-day-width: 2.75rem;
-  --sbb-calendar-day-height: 3rem;
+  --sbb-calendar-day-size: 2.625rem;
+  --sbb-calendar-day-width: var(--sbb-calendar-day-size);
+  --sbb-calendar-day-height: 2.875rem;
+  --sbb-calendar-day-justify-content: start;
+  --sbb-calendar-day-value-height: var(--sbb-spacing-fixed-6x);
   --sbb-calendar-day-extra-display: block;
-  --sbb-calendar-day-extra-height: var(--sbb-spacing-fixed-4x);
-  --sbb-calendar-day-crossed-out-top: 33%;
-  --sbb-calendar-day-crossed-out-translate: translate(-50%, -33%) rotate(-45deg);
+  --sbb-calendar-day-extra-height: 1.125rem;
   --sbb-card-background-color: var(--sbb-background-color-1);
   --sbb-card-border-color: transparent;
   --sbb-card-border-radius: var(--sbb-border-radius-4x);
@@ -1400,13 +1220,6 @@ slot[name=error]::slotted(*) {
   --sbb-card-padding-inline-default: var(--sbb-spacing-responsive-s);
   --sbb-card-padding-block-default: var(--sbb-spacing-responsive-xxxs);
   --sbb-card-with-badge-padding-block-default: var(--sbb-spacing-fixed-6x) var(--sbb-spacing-responsive-xxxs);
-}
-:root.sbb-lean {
-  --sbb-card-padding-inline: var(--sbb-spacing-responsive-xxs);
-  --sbb-card-padding-block: var(--sbb-spacing-fixed-3x);
-  --sbb-card-with-badge-padding-block: var(--sbb-spacing-fixed-6x) var(--sbb-spacing-fixed-3x);
-}
-:root {
   --sbb-card-badge-gap: var(--sbb-spacing-fixed-2x);
   --sbb-card-badge-color: var(--sbb-color-2-inverted);
   --sbb-card-badge-background-color: var(--sbb-background-color-3-inverted);
@@ -1419,12 +1232,18 @@ slot[name=error]::slotted(*) {
   --sbb-carousel-border-radius: var(--sbb-border-radius-4x);
   --sbb-carousel-box-shadow: var(--sbb-box-shadow-level-9-hard);
   --sbb-carousel-paginator-padding: var(--sbb-spacing-responsive-xs);
-  --sbb-chip-label-color: var(--sbb-color-granite);
-  --sbb-chip-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-cloud));
-  --sbb-chip-label-background-color: var(--sbb-background-color-3);
-  --sbb-chip-label-padding-block: 0em;
-  --sbb-chip-label-padding-inline: var(--sbb-spacing-fixed-2x);
-  --sbb-chip-label-font-size: var(--sbb-text-font-size-xxs);
+  --sbb-carousel-list-border-radius: var(--sbb-border-radius-4x);
+  --sbb-checkbox-label-icon-flex-direction: row;
+  --sbb-checkbox-label-icon-justify-content: space-between;
+  --sbb-checkbox-label-icon-flex-grow: 1;
+  --sbb-checkbox-label-gap: var(--sbb-spacing-fixed-2x);
+  --sbb-checkbox-dimension-xs: 1.25rem;
+  --sbb-checkbox-dimension-s: var(--sbb-size-icon-ui-small);
+  --sbb-checkbox-dimension-m: var(--sbb-size-icon-ui-small);
+  --sbb-checkbox-dimension: var(--sbb-checkbox-dimension-m);
+  --sbb-checkbox-font-size: var(--sbb-text-font-size-m);
+  --sbb-checkbox-label-color: var(--sbb-color-color-3);
+  --sbb-checkbox-cursor: var(--sbb-cursor-pointer);
   --sbb-chip-background-color: var(--sbb-background-color-3);
   --sbb-chip-background-color-active: var(--sbb-background-color-1);
   --sbb-chip-background-color-hover: var(--sbb-background-color-1);
@@ -1436,45 +1255,33 @@ slot[name=error]::slotted(*) {
   --sbb-chip-font-size: var(--sbb-text-font-size-xxs);
   --sbb-chip-height: 1.5rem;
   --sbb-chip-label-padding-inline: var(--sbb-spacing-fixed-2x);
-  --_sbb-chip-group-margin-block-start-default: 0.125rem;
-  --_sbb-chip-group-margin-block-start-default-large: 0.21875rem;
   --sbb-chip-group-gap: var(--sbb-spacing-fixed-1x);
   --sbb-chip-group-input-min-width: 9.375rem;
-  --sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default-large) 0;
-  --sbb-chip-group-margin-block-no-label-not-empty: 0.1875rem 0.6875rem;
-  --sbb-chip-group-margin-block-with-label-not-empty: var(--_sbb-chip-group-margin-block-start-default) var(--_sbb-chip-group-margin-block-start-default-large);
-  --sbb-selection-panel-background-default: var(--sbb-background-color-1);
-  --sbb-selection-panel-background-milk: var(--sbb-background-color-3);
-  --sbb-selection-panel-border-radius: var(--sbb-border-radius-4x);
-  --sbb-selection-panel-border-color-default: var(--sbb-border-color-4-inverted);
-  --sbb-selection-panel-border-color-checked: var(--sbb-border-color-3);
-  --sbb-selection-panel-border-color-borderless: transparent;
-  --sbb-selection-panel-border-color: var(--sbb-selection-panel-border-color-default);
-  --sbb-selection-panel-border-width-default: var(--sbb-border-width-1x);
-  --sbb-selection-panel-border-width-checked: var(--sbb-border-width-2x);
-  --sbb-selection-panel-input-padding-block-xs: var(--sbb-spacing-responsive-xxs);
-  --sbb-selection-panel-input-padding-inline-xs: var(--sbb-spacing-responsive-xxxs);
-  --sbb-selection-panel-input-padding-block-s: var(--sbb-spacing-responsive-xxs);
-  --sbb-selection-panel-input-padding-inline-s: var(--sbb-spacing-responsive-xxxs);
-  --sbb-selection-panel-input-padding-block-m: var(--sbb-spacing-responsive-xs);
-  --sbb-selection-panel-input-padding-inline-m: var(--sbb-spacing-responsive-xxs);
-  --sbb-selection-panel-input-padding: var(--sbb-selection-panel-input-padding-block-m) var(--sbb-selection-panel-input-padding-inline-m);
-  --sbb-selection-panel-checkbox-dimension: var(--sbb-checkbox-dimension-m);
-  --sbb-selection-panel-cursor: var(--sbb-cursor-pointer);
-  --sbb-selection-panel-suffix-color: var(--sbb-color-3);
-  --sbb-selection-panel-subtext-color: var(--sbb-color-granite);
-  --sbb-selection-panel-subtext-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));
-  --sbb-checkbox-label-icon-flex-direction: row;
-  --sbb-checkbox-label-icon-justify-content: space-between;
-  --sbb-checkbox-label-icon-flex-grow: 1;
-  --sbb-checkbox-label-gap: var(--sbb-spacing-fixed-2x);
-  --sbb-checkbox-dimension-xs: 1.25rem;
-  --sbb-checkbox-dimension-s: var(--sbb-size-icon-ui-small);
-  --sbb-checkbox-dimension-m: var(--sbb-size-icon-ui-small);
-  --sbb-checkbox-dimension: var(--sbb-checkbox-dimension-m);
-  --sbb-checkbox-font-size: var(--sbb-text-font-size-m);
-  --sbb-checkbox-label-color: var(--sbb-color-color-3);
-  --sbb-checkbox-cursor: var(--sbb-cursor-pointer);
+  --_sbb-chip-group-margin-block-start-default: 0.125rem;
+  --_sbb-chip-group-margin-block-start-default-large: 0.21875rem;
+  --_sbb-chip-group-margin-block-base-lm: var(--_sbb-chip-group-margin-block-start-default) 0;
+  --_sbb-chip-group-margin-block-with-label-s: 0.375rem 0.3125rem;
+  --_sbb-chip-group-margin-block-without-label-s: 0 0.4375rem;
+  --_sbb-chip-group-margin-block-without-label-m: 0.1875rem
+    0.6875rem;
+  --_sbb-chip-group-margin-block-without-label-l: var(--_sbb-chip-group-margin-block-start-default)
+    1rem;
+  --_sbb-chip-group-margin-block-with-label-l: var(--_sbb-chip-group-margin-block-start-default)
+    0.46875rem;
+  --_sbb-chip-group-margin-block-with-label-m: var(--_sbb-chip-group-margin-block-start-default)
+    var(--_sbb-chip-group-margin-block-start-default-large);
+  --sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-base-lm);
+  --sbb-chip-group-margin-block-no-label-not-empty: var(--_sbb-chip-group-margin-block-without-label-m);
+  --sbb-chip-group-margin-block-with-label-not-empty: var(--_sbb-chip-group-margin-block-with-label-m);
+  --sbb-chip-label-color: var(--sbb-color-granite);
+  --sbb-chip-label-color: light-dark(var(--sbb-color-granite), var(--sbb-color-cloud));
+  --sbb-chip-label-background-color: var(--sbb-background-color-3);
+  --sbb-chip-label-padding-block: 0em;
+  --sbb-chip-label-padding-inline: var(--sbb-spacing-fixed-2x);
+  --sbb-chip-label-font-size: var(--sbb-text-font-size-xxs);
+  --sbb-clock-seconds-hand-color: var(--sbb-color-brand);
+  --sbb-clock-face-color: var(--sbb-color-1);
+  --sbb-clock-background-color: var(--sbb-background-color-1);
   --sbb-container-background-border-radius: 0;
   --sbb-container-color: inherit;
   --sbb-sticky-bar-animation-easing: var(--sbb-animation-easing);
@@ -1482,21 +1289,18 @@ slot[name=error]::slotted(*) {
   --sbb-sticky-bar-padding-block: var(--sbb-spacing-responsive-xs);
   --sbb-sticky-bar-position: sticky;
   --sbb-sticky-bar-slide-vertically-animation-easing: ease-out;
-  --sbb-clock-seconds-hand-color: var(--sbb-color-brand);
-  --sbb-clock-face-color: var(--sbb-color-1);
-  --sbb-clock-background-color: var(--sbb-background-color-1);
   --sbb-dialog-padding-inline: var(--sbb-spacing-fixed-5x);
   --sbb-dialog-color: var(--sbb-color-2);
   --sbb-dialog-background-color: var(--sbb-background-color-1);
   --sbb-dialog-block-shadow: var(--sbb-box-shadow-level-9-soft);
   --sbb-dialog-color-negative: var(--sbb-color-2-negative);
   --sbb-dialog-block-shadow-negative: var(--sbb-box-shadow-level-9-soft-negative);
-  --sbb-dialog-width: 100%;
+  --sbb-dialog-width: auto;
   --sbb-dialog-max-width: 100%;
-  --sbb-dialog-max-width-default: 55.75rem;
-  --sbb-dialog-height: 100%;
-  --sbb-dialog-max-height: 100%;
-  --sbb-dialog-inset: 0 auto auto 0;
+  --sbb-dialog-height: auto;
+  --sbb-dialog-max-height: calc(100vh - var(--sbb-spacing-fixed-6x));
+  --sbb-dialog-inset-block: 0 auto;
+  --sbb-dialog-inset-inline: 0 auto;
   --sbb-dialog-border-radius: var(--sbb-border-radius-8x);
   --sbb-dialog-animation-easing: ease;
   --sbb-dialog-pointer-events: none;
@@ -1509,9 +1313,6 @@ slot[name=error]::slotted(*) {
   --sbb-divider-color: var(--sbb-background-color-4);
   --sbb-divider-color-negative: var(--sbb-background-color-4-negative);
   --sbb-divider-border-width: var(--sbb-border-width-1x);
-  --sbb-error-color: var(--sbb-color-error);
-  --sbb-error-icon-size: 1.0625rem;
-  --sbb-error-font-size: var(--sbb-text-font-size-xs);
   --sbb-expansion-panel-background-color: var(--sbb-background-color-1);
   --sbb-expansion-panel-background-color-hover: var(--sbb-background-color-3);
   --sbb-expansion-panel-border-radius: var(--sbb-border-radius-4x);
@@ -1560,6 +1361,9 @@ slot[name=error]::slotted(*) {
   --sbb-footer-gap-horizontal: var(--sbb-grid-base-gutter-responsive);
   --sbb-footer-gap-vertical: var(--sbb-spacing-responsive-l);
   --sbb-footer-padding-block: var(--sbb-spacing-responsive-l);
+  --sbb-error-color: var(--sbb-color-error);
+  --sbb-error-icon-size: 1.0625rem;
+  --sbb-error-font-size: var(--sbb-text-font-size-xs);
   --sbb-form-field-background-color: var(--sbb-background-color-1);
   --sbb-form-field-border-color: var(--sbb-border-color-5);
   --sbb-form-field-border-style: solid;
@@ -1581,15 +1385,15 @@ slot[name=error]::slotted(*) {
   --_sbb-form-field-label-to-input-overlapping: var(--sbb-spacing-fixed-1x);
   --_sbb-form-field-floating-label-transform: 0.53125rem;
   --_sbb-form-field-spacer-margin-block-end: calc(-1 * var(--_sbb-form-field-label-to-input-overlapping));
-  --sbb-header-background: var(--sbb-background-color-1);
-  --sbb-header-box-shadow: var(--sbb-box-shadow-level-9-soft);
-  --sbb-header-inset-inline-end: 0;
-  --sbb-header-position: fixed;
-  --sbb-header-height: var(--sbb-spacing-fixed-14x);
+  --_sbb-form-field-input-margin-block-end: 0;
   --sbb-header-action-color: var(--sbb-color-1);
   --sbb-header-action-background-color: transparent;
-  --sbb-header-action-min-height: var(--sbb-size-element-s);
-  --sbb-header-action-padding-inline: var(--sbb-spacing-fixed-5x);
+  --sbb-header-action-min-height-s: var(--sbb-size-element-xs);
+  --sbb-header-action-min-height-m: var(--sbb-size-element-s);
+  --sbb-header-action-min-height: var(--sbb-header-action-min-height-m);
+  --sbb-header-action-padding-inline-s: var(--sbb-spacing-fixed-4x);
+  --sbb-header-action-padding-inline-m: var(--sbb-spacing-fixed-5x);
+  --sbb-header-action-padding-inline: var(--sbb-header-action-padding-inline-m);
   --sbb-header-action-transition-easing: var(--sbb-animation-easing);
   --sbb-header-action-border-color: transparent;
   --sbb-header-action-gap: var(--sbb-spacing-fixed-2x);
@@ -1597,6 +1401,17 @@ slot[name=error]::slotted(*) {
   --sbb-header-action-active-border-width: var(--sbb-border-width-2x);
   --sbb-header-action-active-border-color: var(--sbb-header-action-color);
   --sbb-header-first-item-icon-shift: 0.125rem;
+  --sbb-header-background: var(--sbb-background-color-1);
+  --sbb-header-box-shadow: var(--sbb-box-shadow-level-9-soft);
+  --sbb-header-inset-inline-end: 0;
+  --sbb-header-position: fixed;
+  --sbb-header-padding-block-start: env(safe-area-inset-top, 0);
+  --sbb-header-vertical-spacing: calc(
+    var(--sbb-header-height) + var(--sbb-header-padding-block-start)
+  );
+  --sbb-header-height-s: 3.25rem;
+  --sbb-header-height-m: var(--sbb-spacing-fixed-14x);
+  --sbb-header-height: var(--sbb-header-height-m);
   --sbb-header-environment-background-color: var(--sbb-color-granite);
   --sbb-header-environment-color: var(--sbb-color-1-negative);
   --sbb-header-environment-size: 2.375rem;
@@ -1634,15 +1449,6 @@ slot[name=error]::slotted(*) {
   --sbb-map-container-sidebar-width: 25rem;
   --sbb-map-container-sidebar-background-color: var(--sbb-background-color-1);
   --sbb-map-container-border-radius: var(--sbb-border-radius-4x);
-  --sbb-menu-animation-easing: ease;
-  --sbb-menu-max-width: 100%;
-  --sbb-menu-min-width: 100%;
-  --sbb-menu-container-height: 100dvh;
-  --sbb-menu-max-height: calc(85vh - var(--sbb-spacing-fixed-8x));
-  --sbb-menu-min-height: 3.03125rem;
-  --sbb-menu-border-radius: var(--sbb-border-radius-4x);
-  --sbb-menu-color: var(--sbb-color-2-inverted);
-  --sbb-menu-background-color: var(--sbb-background-color-1-inverted);
   --sbb-menu-action-border-radius: var(--sbb-border-radius-infinity);
   --sbb-menu-action-outer-horizontal-padding: var(--sbb-spacing-fixed-3x);
   --sbb-menu-action-outer-vertical-padding: var(--sbb-spacing-fixed-1x);
@@ -1651,6 +1457,15 @@ slot[name=error]::slotted(*) {
   --sbb-menu-action-content-padding-inline: var(--sbb-spacing-fixed-2x);
   --sbb-menu-action-content-padding-block: var(--sbb-spacing-fixed-1x);
   --sbb-menu-action-forced-color-border-color: CanvasText;
+  --sbb-menu-max-height: calc(85vh - var(--sbb-spacing-fixed-8x));
+  --sbb-menu-min-height: 3.03125rem;
+  --sbb-menu-border-radius: var(--sbb-border-radius-4x);
+  --sbb-menu-color: var(--sbb-color-2-inverted);
+  --sbb-menu-background-color: var(--sbb-background-color-1-inverted);
+  --sbb-menu-animation-easing: ease;
+  --sbb-menu-max-width: 100%;
+  --sbb-menu-min-width: 100%;
+  --sbb-menu-container-height: 100dvh;
   --sbb-message-action-margin-block: var(--sbb-spacing-responsive-xxxs) 0;
   --sbb-message-image-margin-block: 0 var(--sbb-spacing-responsive-s);
   --sbb-message-image-border-radius: var(--sbb-border-radius-4x);
@@ -1667,6 +1482,54 @@ slot[name=error]::slotted(*) {
     var(--sbb-color-granite),
     var(--sbb-color-silver)
   );
+  --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-line-height: var(--sbb-typo-line-height-heading);
+  --sbb-navigation-action-gap: var(--sbb-spacing-responsive-xs);
+  --sbb-navigation-grid-column: 1 / -1;
+  --sbb-navigation-animation-easing: ease-in;
+  --sbb-navigation-padding-inline: var(--sbb-layout-base-offset-responsive);
+  --sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-l);
+  --sbb-navigation-padding-block-end: var(--sbb-spacing-responsive-xl);
+  --sbb-navigation-backdrop-color: color-mix(in srgb, var(--sbb-color-black) 70%, transparent);
+  --sbb-navigation-backdrop-animation-name: backdrop-open;
+  --sbb-navigation-background-color: var(--sbb-background-color-1-negative);
+  --sbb-navigation-color: var(--sbb-color-1-negative);
+  --sbb-navigation-list-margin-block-start: var(--sbb-spacing-responsive-xxl);
+  --sbb-navigation-expanded-width: 100%;
+  --sbb-navigation-inset: 0 auto auto 0;
+  --sbb-navigation-translate: -100% 0;
+  --sbb-navigation-content-gap: var(--sbb-spacing-responsive-xxl);
+  --sbb-navigation-content-translate: 0;
+  --sbb-navigation-width: 100%;
+  --sbb-navigation-height: 100dvh;
+  --sbb-navigation-list-font-size: var(--sbb-text-font-size-xxs);
+  --sbb-navigation-list-gap: var(--sbb-spacing-fixed-2x);
+  --sbb-navigation-list-margin-block: var(--sbb-spacing-fixed-1x);
+  --sbb-navigation-list-padding-block-end: var(--sbb-spacing-fixed-2x);
+  --sbb-navigation-marker-position-x: var(--sbb-spacing-fixed-1x);
+  --sbb-navigation-marker-position-y: unset;
+  --sbb-navigation-marker-width: 1.0625rem;
+  --sbb-navigation-marker-border: var(--sbb-border-width-1x);
+  --sbb-navigation-marker-padding-inline-start: var(--sbb-spacing-fixed-6x);
+  --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-line-height: var(--sbb-typo-line-height-heading);
+  --sbb-navigation-section-column: 1 / -1;
+  --sbb-navigation-section-position: fixed;
+  --sbb-navigation-section-pointer-events: none;
+  --sbb-navigation-section-animation-easing: ease-out;
+  --sbb-navigation-section-padding-inline: var(--sbb-layout-base-offset-responsive);
+  --sbb-navigation-section-padding-block: var(--sbb-spacing-responsive-l);
+  --sbb-navigation-section-translate: 100%;
+  --sbb-navigation-section-content-padding-inline-start: var(--sbb-spacing-fixed-12x);
+  --sbb-navigation-section-width: 100dvw;
+  --sbb-navigation-section-height: 100dvh;
+  --sbb-navigation-section-font-size: var(--sbb-heading-font-size-4);
   --sbb-notification-base-border-radius: var(--sbb-border-radius-4x);
   --sbb-notification-border-width: var(--sbb-border-width-1x);
   --sbb-notification-color: var(--sbb-color-2-negative-inverted);
@@ -1679,6 +1542,12 @@ slot[name=error]::slotted(*) {
   --sbb-notification-content-margin-block-start: var(--sbb-spacing-fixed-2x);
   --sbb-notification-content-padding-inline: var(--sbb-spacing-responsive-xxxs) var(--sbb-spacing-responsive-xs);
   --sbb-notification-close-wrapper-gap: var(--sbb-spacing-responsive-xxs);
+  --sbb-optgroup-label-color: var(--sbb-color-metal);
+  --sbb-optgroup-label-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));
+  --sbb-optgroup-label-font-size: var(--sbb-text-font-size-xxs);
+  --sbb-optgroup-label-padding-end: var(--sbb-spacing-fixed-2x);
+  --sbb-optgroup-label-padding-inline: var(--sbb-spacing-responsive-xxxs);
+  --sbb-optgroup-divider-color: var(--sbb-divider-color);
   --sbb-option-color: var(--sbb-color-3);
   --sbb-option-background-color: inherit;
   --sbb-option-background-color-hover: var(--sbb-color-milk);
@@ -1695,6 +1564,7 @@ slot[name=error]::slotted(*) {
   --sbb-option-border-radius: var(--sbb-border-radius-4x);
   --sbb-option-icon-color: var(--sbb-color-metal);
   --sbb-option-icon-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));
+  --sbb-option-focus-outline-offset: inherit;
   --sbb-option-focus-outline-color: transparent;
   --sbb-option-focus-outline-inset: var(--sbb-spacing-fixed-1x);
   --sbb-option-font-size: var(--sbb-text-font-size-s);
@@ -1704,11 +1574,13 @@ slot[name=error]::slotted(*) {
   --sbb-option-hint-padding-block-end: var(--sbb-spacing-fixed-2x);
   --sbb-option-hint-padding-inline: var(--sbb-spacing-responsive-xxxs);
   --sbb-option-hint-font-size: var(--sbb-text-font-size-xxs);
-  --sbb-optgroup-label-color: var(--sbb-color-metal);
-  --sbb-optgroup-label-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));
-  --sbb-optgroup-label-font-size: var(--sbb-text-font-size-xxs);
-  --sbb-optgroup-label-padding-end: var(--sbb-spacing-fixed-2x);
-  --sbb-optgroup-label-padding-inline: var(--sbb-spacing-responsive-xxxs);
+  --sbb-options-panel-border-radius: var(--sbb-border-radius-4x);
+  --sbb-options-panel-animation-timing-function: ease;
+  --sbb-options-panel-background-color: var(--sbb-background-color-2);
+  --sbb-options-panel-divider-margin-block: var(--sbb-spacing-fixed-3x);
+  --sbb-options-panel-box-shadow: var(--sbb-box-shadow-level-9-hard);
+  --sbb-options-panel-margin-block-start: var(--sbb-spacing-fixed-2x);
+  --sbb-options-panel-padding-block: var(--sbb-spacing-fixed-1x);
   --sbb-overlay-background-color: var(--sbb-background-color-3);
   --sbb-overlay-display: none;
   --sbb-overlay-height: 100%;
@@ -1716,24 +1588,37 @@ slot[name=error]::slotted(*) {
   --sbb-overlay-animation-easing: ease;
   --sbb-overlay-pointer-events: none;
   --sbb-overlay-container-display: none;
-  --sbb-options-panel-border-radius: var(--sbb-border-radius-4x);
-  --sbb-options-panel-animation-timing-function: ease;
-  --sbb-options-panel-background-color: var(--sbb-background-color-2);
-  --sbb-options-panel-divider-margin-block: var(--sbb-spacing-fixed-3x);
-  --sbb-options-panel-padding-block: var(--sbb-spacing-fixed-2x);
+  --sbb-paginator-color: var(--sbb-color-metal);
+  --sbb-paginator-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));
   --sbb-paginator-height: var(--sbb-size-element-m);
-  --sbb-paginator-page-color: var(--sbb-color-metal);
-  --sbb-paginator-page-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));
   --sbb-paginator-page-border-width: 0;
   --sbb-paginator-page-cursor: var(--sbb-cursor-pointer);
   --sbb-paginator-animation-easing: var(--sbb-animation-easing);
   --sbb-paginator-font-size: var(--sbb-text-font-size-s);
-  --sbb-compact-paginator-height: var(--sbb-size-element-m);
-  --sbb-compact-paginator-color: var(--sbb-color-metal);
-  --sbb-compact-paginator-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));
   --sbb-compact-paginator-font-size: var(--sbb-text-font-size-m);
   --sbb-compact-paginator-gap: var(--sbb-spacing-fixed-5x);
   --sbb-compact-paginator-pages-gap: var(--sbb-spacing-fixed-2x);
+  --sbb-selection-panel-background-default: var(--sbb-background-color-1);
+  --sbb-selection-panel-background-milk: var(--sbb-background-color-3);
+  --sbb-selection-panel-border-radius: var(--sbb-border-radius-4x);
+  --sbb-selection-panel-border-color-default: var(--sbb-border-color-4-inverted);
+  --sbb-selection-panel-border-color-checked: var(--sbb-border-color-3);
+  --sbb-selection-panel-border-color-borderless: transparent;
+  --sbb-selection-panel-border-color: var(--sbb-selection-panel-border-color-default);
+  --sbb-selection-panel-border-width-default: var(--sbb-border-width-1x);
+  --sbb-selection-panel-border-width-checked: var(--sbb-border-width-2x);
+  --sbb-selection-panel-input-padding-block-xs: var(--sbb-spacing-responsive-xxs);
+  --sbb-selection-panel-input-padding-inline-xs: var(--sbb-spacing-responsive-xxxs);
+  --sbb-selection-panel-input-padding-block-s: var(--sbb-spacing-responsive-xxs);
+  --sbb-selection-panel-input-padding-inline-s: var(--sbb-spacing-responsive-xxxs);
+  --sbb-selection-panel-input-padding-block-m: var(--sbb-spacing-responsive-xs);
+  --sbb-selection-panel-input-padding-inline-m: var(--sbb-spacing-responsive-xxs);
+  --sbb-selection-panel-input-padding: var(--sbb-selection-panel-input-padding-block-m) var(--sbb-selection-panel-input-padding-inline-m);
+  --sbb-selection-panel-checkbox-dimension: var(--sbb-checkbox-dimension-m);
+  --sbb-selection-panel-cursor: var(--sbb-cursor-pointer);
+  --sbb-selection-panel-suffix-color: var(--sbb-color-3);
+  --sbb-selection-panel-subtext-color: var(--sbb-color-granite);
+  --sbb-selection-panel-subtext-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));
   --sbb-popover-arrow-size: var(--sbb-spacing-fixed-4x);
   --sbb-popover-max-width: calc(100% - var(--sbb-spacing-fixed-2x));
   --sbb-popover-border-radius: var(--sbb-border-radius-8x);
@@ -1753,11 +1638,11 @@ slot[name=error]::slotted(*) {
   --sbb-radio-button-dimension: var(--sbb-radio-button-dimension-m);
   --sbb-radio-button-inner-circle-dimension: 0.625rem;
   --sbb-radio-button-font-size: var(--sbb-text-font-size-m);
-  --sbb-selection-group-orientation: row;
-  --sbb-selection-group-elements-width: auto;
-  --sbb-selection-group-width: auto;
-  --sbb-selection-group-gap: var(--sbb-spacing-fixed-3x) var(--sbb-spacing-fixed-6x);
-  --sbb-selection-group-elements-flex: none;
+  --sbb-select-placeholder-fallback-color: var(--sbb-color-metal);
+  --sbb-select-placeholder-fallback-color: light-dark(
+    var(--sbb-color-metal),
+    var(--sbb-color-smoke)
+  );
   --sbb-selection-action-panel-action-margin-inline-xs: var(--sbb-spacing-responsive-xxxs);
   --sbb-selection-action-panel-action-margin-inline-s: var(--sbb-spacing-responsive-xxxs);
   --sbb-selection-action-panel-action-margin-inline-m: var(--sbb-spacing-responsive-xxs);
@@ -1774,6 +1659,11 @@ slot[name=error]::slotted(*) {
     --sbb-selection-panel-input-padding-block-m
   );
   --sbb-selection-expansion-panel-content-padding-inline: var(--sbb-selection-panel-input-padding-inline-m);
+  --sbb-selection-group-orientation: row;
+  --sbb-selection-group-elements-width: auto;
+  --sbb-selection-group-width: auto;
+  --sbb-selection-group-gap: var(--sbb-spacing-fixed-3x) var(--sbb-spacing-fixed-6x);
+  --sbb-selection-group-elements-flex: none;
   --sbb-sidebar-background-color: var(--sbb-background-color-1);
   --sbb-sidebar-title-padding-block: var(--sbb-spacing-fixed-3x);
   --sbb-sidebar-padding: var(--sbb-spacing-responsive-xs);
@@ -1784,11 +1674,6 @@ slot[name=error]::slotted(*) {
   --sbb-signet-panel-color: var(--sbb-color-brand);
   --sbb-signet-icon-color: var(--sbb-color-white);
   --sbb-signet-aspect-ratio: 2 / 1;
-  --sbb-select-placeholder-fallback-color: var(--sbb-color-metal);
-  --sbb-select-placeholder-fallback-color: light-dark(
-    var(--sbb-color-metal),
-    var(--sbb-color-smoke)
-  );
   --sbb-slider-line-height: 0.25rem;
   --sbb-slider-knob-size: 1.75rem;
   --sbb-slider-knob-size-active: 1.9375rem;
@@ -1816,25 +1701,39 @@ slot[name=error]::slotted(*) {
   --sbb-status-title-color: var(--sbb-color-granite);
   --sbb-status-title-color: light-dark(var(--sbb-color-granite), var(--sbb-color-smoke));
   --sbb-step-label-color: var(--sbb-color-4);
-  --sbb-step-label-font-size: var(--sbb-text-font-size-l);
-  --sbb-step-label-prefix-size: var(--sbb-size-element-xxs);
   --sbb-step-label-prefix-border-style: solid;
   --sbb-step-label-prefix-border-color: var(--sbb-border-color-4-inverted);
   --sbb-step-label-prefix-background-color: var(--sbb-background-color-1);
-  --sbb-step-label-gap: var(--sbb-spacing-fixed-4x);
-  --sbb-step-label-inset-block-start-size-m: calc(
-    var(--sbb-text-font-size-l) * (var(--sbb-typo-line-height-text) / 2) +
-      (var(--sbb-border-width-1x) / 2)
-  );
-  --sbb-step-label-inset-block-start-size-s: calc(
-    var(--sbb-text-font-size-m) * (var(--sbb-typo-line-height-text) / 2) +
-      (var(--sbb-border-width-1x) / 2)
-  );
-  --sbb-step-label-inset-block-start: var(--sbb-step-label-inset-block-start-size-m);
+  --sbb-step-label-number-font-size: var(--sbb-text-font-size-xxs);
+  --sbb-step-label-font-size-s: var(--sbb-text-font-size-m);
+  --sbb-step-label-font-size-m: var(--sbb-text-font-size-l);
+  --sbb-step-label-font-size: var(--sbb-step-label-font-size-m);
+  --sbb-step-label-gap-s: var(--sbb-spacing-fixed-3x);
+  --sbb-step-label-gap-m: var(--sbb-spacing-fixed-4x);
+  --sbb-step-label-gap: var(--sbb-step-label-gap-m);
+  --sbb-step-label-prefix-size-s: var(--sbb-size-element-xxxs);
+  --sbb-step-label-prefix-size-m: var(--sbb-size-element-xxs);
+  --sbb-step-label-prefix-size: var(--sbb-step-label-prefix-size-m);
   --sbb-stepper-orientation: row;
   --sbb-stepper-border-width: var(--sbb-border-width-1x);
   --sbb-stepper-marker-width: var(--sbb-border-width-3x);
   --sbb-stepper-marker-color: var(--sbb-color-3);
+  --sbb-table-border-color: var(--sbb-color-cloud);
+  --sbb-table-border-color: light-dark(var(--sbb-color-cloud), var(--sbb-color-anthracite));
+  --sbb-table-background-color: var(--sbb-background-color-1);
+  --sbb-table-row-striped-color: var(--sbb-background-color-3);
+  --sbb-table-color: var(--sbb-color-1);
+  --sbb-table-caption-color: var(--sbb-color-granite);
+  --sbb-table-caption-color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
+  --sbb-table-caption-margin-block-start: var(--sbb-spacing-fixed-4x);
+  --sbb-table-sticky-shadow-width: 3rem;
+  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
+  --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
+  --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
+  --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
+  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
+  --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
+  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
   --sbb-tab-group-content-gap-size-s: var(--sbb-spacing-responsive-xs);
   --sbb-tab-group-content-gap-size-l: var(--sbb-spacing-responsive-s);
   --sbb-tab-group-content-gap-size-xl: var(--sbb-spacing-responsive-m);
@@ -1864,7 +1763,12 @@ slot[name=error]::slotted(*) {
   --sbb-tag-text-color: var(--sbb-color-2);
   --sbb-tag-amount-color: var(--sbb-color-metal);
   --sbb-tag-amount-color: light-dark(var(--sbb-color-metal), var(--sbb-color-smoke));
-  --sbb-tag-height: var(--sbb-size-element-xs);
+  --sbb-tag-height-s: var(--sbb-size-element-xxxs);
+  --sbb-tag-height-m: var(--sbb-size-element-xs);
+  --sbb-tag-height: var(--sbb-tag-height-m);
+  --sbb-tag-padding-inline-s: var(--sbb-spacing-fixed-3x);
+  --sbb-tag-padding-inline-m: var(--sbb-spacing-fixed-5x);
+  --sbb-tag-padding-inline: var(--sbb-tag-padding-inline-m);
   --sbb-teaser-scale-hover: 1.02;
   --sbb-teaser-description-color: var(--sbb-color-granite);
   --sbb-teaser-description-color: light-dark(var(--sbb-color-granite), var(--sbb-color-silver));
@@ -1875,6 +1779,18 @@ slot[name=error]::slotted(*) {
   --sbb-teaser-border-radius: var(--sbb-border-radius-4x);
   --sbb-teaser-image-width: 18.75rem;
   --sbb-teaser-hero-link-font-weight: 400;
+  --sbb-panel-width: 13.9375rem;
+  --sbb-panel-inner-height: 10.4375rem;
+  --sbb-panel-triangle-height: 2.0625rem;
+  --sbb-panel-line-height: var(--sbb-typo-line-height-heading);
+  --sbb-panel-font-size: var(--sbb-typo-scale-1-5x);
+  --sbb-panel-font-weight: 300;
+  --sbb-panel-color: var(--sbb-color-1-negative);
+  --sbb-panel-background-color: color-mix(in srgb, var(--sbb-color-primary) 90%, transparent);
+  --sbb-panel-background-color-hover: var(--sbb-color-primary);
+  --sbb-panel-padding-inline: var(--sbb-spacing-responsive-m);
+  --sbb-panel-gap: var(--sbb-spacing-responsive-xs);
+  --sbb-panel-animation-easing: var(--sbb-animation-easing);
   --sbb-teaser-product-background-color: var(--sbb-color-cloud);
   --sbb-teaser-product-background-color: light-dark(
     var(--sbb-color-cloud),
@@ -1897,6 +1813,7 @@ slot[name=error]::slotted(*) {
   --sbb-teaser-product-footer-font-size: var(--sbb-text-font-size-xxs);
   --sbb-teaser-product-footer-padding-block-start: var(--sbb-spacing-responsive-s);
   --sbb-teaser-product-footer-padding-block-end: 0;
+  --sbb-time-input-max-width: 3.625rem;
   --sbb-timetable-form-background-color: var(--sbb-background-color-1);
   --sbb-timetable-form-border-radius: var(--sbb-border-radius-4x);
   --sbb-timetable-form-details-border-block-start: var(--sbb-border-width-1x) solid
@@ -1913,7 +1830,39 @@ slot[name=error]::slotted(*) {
   --sbb-timetable-occupancy-font-size: var(--sbb-text-font-size-s);
   --sbb-timetable-occupancy-list-gap: var(--sbb-spacing-fixed-2x);
   --sbb-timetable-occupancy-item-gap: var(--sbb-spacing-fixed-1x);
-  --sbb-time-input-max-width: 3.625rem;
+  --sbb-title-color: var(--sbb-color-3);
+  --sbb-toast-max-width: 25rem;
+  --sbb-toast-animation-timing-function: ease;
+  --sbb-toast-text-color: var(--sbb-color-3-inverted);
+  --sbb-toast-background-color: var(--sbb-background-color-1-inverted);
+  --sbb-toast-margin: var(--sbb-spacing-responsive-s);
+  --sbb-toast-padding-block: var(--sbb-spacing-responsive-xxxs);
+  --sbb-toast-padding-inline: var(--sbb-spacing-responsive-xs);
+  --sbb-toast-border-radius: var(--sbb-border-radius-4x);
+  --sbb-toast-container-position: fixed;
+  --sbb-toast-horizontal-position: initial;
+  --sbb-toast-vertical-position: initial;
+  --sbb-toast-gap: var(--sbb-spacing-fixed-2x);
+  --sbb-toggle-height-s: var(--sbb-size-element-xxs);
+  --sbb-toggle-height-m: var(--sbb-size-element-m);
+  --sbb-toggle-height: var(--sbb-toggle-height-m);
+  --sbb-toggle-padding-inline-s: var(--sbb-spacing-responsive-xxxs);
+  --sbb-toggle-padding-inline-m: var(--sbb-spacing-responsive-xs);
+  --sbb-toggle-padding-inline: var(--sbb-toggle-padding-inline-m);
+  --sbb-toggle-background-color: var(--sbb-background-color-4);
+  --sbb-toggle-background-inset: 0.125rem;
+  --sbb-toggle-border-radius: var(--sbb-border-radius-infinity);
+  --sbb-toggle-font-size: var(--sbb-text-font-size-m);
+  --sbb-toggle-grid-template-columns: auto auto;
+  --sbb-toggle-selected-option-border-width: var(--sbb-border-width-1x);
+  --sbb-toggle-selected-option-border-style: solid;
+  --sbb-toggle-selected-option-border-color: var(--sbb-border-color-5);
+  --sbb-toggle-selected-option-background-color: var(--sbb-background-color-1);
+  --sbb-toggle-option-color: var(--sbb-color-anthracite);
+  --sbb-toggle-option-color: light-dark(var(--sbb-color-anthracite), var(--sbb-color-cloud));
+  --sbb-toggle-option-gap: var(--sbb-spacing-fixed-1x);
+  --sbb-toggle-option-font-size: var(--sbb-text-font-size-xs);
+  --sbb-toggle-option-icon-min-size: var(--sbb-size-icon-ui-small);
   --sbb-toggle-check-font-size: var(--sbb-text-font-size-s);
   --sbb-toggle-check-color: var(--sbb-color-2);
   --sbb-toggle-check-checked-color: var(--sbb-color-primary);
@@ -1929,22 +1878,6 @@ slot[name=error]::slotted(*) {
   --sbb-toggle-check-border-width: var(--sbb-border-width-1x);
   --sbb-toggle-check-border-radius: var(--sbb-border-radius-4x);
   --sbb-toggle-check-shadow: var(--sbb-box-shadow-level-5-hard);
-  --sbb-toggle-padding-inline: var(--sbb-spacing-responsive-xs);
-  --sbb-toggle-height: var(--sbb-size-element-m);
-  --sbb-toggle-background-color: var(--sbb-background-color-4);
-  --sbb-toggle-background-inset: 0.125rem;
-  --sbb-toggle-border-radius: var(--sbb-border-radius-infinity);
-  --sbb-toggle-font-size: var(--sbb-text-font-size-m);
-  --sbb-toggle-grid-template-columns: auto auto;
-  --sbb-toggle-selected-option-border-width: var(--sbb-border-width-1x);
-  --sbb-toggle-selected-option-border-style: solid;
-  --sbb-toggle-selected-option-border-color: var(--sbb-border-color-5);
-  --sbb-toggle-selected-option-background-color: var(--sbb-background-color-1);
-  --sbb-toggle-option-color: var(--sbb-color-anthracite);
-  --sbb-toggle-option-color: light-dark(var(--sbb-color-anthracite), var(--sbb-color-cloud));
-  --sbb-toggle-option-gap: var(--sbb-spacing-fixed-1x);
-  --sbb-toggle-option-font-size: var(--sbb-text-font-size-xs);
-  --sbb-toggle-option-icon-min-size: var(--sbb-size-icon-ui-small);
   --sbb-tooltip-animation-easing: ease-out;
   --sbb-tooltip-animation-translate: 0 var(--sbb-spacing-fixed-2x);
   --sbb-tooltip-background-color: var(--sbb-background-color-1-inverted);
@@ -1959,18 +1892,59 @@ slot[name=error]::slotted(*) {
   --sbb-overlay-position-try-fallbacks:
     block-start span-inline-end, block-start span-inline-start, block-end,
     block-end span-inline-end, block-end span-inline-start;
-  --sbb-toast-max-width: 25rem;
-  --sbb-toast-animation-timing-function: ease;
-  --sbb-toast-text-color: var(--sbb-color-3-inverted);
-  --sbb-toast-background-color: var(--sbb-background-color-1-inverted);
-  --sbb-toast-margin: var(--sbb-spacing-responsive-s);
-  --sbb-toast-padding-block: var(--sbb-spacing-responsive-xxxs);
-  --sbb-toast-padding-inline: var(--sbb-spacing-responsive-xs);
-  --sbb-toast-border-radius: var(--sbb-border-radius-4x);
-  --sbb-toast-container-position: fixed;
-  --sbb-toast-horizontal-position: initial;
-  --sbb-toast-vertical-position: initial;
-  --sbb-toast-gap: var(--sbb-spacing-fixed-2x);
+  --sbb-train-blocked-passage-background-color: var(--sbb-color-error);
+  --sbb-train-blocked-passage-bar-color: var(--sbb-color-white);
+  --sbb-train-blocked-passage-icon-bar-width: 0.625rem;
+  --sbb-train-blocked-passage-icon-bar-height: 0.25rem;
+  --sbb-train-blocked-passage-icon-bar-border-radius: var(--sbb-border-radius-1x);
+  --sbb-train-formation-wagon-dimension-short: 2.25rem;
+  --sbb-train-formation-wagon-dimension-long: 5.25rem;
+  --sbb-train-formation-wagon-gap: var(--sbb-spacing-fixed-1x);
+  --sbb-train-formation-sector-line-color: var(--sbb-color-cement);
+  --sbb-train-formation-sector-line-color: light-dark(
+    var(--sbb-color-cement),
+    var(--sbb-color-smoke)
+  );
+  --sbb-train-formation-sector-line-width: var(--sbb-border-width-1x);
+  --sbb-train-formation-blocked-passage-dimension: 1rem;
+  --sbb-train-formation-text-color: var(--sbb-color-3);
+  --sbb-train-formation-gap: var(--sbb-spacing-fixed-2x);
+  --sbb-train-formation-sector-padding: var(--sbb-spacing-fixed-1x);
+  --sbb-train-formation-sector-margin: var(--sbb-spacing-fixed-2x);
+  --sbb-train-formation-padding: var(--sbb-spacing-fixed-1x);
+  --_sbb-train-formation-flex-direction: row;
+  --_sbb-train-formation-flex-direction-inverted: column;
+  --sbb-train-wagon-font-size: var(--sbb-text-font-size-xxs);
+  --sbb-train-wagon-shape-color: var(--sbb-color-3);
+  --sbb-train-wagon-vertical-gap: 0.125rem;
+  --sbb-train-wagon-padding-inline: var(--sbb-spacing-fixed-3x);
+  --sbb-train-wagon-border-width: var(--sbb-border-width-1x);
+  --sbb-train-wagon-main-icon-height: 1.25rem;
+  --sbb-train-wagon-attribute-icon-gap: 0.125rem;
+  --sbb-train-wagon-attribute-icon-height: 0.875rem;
+  --sbb-train-wagon-attribute-icon-color: var(--sbb-color-1);
+  --sbb-train-wagon-attributes-max-width: 3.4375rem;
+  --sbb-train-wagon-attributes-mean-width: 1.75rem;
+  --sbb-train-wagon-occupancy-height: 0.75rem;
+  --sbb-train-wagon-background-color-hover: var(--sbb-background-color-3);
+  --sbb-train-wagon-background-color-active: var(--sbb-background-color-4);
+  --sbb-train-wagon-border-radius: var(--sbb-border-radius-6x);
+  --sbb-train-wagon-information-gap: var(--sbb-spacing-fixed-1x);
+  --sbb-train-wagon-information-min-width: 1.875rem;
+  --sbb-train-wagon-class-dimension: 1.125rem;
+  --sbb-train-wagon-class-color: var(--sbb-color-anthracite);
+  --sbb-train-wagon-class-color: light-dark(var(--sbb-color-anthracite), var(--sbb-color-graphite));
+  --sbb-train-wagon-class-background-color: var(--sbb-background-color-3);
+  --sbb-train-wagon-class-border-width: var(--sbb-border-width-1x);
+  --sbb-train-wagon-class-border: var(--sbb-train-wagon-class-border-width) solid
+    var(--sbb-color-graphite);
+  --sbb-train-wagon-class-border: var(--sbb-train-wagon-class-border-width) solid
+    light-dark(var(--sbb-color-graphite), var(--sbb-color-anthracite));
+  --sbb-train-wagon-class-border-radius: var(--sbb-border-radius-2x);
+  --sbb-train-wagon-class-font-weight: bold;
+  --sbb-train-wagon-class-first-thickness: 0.25rem;
+  --sbb-train-wagon-class-first-color: var(--sbb-color-lemon);
+  --sbb-train-wagon-class-first-border-radius: var(--sbb-border-radius-1x);
   --sbb-visual-checkbox-dimension: var(--sbb-checkbox-dimension-m);
   --sbb-visual-checkbox-selection-color: var(--sbb-color-primary);
   --sbb-visual-checkbox-selection-color-negative: var(--sbb-color-primary85);
@@ -1993,31 +1967,27 @@ slot[name=error]::slotted(*) {
     --sbb-focus-outline-color-default: Highlight;
     --sbb-focus-outline-color-dark: Highlight;
     --sbb-focus-outline-width: var(--sbb-border-width-2x);
+    --sbb-alert-outline: var(--sbb-border-width-1x) solid CanvasText;
+    --sbb-alert-forced-color-border-radius: var(--sbb-alert-border-radius);
     --sbb-breadcrumb-color: ButtonText;
     --sbb-breadcrumb-color-active: Highlight;
+    --sbb-calendar-cell-background-color-hover: transparent;
+    --sbb-calendar-cell-background-color-active: transparent;
     --sbb-card-border-color: CanvasText;
     --sbb-card-border-width: var(--sbb-border-width-2x);
     --sbb-card-badge-border-display: block;
     --sbb-card-badge-inline-border-display: none;
+    --sbb-expansion-panel-header-text-color: ButtonText;
+    --sbb-form-field-border-color: ButtonBorder;
     --sbb-header-action-border-color: CanvasText;
     --sbb-header-action-color: LinkText;
     --sbb-header-action-active-border-width: 0;
-    --sbb-expansion-panel-header-text-color: ButtonText;
-    --sbb-form-field-border-color: ButtonBorder;
     --sbb-loading-indicator-circle-animated-width: 50%;
     --sbb-loading-indicator-circle-animated-height: 100%;
     --sbb-loading-indicator-circle-animated-border-radius: 0;
     --sbb-loading-indicator-circle-background: transparent;
     --sbb-logo-panel-color: ButtonText !important;
     --sbb-logo-signet-color: Canvas !important;
-    --sbb-visual-checkbox-selection-color: Canvas;
-    --sbb-visual-checkbox-selection-color-negative: Canvas;
-    --sbb-visual-checkbox-selection-color-disabled: Canvas;
-    --sbb-visual-checkbox-selection-color-disabled-negative: Canvas;
-    --sbb-visual-checkbox-border-color: ButtonBorder;
-    --sbb-visual-checkbox-border-color-disabled: GrayText;
-    --sbb-visual-checkbox-border-width: var(--sbb-border-width-2x);
-    --sbb-visual-checkbox-border-style-disabled: solid;
     --sbb-radio-button-background-color: Canvas;
     --sbb-radio-button-border-width: var(--sbb-border-width-2x);
     --sbb-radio-button-border-color: ButtonBorder;
@@ -2033,43 +2003,24 @@ slot[name=error]::slotted(*) {
     --sbb-tag-text-color: ButtonText;
     --sbb-tag-border-color: CanvasText;
     --sbb-tag-border-width: var(--sbb-border-width-2x);
-    --sbb-toggle-check-background-color: CanvasText;
-    --sbb-toggle-check-circle-background-color: Canvas;
     --sbb-toggle-selected-option-border-width: var(--sbb-border-width-2x);
     --sbb-toggle-selected-option-border-color: Highlight;
+    --sbb-toggle-check-background-color: CanvasText;
+    --sbb-toggle-check-circle-background-color: Canvas;
+    --sbb-train-blocked-passage-background-color: CanvasText;
+    --sbb-train-blocked-passage-bar-color: Canvas;
+    --sbb-train-formation-sector-line-color: CanvasText;
+    --sbb-train-wagon-shape-color: CanvasText;
+    --sbb-visual-checkbox-selection-color: Canvas;
+    --sbb-visual-checkbox-selection-color-negative: Canvas;
+    --sbb-visual-checkbox-selection-color-disabled: Canvas;
+    --sbb-visual-checkbox-selection-color-disabled-negative: Canvas;
+    --sbb-visual-checkbox-border-color: ButtonBorder;
+    --sbb-visual-checkbox-border-color-disabled: GrayText;
+    --sbb-visual-checkbox-border-width: var(--sbb-border-width-2x);
+    --sbb-visual-checkbox-border-style-disabled: solid;
   }
 }
-:root {
-  --sbb-train-formation-wagon-width: 5rem;
-  --sbb-train-formation-wagon-height: 2.5rem;
-  --sbb-train-formation-wagon-gap: var(--sbb-spacing-fixed-1x);
-  --sbb-overlay-default-z-index: 1000;
-  --sbb-cursor-default: default;
-  --sbb-cursor-pointer: pointer;
-  --sbb-border-radius-infinity: calc(infinity * 1px);
-}
-:root.sbb-lean {
-  --sbb-title-font-size-level-1-lean: var(--sbb-heading-font-size-2);
-  --sbb-title-font-size-level-2-lean: var(--sbb-heading-font-size-3);
-  --sbb-title-font-size-level-3-lean: var(--sbb-heading-font-size-4);
-  --sbb-title-font-size-level-4-lean: var(--sbb-heading-font-size-5);
-  --sbb-title-font-size-level-5-lean: var(--sbb-heading-font-size-6);
-  --sbb-title-font-size-level-6-lean: var(--sbb-typo-scale-0-75x);
-  --sbb-heading-margin-block-1-lean: var(--sbb-spacing-responsive-s)
-    var(--sbb-spacing-fixed-3x);
-  --sbb-heading-margin-block-2-lean: var(--sbb-spacing-responsive-s)
-    var(--sbb-spacing-fixed-3x);
-  --sbb-heading-margin-block-3-lean: var(--sbb-spacing-responsive-s)
-    var(--sbb-spacing-responsive-xxxs);
-  --sbb-heading-margin-block-4-lean: var(--sbb-spacing-responsive-s)
-    var(--sbb-spacing-fixed-2x);
-  --sbb-heading-margin-block-5-lean: var(--sbb-spacing-responsive-s)
-    var(--sbb-spacing-fixed-1x);
-  --sbb-heading-margin-block-6-lean: var(--sbb-spacing-responsive-s) 0;
-}
-:root:where(.sbb-focus-modality-mouse, .sbb-focus-modality-touch) {
-  --sbb-focus-outline-style: none;
-}
 @media (min-width: calc(37.5rem)) {
   :root {
     /* Title */
@@ -2082,7 +2033,11 @@ slot[name=error]::slotted(*) {
     --sbb-layout-base-offset-responsive: var(--sbb-layout-base-offset-responsive-small);
     --sbb-grid-base-columns: var(--sbb-layout-base-grid-columns-small);
     --sbb-grid-base-gutter-responsive: var(--sbb-layout-base-grid-gutter-responsive-small);
-    --sbb-dialog-padding-inline: var(--sbb-spacing-fixed-12x);
+    --sbb-alert-close-button-divider-display: block;
+    --sbb-dialog-padding-inline: var(--sbb-spacing-fixed-8x);
+    --sbb-dialog-max-height: calc(100vh - 2 * var(--sbb-spacing-fixed-6x));
+    --sbb-dialog-max-width: 90vw;
+    --sbb-dialog-translate-y: var(--sbb-spacing-fixed-4x);
     --sbb-footer-clock-width: 7rem;
     --sbb-notification-icon-align-self: flex-start;
     --sbb-notification-padding-inline: var(--sbb-spacing-responsive-xs);
@@ -2123,22 +2078,54 @@ slot[name=error]::slotted(*) {
     --sbb-size-element-s: var(--sbb-size-element-s-large);
     --sbb-size-element-m: var(--sbb-size-element-m-large);
     --sbb-size-element-l: var(--sbb-size-element-l-large);
+    --sbb-alert-icon-size: 1.75rem;
+    --sbb-alert-icon-size-l: 2.125rem;
     --sbb-button-padding-inline-size-l: var(--sbb-spacing-fixed-10x);
     --sbb-button-padding-inline-size-m: var(--sbb-spacing-fixed-8x);
     --sbb-button-padding-inline-size-s: var(--sbb-spacing-fixed-5x);
-    --sbb-chip-group-margin-block: var(--_sbb-chip-group-margin-block-start-default-large) 0;
-    --sbb-chip-group-margin-block-no-label-not-empty: 0.1875rem 0.875rem;
-    --sbb-chip-group-margin-block-with-label-not-empty: var(--_sbb-chip-group-margin-block-start-default-large) var(--_sbb-chip-group-margin-block-start-default-large);
-    --sbb-dialog-padding-inline: var(--sbb-spacing-responsive-s);
-    --sbb-dialog-max-height: calc(100vh - var(--sbb-spacing-fixed-16x));
+    --_sbb-chip-group-margin-block-base-lm: var(--_sbb-chip-group-margin-block-start-default-large) 0;
+    --_sbb-chip-group-margin-block-with-label-s: 0.3125rem 0.1875rem;
+    --_sbb-chip-group-margin-block-without-label-s: 0 0.3125rem;
+    --_sbb-chip-group-margin-block-without-label-m: 0.1875rem
+      0.875rem;
+    --_sbb-chip-group-margin-block-without-label-l: var(
+        --_sbb-chip-group-margin-block-start-default-large
+      )
+      1.25rem;
+    --_sbb-chip-group-margin-block-with-label-l: var(
+        --_sbb-chip-group-margin-block-start-default-large
+      )
+      0.46875rem;
+    --_sbb-chip-group-margin-block-with-label-m: var(
+        --_sbb-chip-group-margin-block-start-default-large
+      )
+      var(--_sbb-chip-group-margin-block-start-default-large);
     --sbb-flip-card-min-height: 20rem;
     --_sbb-form-field-label-to-input-overlapping: var(--sbb-spacing-fixed-1x);
     --_sbb-form-field-floating-label-transform: 0.65625rem;
     --_sbb-form-field-spacer-margin-block-end: calc(-1 * var(--_sbb-form-field-label-to-input-overlapping));
-    --sbb-header-height: var(--sbb-spacing-fixed-24x);
+    --sbb-header-height-s: var(--sbb-spacing-fixed-14x);
+    --sbb-header-height-m: var(--sbb-spacing-fixed-24x);
     --sbb-menu-max-width: 20rem;
     --sbb-menu-min-width: 11.25rem;
     --sbb-menu-transform-y: var(--sbb-spacing-fixed-2x);
+    --sbb-navigation-grid-column: 1 / 5;
+    --sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-xl);
+    --sbb-navigation-padding-inline: var(--sbb-layout-base-offset-responsive) 0;
+    --sbb-navigation-list-margin-block-start: var(--sbb-spacing-fixed-1x);
+    --sbb-navigation-inline-start: calc(var(--sbb-layout-base-offset-responsive) * -1);
+    --sbb-navigation-section-column: 5 / 13;
+    --sbb-navigation-section-padding-block: var(--sbb-spacing-responsive-xl);
+    --sbb-navigation-section-padding-inline: var(--sbb-spacing-fixed-8x)
+      var(--sbb-layout-base-offset-responsive);
+    --sbb-navigation-section-position: relative;
+    --sbb-navigation-section-translate: 0;
+    --sbb-navigation-section-content-padding-inline-start: 0;
+    --sbb-navigation-section-font-size: var(--sbb-heading-font-size-2);
+    --sbb-panel-width: 20.0625rem;
+    --sbb-panel-inner-height: 15.006875rem;
+    --sbb-panel-triangle-height: 2.965625rem;
+    --sbb-panel-font-size: var(--sbb-typo-scale-2x);
     --sbb-teaser-product-container-padding-block: var(--sbb-spacing-responsive-l) 0;
     --sbb-teaser-product-container-padding-inline: var(--sbb-spacing-responsive-xl);
     --sbb-teaser-product-content-align-content: center;
@@ -2147,9 +2134,6 @@ slot[name=error]::slotted(*) {
     --sbb-teaser-product-footer-min-height: var(--sbb-teaser-product-container-spacing);
     --sbb-time-input-max-width: 4.0625rem;
   }
-  :root.sbb-lean {
-    --sbb-title-font-size-level-6-lean: var(--sbb-typo-scale-0-875x);
-  }
 }
 @media (min-width: calc(90rem)) {
   :root {
@@ -2167,33 +2151,103 @@ slot[name=error]::slotted(*) {
     --sbb-lead-container-image-ratio: 21 / 9;
     --sbb-lead-container-image-border-radius: var(--sbb-lead-container-border-radius);
     --sbb-map-container-sidebar-width: 30rem;
+    --sbb-navigation-grid-column: 1 / 6;
+    --sbb-navigation-padding-block-start: var(--sbb-spacing-responsive-xxl);
+    --sbb-navigation-section-column: 6 / 17;
+    --sbb-navigation-section-padding-block: var(--sbb-spacing-responsive-xxl)
+      var(--sbb-spacing-responsive-l);
+    --sbb-panel-width: 26.75rem;
+    --sbb-panel-inner-height: 20.02375rem;
+    --sbb-panel-triangle-height: 3.956875rem;
+    --sbb-panel-font-size: var(--sbb-typo-scale-2-5x);
+    --sbb-panel-line-height: 1.2;
   }
 }
 
-@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;
+*,
+::before,
+::after {
+  box-sizing: border-box;
 }
-@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;
+
+:root:where(.sbb-focus-modality-mouse, .sbb-focus-modality-touch) {
+  --sbb-focus-outline-style: none;
 }
-@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;
+
+::placeholder {
+  color: var(--sbb-color-5);
+  -webkit-text-fill-color: var(--sbb-color-5);
+  opacity: 1;
+}
+
+:is(sbb-autocomplete,
+sbb-autocomplete-grid,
+sbb-datepicker,
+sbb-dialog,
+sbb-menu,
+sbb-navigation,
+sbb-navigation-section,
+sbb-overlay,
+sbb-popover,
+sbb-select,
+sbb-skiplink-list,
+sbb-toast,
+sbb-tooltip):not(:defined) {
+  display: none;
+}
+
+img {
+  aspect-ratio: var(--sbb-image-aspect-ratio);
+  object-fit: var(--sbb-image-object-fit);
+  object-position: var(--sbb-image-object-position);
+}
+
+.sbb-overlay-outlet {
+  position: fixed;
+  inset: 0;
+  pointer-events: none;
+}
+
+[sbb-badge] {
+  --sbb-badge-position-offset: calc(var(--sbb-spacing-fixed-2x) * -1);
+  position: relative;
 }
+[sbb-badge]::after {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding-inline: var(--sbb-spacing-fixed-1x);
+  border-radius: var(--sbb-border-radius-infinity);
+  background-color: var(--sbb-color-primary);
+  color: var(--sbb-color-1-negative);
+  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);
+  font-size: var(--sbb-text-font-size-xxs);
+  font-weight: bold;
+  outline: var(--sbb-border-width-1x) solid transparent;
+  content: attr(sbb-badge);
+  position: absolute;
+  inset-block-start: var(--sbb-badge-position-offset);
+}
+[sbb-badge]:where([sbb-badge-position=before])::after {
+  inset-inline-start: var(--sbb-badge-position-offset);
+}
+[sbb-badge]:where(:not([sbb-badge-position]), [sbb-badge-position=after])::after {
+  inset-inline-end: var(--sbb-badge-position-offset);
+}
+
 sbb-breadcrumb-group:not(:defined) {
   display: block;
   height: calc(var(--sbb-typo-line-height-text) * var(--sbb-text-font-size-xs));
   overflow: hidden;
 }
 
+sbb-card .sbb-action {
+  pointer-events: all;
+}
+
 sbb-container > [slot=image]:is(sbb-image, img),
 sbb-container > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap-image) {
   --sbb-image-object-fit: cover;
@@ -2216,15 +2270,15 @@ sbb-dialog:has(> sbb-dialog-title[visual-level="5"]) > sbb-dialog-close-button,
 sbb-dialog:has(> sbb-dialog-title) > sbb-dialog-content, sbb-dialog:is(:state(has-intermediate-element),[state--has-intermediate-element]):has(> * > sbb-dialog-title) > * > sbb-dialog-content {
   padding-block-start: var(--sbb-spacing-fixed-1x);
 }
-sbb-dialog[negative] > sbb-dialog-content, sbb-dialog[negative]:is(:state(has-intermediate-element),[state--has-intermediate-element]) > * > sbb-dialog-content {
-  --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-white) 30%, transparent);
-  --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-white) 60%, transparent);
-}
 
 sbb-dialog:has(> sbb-dialog-close-button) > sbb-dialog-title, sbb-dialog:is(:state(has-intermediate-element),[state--has-intermediate-element]):has(> * > sbb-dialog-close-button) > * > sbb-dialog-title {
   padding-inline-end: 0;
 }
 
+sbb-flip-card .sbb-action {
+  pointer-events: all;
+}
+
 sbb-flip-card-summary > [slot=image]:is(sbb-image, img),
 sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap-image) {
   --sbb-image-aspect-ratio: auto;
@@ -2293,6 +2347,7 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
   margin-block-end: -0.125rem;
 }
 :is(sbb-form-field, sbb-timetable-form-field) :where(textarea) {
+  --sbb-scrollbar-width: var(--sbb-spacing-fixed-3x);
   --sbb-scrollbar-thumb-width: 0.125rem;
   --sbb-scrollbar-thumb-width-hover: 0.25rem;
   --sbb-scrollbar-width-firefox: thin;
@@ -2307,7 +2362,6 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
     color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
   );
   --sbb-scrollbar-track-color: transparent;
-  --sbb-scrollbar-width: var(--sbb-spacing-fixed-3x);
 }
 :is(sbb-form-field, sbb-timetable-form-field) :where(textarea)::-webkit-scrollbar {
   width: var(--sbb-scrollbar-width);
@@ -2348,40 +2402,8 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
   padding-block-end: 0.34375rem;
 }
 :is(sbb-form-field, sbb-timetable-form-field)[negative] :where(textarea) {
-  --sbb-scrollbar-thumb-width: 0.125rem;
-  --sbb-scrollbar-thumb-width-hover: 0.25rem;
-  --sbb-scrollbar-width-firefox: thin;
   --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-white) 30%, transparent);
   --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-white) 60%, transparent);
-  --sbb-scrollbar-track-color: transparent;
-  --sbb-scrollbar-width: var(--sbb-spacing-fixed-3x);
-}
-:is(sbb-form-field, sbb-timetable-form-field)[negative] :where(textarea)::-webkit-scrollbar {
-  width: var(--sbb-scrollbar-width);
-  height: var(--sbb-scrollbar-width);
-  background-color: var(--sbb-scrollbar-track-color, transparent);
-}
-:is(sbb-form-field, sbb-timetable-form-field)[negative] :where(textarea)::-webkit-scrollbar-corner {
-  background-color: var(--sbb-scrollbar-track-color, transparent);
-}
-:is(sbb-form-field, sbb-timetable-form-field)[negative] :where(textarea)::-webkit-scrollbar-thumb {
-  background-color: var(--sbb-scrollbar-color, currentcolor);
-  border: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;
-  border-radius: var(--sbb-border-radius-4x);
-  background-clip: padding-box;
-}
-:is(sbb-form-field, sbb-timetable-form-field)[negative] :where(textarea)::-webkit-scrollbar-thumb:hover {
-  background-color: var(--sbb-scrollbar-color-hover, currentcolor);
-  border-width: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)));
-}
-:is(sbb-form-field, sbb-timetable-form-field)[negative] :where(textarea)::-webkit-scrollbar-button, :is(sbb-form-field, sbb-timetable-form-field)[negative] :where(textarea)::-webkit-scrollbar-corner {
-  display: none;
-}
-@supports not selector(::-webkit-scrollbar) {
-  :is(sbb-form-field, sbb-timetable-form-field)[negative] :where(textarea) {
-    scrollbar-width: var(--sbb-scrollbar-width-firefox);
-    scrollbar-color: var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent);
-  }
 }
 :is(sbb-form-field, sbb-timetable-form-field):has(:is(:is(input, textarea, select):user-invalid,
 :is(:state(interacted),[state--interacted]):invalid,
@@ -2433,24 +2455,12 @@ sbb-flip-card-summary > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap
   }
 }
 
-:root:has(sbb-header[size=m]) {
-  --sbb-header-height: var(--sbb-spacing-fixed-14x);
-}
-
 :root:has(sbb-header[size=s]) {
-  --sbb-header-height: 3.25rem;
+  --sbb-header-height: var(--sbb-header-height-s);
 }
 
-@media (min-width: calc(64rem)) {
-  :root:has(sbb-header[size=m]) {
-    --sbb-header-height: var(--sbb-spacing-fixed-24x);
-  }
-  :root:has(sbb-header[size=s]) {
-    --sbb-header-height: var(--sbb-spacing-fixed-14x);
-  }
-}
 sbb-header + :where(sbb-sidebar-container, sbb-icon-sidebar-container) {
-  margin-block-start: var(--sbb-header-height);
+  margin-block-start: var(--sbb-header-vertical-spacing);
 }
 
 .sbb-header-info {
@@ -2490,18 +2500,6 @@ sbb-message > [slot=image] :is(sbb-image, img):not(.sbb-figure-overlap-image) {
   border-radius: var(--sbb-message-image-border-radius);
 }
 
-:where(sbb-select, sbb-autocomplete, sbb-autocomplete-grid)[size=s] :where(sbb-option, sbb-autocomplete-grid-option) {
-  --sbb-option-min-height: var(--sbb-size-element-xxs);
-  --sbb-focus-outline-offset: calc(-1 * var(--sbb-spacing-fixed-1x));
-  --sbb-option-focus-outline-inset: 0 var(--sbb-spacing-fixed-1x);
-}
-:where(sbb-select, sbb-autocomplete, sbb-autocomplete-grid)[size=s] sbb-optgroup {
-  --sbb-optgroup-label-padding-end: var(--sbb-spacing-fixed-1x);
-}
-:where(sbb-select, sbb-autocomplete, sbb-autocomplete-grid)[size=s] sbb-option-hint {
-  --sbb-option-hint-padding-block-end: var(--sbb-spacing-fixed-1x);
-}
-
 .sbb-options-nowrap {
   --sbb-option-text-overflow: ellipsis;
   --sbb-option-overflow: hidden;
@@ -2547,240 +2545,335 @@ sbb-sidebar-container:is(:has(> sbb-sidebar:not([position=end]):is(:is(:state(st
   --_sbb-sidebar-content-margin-inline-start: 0;
 }
 
-sbb-tab-nav-bar .sbb-tab-amount {
-  margin: 0;
-  color: var(--sbb-tab-label-amount-color);
-  font-weight: normal;
-  text-decoration: var(--sbb-tab-label-text-decoration);
-}
-
-sbb-teaser :is(sbb-image, img):not(.sbb-figure-overlap-image) {
-  --sbb-image-object-fit: cover;
-  --sbb-image-aspect-ratio: 4 / 3;
-  transition-property: filter, scale;
-  will-change: filter, scale;
-  scale: var(--sbb-teaser-scale, 1);
-}
-
-sbb-teaser-hero :is(sbb-image, img):not(.sbb-figure-overlap-image) {
-  --sbb-image-aspect-ratio: 1 / 1;
-  border-radius: 0;
-}
-@media (min-width: calc(37.5rem)) {
-  sbb-teaser-hero :is(sbb-image, img):not(.sbb-figure-overlap-image) {
-    --sbb-image-aspect-ratio: 16 / 9;
-  }
-}
-sbb-teaser-hero img:not(.sbb-figure-overlap-image) {
-  display: block;
-  align-self: stretch;
-  width: 100%;
+:is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) {
+  --sbb-table-border: var(--sbb-border-width-1x) solid var(--sbb-table-border-color);
+  --sbb-table-sticky-shadow-transition-duration: var(
+    --sbb-disable-animation-duration,
+    var(--sbb-animation-duration-6x)
+  );
+  border-spacing: 0;
+  caption-side: bottom;
+  color: var(--sbb-table-color);
+  table-layout: auto;
+  text-align: left;
 }
-
-:is(sbb-teaser-product, sbb-teaser-product-static) :is(sbb-image, img):not(.sbb-figure-overlap-image) {
-  border-radius: 0;
-  --sbb-image-object-fit: cover;
-  --sbb-image-aspect-ratio: 16 / 9;
+: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);
+  font-weight: bold;
+  background-color: var(--sbb-table-background-color);
+  border-block-end: var(--sbb-table-border);
+  border-inline-end: var(--sbb-table-border);
+  padding-block: var(--sbb-table-header-padding-block);
+  padding-inline: var(--sbb-table-header-padding-inline);
 }
-:is(sbb-teaser-product, sbb-teaser-product-static) img:not(.sbb-figure-overlap-image) {
-  place-self: stretch;
+: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);
+  background-color: var(--sbb-table-background-color);
+  border-block-end: var(--sbb-table-border);
+  border-inline-end: var(--sbb-table-border);
+  padding-block: var(--sbb-table-cell-padding-block);
+  padding-inline: var(--sbb-table-cell-padding-inline);
 }
-
-sbb-toggle:has(: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);
+:is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) :is(th, td).sbb-table-group-with-next {
+  border-inline-end: none;
 }
-
-.sbb-dark {
-  color-scheme: dark;
+:is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) :is(th, td):first-child {
+  border-inline-start: var(--sbb-table-border);
 }
-
-.sbb-light {
-  color-scheme: light;
+:is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs):has(thead tr) thead tr:first-of-type > :is(th, td), :is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs):not(:has(thead tr)) tbody tr:first-of-type > :is(th, td) {
+  border-block-start: var(--sbb-table-border);
 }
-
-.sbb-light-dark {
-  color-scheme: light dark;
+:is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) thead > tr:has(+ tr) > :is(th, td) {
+  border-block-end: none;
 }
 
-html {
-  font-family: var(--sbb-typo-font-family);
-  font-weight: normal;
-  line-height: var(--sbb-typo-line-height-text);
+:is(.sbb-table, .sbb-table-m, .sbb-table-s, .sbb-table-xs) caption,
+.sbb-table-caption {
+  --sbb-table-caption-color-fallback: var(--sbb-color-granite);
+  --sbb-table-caption-color-fallback: light-dark(
+    var(--sbb-color-granite),
+    var(--sbb-color-cement)
+  );
+  font-size: var(--sbb-text-font-size-xs);
   letter-spacing: var(--sbb-typo-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);
+  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;
 }
 
-::placeholder {
-  color: var(--sbb-color-5);
-  -webkit-text-fill-color: var(--sbb-color-5);
-  opacity: 1;
+.sbb-table-xs {
+  --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
+  --sbb-table-header-padding-block: 0;
+  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-1x);
+  --sbb-table-cell-padding-block: 0;
+  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-1x);
 }
 
-:is(sbb-autocomplete,
-sbb-autocomplete-grid,
-sbb-datepicker,
-sbb-dialog,
-sbb-menu,
-sbb-navigation,
-sbb-navigation-section,
-sbb-overlay,
-sbb-popover,
-sbb-select,
-sbb-skiplink-list,
-sbb-toast,
-sbb-tooltip):not(:defined) {
-  display: none;
+.sbb-table-s {
+  --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
+  --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
+  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
+  --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
+  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
 }
 
-[popover]:where(sbb-autocomplete,
-sbb-autocomplete-grid,
-sbb-datepicker,
-sbb-dialog,
-sbb-menu,
-sbb-navigation,
-sbb-overlay,
-sbb-popover,
-sbb-toast) {
-  margin: 0;
-  padding: 0;
-  border: none;
-  width: auto;
-  height: auto;
-  background-color: transparent;
-  color: inherit;
-  pointer-events: none;
+.sbb-table-m {
+  --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
+  --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
+  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
+  --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
+  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
 }
 
-:is(sbb-card, sbb-flip-card) .sbb-action {
-  pointer-events: all;
+sbb-table-wrapper[negative] .sbb-table,
+.sbb-table--negative {
+  --sbb-table-border-color: var(--sbb-color-anthracite);
+  --sbb-table-background-color: var(--sbb-background-color-1-negative);
+  --sbb-table-color: var(--sbb-color-1-negative);
+  --sbb-table-row-striped-color: var(--sbb-background-color-3-negative);
+  --sbb-table-caption-color: var(--sbb-color-cement);
 }
 
-sbb-title + p {
-  margin-block-start: 0;
+.sbb-table--striped tbody tr:nth-child(odd) :is(th, td) {
+  background-color: var(--sbb-table-row-striped-color);
 }
 
-img {
-  aspect-ratio: var(--sbb-image-aspect-ratio);
-  object-fit: var(--sbb-image-object-fit);
-  object-position: var(--sbb-image-object-position);
+.sbb-table--unstriped tbody tr:nth-child(odd) :is(th, td) {
+  background-color: var(--sbb-table-background-color);
 }
 
-:is(sbb-teaser, sbb-teaser-hero, sbb-teaser-product) {
-  --sbb-teaser-image-brightness-hover: var(--sbb-hover-image-brightness);
-  --sbb-teaser-image-animation-duration: var(
-    --sbb-disable-animation-duration,
-    var(--sbb-animation-duration-4x)
-  );
-  --sbb-teaser-image-animation-easing: var(--sbb-animation-easing);
+.sbb-table--theme-iron {
+  --sbb-table-cell-color: var(--sbb-color-4);
 }
-@media (any-hover: hover) {
-  :is(sbb-teaser, sbb-teaser-hero, sbb-teaser-product):hover {
-    --sbb-teaser-image-brightness: var(--sbb-teaser-image-brightness-hover);
-  }
+sbb-table-wrapper[negative] .sbb-table--theme-iron, .sbb-table--theme-iron.sbb-table--negative {
+  --sbb-table-cell-color: var(--sbb-color-cloud);
 }
-:is(sbb-teaser, sbb-teaser-hero, sbb-teaser-product) :is(sbb-image, img):not(.sbb-figure-overlap-image) {
-  will-change: filter;
-  filter: brightness(var(--sbb-teaser-image-brightness, 1));
-  transition: filter var(--sbb-teaser-image-animation-duration) var(--sbb-teaser-image-animation-easing);
+.sbb-table--theme-iron tbody > tr > td {
+  color: var(--sbb-table-cell-color);
 }
 
-sbb-train-formation:has(sbb-train[direction-label]) {
-  --sbb-train-formation-reserve-spacing-display: block;
+.sbb-table-header-subtitle {
+  font-weight: normal;
 }
 
-sbb-train-formation:has(sbb-train-wagon[sector]) {
-  --sbb-train-formation-show-sectors-gap: 1;
+.sbb-table-row--striped {
+  background-color: var(--sbb-table-row-striped-color);
 }
 
-sbb-train-formation:not(:has(sbb-train-wagon[label])) {
-  --sbb-train-formation-wagon-label-display: none;
+.sbb-table-filter {
+  padding-block-start: 0 !important;
 }
 
-sbb-train-formation[view=side] sbb-train-wagon {
-  --sbb-train-wagon-wagon-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40' viewBox='0 0 80 40' fill='none'%3E%3Cpath d='M12.5,0.5 h55 a12,12 0 0 1 12,12 v15 a12,12 0 0 1 -12,12 h-55 a12,12 0 0 1 -12,-12 v-15 a12,12 0 0 1 12,-12 z' stroke='%23000000' stroke-width='1'/%3E%3C/svg%3E");
-  --sbb-train-wagon-wagon-closed-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40' viewBox='0 0 80 40' fill='none'%3E%3Crect x='0.5' y='0.5' width='79' height='39' rx='11.5' stroke='%23000000'/%3E%3Cpath d='M76 4L4 36' stroke='%23000000'/%3E%3Cpath d='M76 36L4 4' stroke='%23000000'/%3E%3C/svg%3E");
-  --sbb-train-wagon-wagon-end-left-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40' viewBox='0 0 80 40' fill='none'%3E%3Cpath d='M10.745 7.90416C13.5624 3.30431 18.5686 0.5 23.9627 0.5H68C74.3513 0.5 79.5 5.64873 79.5 12V28C79.5 34.3513 74.3513 39.5 68 39.5H11.922C2.93614 39.5 -2.57807 29.6562 2.11537 21.9934L10.745 7.90416Z' stroke='%23000000'/%3E%3C/svg%3E");
-  --sbb-train-wagon-locomotive-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40' viewBox='0 0 80 40' fill='none'%3E%3Cpath d='M10.745 7.90416C13.5624 3.30431 18.5686 0.5 23.9627 0.5H56.0373C61.4314 0.5 66.4376 3.30432 69.255 7.90416L77.8846 21.9934C82.5781 29.6562 77.0639 39.5 68.078 39.5H11.922C2.93615 39.5 -2.57807 29.6562 2.11537 21.9934L10.745 7.90416Z' stroke='%23000000'/%3E%3C/svg%3E");
-  --sbb-train-wagon-wagon-end-right-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40' viewBox='0 0 80 40' fill='none'%3E%3Cpath d='M0.5 12C0.5 5.64873 5.64873 0.5 12 0.5H56.0373C61.4314 0.5 66.4376 3.30432 69.255 7.90416L77.8846 21.9934C82.5781 29.6562 77.0638 39.5 68.0779 39.5H12C5.64873 39.5 0.5 34.3513 0.5 28V12Z' stroke='%23000000'/%3E%3C/svg%3E");
+.sbb-table-caption {
+  --sbb-table-caption-color-fallback: var(--sbb-color-granite);
+  --sbb-table-caption-color-fallback: light-dark(
+    var(--sbb-color-granite),
+    var(--sbb-color-cement)
+  );
+  font-size: var(--sbb-text-font-size-xs);
+  letter-spacing: var(--sbb-typo-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;
 }
 
-sbb-train-formation[view=top] sbb-train-wagon {
-  --sbb-train-wagon-wagon-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40' viewBox='0 0 80 40' fill='none'%3E%3Cpath d='M8.5,0.5 h63 a8,8 0 0 1 8,8 v23 a8,8 0 0 1 -8,8 h-63 a8,8 0 0 1 -8,-8 v-23 a8,8 0 0 1 8,-8 z' stroke='%23000000' stroke-width='1'/%3E%3C/svg%3E%0A");
-  --sbb-train-wagon-wagon-closed-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40' viewBox='0 0 80 40' fill='none'%3E%3Crect x='0.5' y='0.5' width='79' height='39' rx='7.5' stroke='%23000000'/%3E%3Cpath d='M77.5 2.5L2.5 37.5' stroke='%23000000'/%3E%3Cpath d='M77.5 37.5L2.5 2.5' stroke='%23000000'/%3E%3C/svg%3E");
-  --sbb-train-wagon-wagon-end-left-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40' viewBox='0 0 80 40' fill='none'%3E%3Cpath transform='translate(80,40) rotate(180)' d='M8.5,0.5 h51.5 a19.5,19.5 0 0 1 19.5,19.5 v0 a19.5,19.5 0 0 1 -19.5,19.5 h-51.5 a8,8 0 0 1 -8,-8 v-23 a8,8 0 0 1 8,-8 z' stroke='%23000000' stroke-width='1'/%3E%3C/svg%3E");
-  --sbb-train-wagon-locomotive-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40' viewBox='0 0 80 40' fill='none'%3E%3Cpath d='M20,0.5 h40 a19.5,19.5 0 0 1 19.5,19.5 v0 a19.5,19.5 0 0 1 -19.5,19.5 h-40 a19.5,19.5 0 0 1 -19.5,-19.5 v0 a19.5,19.5 0 0 1 19.5,-19.5 z' stroke='%23000000' stroke-width='1'/%3E%3C/svg%3E%0A");
-  --sbb-train-wagon-wagon-end-right-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40' viewBox='0 0 80 40' fill='none'%3E%3Cpath d='M8.5,0.5 h51.5 a19.5,19.5 0 0 1 19.5,19.5 v0 a19.5,19.5 0 0 1 -19.5,19.5 h-51.5 a8,8 0 0 1 -8,-8 v-23 a8,8 0 0 1 8,-8 z' stroke='%23000000' stroke-width='1'/%3E%3C/svg%3E");
+.sbb-table-sticky {
+  position: sticky !important;
 }
 
-.sbb-overlay-outlet {
-  position: fixed;
+:is(.sbb-table-sticky-border-elem-left, .sbb-table-sticky-border-elem-right)::after {
+  content: "";
+  transition-timing-function: var(--sbb-table-sticky-shadow-transition-easing);
+  transition-duration: var(--sbb-table-sticky-shadow-transition-duration);
+  transition-property: visibility, opacity;
+  visibility: hidden;
+  opacity: 0;
+  position: absolute;
+  width: var(--sbb-table-sticky-shadow-width);
   inset: 0;
-  pointer-events: none;
 }
 
-sub {
-  bottom: -0.36em;
-}
+:is(.sbb-table-wrapper-offset-left, .sbb-table-wrapper-offset-both) .sbb-table-sticky-border-elem-left {
+  border-inline-end: var(--sbb-table-border);
+}
+:is(.sbb-table-wrapper-offset-left, .sbb-table-wrapper-offset-both) .sbb-table-sticky-border-elem-left::after {
+  visibility: visible;
+  opacity: 1;
+  background-image: linear-gradient(-270deg, rgba(0, 0, 0, 0.1) 0%, transparent 100%);
+  inset-inline-start: unset;
+  inset-inline-end: calc(var(--sbb-table-sticky-shadow-width) * -1 - 1px);
+}
 
-sup {
-  top: -0.5em;
+:is(.sbb-table-wrapper-offset-right, .sbb-table-wrapper-offset-both) .sbb-table-sticky-border-elem-right {
+  border-inline-start: var(--sbb-table-border);
+}
+:is(.sbb-table-wrapper-offset-right, .sbb-table-wrapper-offset-both) .sbb-table-sticky-border-elem-right::after {
+  visibility: visible;
+  opacity: 1;
+  background-image: linear-gradient(270deg, rgba(0, 0, 0, 0.1) 0%, transparent 100%);
+  inset-inline-start: calc(var(--sbb-table-sticky-shadow-width) * -1 - 1px);
+  inset-inline-end: unset;
 }
 
-.sbb-text-xxs,
-.sbb-text-xs,
-.sbb-text-s,
-.sbb-text-m,
-.sbb-text-l,
-.sbb-text-xl {
-  font-family: var(--sbb-typo-font-family);
+.sbb-table-align-start {
+  text-align: start;
+}
+
+.sbb-table-align-center {
+  text-align: center;
+}
+
+.sbb-table-align-end {
+  text-align: end;
+}
+
+.sbb-table-align-justify {
+  text-align: justify;
+}
+
+.sbb-table-align-left {
+  text-align: left;
+}
+
+.sbb-table-align-right {
+  text-align: right;
+}
+
+sbb-tab-nav-bar .sbb-tab-amount {
+  margin: 0;
+  color: var(--sbb-tab-label-amount-color);
   font-weight: normal;
-  line-height: var(--sbb-typo-line-height-text);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
-  font-size: var(--sbb-text-font-size);
+  text-decoration: var(--sbb-tab-label-text-decoration);
 }
 
-.sbb-text-xxs {
-  --sbb-text-font-size: var(--sbb-text-font-size-xxs);
+:is(sbb-teaser, sbb-teaser-hero, sbb-teaser-product) {
+  --sbb-teaser-image-brightness-hover: var(--sbb-hover-image-brightness);
+  --sbb-teaser-image-animation-duration: var(
+    --sbb-disable-animation-duration,
+    var(--sbb-animation-duration-4x)
+  );
+  --sbb-teaser-image-animation-easing: var(--sbb-animation-easing);
+}
+@media (any-hover: hover) {
+  :is(sbb-teaser, sbb-teaser-hero, sbb-teaser-product):hover {
+    --sbb-teaser-image-brightness: var(--sbb-teaser-image-brightness-hover);
+  }
+}
+:is(sbb-teaser, sbb-teaser-hero, sbb-teaser-product) :is(sbb-image, img):not(.sbb-figure-overlap-image) {
+  will-change: filter, scale;
+  filter: brightness(var(--sbb-teaser-image-brightness, 1));
+  transition: filter, scale var(--sbb-teaser-image-animation-duration) var(--sbb-teaser-image-animation-easing);
 }
 
-.sbb-text-xs {
-  --sbb-text-font-size: var(--sbb-text-font-size-xs);
+sbb-teaser :is(sbb-image, img):not(.sbb-figure-overlap-image) {
+  --sbb-image-object-fit: cover;
+  --sbb-image-aspect-ratio: 4 / 3;
+  scale: var(--sbb-teaser-scale, 1);
 }
 
-.sbb-text-s {
-  --sbb-text-font-size: var(--sbb-text-font-size-s);
+sbb-teaser-hero :is(sbb-image, img):not(.sbb-figure-overlap-image) {
+  --sbb-image-aspect-ratio: 1 / 1;
+  border-radius: 0;
+}
+@media (min-width: calc(37.5rem)) {
+  sbb-teaser-hero :is(sbb-image, img):not(.sbb-figure-overlap-image) {
+    --sbb-image-aspect-ratio: 16 / 9;
+  }
+}
+sbb-teaser-hero img:not(.sbb-figure-overlap-image) {
+  display: block;
+  align-self: stretch;
+  width: 100%;
 }
 
-.sbb-text-m {
-  --sbb-text-font-size: var(--sbb-text-font-size-m);
+:is(sbb-teaser-product, sbb-teaser-product-static) :is(sbb-image, img):not(.sbb-figure-overlap-image) {
+  border-radius: 0;
+  --sbb-image-object-fit: cover;
+  --sbb-image-aspect-ratio: 16 / 9;
+}
+:is(sbb-teaser-product, sbb-teaser-product-static) img:not(.sbb-figure-overlap-image) {
+  place-self: stretch;
 }
 
-.sbb-text-l {
-  --sbb-text-font-size: var(--sbb-text-font-size-l);
+.sbb-timetable-form {
+  --sbb-timetable-form-content-max-width: 46.25rem;
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  column-gap: var(--sbb-spacing-fixed-3x);
+  border-radius: var(--sbb-border-radius-4x);
+  padding-block: var(--sbb-spacing-fixed-10x) var(--sbb-spacing-responsive-l);
+  padding-inline: var(--sbb-spacing-fixed-5x);
+  background: linear-gradient(to bottom, var(--sbb-color-primary) 0 11.125rem, var(--sbb-background-color-3) 11.125rem 100%);
+}
+@media (max-width: calc(63.9375rem)) {
+  .sbb-timetable-form:has(sbb-signet) {
+    padding-block-start: var(--sbb-spacing-fixed-4x);
+  }
+}
+.sbb-timetable-form sbb-signet {
+  width: var(--sbb-spacing-fixed-16x);
+  align-self: end;
+  margin-block-end: var(--sbb-spacing-fixed-2x);
+  margin-inline: 0;
+}
+@media (min-width: calc(64rem)) {
+  .sbb-timetable-form sbb-signet {
+    position: absolute;
+    inset-block-start: var(--sbb-spacing-fixed-6x);
+    inset-inline-end: var(--sbb-spacing-fixed-6x);
+  }
+}
+.sbb-timetable-form > * {
+  margin-inline: auto;
+  max-width: var(--sbb-timetable-form-content-max-width);
+  width: 100%;
 }
 
-.sbb-text-xl {
-  --sbb-text-font-size: var(--sbb-text-font-size-xl);
+sbb-timetable-form sbb-date-input {
+  min-width: 8.3125rem;
+}
+sbb-timetable-form :is(.sbb-timetable-form-block, .sbb-timetable-form-mobile-block) {
+  --sbb-form-field-focus-underline-z-index: 1;
+  width: 100%;
+  position: relative;
+}
+sbb-timetable-form :is(.sbb-timetable-form-block, .sbb-timetable-form-mobile-block)::after {
+  content: "";
+  position: absolute;
+  border-block-end: var(--sbb-border-width-1x) solid var(--sbb-border-color-4-inverted);
+  inset-inline: var(--sbb-form-field-padding-inline);
+  inset-block-end: 0;
+}
+sbb-timetable-form :is(.sbb-timetable-form-block, .sbb-timetable-form-mobile-block) sbb-datepicker-toggle {
+  margin-inline-end: var(--sbb-spacing-fixed-6x);
+}
+@media (min-width: calc(37.5rem)) {
+  sbb-timetable-form .sbb-timetable-form-mobile-block {
+    width: unset;
+  }
+  sbb-timetable-form .sbb-timetable-form-mobile-block::after {
+    display: none;
+  }
+  sbb-timetable-form .sbb-timetable-form-mobile-block sbb-datepicker-toggle {
+    margin-inline-end: unset;
+  }
+}
+@media (max-width: calc(37.4375rem)) {
+  sbb-timetable-form .sbb-timetable-form-mobile-hidden {
+    display: none;
+  }
 }
 
-.sbb-text--bold {
-  font-weight: bold;
+sbb-title + p {
+  margin-block-start: 0;
 }
 
-.sbb-legend {
-  --sbb-text-font-size: var(--sbb-text-font-size-xs);
-  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);
-  font-size: var(--sbb-text-font-size);
-  padding: 0;
-  color: var(--sbb-color-granite);
-  color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
+sbb-toggle:has(: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);
 }
 
 .sbb-screen-reader-only {
@@ -2795,50 +2888,15 @@ sup {
   width: 1px;
 }
 
-.sbb-focus-outline:focus-visible {
+:is(.sbb-focus-outline, .sbb-focus-outline-dark):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);
 }
 
 .sbb-focus-outline-dark: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);
   --sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);
 }
 
-[sbb-badge] {
-  --sbb-badge-position-offset: calc(var(--sbb-spacing-fixed-2x) * -1);
-  position: relative;
-}
-[sbb-badge]::after {
-  --sbb-text-font-size: var(--sbb-text-font-size-xxs);
-  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);
-  font-size: var(--sbb-text-font-size);
-  font-weight: bold;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding-inline: var(--sbb-spacing-fixed-1x);
-  border-radius: var(--sbb-border-radius-infinity);
-  background-color: var(--sbb-color-primary);
-  color: var(--sbb-color-1-negative);
-  min-width: var(--sbb-spacing-fixed-4x);
-  max-height: var(--sbb-spacing-fixed-4x);
-  outline: var(--sbb-border-width-1x) solid transparent;
-  content: attr(sbb-badge);
-  position: absolute;
-  inset-block-start: var(--sbb-badge-position-offset);
-}
-[sbb-badge]:where([sbb-badge-position=before])::after {
-  inset-inline-start: var(--sbb-badge-position-offset);
-}
-[sbb-badge]:where(:not([sbb-badge-position]), [sbb-badge-position=after])::after {
-  inset-inline-end: var(--sbb-badge-position-offset);
-}
-
 .sbb-disable-animation {
   --sbb-disable-animation-duration: 0s;
 }
@@ -2846,6 +2904,7 @@ sup {
 .sbb-disable-animation-locally {
   --sbb-disable-animation-duration: 0s;
 }
+
 .sbb-disable-animation-locally > * {
   --sbb-disable-animation-duration: initial;
 }
@@ -2854,6 +2913,18 @@ sup {
   --sbb-disable-animation-duration: initial;
 }
 
+.sbb-dark {
+  color-scheme: dark;
+}
+
+.sbb-light {
+  color-scheme: light;
+}
+
+.sbb-light-dark {
+  color-scheme: light dark;
+}
+
 .sbb-figure {
   display: grid;
   grid-template-rows: auto;
@@ -2861,24 +2932,24 @@ sup {
   grid-auto-rows: auto;
   margin: 0;
 }
+
 .sbb-figure :is(img, sbb-image, .sbb-image):not(.sbb-figure-overlap-image) {
   grid-row: 1;
   grid-column: 1;
   width: 100%;
 }
+
 .sbb-figure :is(figcaption, .sbb-caption) {
   grid-row: 2;
   grid-column: 1;
   padding-block-start: var(--sbb-spacing-fixed-4x);
   color: var(--sbb-color-granite);
   color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
-  --sbb-text-font-size: var(--sbb-text-font-size-xs);
-  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);
-  font-size: var(--sbb-text-font-size);
+  font-size: var(--sbb-text-font-size-xs);
 }
+
 .sbb-figure :is(.sbb-figure-overlap-start-start,
 .sbb-figure-overlap-start-end,
 .sbb-figure-overlap-end-start,
@@ -2893,18 +2964,22 @@ sup {
   grid-row: 1;
   grid-column: 1;
 }
+
 .sbb-figure .sbb-figure-overlap-start-start {
   place-self: start start;
   justify-content: start;
 }
+
 .sbb-figure .sbb-figure-overlap-start-end {
   place-self: start end;
   justify-content: end;
 }
+
 .sbb-figure .sbb-figure-overlap-end-start {
   place-self: end start;
   justify-content: start;
 }
+
 .sbb-figure .sbb-figure-overlap-end-end {
   place-self: end end;
   justify-content: end;
@@ -2976,13 +3051,13 @@ sup {
   margin-inline: auto;
   width: 100%;
 }
+
 @media (min-width: calc(90rem)) {
   .sbb-grid,
   .sbb-page-spacing {
     max-width: var(--sbb-spacing-max-width, calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)));
   }
 }
-
 .sbb-grid-expanded,
 .sbb-page-spacing-expanded {
   padding-inline: var(--sbb-page-spacing-padding, var(--sbb-spacing-responsive-xxs));
@@ -3001,39 +3076,70 @@ sup {
   grid-template-columns: repeat(var(--sbb-grid-base-columns), 1fr);
 }
 
-.sbb-list:where(ol, ul) {
-  --sbb-list-vertical-gap: 0.75em;
-  --sbb-list-padding-inline-start: 1.5em;
+.sbb-orientation-vertical,
+.sbb-orientation-horizontal-from-small,
+.sbb-orientation-horizontal-from-large,
+.sbb-orientation-horizontal-from-ultra {
+  display: flex;
+  flex-direction: column;
 }
+
+@media (min-width: calc(37.5rem)) {
+  .sbb-orientation-horizontal-from-small {
+    flex-direction: row;
+  }
+}
+@media (min-width: calc(64rem)) {
+  .sbb-orientation-horizontal-from-large {
+    flex-direction: row;
+  }
+}
+@media (min-width: calc(90rem)) {
+  .sbb-orientation-horizontal-from-ultra {
+    flex-direction: row;
+  }
+}
+.sbb-list:where(ol, ul) {
+  --sbb-list-vertical-gap: 0.75em;
+  --sbb-list-padding-inline-start: 1.5em;
+}
+
 .sbb-list:where(ol, ul),
 .sbb-list:where(ol, ul) :is(ol, ul) {
   margin: 0;
   padding: 0;
   padding-inline-start: var(--sbb-list-padding-inline-start);
 }
+
 .sbb-list:where(ol, ul) > li + li,
 .sbb-list:where(ol, ul) :is(ol, ul) > li + li {
   margin-block-start: var(--sbb-list-vertical-gap);
 }
+
 .sbb-list:where(ol, ul) > li p,
 .sbb-list:where(ol, ul) :is(ol, ul) > li p {
   margin-block: 0;
 }
+
 .sbb-list:where(ol, ul) > li > * + p,
 .sbb-list:where(ol, ul) :is(ol, ul) > li > * + p {
   margin-block-start: var(--sbb-spacing-responsive-xxxs);
 }
+
 .sbb-list:where(ol, ul) :is(ul, ol), .sbb-step-list .sbb-list:where(ol, ul) {
   margin-block-start: var(--sbb-list-vertical-gap);
 }
+
 .sbb-list:where(ul),
 .sbb-list:where(ul) ul {
   list-style-type: none;
 }
+
 .sbb-list:where(ul) > li,
 .sbb-list:where(ul) ul > li {
   position: relative;
 }
+
 .sbb-list:where(ul) > li::before,
 .sbb-list:where(ul) ul > li::before {
   content: "•";
@@ -3047,19 +3153,18 @@ sup {
   inset-inline-start: calc(-1 * (0.5 * var(--sbb-list-padding-inline-start) + 0.5em));
   transform: scale(1.3);
 }
+
 .sbb-list:where(dl) {
-  --sbb-text-font-size: var(--sbb-text-font-size-s);
-  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);
-  font-size: var(--sbb-text-font-size);
+  font-size: var(--sbb-text-font-size-s);
   margin: 0;
   padding: 0;
   display: grid;
   grid-template-columns: auto minmax(20%, 1fr);
   gap: var(--sbb-spacing-fixed-1x) var(--sbb-spacing-fixed-2x);
 }
+
 .sbb-list:where(dl) :is(dt, dd) {
   margin: 0;
   padding: 0;
@@ -3086,12 +3191,15 @@ sup {
   counter-reset: steps;
   color: var(--sbb-step-list-color);
 }
+
 .sbb-step-list:where(.sbb-text-s) {
   --sbb-step-list-padding-block: var(--sbb-spacing-fixed-4x);
 }
+
 .sbb-step-list:where(.sbb-text-m, .sbb-text-l, .sbb-text-xl) {
   --sbb-step-list-padding-block: var(--sbb-spacing-fixed-5x);
 }
+
 @media (min-width: calc(64rem)) {
   .sbb-step-list:where(.sbb-text-xl) {
     --sbb-step-list-dimensions: 2.5625rem;
@@ -3105,14 +3213,8 @@ sup {
   padding-inline: calc(var(--sbb-step-list-padding-inline) + var(--sbb-step-list-dimensions) + var(--sbb-step-list-to-text-gap)) var(--sbb-step-list-padding-inline);
   min-height: calc(var(--sbb-step-list-dimensions) + 2 * var(--sbb-step-list-padding-block));
 }
+
 .sbb-step-list > li::before {
-  --sbb-text-font-size: var(--sbb-text-font-size-xxs);
-  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);
-  font-size: var(--sbb-text-font-size);
-  font-weight: bold;
   content: counter(steps);
   position: absolute;
   display: flex;
@@ -3126,20 +3228,29 @@ sup {
   border: var(--sbb-border-width-1x) solid var(--sbb-color-cement);
   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);
+  font-size: var(--sbb-text-font-size-xxs);
+  font-weight: bold;
 }
+
 .sbb-step-list > li + li {
   margin-block-start: var(--sbb-step-list-vertical-gap);
 }
+
 .sbb-step-list > li p {
   margin-block: 0;
 }
+
 .sbb-step-list > li > * + p {
   margin-block-start: var(--sbb-spacing-responsive-xxxs);
 }
+
 .sbb-step-list > li:first-of-type {
   border-start-start-radius: var(--sbb-step-list-border-radius);
   border-start-end-radius: var(--sbb-step-list-border-radius);
 }
+
 .sbb-step-list > li:last-of-type {
   border-end-start-radius: var(--sbb-step-list-border-radius);
   border-end-end-radius: var(--sbb-step-list-border-radius);
@@ -3162,20 +3273,25 @@ sup {
   margin: 0;
   padding: 0;
 }
+
 .sbb-icon-list > li {
   position: relative;
   padding-inline: calc(var(--sbb-icon-list-dimensions) + var(--sbb-icon-list-to-text-gap)) 0;
   min-height: var(--sbb-icon-list-dimensions);
 }
+
 .sbb-icon-list > li + li {
   margin-block-start: var(--sbb-icon-list-vertical-gap);
 }
+
 .sbb-icon-list > li p {
   margin-block: 0;
 }
+
 .sbb-icon-list > li > * + p {
   margin-block-start: var(--sbb-spacing-responsive-xxxs);
 }
+
 .sbb-icon-list > li::before {
   content: "";
   position: absolute;
@@ -3189,542 +3305,205 @@ sup {
   mask-position: center;
   mask-size: 100%;
 }
+
 @media (forced-colors: active) {
   .sbb-icon-list > li::before {
     background-color: CanvasText;
   }
 }
-
-.sbb-scrollbar,
+:is(.sbb-scrollbar,
 .sbb-scrollbar-negative,
 .sbb-scrollbar-thick,
 .sbb-scrollbar-thick-negative,
 .sbb-scrollbar-track-visible,
 .sbb-scrollbar-negative-track-visible,
 .sbb-scrollbar-thick-track-visible,
-.sbb-scrollbar-thick-negative-track-visible {
+.sbb-scrollbar-thick-negative-track-visible) {
   --sbb-scrollbar-width: var(--sbb-spacing-fixed-3x);
+  --sbb-scrollbar-thumb-width: 0.125rem;
+  --sbb-scrollbar-thumb-width-hover: 0.25rem;
+  --sbb-scrollbar-width-firefox: thin;
+  --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);
+  --sbb-scrollbar-color: light-dark(
+    color-mix(in srgb, var(--sbb-color-black) 30%, transparent),
+    color-mix(in srgb, var(--sbb-color-white) 30%, transparent)
+  );
+  --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);
+  --sbb-scrollbar-color-hover: light-dark(
+    color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
+    color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
+  );
+  --sbb-scrollbar-track-color: transparent;
 }
-.sbb-scrollbar::-webkit-scrollbar,
-.sbb-scrollbar-negative::-webkit-scrollbar,
-.sbb-scrollbar-thick::-webkit-scrollbar,
-.sbb-scrollbar-thick-negative::-webkit-scrollbar,
-.sbb-scrollbar-track-visible::-webkit-scrollbar,
-.sbb-scrollbar-negative-track-visible::-webkit-scrollbar,
-.sbb-scrollbar-thick-track-visible::-webkit-scrollbar,
-.sbb-scrollbar-thick-negative-track-visible::-webkit-scrollbar {
+
+:is(.sbb-scrollbar,
+.sbb-scrollbar-negative,
+.sbb-scrollbar-thick,
+.sbb-scrollbar-thick-negative,
+.sbb-scrollbar-track-visible,
+.sbb-scrollbar-negative-track-visible,
+.sbb-scrollbar-thick-track-visible,
+.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar {
   width: var(--sbb-scrollbar-width);
   height: var(--sbb-scrollbar-width);
   background-color: var(--sbb-scrollbar-track-color, transparent);
 }
-.sbb-scrollbar::-webkit-scrollbar-corner,
-.sbb-scrollbar-negative::-webkit-scrollbar-corner,
-.sbb-scrollbar-thick::-webkit-scrollbar-corner,
-.sbb-scrollbar-thick-negative::-webkit-scrollbar-corner,
-.sbb-scrollbar-track-visible::-webkit-scrollbar-corner,
-.sbb-scrollbar-negative-track-visible::-webkit-scrollbar-corner,
-.sbb-scrollbar-thick-track-visible::-webkit-scrollbar-corner,
-.sbb-scrollbar-thick-negative-track-visible::-webkit-scrollbar-corner {
+
+:is(.sbb-scrollbar,
+.sbb-scrollbar-negative,
+.sbb-scrollbar-thick,
+.sbb-scrollbar-thick-negative,
+.sbb-scrollbar-track-visible,
+.sbb-scrollbar-negative-track-visible,
+.sbb-scrollbar-thick-track-visible,
+.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-corner {
   background-color: var(--sbb-scrollbar-track-color, transparent);
 }
-.sbb-scrollbar::-webkit-scrollbar-thumb,
-.sbb-scrollbar-negative::-webkit-scrollbar-thumb,
-.sbb-scrollbar-thick::-webkit-scrollbar-thumb,
-.sbb-scrollbar-thick-negative::-webkit-scrollbar-thumb,
-.sbb-scrollbar-track-visible::-webkit-scrollbar-thumb,
-.sbb-scrollbar-negative-track-visible::-webkit-scrollbar-thumb,
-.sbb-scrollbar-thick-track-visible::-webkit-scrollbar-thumb,
-.sbb-scrollbar-thick-negative-track-visible::-webkit-scrollbar-thumb {
+
+:is(.sbb-scrollbar,
+.sbb-scrollbar-negative,
+.sbb-scrollbar-thick,
+.sbb-scrollbar-thick-negative,
+.sbb-scrollbar-track-visible,
+.sbb-scrollbar-negative-track-visible,
+.sbb-scrollbar-thick-track-visible,
+.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-thumb {
   background-color: var(--sbb-scrollbar-color, currentcolor);
   border: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width))) solid transparent;
   border-radius: var(--sbb-border-radius-4x);
   background-clip: padding-box;
 }
-.sbb-scrollbar::-webkit-scrollbar-thumb:hover,
-.sbb-scrollbar-negative::-webkit-scrollbar-thumb:hover,
-.sbb-scrollbar-thick::-webkit-scrollbar-thumb:hover,
-.sbb-scrollbar-thick-negative::-webkit-scrollbar-thumb:hover,
-.sbb-scrollbar-track-visible::-webkit-scrollbar-thumb:hover,
-.sbb-scrollbar-negative-track-visible::-webkit-scrollbar-thumb:hover,
-.sbb-scrollbar-thick-track-visible::-webkit-scrollbar-thumb:hover,
-.sbb-scrollbar-thick-negative-track-visible::-webkit-scrollbar-thumb:hover {
+
+:is(.sbb-scrollbar,
+.sbb-scrollbar-negative,
+.sbb-scrollbar-thick,
+.sbb-scrollbar-thick-negative,
+.sbb-scrollbar-track-visible,
+.sbb-scrollbar-negative-track-visible,
+.sbb-scrollbar-thick-track-visible,
+.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-thumb:hover {
   background-color: var(--sbb-scrollbar-color-hover, currentcolor);
   border-width: calc(0.5 * (var(--sbb-scrollbar-width) - var(--sbb-scrollbar-thumb-width-hover)));
 }
-.sbb-scrollbar::-webkit-scrollbar-button, .sbb-scrollbar::-webkit-scrollbar-corner,
-.sbb-scrollbar-negative::-webkit-scrollbar-button,
-.sbb-scrollbar-negative::-webkit-scrollbar-corner,
-.sbb-scrollbar-thick::-webkit-scrollbar-button,
-.sbb-scrollbar-thick::-webkit-scrollbar-corner,
-.sbb-scrollbar-thick-negative::-webkit-scrollbar-button,
-.sbb-scrollbar-thick-negative::-webkit-scrollbar-corner,
-.sbb-scrollbar-track-visible::-webkit-scrollbar-button,
-.sbb-scrollbar-track-visible::-webkit-scrollbar-corner,
-.sbb-scrollbar-negative-track-visible::-webkit-scrollbar-button,
-.sbb-scrollbar-negative-track-visible::-webkit-scrollbar-corner,
-.sbb-scrollbar-thick-track-visible::-webkit-scrollbar-button,
-.sbb-scrollbar-thick-track-visible::-webkit-scrollbar-corner,
-.sbb-scrollbar-thick-negative-track-visible::-webkit-scrollbar-button,
-.sbb-scrollbar-thick-negative-track-visible::-webkit-scrollbar-corner {
+
+:is(.sbb-scrollbar,
+.sbb-scrollbar-negative,
+.sbb-scrollbar-thick,
+.sbb-scrollbar-thick-negative,
+.sbb-scrollbar-track-visible,
+.sbb-scrollbar-negative-track-visible,
+.sbb-scrollbar-thick-track-visible,
+.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-button, :is(.sbb-scrollbar,
+.sbb-scrollbar-negative,
+.sbb-scrollbar-thick,
+.sbb-scrollbar-thick-negative,
+.sbb-scrollbar-track-visible,
+.sbb-scrollbar-negative-track-visible,
+.sbb-scrollbar-thick-track-visible,
+.sbb-scrollbar-thick-negative-track-visible)::-webkit-scrollbar-corner {
   display: none;
 }
+
 @supports not selector(::-webkit-scrollbar) {
-  .sbb-scrollbar,
+  :is(.sbb-scrollbar,
   .sbb-scrollbar-negative,
   .sbb-scrollbar-thick,
   .sbb-scrollbar-thick-negative,
   .sbb-scrollbar-track-visible,
   .sbb-scrollbar-negative-track-visible,
   .sbb-scrollbar-thick-track-visible,
-  .sbb-scrollbar-thick-negative-track-visible {
+  .sbb-scrollbar-thick-negative-track-visible) {
     scrollbar-width: var(--sbb-scrollbar-width-firefox);
     scrollbar-color: var(--sbb-scrollbar-color, currentcolor) var(--sbb-scrollbar-track-color, transparent);
   }
 }
-
-.sbb-scrollbar {
-  --sbb-scrollbar-thumb-width: 0.125rem;
-  --sbb-scrollbar-thumb-width-hover: 0.25rem;
-  --sbb-scrollbar-width-firefox: thin;
-  --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);
-  --sbb-scrollbar-color: light-dark(
-    color-mix(in srgb, var(--sbb-color-black) 30%, transparent),
-    color-mix(in srgb, var(--sbb-color-white) 30%, transparent)
-  );
-  --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);
-  --sbb-scrollbar-color-hover: light-dark(
-    color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
-    color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
-  );
-  --sbb-scrollbar-track-color: transparent;
-}
-
-.sbb-scrollbar-negative {
-  --sbb-scrollbar-thumb-width: 0.125rem;
-  --sbb-scrollbar-thumb-width-hover: 0.25rem;
-  --sbb-scrollbar-width-firefox: thin;
+:is(.sbb-scrollbar-negative,
+.sbb-scrollbar-thick-negative,
+.sbb-scrollbar-negative-track-visible,
+.sbb-scrollbar-thick-negative-track-visible) {
   --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-white) 30%, transparent);
   --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-white) 60%, transparent);
-  --sbb-scrollbar-track-color: transparent;
 }
 
-.sbb-scrollbar-thick {
-  --sbb-scrollbar-thumb-width: 0.5rem;
-  --sbb-scrollbar-thumb-width-hover: var(--sbb-scrollbar-thumb-width);
-  --sbb-scrollbar-width-firefox: auto;
-  --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);
-  --sbb-scrollbar-color: light-dark(
-    color-mix(in srgb, var(--sbb-color-black) 30%, transparent),
-    color-mix(in srgb, var(--sbb-color-white) 30%, transparent)
-  );
-  --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);
-  --sbb-scrollbar-color-hover: light-dark(
-    color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
-    color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
-  );
-  --sbb-scrollbar-track-color: transparent;
-}
-
-.sbb-scrollbar-thick-negative {
+:is(.sbb-scrollbar-thick-negative,
+.sbb-scrollbar-thick,
+.sbb-scrollbar-thick-track-visible,
+.sbb-scrollbar-thick-negative-track-visible) {
   --sbb-scrollbar-thumb-width: 0.5rem;
   --sbb-scrollbar-thumb-width-hover: var(--sbb-scrollbar-thumb-width);
   --sbb-scrollbar-width-firefox: auto;
-  --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-white) 30%, transparent);
-  --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-white) 60%, transparent);
-  --sbb-scrollbar-track-color: transparent;
 }
 
-.sbb-scrollbar-track-visible {
-  --sbb-scrollbar-thumb-width: 0.125rem;
-  --sbb-scrollbar-thumb-width-hover: 0.25rem;
-  --sbb-scrollbar-width-firefox: thin;
-  --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);
-  --sbb-scrollbar-color: light-dark(
-    color-mix(in srgb, var(--sbb-color-black) 30%, transparent),
-    color-mix(in srgb, var(--sbb-color-white) 30%, transparent)
-  );
-  --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);
-  --sbb-scrollbar-color-hover: light-dark(
-    color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
-    color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
-  );
+:is(.sbb-scrollbar-track-visible, .sbb-scrollbar-thick-track-visible) {
   --sbb-scrollbar-track-color: var(--sbb-background-color-4);
 }
 
-.sbb-scrollbar-negative-track-visible {
-  --sbb-scrollbar-thumb-width: 0.125rem;
-  --sbb-scrollbar-thumb-width-hover: 0.25rem;
-  --sbb-scrollbar-width-firefox: thin;
-  --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-white) 30%, transparent);
-  --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-white) 60%, transparent);
+:is(.sbb-scrollbar-negative-track-visible, .sbb-scrollbar-thick-negative-track-visible) {
   --sbb-scrollbar-track-color: var(--sbb-background-color-4-negative);
 }
 
-.sbb-scrollbar-thick-track-visible {
-  --sbb-scrollbar-thumb-width: 0.5rem;
-  --sbb-scrollbar-thumb-width-hover: var(--sbb-scrollbar-thumb-width);
-  --sbb-scrollbar-width-firefox: auto;
-  --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-black) 30%, transparent);
-  --sbb-scrollbar-color: light-dark(
-    color-mix(in srgb, var(--sbb-color-black) 30%, transparent),
-    color-mix(in srgb, var(--sbb-color-white) 30%, transparent)
-  );
-  --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-black) 60%, transparent);
-  --sbb-scrollbar-color-hover: light-dark(
-    color-mix(in srgb, var(--sbb-color-black) 60%, transparent),
-    color-mix(in srgb, var(--sbb-color-white) 60%, transparent)
-  );
-  --sbb-scrollbar-track-color: var(--sbb-background-color-4);
+sub,
+sup {
+  font-size: 60%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
 }
 
-.sbb-scrollbar-thick-negative-track-visible {
-  --sbb-scrollbar-thumb-width: 0.5rem;
-  --sbb-scrollbar-thumb-width-hover: var(--sbb-scrollbar-thumb-width);
-  --sbb-scrollbar-width-firefox: auto;
-  --sbb-scrollbar-color: color-mix(in srgb, var(--sbb-color-white) 30%, transparent);
-  --sbb-scrollbar-color-hover: color-mix(in srgb, var(--sbb-color-white) 60%, transparent);
-  --sbb-scrollbar-track-color: var(--sbb-background-color-4-negative);
+sub {
+  bottom: -0.36em;
 }
 
-:root {
-  --sbb-table-border-color: var(--sbb-color-cloud);
-  --sbb-table-border-color: light-dark(var(--sbb-color-cloud), var(--sbb-color-anthracite));
-  --sbb-table-background-color: var(--sbb-background-color-1);
-  --sbb-table-row-striped-color: var(--sbb-background-color-3);
-  --sbb-table-color: var(--sbb-color-1);
-  --sbb-table-caption-color: var(--sbb-color-granite);
-  --sbb-table-caption-color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
-  --sbb-table-caption-margin-block-start: var(--sbb-spacing-fixed-4x);
-  --sbb-table-sticky-shadow-width: 3rem;
-  --sbb-table-sticky-shadow-transition-easing: var(--sbb-animation-easing);
-  --sbb-table-header-cell-font-size: var(--sbb-text-font-size-xs);
-  --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
-  --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
-  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
-  --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
-  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
+sup {
+  top: -0.5em;
 }
 
-.sbb-table,
-.sbb-table-m,
-.sbb-table-s,
-.sbb-table-xs {
-  --sbb-table-border: var(--sbb-border-width-1x) solid var(--sbb-table-border-color);
-  --sbb-table-sticky-shadow-transition-duration: var(
-    --sbb-disable-animation-duration,
-    var(--sbb-animation-duration-6x)
-  );
-  border-spacing: 0;
-  caption-side: bottom;
-  color: var(--sbb-table-color);
-  table-layout: auto;
-  text-align: left;
-}
-.sbb-table th,
-.sbb-table-m th,
-.sbb-table-s th,
-.sbb-table-xs th {
-  font-size: var(--sbb-table-header-cell-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
-  font-weight: bold;
-  background-color: var(--sbb-table-background-color);
-  border-block-end: var(--sbb-table-border);
-  border-inline-end: var(--sbb-table-border);
-  padding-block: var(--sbb-table-header-padding-block);
-  padding-inline: var(--sbb-table-header-padding-inline);
-}
-.sbb-table td,
-.sbb-table-m td,
-.sbb-table-s td,
-.sbb-table-xs td {
-  font-size: var(--sbb-table-data-cell-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
-  background-color: var(--sbb-table-background-color);
-  border-block-end: var(--sbb-table-border);
-  border-inline-end: var(--sbb-table-border);
-  padding-block: var(--sbb-table-cell-padding-block);
-  padding-inline: var(--sbb-table-cell-padding-inline);
-}
-.sbb-table :is(th, td).sbb-table-group-with-next,
-.sbb-table-m :is(th, td).sbb-table-group-with-next,
-.sbb-table-s :is(th, td).sbb-table-group-with-next,
-.sbb-table-xs :is(th, td).sbb-table-group-with-next {
-  border-inline-end: none;
-}
-.sbb-table :is(th, td):first-child,
-.sbb-table-m :is(th, td):first-child,
-.sbb-table-s :is(th, td):first-child,
-.sbb-table-xs :is(th, td):first-child {
-  border-inline-start: var(--sbb-table-border);
-}
-.sbb-table tbody tr:nth-child(odd) :is(th, td),
-.sbb-table-m tbody tr:nth-child(odd) :is(th, td),
-.sbb-table-s tbody tr:nth-child(odd) :is(th, td),
-.sbb-table-xs tbody tr:nth-child(odd) :is(th, td) {
-  background-color: var(--sbb-table-row-striped-color);
-}
-.sbb-table:has(thead tr) thead tr:first-of-type > :is(th, td), .sbb-table:not(:has(thead tr)) tbody tr:first-of-type > :is(th, td),
-.sbb-table-m:has(thead tr) thead tr:first-of-type > :is(th, td),
-.sbb-table-m:not(:has(thead tr)) tbody tr:first-of-type > :is(th, td),
-.sbb-table-s:has(thead tr) thead tr:first-of-type > :is(th, td),
-.sbb-table-s:not(:has(thead tr)) tbody tr:first-of-type > :is(th, td),
-.sbb-table-xs:has(thead tr) thead tr:first-of-type > :is(th, td),
-.sbb-table-xs:not(:has(thead tr)) tbody tr:first-of-type > :is(th, td) {
-  border-block-start: var(--sbb-table-border);
-}
-.sbb-table thead > tr:has(+ tr) > :is(th, td),
-.sbb-table-m thead > tr:has(+ tr) > :is(th, td),
-.sbb-table-s thead > tr:has(+ tr) > :is(th, td),
-.sbb-table-xs thead > tr:has(+ tr) > :is(th, td) {
-  border-block-end: none;
-}
-.sbb-table caption,
-.sbb-table-m caption,
-.sbb-table-s caption,
-.sbb-table-xs caption {
-  --sbb-table-caption-color-fallback: var(--sbb-color-granite);
-  --sbb-table-caption-color-fallback: light-dark(
-    var(--sbb-color-granite),
-    var(--sbb-color-cement)
-  );
-  font-size: var(--sbb-text-font-size-xs);
+.sbb-text-xxs,
+.sbb-text-xs,
+.sbb-text-s,
+.sbb-text-m,
+.sbb-text-l,
+.sbb-text-xl {
+  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);
-  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;
-}
-
-.sbb-table-m {
-  --sbb-table-data-cell-font-size: var(--sbb-text-font-size-s);
-  --sbb-table-header-padding-block: var(--sbb-spacing-fixed-3x);
-  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-4x);
-  --sbb-table-cell-padding-block: var(--sbb-spacing-responsive-xxxs);
-  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-4x);
-}
-
-html.sbb-lean .sbb-table:not(.sbb-table-xs, .sbb-table-m),
-.sbb-table-s {
-  --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
-  --sbb-table-header-padding-block: var(--sbb-spacing-fixed-1x);
-  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-2x);
-  --sbb-table-cell-padding-block: var(--sbb-spacing-fixed-1x);
-  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-2x);
-}
-
-.sbb-table-xs {
-  --sbb-table-data-cell-font-size: var(--sbb-text-font-size-xs);
-  --sbb-table-header-padding-block: 0;
-  --sbb-table-header-padding-inline: var(--sbb-spacing-fixed-1x);
-  --sbb-table-cell-padding-block: 0;
-  --sbb-table-cell-padding-inline: var(--sbb-spacing-fixed-1x);
+  font-size: var(--sbb-text-font-size);
 }
 
-sbb-table-wrapper[negative] .sbb-table,
-.sbb-table--negative {
-  --sbb-table-border-color: var(--sbb-color-anthracite);
-  --sbb-table-background-color: var(--sbb-background-color-1-negative);
-  --sbb-table-color: var(--sbb-color-1-negative);
-  --sbb-table-row-striped-color: var(--sbb-background-color-3-negative);
-  --sbb-table-caption-color: var(--sbb-color-cement);
+.sbb-text-xxs {
+  --sbb-text-font-size: var(--sbb-text-font-size-xxs);
 }
 
-.sbb-table--striped tbody tr:nth-child(odd) :is(th, td) {
-  background-color: var(--sbb-table-row-striped-color);
+.sbb-text-xs {
+  --sbb-text-font-size: var(--sbb-text-font-size-xs);
 }
 
-.sbb-table--unstriped tbody tr:nth-child(odd) :is(th, td) {
-  background-color: var(--sbb-table-background-color);
+.sbb-text-s {
+  --sbb-text-font-size: var(--sbb-text-font-size-s);
 }
 
-.sbb-table--theme-iron {
-  --sbb-table-cell-color: var(--sbb-color-4);
-}
-sbb-table-wrapper[negative] .sbb-table--theme-iron, .sbb-table--theme-iron.sbb-table--negative {
-  --sbb-table-cell-color: var(--sbb-color-cloud);
-}
-.sbb-table--theme-iron tbody > tr > td {
-  color: var(--sbb-table-cell-color);
+.sbb-text-m {
+  --sbb-text-font-size: var(--sbb-text-font-size-m);
 }
 
-.sbb-table-header-subtitle {
-  font-weight: normal;
+.sbb-text-l {
+  --sbb-text-font-size: var(--sbb-text-font-size-l);
 }
 
-.sbb-table-header-row:last-of-type > th {
-  border-block-end: var(--sbb-table-border);
+.sbb-text-xl {
+  --sbb-text-font-size: var(--sbb-text-font-size-xl);
 }
 
-.sbb-table-header-cell {
-  font-size: var(--sbb-table-header-cell-font-size);
-  letter-spacing: var(--sbb-typo-letter-spacing-text);
+.sbb-text--bold {
   font-weight: bold;
-  background-color: var(--sbb-table-background-color);
-  border-block-end: var(--sbb-table-border);
-  border-inline-end: var(--sbb-table-border);
-  padding-block: var(--sbb-table-header-padding-block);
-  padding-inline: var(--sbb-table-header-padding-inline);
-}
-
-.sbb-table-row--striped {
-  background-color: var(--sbb-table-row-striped-color);
 }
 
-.sbb-table-data-cell {
-  font-size: var(--sbb-table-data-cell-font-size);
+.sbb-legend {
+  line-height: var(--sbb-typo-line-height-text);
   letter-spacing: var(--sbb-typo-letter-spacing-text);
-  background-color: var(--sbb-table-background-color);
-  border-block-end: var(--sbb-table-border);
-  border-inline-end: var(--sbb-table-border);
-  padding-block: var(--sbb-table-cell-padding-block);
-  padding-inline: var(--sbb-table-cell-padding-inline);
-}
-
-.sbb-table-caption {
-  --sbb-table-caption-color-fallback: var(--sbb-color-granite);
-  --sbb-table-caption-color-fallback: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
   font-size: var(--sbb-text-font-size-xs);
-  letter-spacing: var(--sbb-typo-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;
-}
-
-.sbb-table-filter {
-  padding-block-start: 0 !important;
-}
-
-.sbb-table-sticky {
-  position: sticky !important;
-}
-
-:is(.sbb-table-sticky-border-elem-left, .sbb-table-sticky-border-elem-right)::after {
-  content: "";
-  transition-timing-function: var(--sbb-table-sticky-shadow-transition-easing);
-  transition-duration: var(--sbb-table-sticky-shadow-transition-duration);
-  transition-property: visibility, opacity;
-  visibility: hidden;
-  opacity: 0;
-  position: absolute;
-  width: var(--sbb-table-sticky-shadow-width);
-  inset: 0;
-}
-
-:is(.sbb-table-wrapper-offset-left, .sbb-table-wrapper-offset-both) .sbb-table-sticky-border-elem-left {
-  border-inline-end: var(--sbb-table-border);
-}
-:is(.sbb-table-wrapper-offset-left, .sbb-table-wrapper-offset-both) .sbb-table-sticky-border-elem-left::after {
-  visibility: visible;
-  opacity: 1;
-  background-image: linear-gradient(-270deg, rgba(0, 0, 0, 0.1) 0%, transparent 100%);
-  inset-inline-start: unset;
-  inset-inline-end: calc(var(--sbb-table-sticky-shadow-width) * -1 - 1px);
-}
-
-:is(.sbb-table-wrapper-offset-right, .sbb-table-wrapper-offset-both) .sbb-table-sticky-border-elem-right {
-  border-inline-start: var(--sbb-table-border);
-}
-:is(.sbb-table-wrapper-offset-right, .sbb-table-wrapper-offset-both) .sbb-table-sticky-border-elem-right::after {
-  visibility: visible;
-  opacity: 1;
-  background-image: linear-gradient(270deg, rgba(0, 0, 0, 0.1) 0%, transparent 100%);
-  inset-inline-start: calc(var(--sbb-table-sticky-shadow-width) * -1 - 1px);
-  inset-inline-end: unset;
-}
-
-.sbb-table-align-start {
-  text-align: start;
-}
-
-.sbb-table-align-center {
-  text-align: center;
-}
-
-.sbb-table-align-end {
-  text-align: end;
-}
-
-.sbb-table-align-justify {
-  text-align: justify;
-}
-
-.sbb-table-align-left {
-  text-align: left;
-}
-
-.sbb-table-align-right {
-  text-align: right;
-}
-
-.sbb-timetable-form {
-  --sbb-timetable-form-content-max-width: 46.25rem;
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  column-gap: var(--sbb-spacing-fixed-3x);
-  border-radius: var(--sbb-border-radius-4x);
-  padding-block: var(--sbb-spacing-fixed-10x) var(--sbb-spacing-responsive-l);
-  padding-inline: var(--sbb-spacing-fixed-5x);
-  background: linear-gradient(to bottom, var(--sbb-color-primary) 0 11.125rem, var(--sbb-background-color-3) 11.125rem 100%);
-}
-@media (max-width: calc(63.9375rem)) {
-  .sbb-timetable-form:has(sbb-signet) {
-    padding-block-start: var(--sbb-spacing-fixed-4x);
-  }
-}
-.sbb-timetable-form sbb-signet {
-  width: var(--sbb-spacing-fixed-16x);
-  align-self: end;
-  margin-block-end: var(--sbb-spacing-fixed-2x);
-  margin-inline: 0;
-}
-@media (min-width: calc(64rem)) {
-  .sbb-timetable-form sbb-signet {
-    position: absolute;
-    inset-block-start: var(--sbb-spacing-fixed-6x);
-    inset-inline-end: var(--sbb-spacing-fixed-6x);
-  }
-}
-.sbb-timetable-form > * {
-  margin-inline: auto;
-  max-width: var(--sbb-timetable-form-content-max-width);
-  width: 100%;
-}
-
-sbb-timetable-form sbb-date-input {
-  min-width: 8.3125rem;
-}
-sbb-timetable-form .sbb-timetable-form-block {
-  --sbb-form-field-focus-underline-z-index: 1;
-  width: 100%;
-  position: relative;
-}
-sbb-timetable-form .sbb-timetable-form-block::after {
-  content: "";
-  position: absolute;
-  border-block-end: var(--sbb-border-width-1x) solid var(--sbb-border-color-4-inverted);
-  inset-inline: var(--sbb-form-field-padding-inline);
-  inset-block-end: 0;
-}
-sbb-timetable-form .sbb-timetable-form-block sbb-datepicker-toggle {
-  margin-inline-end: var(--sbb-spacing-fixed-6x);
-}
-@media (max-width: calc(37.4375rem)) {
-  sbb-timetable-form .sbb-timetable-form-mobile-block {
-    --sbb-form-field-focus-underline-z-index: 1;
-    width: 100%;
-    position: relative;
-  }
-  sbb-timetable-form .sbb-timetable-form-mobile-block::after {
-    content: "";
-    position: absolute;
-    border-block-end: var(--sbb-border-width-1x) solid var(--sbb-border-color-4-inverted);
-    inset-inline: var(--sbb-form-field-padding-inline);
-    inset-block-end: 0;
-  }
-  sbb-timetable-form .sbb-timetable-form-mobile-block sbb-datepicker-toggle {
-    margin-inline-end: var(--sbb-spacing-fixed-6x);
-  }
-  sbb-timetable-form .sbb-timetable-form-mobile-hidden {
-    display: none;
-  }
+  padding: 0;
+  color: var(--sbb-color-granite);
+  color: light-dark(var(--sbb-color-granite), var(--sbb-color-cement));
 }