/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */
@layer properties {
  @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
    *, :before, :after, ::backdrop {
      --tw-rotate-x: initial;
      --tw-rotate-y: initial;
      --tw-rotate-z: initial;
      --tw-skew-x: initial;
      --tw-skew-y: initial;
      --tw-border-style: solid;
      --tw-blur: initial;
      --tw-brightness: initial;
      --tw-contrast: initial;
      --tw-grayscale: initial;
      --tw-hue-rotate: initial;
      --tw-invert: initial;
      --tw-opacity: initial;
      --tw-saturate: initial;
      --tw-sepia: initial;
      --tw-drop-shadow: initial;
      --tw-drop-shadow-color: initial;
      --tw-drop-shadow-alpha: 100%;
      --tw-drop-shadow-size: initial;
      --tw-shadow: 0 0 #0000;
      --tw-shadow-color: initial;
      --tw-shadow-alpha: 100%;
      --tw-inset-shadow: 0 0 #0000;
      --tw-inset-shadow-color: initial;
      --tw-inset-shadow-alpha: 100%;
      --tw-ring-color: initial;
      --tw-ring-shadow: 0 0 #0000;
      --tw-inset-ring-color: initial;
      --tw-inset-ring-shadow: 0 0 #0000;
      --tw-ring-inset: initial;
      --tw-ring-offset-width: 0px;
      --tw-ring-offset-color: #fff;
      --tw-ring-offset-shadow: 0 0 #0000;
    }
  }
}

@layer pretzel-assets {
  @font-face {
    font-display: swap;
    font-family: Storebrand Display;
    font-stretch: 100%;
    font-style: normal;
    font-weight: 400 700;
    src: url("/bank/lan/mine-boliger/assets/StorebrandDisplay-CA9Xw8Sr.woff2") format("woff2");
  }

  @font-face {
    font-display: swap;
    font-family: Storebrand Display;
    font-stretch: 100%;
    font-style: italic;
    font-weight: 400 700;
    src: url("/bank/lan/mine-boliger/assets/StorebrandDisplay-Italic-CqCcSe91.woff2") format("woff2");
  }

  @font-face {
    font-display: swap;
    font-family: Storebrand Text;
    font-stretch: 100%;
    font-style: normal;
    font-weight: 400 700;
    src: url("/bank/lan/mine-boliger/assets/StorebrandText-CYEBqy8k.woff2") format("woff2");
  }

  @font-face {
    font-display: swap;
    font-family: Storebrand Text;
    font-stretch: 100%;
    font-style: italic;
    font-weight: 400 700;
    src: url("/bank/lan/mine-boliger/assets/StorebrandText-Italic-D-ROECLA.woff2") format("woff2");
  }

  @font-face {
    font-family: Phosphor;
    src: url("/bank/lan/mine-boliger/assets/Phosphor-yX8TMCkv.eot") format("eot"), url("/bank/lan/mine-boliger/assets/Phosphor-BswXykKd.woff") format("woff"), url("/bank/lan/mine-boliger/assets/Phosphor-B8VTcgRP.woff2") format("woff2"), url("/bank/lan/mine-boliger/assets/Phosphor-Bx6cQLyT.ttf") format("truetype");
    text-rendering: optimizelegibility;
  }

  body[data-phosphor-icons="true"] i, body [data-phosphor-icons="true"] i, body i[data-phosphor-icons="true"] {
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-size: 1rem;
    font-style: normal;
    font-weight: normal;
    line-height: 1rem;
    font-family: Phosphor !important;
  }

  body {
    --p-system-icon-body-lg: 1.625rem;
    --p-system-icon-body: 1.375rem;
    --p-system-icon-body-sm: 1.25rem;
    --p-system-icon-body-details: 1rem;
  }

  @media (min-width: 600px) {
    body {
      --p-system-icon-body-lg: 1.75rem;
      --p-system-icon-body: 1.625rem;
      --p-system-icon-body-sm: 1.375rem;
      --p-system-icon-body-details: 1.125rem;
    }
  }

  @font-face {
    font-family: Storebrand Symbols;
    src: url("/bank/lan/mine-boliger/assets/StorebrandSymbols-Clo5b6po.eot") format("eot"), url("/bank/lan/mine-boliger/assets/StorebrandSymbols-CnO8nvkm.woff") format("woff"), url("/bank/lan/mine-boliger/assets/StorebrandSymbols-sTpV5J79.woff2") format("woff2"), url("/bank/lan/mine-boliger/assets/StorebrandSymbols-DDJ5M5C-.ttf") format("truetype");
    text-rendering: optimizelegibility;
  }

  i {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 1rem;
    font-style: normal;
    font-weight: normal;
    line-height: 1rem;
    font-family: Storebrand Symbols !important;
  }

  @font-face {
    font-family: System-Icons;
    src: url("/bank/lan/mine-boliger/assets/System-Icons-DXPlvFvc.eot") format("eot"), url("/bank/lan/mine-boliger/assets/System-Icons-Ck657884.woff") format("woff"), url("/bank/lan/mine-boliger/assets/System-Icons-CHTM6e44.woff2") format("woff2"), url("/bank/lan/mine-boliger/assets/System-Icons-JmO03J-H.ttf") format("truetype");
    text-rendering: optimizelegibility;
  }

  i.legacy, body[data-legacy-icons="true"] i {
    font-family: System-Icons !important;
  }

  :root, :host {
    --p-border-xsmall: 1px;
    --p-border-small: 2px;
    --p-border-medium: 3px;
    --p-border-large: 4px;
    --p-border-rem-xsmall: .0625rem;
    --p-border-rem-small: .125rem;
    --p-border-rem-medium: .1875rem;
    --p-border-rem-large: .25rem;
    --p-button-icon-desktop-xl: 2rem;
    --p-button-icon-desktop-lg: 1.5rem;
    --p-button-icon-desktop-md: 1.25rem;
    --p-button-icon-desktop-sm: 1.125rem;
    --p-button-icon-desktop-xsm: 1rem;
    --p-button-icon-mobile-xl: 1.125rem;
    --p-button-icon-mobile-lg: 1.125rem;
    --p-button-icon-mobile-md: 1.125rem;
    --p-button-icon-mobile-sm: 1.125rem;
    --p-button-icon-mobile-xsm: 1rem;
    --p-color-red-100: #fff0f0;
    --p-color-red-200: #ffdfdf;
    --p-color-red-300: #ffb8b8;
    --p-color-red-400: #fc9797;
    --p-color-red-500: #ff6c6c;
    --p-color-red-550: #ff5d5d;
    --p-color-red-600: #b20000;
    --p-color-red-700: #940000;
    --p-color-red-800: #700;
    --p-color-red-pale-800: #492727;
    --p-color-red-900: #560000;
    --p-color-red-1000: #310502;
    --p-color-purple-100: #f7f0ff;
    --p-color-purple-200: #f0deff;
    --p-color-purple-300: #e5ccff;
    --p-color-purple-400: #dbb8ff;
    --p-color-purple-500: #ce99ff;
    --p-color-purple-550: #ba6fff;
    --p-color-purple-600: #730099;
    --p-color-purple-700: #610080;
    --p-color-purple-800: #521264;
    --p-color-purple-pale-800: #472749;
    --p-color-purple-900: #410e44;
    --p-color-purple-1000: #29082b;
    --p-color-orange-100: #fff0eb;
    --p-color-orange-200: #ffe7e0;
    --p-color-orange-300: #ffc4b2;
    --p-color-orange-400: #ffa58f;
    --p-color-orange-500: #ff8468;
    --p-color-orange-600: #943100;
    --p-color-orange-pale-800: #493227;
    --p-color-grey-000: #fff;
    --p-color-grey-100: #f7f3f3;
    --p-color-grey-200: #e9e2e2;
    --p-color-grey-300: #d1c7c7;
    --p-color-grey-400: #b6a5a5;
    --p-color-grey-500: #9a8989;
    --p-color-grey-600: #7f6c6c;
    --p-color-grey-700: #5e5050;
    --p-color-grey-800: #3d3434;
    --p-color-grey-900: #2b2525;
    --p-color-grey-1000: #191515;
    --p-color-grey-cold-000: #fff;
    --p-color-grey-cold-100: #f2f1f4;
    --p-color-grey-cold-200: #e3e0e6;
    --p-color-grey-cold-300: #d1c7c7;
    --p-color-grey-cold-400: #afa5b6;
    --p-color-grey-cold-500: #93869c;
    --p-color-grey-cold-600: #776a81;
    --p-color-grey-cold-700: #584e5f;
    --p-color-grey-cold-800: #39323e;
    --p-color-grey-cold-900: #27222a;
    --p-color-grey-cold-1000: #171519;
    --p-color-logo-red: #da291c;
    --p-color-yellow-100: #fff7e6;
    --p-color-yellow-200: #fff0d1;
    --p-color-yellow-300: #ffe9bd;
    --p-color-yellow-400: #ffdb94;
    --p-color-yellow-500: #ffcf70;
    --p-color-yellow-600: #8f5f00;
    --p-color-yellow-700: #754e00;
    --p-color-yellow-800: #5c3d00;
    --p-color-yellow-pale-800: #433723;
    --p-color-yellow-900: #473000;
    --p-color-yellow-1000: #320;
    --p-color-green-100: #e6f9ec;
    --p-color-green-200: #d0f5dc;
    --p-color-green-300: #adebc1;
    --p-color-green-400: #88dda3;
    --p-color-green-500: #48cb71;
    --p-color-green-550: #30a956;
    --p-color-green-600: #1f6f3d;
    --p-color-green-700: #1a5b32;
    --p-color-green-800: #134425;
    --p-color-green-pale-800: #1e3828;
    --p-color-green-900: #10381e;
    --p-color-green-1000: #0b2816;
    --p-color-blue-100: #e1f2fe;
    --p-color-blue-200: #c9e7fd;
    --p-color-blue-300: #9dd2fb;
    --p-color-blue-400: #6cb5f9;
    --p-color-blue-500: #388fe5;
    --p-color-blue-600: #1f47ad;
    --p-color-blue-700: #17368c;
    --p-color-blue-800: #0b2365;
    --p-color-blue-pale-800: #273049;
    --p-color-blue-900: #001247;
    --p-color-blue-1000: #000a29;
    --p-color-focus-1: #00f;
    --p-color-scrim-1: #19151560;
    --p-corner-radius-none: 0px;
    --p-corner-radius-small: 8px;
    --p-corner-radius-medium: 12px;
    --p-corner-radius-large: 16px;
    --p-corner-radius-extreme: 999px;
    --p-corner-radius-rem-none: 0rem;
    --p-corner-radius-rem-small: .5rem;
    --p-corner-radius-rem-medium: .75rem;
    --p-corner-radius-rem-large: 1rem;
    --p-corner-radius-rem-extreme: 62.4375rem;
    --p-font-styles-size-12: 12px;
    --p-font-styles-size-14: 14px;
    --p-font-styles-size-16: 16px;
    --p-font-styles-size-18: 18px;
    --p-font-styles-size-20: 20px;
    --p-font-styles-size-24: 24px;
    --p-font-styles-size-28: 28px;
    --p-font-styles-size-32: 32px;
    --p-font-styles-size-36: 36px;
    --p-font-styles-size-40: 40px;
    --p-font-styles-size-64: 64px;
    --p-font-styles-line-height-desktop-14: 18px;
    --p-font-styles-line-height-desktop-16: 22px;
    --p-font-styles-line-height-desktop-18: 26px;
    --p-font-styles-line-height-desktop-20: 28px;
    --p-font-styles-line-height-desktop-24: 32px;
    --p-font-styles-line-height-desktop-32: 40px;
    --p-font-styles-line-height-desktop-40: 52px;
    --p-font-styles-line-height-desktop-64: 72px;
    --p-font-styles-line-height-mobile-12: 16px;
    --p-font-styles-line-height-mobile-14: 20px;
    --p-font-styles-line-height-mobile-16: 22px;
    --p-font-styles-line-height-mobile-18: 26px;
    --p-font-styles-line-height-mobile-20: 28px;
    --p-font-styles-line-height-mobile-24: 32px;
    --p-font-styles-line-height-mobile-28: 36px;
    --p-font-styles-line-height-mobile-36: 44px;
    --p-grid-column-04: 4px;
    --p-grid-column-08: 8px;
    --p-grid-column-12: 12px;
    --p-grid-margin-16: 16px;
    --p-grid-margin-24: 24px;
    --p-grid-gutter-16: 16px;
    --p-grid-gutter-24: 24px;
    --p-spacing-04: 4px;
    --p-spacing-08: 8px;
    --p-spacing-12: 12px;
    --p-spacing-16: 16px;
    --p-spacing-20: 20px;
    --p-spacing-24: 24px;
    --p-spacing-28: 28px;
    --p-spacing-32: 32px;
    --p-spacing-40: 40px;
    --p-spacing-48: 48px;
    --p-spacing-56: 56px;
    --p-spacing-64: 64px;
    --p-spacing-96: 96px;
    --p-spacing-rem-04: .25rem;
    --p-spacing-rem-08: .5rem;
    --p-spacing-rem-12: .75rem;
    --p-spacing-rem-16: 1rem;
    --p-spacing-rem-20: 1.25rem;
    --p-spacing-rem-24: 1.5rem;
    --p-spacing-rem-28: 1.75rem;
    --p-spacing-rem-32: 2rem;
    --p-spacing-rem-40: 2.5rem;
    --p-spacing-rem-48: 3rem;
    --p-spacing-rem-56: 3.5rem;
    --p-spacing-rem-64: 4rem;
    --p-spacing-rem-96: 6rem;
    --p-elevation-above-scrim: 0 0 15px 0 #00000040;
    --p-elevation-temporary: 0 4px 8px 0 #00000047;
    --p-elevation-overlay: 0 2px 4px 0 #00000038;
    --p-elevation-raised: 0 1px 3px 0 #0003;
    --p-section-away: var(--p-spacing-rem-64);
    --p-section-near: var(--p-spacing-rem-40);
    --p-subsection-away: var(--p-spacing-rem-24);
    --p-subsection-near: var(--p-spacing-rem-12);
    --p-heading-near: var(--p-spacing-rem-08);
    --p-body-away: var(--p-spacing-rem-12);
    --p-body-near: var(--p-spacing-rem-04);
  }

  @media (min-width: 600px) {
    :is(:root, :host) {
      --p-section-away: var(--p-spacing-rem-96);
      --p-section-near: var(--p-spacing-rem-48);
      --p-subsection-away: var(--p-spacing-rem-32);
      --p-subsection-near: var(--p-spacing-rem-16);
      --p-heading-near: var(--p-spacing-rem-12);
      --p-body-away: var(--p-spacing-rem-16);
      --p-body-near: var(--p-spacing-rem-04);
    }
  }

  .section-away {
    margin: var(--p-section-away) 0;
  }

  .section-away-top {
    margin-top: var(--p-section-away);
  }

  .section-away-bottom {
    margin-bottom: var(--p-section-away);
  }

  .section-near {
    margin: var(--p-section-near) 0;
  }

  .section-near-top {
    margin-top: var(--p-section-near);
  }

  .section-near-bottom {
    margin-bottom: var(--p-section-near);
  }

  .subsection-away {
    margin: var(--p-subsection-away) 0;
  }

  .subsection-away-top {
    margin-top: var(--p-subsection-away);
  }

  .subsection-away-bottom {
    margin-bottom: var(--p-subsection-away);
  }

  .subsection-near {
    margin: var(--p-subsection-near) 0;
  }

  .subsection-near-top {
    margin-top: var(--p-subsection-near);
  }

  .subsection-near-bottom {
    margin-bottom: var(--p-subsection-near);
  }

  .heading-near {
    margin: var(--p-heading-near) 0;
  }

  .heading-near-top {
    margin-top: var(--p-heading-near);
  }

  .heading-near-bottom {
    margin-bottom: var(--p-heading-near);
  }

  .body-away {
    margin: var(--p-body-away) 0;
  }

  .body-away-top {
    margin-top: var(--p-body-away);
  }

  .body-away-bottom {
    margin-bottom: var(--p-body-away);
  }

  .body-near {
    margin: var(--p-body-near) 0;
  }

  .body-near-top {
    margin-top: var(--p-body-near);
  }

  .body-near-bottom {
    margin-bottom: var(--p-body-near);
  }

  :root, :host {
    --p-transition-duration: .1s;
  }

  :root, :host, [data-theme="pretzel-light"] {
    --p-color-background: var(--p-color-grey-000);
    --p-color-background-white: var(--p-color-grey-000);
    --p-color-background-grey: var(--p-color-grey-100);
    --p-color-background-hover: var(--p-color-grey-100);
    --p-color-background-hover-white: var(--p-color-grey-100);
    --p-color-background-hover-grey: var(--p-color-grey-200);
    --p-color-background-pressed: var(--p-color-grey-200);
    --p-color-background-pressed-white: var(--p-color-grey-200);
    --p-color-background-pressed-grey: var(--p-color-grey-300);
    --p-color-background-active: var(--p-color-red-600);
    --p-color-background-active-white: var(--p-color-red-600);
    --p-color-background-active-grey: var(--p-color-red-600);
    --p-color-background-disabled: var(--p-color-grey-200);
    --p-color-background-disabled-white: var(--p-color-grey-200);
    --p-color-background-disabled-grey: var(--p-color-grey-300);
    --p-color-background-selected: var(--p-color-red-700);
    --p-color-background-selected-white: var(--p-color-red-700);
    --p-color-background-selected-grey: var(--p-color-red-700);
    --p-color-background-selected-hover: var(--p-color-red-800);
    --p-color-background-selected-hover-white: var(--p-color-red-800);
    --p-color-background-selected-hover-grey: var(--p-color-red-800);
    --p-color-background-selected-pressed: var(--p-color-red-900);
    --p-color-background-selected-pressed-white: var(--p-color-red-900);
    --p-color-background-selected-pressed-grey: var(--p-color-red-900);
    --p-color-text-primary: var(--p-color-red-1000);
    --p-color-text-primary-white: var(--p-color-red-1000);
    --p-color-text-primary-grey: var(--p-color-red-1000);
    --p-color-text-primary-hover: var(--p-color-red-800);
    --p-color-text-primary-hover-white: var(--p-color-red-800);
    --p-color-text-primary-hover-grey: var(--p-color-red-800);
    --p-color-text-primary-pressed: var(--p-color-red-700);
    --p-color-text-primary-pressed-white: var(--p-color-red-700);
    --p-color-text-primary-pressed-grey: var(--p-color-red-700);
    --p-color-text-primary-active: var(--p-color-red-700);
    --p-color-text-primary-active-white: var(--p-color-red-700);
    --p-color-text-primary-active-grey: var(--p-color-red-700);
    --p-color-text-interactive: var(--p-color-red-600);
    --p-color-text-interactive-white: var(--p-color-red-600);
    --p-color-text-interactive-grey: var(--p-color-red-600);
    --p-color-text-interactive-hover: var(--p-color-red-700);
    --p-color-text-interactive-hover-white: var(--p-color-red-700);
    --p-color-text-interactive-hover-grey: var(--p-color-red-700);
    --p-color-text-interactive-pressed: var(--p-color-red-800);
    --p-color-text-interactive-pressed-white: var(--p-color-red-800);
    --p-color-text-interactive-pressed-grey: var(--p-color-red-800);
    --p-color-text-interactive-active: var(--p-color-red-800);
    --p-color-text-interactive-active-white: var(--p-color-red-800);
    --p-color-text-interactive-active-grey: var(--p-color-red-800);
    --p-color-text-selected: var(--p-color-red-700);
    --p-color-text-selected-white: var(--p-color-red-700);
    --p-color-text-selected-grey: var(--p-color-red-700);
    --p-color-text-selected-hover: var(--p-color-red-800);
    --p-color-text-selected-hover-white: var(--p-color-red-800);
    --p-color-text-selected-hover-grey: var(--p-color-red-800);
    --p-color-text-selected-pressed: var(--p-color-red-900);
    --p-color-text-selected-pressed-white: var(--p-color-red-900);
    --p-color-text-selected-pressed-grey: var(--p-color-red-900);
    --p-color-text-secondary: var(--p-color-grey-700);
    --p-color-text-secondary-white: var(--p-color-grey-700);
    --p-color-text-secondary-grey: var(--p-color-grey-700);
    --p-color-text-placeholder: var(--p-color-grey-600);
    --p-color-text-placeholder-white: var(--p-color-grey-600);
    --p-color-text-placeholder-grey: var(--p-color-grey-600);
    --p-color-text-on-color: var(--p-color-red-100);
    --p-color-text-on-color-white: var(--p-color-red-100);
    --p-color-text-on-color-grey: var(--p-color-red-100);
    --p-color-text-disabled: var(--p-color-grey-400);
    --p-color-text-disabled-white: var(--p-color-grey-400);
    --p-color-text-disabled-grey: var(--p-color-grey-500);
    --p-color-text-info: var(--p-color-blue-600);
    --p-color-text-info-white: var(--p-color-blue-600);
    --p-color-text-info-grey: var(--p-color-blue-600);
    --p-color-text-success: var(--p-color-green-600);
    --p-color-text-success-white: var(--p-color-green-600);
    --p-color-text-success-grey: var(--p-color-green-600);
    --p-color-text-warning: var(--p-color-yellow-600);
    --p-color-text-warning-white: var(--p-color-yellow-600);
    --p-color-text-warning-grey: var(--p-color-yellow-600);
    --p-color-text-error: var(--p-color-red-600);
    --p-color-text-error-white: var(--p-color-red-600);
    --p-color-text-error-grey: var(--p-color-red-600);
    --p-color-text-alert: var(--p-color-grey-900);
    --p-color-text-alert-white: var(--p-color-grey-900);
    --p-color-text-alert-grey: var(--p-color-grey-900);
    --p-color-text-on-brand: var(--p-color-red-100);
    --p-color-text-on-brand-white: var(--p-color-red-100);
    --p-color-text-on-brand-grey: var(--p-color-red-100);
    --p-color-text-on-error: var(--p-color-red-800);
    --p-color-text-on-info: var(--p-color-blue-800);
    --p-color-text-on-warning: var(--p-color-yellow-800);
    --p-color-text-on-success: var(--p-color-green-800);
    --p-color-text-on-purple: var(--p-color-purple-800);
    --p-color-text-on-orange: var(--p-color-red-800);
    --p-color-icon-primary: var(--p-color-red-1000);
    --p-color-icon-primary-white: var(--p-color-red-1000);
    --p-color-icon-primary-grey: var(--p-color-red-1000);
    --p-color-icon-primary-hover: var(--p-color-red-800);
    --p-color-icon-primary-hover-white: var(--p-color-red-800);
    --p-color-icon-primary-hover-grey: var(--p-color-red-800);
    --p-color-icon-primary-active: var(--p-color-red-700);
    --p-color-icon-primary-active-white: var(--p-color-red-700);
    --p-color-icon-primary-active-grey: var(--p-color-red-700);
    --p-color-icon-primary-pressed: var(--p-color-red-700);
    --p-color-icon-primary-pressed-white: var(--p-color-red-700);
    --p-color-icon-primary-pressed-grey: var(--p-color-red-700);
    --p-color-icon-interactive: var(--p-color-red-600);
    --p-color-icon-interactive-white: var(--p-color-red-600);
    --p-color-icon-interactive-grey: var(--p-color-red-600);
    --p-color-icon-interactive-hover: var(--p-color-red-700);
    --p-color-icon-interactive-hover-white: var(--p-color-red-700);
    --p-color-icon-interactive-hover-grey: var(--p-color-red-700);
    --p-color-icon-interactive-pressed: var(--p-color-red-800);
    --p-color-icon-interactive-pressed-white: var(--p-color-red-800);
    --p-color-icon-interactive-pressed-grey: var(--p-color-red-800);
    --p-color-icon-interactive-active: var(--p-color-red-800);
    --p-color-icon-interactive-active-white: var(--p-color-red-800);
    --p-color-icon-interactive-active-grey: var(--p-color-red-800);
    --p-color-icon-on-color: var(--p-color-red-100);
    --p-color-icon-on-color-white: var(--p-color-red-100);
    --p-color-icon-on-color-grey: var(--p-color-red-100);
    --p-color-icon-disabled: var(--p-color-grey-400);
    --p-color-icon-disabled-white: var(--p-color-grey-400);
    --p-color-icon-disabled-grey: var(--p-color-grey-500);
    --p-color-icon-error: var(--p-color-red-600);
    --p-color-icon-error-white: var(--p-color-red-600);
    --p-color-icon-error-grey: var(--p-color-red-600);
    --p-color-icon-success: var(--p-color-green-600);
    --p-color-icon-success-white: var(--p-color-green-600);
    --p-color-icon-success-grey: var(--p-color-green-600);
    --p-color-icon-warning: var(--p-color-yellow-600);
    --p-color-icon-warning-white: var(--p-color-yellow-600);
    --p-color-icon-warning-grey: var(--p-color-yellow-600);
    --p-color-icon-info: var(--p-color-blue-600);
    --p-color-icon-info-white: var(--p-color-blue-600);
    --p-color-icon-info-grey: var(--p-color-blue-600);
    --p-color-icon-neutral: var(--p-color-grey-900);
    --p-color-icon-neutral-white: var(--p-color-grey-900);
    --p-color-icon-neutral-grey: var(--p-color-grey-900);
    --p-color-icon-on-brand: var(--p-color-red-100);
    --p-color-icon-on-brand-white: var(--p-color-red-100);
    --p-color-icon-on-brand-grey: var(--p-color-red-100);
    --p-color-icon-on-error: var(--p-color-red-800);
    --p-color-icon-on-info: var(--p-color-blue-800);
    --p-color-icon-on-warning: var(--p-color-yellow-800);
    --p-color-icon-on-success: var(--p-color-green-800);
    --p-color-icon-on-purple: var(--p-color-purple-800);
    --p-color-icon-on-orange: var(--p-color-red-800);
    --p-color-button-brand-fill: var(--p-color-red-600);
    --p-color-button-brand-fill-white: var(--p-color-red-600);
    --p-color-button-brand-fill-grey: var(--p-color-red-600);
    --p-color-button-brand-fill-hover: var(--p-color-red-700);
    --p-color-button-brand-fill-hover-white: var(--p-color-red-700);
    --p-color-button-brand-fill-hover-grey: var(--p-color-red-700);
    --p-color-button-brand-fill-pressed: var(--p-color-red-800);
    --p-color-button-brand-fill-pressed-white: var(--p-color-red-800);
    --p-color-button-brand-fill-pressed-grey: var(--p-color-red-800);
    --p-color-button-brand-fill-active: var(--p-color-red-800);
    --p-color-button-brand-fill-active-white: var(--p-color-red-800);
    --p-color-button-brand-fill-active-grey: var(--p-color-red-800);
    --p-color-button-action-fill: var(--p-color-red-900);
    --p-color-button-action-fill-white: var(--p-color-red-900);
    --p-color-button-action-fill-grey: var(--p-color-red-900);
    --p-color-button-action-fill-hover: var(--p-color-red-800);
    --p-color-button-action-fill-hover-white: var(--p-color-red-800);
    --p-color-button-action-fill-hover-grey: var(--p-color-red-800);
    --p-color-button-action-fill-pressed: var(--p-color-red-700);
    --p-color-button-action-fill-pressed-white: var(--p-color-red-700);
    --p-color-button-action-fill-pressed-grey: var(--p-color-red-700);
    --p-color-button-action-fill-active: var(--p-color-red-700);
    --p-color-button-action-fill-active-white: var(--p-color-red-700);
    --p-color-button-action-fill-active-grey: var(--p-color-red-700);
    --p-color-button-disabled: var(--p-color-grey-200);
    --p-color-button-disabled-white: var(--p-color-grey-200);
    --p-color-button-disabled-grey: var(--p-color-grey-300);
    --p-color-graphics-illustration-primary: var(--p-color-red-600);
    --p-color-graphics-illustration-primary-white: var(--p-color-red-600);
    --p-color-graphics-illustration-primary-grey: var(--p-color-red-600);
    --p-color-graphics-illustration-detail: var(--p-color-logo-red);
    --p-color-graphics-illustration-detail-white: var(--p-color-logo-red);
    --p-color-graphics-illustration-detail-grey: var(--p-color-logo-red);
    --p-color-graphics-illustration-base: var(--p-color-purple-900);
    --p-color-graphics-illustration-base-white: var(--p-color-purple-900);
    --p-color-graphics-illustration-base-grey: var(--p-color-purple-900);
    --p-color-graphics-illustration-white: var(--p-color-grey-000);
    --p-color-graphics-illustration-white-white: var(--p-color-grey-000);
    --p-color-graphics-illustration-white-grey: var(--p-color-grey-000);
    --p-color-graphics-storebrand-icon-detail: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-detail-white: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-detail-grey: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-outline: var(--p-color-red-800);
    --p-color-graphics-storebrand-icon-outline-white: var(--p-color-red-800);
    --p-color-graphics-storebrand-icon-outline-grey: var(--p-color-red-800);
    --p-color-static-brand-foreground: var(--p-color-red-600);
    --p-color-static-brand-foreground-white: var(--p-color-red-600);
    --p-color-static-brand-foreground-grey: var(--p-color-red-600);
    --p-color-static-brand-background: var(--p-color-red-200);
    --p-color-static-brand-background-white: var(--p-color-red-200);
    --p-color-static-brand-background-grey: var(--p-color-red-200);
    --p-color-static-orange-foreground: var(--p-color-orange-600);
    --p-color-static-orange-foreground-white: var(--p-color-orange-600);
    --p-color-static-orange-foreground-grey: var(--p-color-orange-600);
    --p-color-static-orange-background: var(--p-color-orange-200);
    --p-color-static-orange-background-white: var(--p-color-orange-200);
    --p-color-static-orange-background-grey: var(--p-color-orange-300);
    --p-color-static-purple-foreground: var(--p-color-purple-600);
    --p-color-static-purple-foreground-white: var(--p-color-purple-600);
    --p-color-static-purple-foreground-grey: var(--p-color-purple-600);
    --p-color-static-purple-background: var(--p-color-purple-200);
    --p-color-static-purple-background-white: var(--p-color-purple-200);
    --p-color-static-purple-background-grey: var(--p-color-purple-300);
    --p-color-static-red-foreground: var(--p-color-red-600);
    --p-color-static-red-foreground-white: var(--p-color-red-600);
    --p-color-static-red-foreground-grey: var(--p-color-red-600);
    --p-color-static-red-background: var(--p-color-red-200);
    --p-color-static-red-background-white: var(--p-color-red-200);
    --p-color-static-red-background-grey: var(--p-color-red-200);
    --p-color-static-grey-foreground: var(--p-color-grey-600);
    --p-color-static-grey-foreground-white: var(--p-color-grey-600);
    --p-color-static-grey-foreground-grey: var(--p-color-grey-600);
    --p-color-static-grey-background: var(--p-color-grey-200);
    --p-color-static-grey-background-white: var(--p-color-grey-200);
    --p-color-static-grey-background-grey: var(--p-color-grey-300);
    --p-color-static-risk-filled: var(--p-color-orange-600);
    --p-color-static-risk-filled-white: var(--p-color-orange-600);
    --p-color-static-risk-filled-grey: var(--p-color-orange-600);
    --p-color-static-risk-unfilled: var(--p-color-orange-200);
    --p-color-static-risk-unfilled-white: var(--p-color-orange-200);
    --p-color-static-risk-unfilled-grey: var(--p-color-orange-300);
    --p-color-static-sustainability-filled: var(--p-color-purple-600);
    --p-color-static-sustainability-filled-white: var(--p-color-purple-600);
    --p-color-static-sustainability-filled-grey: var(--p-color-purple-600);
    --p-color-static-sustainability-unfilled: var(--p-color-purple-200);
    --p-color-static-sustainability-unfilled-white: var(--p-color-purple-200);
    --p-color-static-sustainability-unfilled-grey: var(--p-color-purple-300);
    --p-color-states-focus: var(--p-color-focus-1);
    --p-color-states-focus-white: var(--p-color-focus-1);
    --p-color-states-focus-grey: var(--p-color-focus-1);
    --p-color-states-scrim: var(--p-color-scrim-1);
    --p-color-states-scrim-white: var(--p-color-scrim-1);
    --p-color-states-scrim-grey: var(--p-color-scrim-1);
    --p-color-states-toggle-off: var(--p-color-grey-400);
    --p-color-states-toggle-off-white: var(--p-color-grey-400);
    --p-color-states-toggle-off-grey: var(--p-color-grey-500);
    --p-color-states-toggle-off-hover: var(--p-color-grey-300);
    --p-color-states-toggle-off-hover-white: var(--p-color-grey-300);
    --p-color-states-toggle-off-hover-grey: var(--p-color-grey-400);
    --p-color-surface-1: var(--p-color-grey-100);
    --p-color-surface-1-white: var(--p-color-grey-100);
    --p-color-surface-1-grey: var(--p-color-grey-000);
    --p-color-surface-2: var(--p-color-grey-000);
    --p-color-surface-2-white: var(--p-color-grey-000);
    --p-color-surface-2-grey: var(--p-color-grey-100);
    --p-color-surface-1-hover: var(--p-color-grey-200);
    --p-color-surface-1-hover-white: var(--p-color-grey-200);
    --p-color-surface-1-hover-grey: var(--p-color-grey-200);
    --p-color-surface-2-hover: var(--p-color-grey-200);
    --p-color-surface-2-hover-white: var(--p-color-grey-200);
    --p-color-surface-2-hover-grey: var(--p-color-grey-200);
    --p-color-surface-inverse: var(--p-color-red-900);
    --p-color-surface-inverse-white: var(--p-color-red-900);
    --p-color-surface-inverse-grey: var(--p-color-red-900);
    --p-color-surface-inverse-hover: var(--p-color-red-800);
    --p-color-surface-inverse-hover-white: var(--p-color-red-800);
    --p-color-surface-inverse-hover-grey: var(--p-color-red-800);
    --p-color-surface-inverse-pressed: var(--p-color-red-700);
    --p-color-surface-inverse-pressed-white: var(--p-color-red-700);
    --p-color-surface-inverse-pressed-grey: var(--p-color-red-700);
    --p-color-surface-selected: var(--p-color-red-700);
    --p-color-surface-selected-white: var(--p-color-red-700);
    --p-color-surface-selected-grey: var(--p-color-red-700);
    --p-color-surface-selected-hover: var(--p-color-red-800);
    --p-color-surface-selected-hover-white: var(--p-color-red-800);
    --p-color-surface-selected-hover-grey: var(--p-color-red-800);
    --p-color-surface-selected-pressed: var(--p-color-red-800);
    --p-color-surface-selected-pressed-white: var(--p-color-red-800);
    --p-color-surface-selected-pressed-grey: var(--p-color-red-800);
    --p-color-surface-selected-active: var(--p-color-red-900);
    --p-color-surface-selected-active-white: var(--p-color-red-900);
    --p-color-surface-selected-active-grey: var(--p-color-red-900);
    --p-color-surface-error: var(--p-color-red-200);
    --p-color-surface-error-white: var(--p-color-red-200);
    --p-color-surface-error-grey: var(--p-color-red-200);
    --p-color-surface-success: var(--p-color-green-200);
    --p-color-surface-success-white: var(--p-color-green-200);
    --p-color-surface-success-grey: var(--p-color-green-200);
    --p-color-surface-warning: var(--p-color-yellow-200);
    --p-color-surface-warning-white: var(--p-color-yellow-200);
    --p-color-surface-warning-grey: var(--p-color-yellow-200);
    --p-color-surface-info: var(--p-color-blue-200);
    --p-color-surface-info-white: var(--p-color-blue-200);
    --p-color-surface-info-grey: var(--p-color-blue-200);
    --p-color-surface-neutral: var(--p-color-grey-100);
    --p-color-surface-neutral-white: var(--p-color-grey-000);
    --p-color-surface-neutral-grey: var(--p-color-grey-100);
    --p-color-surface-static: var(--p-color-grey-000);
    --p-color-surface-static-white: var(--p-color-grey-000);
    --p-color-surface-static-grey: var(--p-color-grey-000);
    --p-color-stroke-strong: var(--p-color-red-900);
    --p-color-stroke-strong-white: var(--p-color-red-900);
    --p-color-stroke-strong-grey: var(--p-color-red-900);
    --p-color-stroke-strong-hover: var(--p-color-red-800);
    --p-color-stroke-strong-hover-white: var(--p-color-red-800);
    --p-color-stroke-strong-hover-grey: var(--p-color-red-800);
    --p-color-stroke-strong-pressed: var(--p-color-red-700);
    --p-color-stroke-strong-pressed-white: var(--p-color-red-700);
    --p-color-stroke-strong-pressed-grey: var(--p-color-red-700);
    --p-color-stroke: var(--p-color-grey-500);
    --p-color-stroke-white: var(--p-color-grey-500);
    --p-color-stroke-grey: var(--p-color-grey-500);
    --p-color-stroke-0: var(--p-color-stroke);
    --p-color-stroke-0-white: var(--p-color-stroke-white);
    --p-color-stroke-0-grey: var(--p-color-stroke-grey);
    --p-color-stroke-1: var(--p-color-stroke);
    --p-color-stroke-1-white: var(--p-color-stroke-white);
    --p-color-stroke-1-grey: var(--p-color-stroke-grey);
    --p-color-stroke-2: var(--p-color-stroke);
    --p-color-stroke-2-white: var(--p-color-stroke-white);
    --p-color-stroke-2-grey: var(--p-color-stroke-grey);
    --p-color-stroke-hover: var(--p-color-red-900);
    --p-color-stroke-white-hover: var(--p-color-red-900);
    --p-color-stroke-grey-hover: var(--p-color-red-900);
    --p-color-stroke-pressed: var(--p-color-red-800);
    --p-color-stroke-white-pressed: var(--p-color-red-800);
    --p-color-stroke-grey-pressed: var(--p-color-red-800);
    --p-color-stroke-on-white: var(--p-color-grey-300);
    --p-color-stroke-on-white-white: var(--p-color-grey-300);
    --p-color-stroke-on-white-grey: var(--p-color-grey-300);
    --p-color-stroke-subtle-0: var(--p-color-grey-200);
    --p-color-stroke-subtle-0-white: var(--p-color-grey-200);
    --p-color-stroke-subtle-0-grey: var(--p-color-grey-300);
    --p-color-stroke-subtle-1: var(--p-color-grey-300);
    --p-color-stroke-subtle-1-white: var(--p-color-grey-300);
    --p-color-stroke-subtle-1-grey: var(--p-color-grey-200);
    --p-color-stroke-subtle-2: var(--p-color-grey-200);
    --p-color-stroke-subtle-2-white: var(--p-color-grey-200);
    --p-color-stroke-subtle-2-grey: var(--p-color-grey-300);
    --p-color-stroke-subtle-on-white: var(--p-color-grey-200);
    --p-color-stroke-subtle-on-white-white: var(--p-color-grey-200);
    --p-color-stroke-subtle-on-white-grey: var(--p-color-grey-200);
    --p-color-stroke-subtle-hover: var(--p-color-red-800);
    --p-color-stroke-subtle-hover-white: var(--p-color-red-800);
    --p-color-stroke-subtle-hover-grey: var(--p-color-red-800);
    --p-color-stroke-subtle-pressed: var(--p-color-red-700);
    --p-color-stroke-subtle-pressed-white: var(--p-color-red-700);
    --p-color-stroke-subtle-pressed-grey: var(--p-color-red-700);
    --p-color-stroke-on-color: var(--p-color-red-100);
    --p-color-stroke-on-color-white: var(--p-color-red-100);
    --p-color-stroke-on-color-grey: var(--p-color-red-100);
    --p-color-stroke-interactive: var(--p-color-red-600);
    --p-color-stroke-interactive-white: var(--p-color-red-600);
    --p-color-stroke-interactive-grey: var(--p-color-red-600);
    --p-color-stroke-interactive-hover: var(--p-color-red-700);
    --p-color-stroke-interactive-hover-white: var(--p-color-red-700);
    --p-color-stroke-interactive-hover-grey: var(--p-color-red-700);
    --p-color-stroke-interactive-pressed: var(--p-color-red-800);
    --p-color-stroke-interactive-pressed-white: var(--p-color-red-800);
    --p-color-stroke-interactive-pressed-grey: var(--p-color-red-800);
    --p-color-stroke-selected: var(--p-color-red-700);
    --p-color-stroke-selected-white: var(--p-color-red-700);
    --p-color-stroke-selected-grey: var(--p-color-red-700);
    --p-color-stroke-selected-hover: var(--p-color-red-800);
    --p-color-stroke-selected-hover-white: var(--p-color-red-800);
    --p-color-stroke-selected-hover-grey: var(--p-color-red-800);
    --p-color-stroke-selected-pressed: var(--p-color-red-900);
    --p-color-stroke-selected-pressed-white: var(--p-color-red-900);
    --p-color-stroke-selected-pressed-grey: var(--p-color-red-900);
    --p-color-stroke-disabled: var(--p-color-grey-200);
    --p-color-stroke-disabled-white: var(--p-color-grey-200);
    --p-color-stroke-disabled-grey: var(--p-color-grey-300);
    --p-color-stroke-error: var(--p-color-red-600);
    --p-color-stroke-error-white: var(--p-color-red-600);
    --p-color-stroke-error-grey: var(--p-color-red-600);
    --p-color-stroke-success: var(--p-color-green-600);
    --p-color-stroke-success-white: var(--p-color-green-600);
    --p-color-stroke-success-grey: var(--p-color-green-600);
    --p-color-stroke-warning: var(--p-color-yellow-600);
    --p-color-stroke-warning-white: var(--p-color-yellow-600);
    --p-color-stroke-warning-grey: var(--p-color-yellow-600);
    --p-color-monochromatic-red-1: var(--p-color-red-550);
    --p-color-monochromatic-red-1-white: var(--p-color-red-550);
    --p-color-monochromatic-red-1-grey: var(--p-color-red-550);
    --p-color-monochromatic-red-2: var(--p-color-red-600);
    --p-color-monochromatic-red-2-white: var(--p-color-red-600);
    --p-color-monochromatic-red-2-grey: var(--p-color-red-600);
    --p-color-monochromatic-red-3: var(--p-color-red-800);
    --p-color-monochromatic-red-3-white: var(--p-color-red-800);
    --p-color-monochromatic-red-3-grey: var(--p-color-red-800);
    --p-color-monochromatic-red-4: var(--p-color-red-900);
    --p-color-monochromatic-red-4-white: var(--p-color-red-900);
    --p-color-monochromatic-red-4-grey: var(--p-color-red-900);
    --p-color-monochromatic-purple-1: var(--p-color-purple-550);
    --p-color-monochromatic-purple-1-white: var(--p-color-purple-550);
    --p-color-monochromatic-purple-1-grey: var(--p-color-purple-550);
    --p-color-monochromatic-purple-2: var(--p-color-purple-600);
    --p-color-monochromatic-purple-2-white: var(--p-color-purple-600);
    --p-color-monochromatic-purple-2-grey: var(--p-color-purple-600);
    --p-color-monochromatic-purple-3: var(--p-color-purple-800);
    --p-color-monochromatic-purple-3-white: var(--p-color-purple-800);
    --p-color-monochromatic-purple-3-grey: var(--p-color-purple-800);
    --p-color-monochromatic-purple-4: var(--p-color-purple-900);
    --p-color-monochromatic-purple-4-white: var(--p-color-purple-900);
    --p-color-monochromatic-purple-4-grey: var(--p-color-purple-900);
    --p-color-categorical-1: var(--p-color-purple-800);
    --p-color-categorical-1-white: var(--p-color-purple-800);
    --p-color-categorical-1-grey: var(--p-color-purple-800);
    --p-color-categorical-2: var(--p-color-red-550);
    --p-color-categorical-2-white: var(--p-color-red-550);
    --p-color-categorical-2-grey: var(--p-color-red-550);
    --p-color-categorical-3: var(--p-color-red-600);
    --p-color-categorical-3-white: var(--p-color-red-600);
    --p-color-categorical-3-grey: var(--p-color-red-600);
    --p-color-categorical-4: var(--p-color-purple-550);
    --p-color-categorical-4-white: var(--p-color-purple-550);
    --p-color-categorical-4-grey: var(--p-color-purple-550);
    --p-color-categorical-5: var(--p-color-red-800);
    --p-color-categorical-5-white: var(--p-color-red-800);
    --p-color-categorical-5-grey: var(--p-color-red-800);
    --p-color-categorical-6: var(--p-color-grey-500);
    --p-color-categorical-6-white: var(--p-color-grey-500);
    --p-color-categorical-6-grey: var(--p-color-grey-500);
    --p-color-categorical-7: var(--p-color-blue-700);
    --p-color-categorical-7-white: var(--p-color-blue-700);
    --p-color-categorical-7-grey: var(--p-color-blue-700);
    --p-color-categorical-8: var(--p-color-green-550);
    --p-color-categorical-8-white: var(--p-color-green-550);
    --p-color-categorical-8-grey: var(--p-color-green-550);
    --p-color-categorical-9: var(--p-color-purple-600);
    --p-color-categorical-9-white: var(--p-color-purple-600);
    --p-color-categorical-9-grey: var(--p-color-purple-600);
    --p-color-categorical-10: var(--p-color-blue-500);
    --p-color-categorical-10-white: var(--p-color-blue-500);
    --p-color-categorical-10-grey: var(--p-color-blue-500);
    --p-color-categorical-11: var(--p-color-green-700);
    --p-color-categorical-11-white: var(--p-color-green-700);
    --p-color-categorical-11-grey: var(--p-color-green-700);
    --p-color-categorical-12: var(--p-color-grey-700);
    --p-color-categorical-12-white: var(--p-color-grey-700);
    --p-color-categorical-12-grey: var(--p-color-grey-700);
    --p-outline: .125rem solid var(--p-color-states-focus);
    --p-outline-offset: .125rem;
  }

  [data-theme="pretzel-dark"] {
    --p-color-background: var(--p-color-grey-1000);
    --p-color-background-white: var(--p-color-grey-1000);
    --p-color-background-grey: var(--p-color-grey-1000);
    --p-color-background-hover: var(--p-color-grey-900);
    --p-color-background-hover-white: var(--p-color-grey-900);
    --p-color-background-hover-grey: var(--p-color-grey-800);
    --p-color-background-pressed: var(--p-color-grey-800);
    --p-color-background-pressed-white: var(--p-color-grey-800);
    --p-color-background-pressed-grey: var(--p-color-grey-700);
    --p-color-background-active: var(--p-color-red-400);
    --p-color-background-active-white: var(--p-color-red-400);
    --p-color-background-active-grey: var(--p-color-red-400);
    --p-color-background-disabled: var(--p-color-grey-800);
    --p-color-background-disabled-white: var(--p-color-grey-800);
    --p-color-background-disabled-grey: var(--p-color-grey-700);
    --p-color-background-selected: var(--p-color-red-300);
    --p-color-background-selected-white: var(--p-color-red-300);
    --p-color-background-selected-grey: var(--p-color-red-300);
    --p-color-background-selected-hover: var(--p-color-red-200);
    --p-color-background-selected-hover-white: var(--p-color-red-200);
    --p-color-background-selected-hover-grey: var(--p-color-red-200);
    --p-color-background-selected-pressed: var(--p-color-red-100);
    --p-color-background-selected-pressed-white: var(--p-color-red-100);
    --p-color-background-selected-pressed-grey: var(--p-color-red-100);
    --p-color-text-primary: var(--p-color-red-100);
    --p-color-text-primary-white: var(--p-color-red-100);
    --p-color-text-primary-grey: var(--p-color-red-100);
    --p-color-text-primary-hover: var(--p-color-red-200);
    --p-color-text-primary-hover-white: var(--p-color-red-200);
    --p-color-text-primary-hover-grey: var(--p-color-red-200);
    --p-color-text-primary-pressed: var(--p-color-red-300);
    --p-color-text-primary-pressed-white: var(--p-color-red-300);
    --p-color-text-primary-pressed-grey: var(--p-color-red-300);
    --p-color-text-primary-active: var(--p-color-red-300);
    --p-color-text-primary-active-white: var(--p-color-red-300);
    --p-color-text-primary-active-grey: var(--p-color-red-300);
    --p-color-text-interactive: var(--p-color-red-200);
    --p-color-text-interactive-white: var(--p-color-red-200);
    --p-color-text-interactive-grey: var(--p-color-red-200);
    --p-color-text-interactive-hover: var(--p-color-red-400);
    --p-color-text-interactive-hover-white: var(--p-color-red-400);
    --p-color-text-interactive-hover-grey: var(--p-color-red-400);
    --p-color-text-interactive-pressed: var(--p-color-red-300);
    --p-color-text-interactive-pressed-white: var(--p-color-red-300);
    --p-color-text-interactive-pressed-grey: var(--p-color-red-300);
    --p-color-text-interactive-active: var(--p-color-red-300);
    --p-color-text-interactive-active-white: var(--p-color-red-300);
    --p-color-text-interactive-active-grey: var(--p-color-red-300);
    --p-color-text-selected: var(--p-color-red-300);
    --p-color-text-selected-white: var(--p-color-red-300);
    --p-color-text-selected-grey: var(--p-color-red-300);
    --p-color-text-selected-hover: var(--p-color-red-200);
    --p-color-text-selected-hover-white: var(--p-color-red-200);
    --p-color-text-selected-hover-grey: var(--p-color-red-200);
    --p-color-text-selected-pressed: var(--p-color-red-100);
    --p-color-text-selected-pressed-white: var(--p-color-red-100);
    --p-color-text-selected-pressed-grey: var(--p-color-red-100);
    --p-color-text-secondary: var(--p-color-grey-300);
    --p-color-text-secondary-white: var(--p-color-grey-300);
    --p-color-text-secondary-grey: var(--p-color-grey-300);
    --p-color-text-placeholder: var(--p-color-grey-400);
    --p-color-text-placeholder-white: var(--p-color-grey-400);
    --p-color-text-placeholder-grey: var(--p-color-grey-400);
    --p-color-text-on-color: var(--p-color-red-900);
    --p-color-text-on-color-white: var(--p-color-red-900);
    --p-color-text-on-color-grey: var(--p-color-red-900);
    --p-color-text-disabled: var(--p-color-grey-600);
    --p-color-text-disabled-white: var(--p-color-grey-600);
    --p-color-text-disabled-grey: var(--p-color-grey-500);
    --p-color-text-info: var(--p-color-blue-400);
    --p-color-text-info-white: var(--p-color-blue-400);
    --p-color-text-info-grey: var(--p-color-blue-400);
    --p-color-text-success: var(--p-color-green-400);
    --p-color-text-success-white: var(--p-color-green-400);
    --p-color-text-success-grey: var(--p-color-green-400);
    --p-color-text-warning: var(--p-color-yellow-400);
    --p-color-text-warning-white: var(--p-color-yellow-400);
    --p-color-text-warning-grey: var(--p-color-yellow-400);
    --p-color-text-error: var(--p-color-red-400);
    --p-color-text-error-white: var(--p-color-red-400);
    --p-color-text-error-grey: var(--p-color-red-400);
    --p-color-text-alert: var(--p-color-grey-100);
    --p-color-text-alert-white: var(--p-color-grey-100);
    --p-color-text-alert-grey: var(--p-color-grey-100);
    --p-color-text-on-brand: var(--p-color-red-900);
    --p-color-text-on-brand-white: var(--p-color-red-900);
    --p-color-text-on-brand-grey: var(--p-color-red-900);
    --p-color-text-on-error: var(--p-color-red-200);
    --p-color-text-on-info: var(--p-color-blue-200);
    --p-color-text-on-warning: var(--p-color-yellow-200);
    --p-color-text-on-success: var(--p-color-green-200);
    --p-color-text-on-purple: var(--p-color-purple-200);
    --p-color-text-on-orange: var(--p-color-orange-200);
    --p-color-icon-primary: var(--p-color-red-100);
    --p-color-icon-primary-white: var(--p-color-red-100);
    --p-color-icon-primary-grey: var(--p-color-red-100);
    --p-color-icon-primary-hover: var(--p-color-red-200);
    --p-color-icon-primary-hover-white: var(--p-color-red-200);
    --p-color-icon-primary-hover-grey: var(--p-color-red-200);
    --p-color-icon-primary-active: var(--p-color-red-300);
    --p-color-icon-primary-active-white: var(--p-color-red-300);
    --p-color-icon-primary-active-grey: var(--p-color-red-300);
    --p-color-icon-primary-pressed: var(--p-color-red-300);
    --p-color-icon-primary-pressed-white: var(--p-color-red-300);
    --p-color-icon-primary-pressed-grey: var(--p-color-red-300);
    --p-color-icon-interactive: var(--p-color-red-200);
    --p-color-icon-interactive-white: var(--p-color-red-200);
    --p-color-icon-interactive-grey: var(--p-color-red-200);
    --p-color-icon-interactive-hover: var(--p-color-red-400);
    --p-color-icon-interactive-hover-white: var(--p-color-red-400);
    --p-color-icon-interactive-hover-grey: var(--p-color-red-400);
    --p-color-icon-interactive-pressed: var(--p-color-red-300);
    --p-color-icon-interactive-pressed-white: var(--p-color-red-300);
    --p-color-icon-interactive-pressed-grey: var(--p-color-red-300);
    --p-color-icon-interactive-active: var(--p-color-red-300);
    --p-color-icon-interactive-active-white: var(--p-color-red-300);
    --p-color-icon-interactive-active-grey: var(--p-color-red-300);
    --p-color-icon-on-color: var(--p-color-red-900);
    --p-color-icon-on-color-white: var(--p-color-red-900);
    --p-color-icon-on-color-grey: var(--p-color-red-900);
    --p-color-icon-disabled: var(--p-color-grey-600);
    --p-color-icon-disabled-white: var(--p-color-grey-600);
    --p-color-icon-disabled-grey: var(--p-color-grey-500);
    --p-color-icon-error: var(--p-color-red-400);
    --p-color-icon-error-white: var(--p-color-red-400);
    --p-color-icon-error-grey: var(--p-color-red-400);
    --p-color-icon-success: var(--p-color-green-400);
    --p-color-icon-success-white: var(--p-color-green-400);
    --p-color-icon-success-grey: var(--p-color-green-400);
    --p-color-icon-warning: var(--p-color-yellow-400);
    --p-color-icon-warning-white: var(--p-color-yellow-400);
    --p-color-icon-warning-grey: var(--p-color-yellow-400);
    --p-color-icon-info: var(--p-color-blue-400);
    --p-color-icon-info-white: var(--p-color-blue-400);
    --p-color-icon-info-grey: var(--p-color-blue-400);
    --p-color-icon-neutral: var(--p-color-grey-100);
    --p-color-icon-neutral-white: var(--p-color-grey-100);
    --p-color-icon-neutral-grey: var(--p-color-grey-100);
    --p-color-icon-on-brand: var(--p-color-red-900);
    --p-color-icon-on-brand-white: var(--p-color-red-900);
    --p-color-icon-on-brand-grey: var(--p-color-red-900);
    --p-color-icon-on-error: var(--p-color-red-200);
    --p-color-icon-on-info: var(--p-color-blue-200);
    --p-color-icon-on-warning: var(--p-color-yellow-200);
    --p-color-icon-on-success: var(--p-color-green-200);
    --p-color-icon-on-purple: var(--p-color-purple-200);
    --p-color-icon-on-orange: var(--p-color-orange-200);
    --p-color-button-brand-fill: var(--p-color-red-400);
    --p-color-button-brand-fill-white: var(--p-color-red-400);
    --p-color-button-brand-fill-grey: var(--p-color-red-400);
    --p-color-button-brand-fill-hover: var(--p-color-red-300);
    --p-color-button-brand-fill-hover-white: var(--p-color-red-300);
    --p-color-button-brand-fill-hover-grey: var(--p-color-red-300);
    --p-color-button-brand-fill-pressed: var(--p-color-red-200);
    --p-color-button-brand-fill-pressed-white: var(--p-color-red-200);
    --p-color-button-brand-fill-pressed-grey: var(--p-color-red-200);
    --p-color-button-brand-fill-active: var(--p-color-red-200);
    --p-color-button-brand-fill-active-white: var(--p-color-red-200);
    --p-color-button-brand-fill-active-grey: var(--p-color-red-200);
    --p-color-button-action-fill: var(--p-color-red-100);
    --p-color-button-action-fill-white: var(--p-color-red-100);
    --p-color-button-action-fill-grey: var(--p-color-red-100);
    --p-color-button-action-fill-hover: var(--p-color-red-200);
    --p-color-button-action-fill-hover-white: var(--p-color-red-200);
    --p-color-button-action-fill-hover-grey: var(--p-color-red-200);
    --p-color-button-action-fill-pressed: var(--p-color-red-300);
    --p-color-button-action-fill-pressed-white: var(--p-color-red-300);
    --p-color-button-action-fill-pressed-grey: var(--p-color-red-300);
    --p-color-button-action-fill-active: var(--p-color-red-300);
    --p-color-button-action-fill-active-white: var(--p-color-red-300);
    --p-color-button-action-fill-active-grey: var(--p-color-red-300);
    --p-color-button-disabled: var(--p-color-grey-800);
    --p-color-button-disabled-white: var(--p-color-grey-800);
    --p-color-button-disabled-grey: var(--p-color-grey-800);
    --p-color-graphics-illustration-primary: var(--p-color-red-400);
    --p-color-graphics-illustration-primary-white: var(--p-color-red-400);
    --p-color-graphics-illustration-primary-grey: var(--p-color-red-400);
    --p-color-graphics-illustration-detail: var(--p-color-logo-red);
    --p-color-graphics-illustration-detail-white: var(--p-color-logo-red);
    --p-color-graphics-illustration-detail-grey: var(--p-color-logo-red);
    --p-color-graphics-illustration-base: var(--p-color-purple-100);
    --p-color-graphics-illustration-base-white: var(--p-color-purple-100);
    --p-color-graphics-illustration-base-grey: var(--p-color-purple-100);
    --p-color-graphics-illustration-white: var(--p-color-grey-1000);
    --p-color-graphics-illustration-white-white: var(--p-color-grey-1000);
    --p-color-graphics-illustration-white-grey: var(--p-color-grey-1000);
    --p-color-graphics-storebrand-icon-detail: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-detail-white: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-detail-grey: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-outline: var(--p-color-red-200);
    --p-color-graphics-storebrand-icon-outline-white: var(--p-color-red-200);
    --p-color-graphics-storebrand-icon-outline-grey: var(--p-color-red-200);
    --p-color-static-brand-foreground: var(--p-color-red-400);
    --p-color-static-brand-foreground-white: var(--p-color-red-400);
    --p-color-static-brand-foreground-grey: var(--p-color-red-400);
    --p-color-static-brand-background: var(--p-color-red-800);
    --p-color-static-brand-background-white: var(--p-color-red-800);
    --p-color-static-brand-background-grey: var(--p-color-red-800);
    --p-color-static-orange-foreground: var(--p-color-orange-400);
    --p-color-static-orange-foreground-white: var(--p-color-orange-400);
    --p-color-static-orange-foreground-grey: var(--p-color-orange-400);
    --p-color-static-orange-background: var(--p-color-orange-pale-800);
    --p-color-static-orange-background-white: var(--p-color-orange-pale-800);
    --p-color-static-orange-background-grey: var(--p-color-orange-pale-800);
    --p-color-static-purple-foreground: var(--p-color-purple-400);
    --p-color-static-purple-foreground-white: var(--p-color-purple-400);
    --p-color-static-purple-foreground-grey: var(--p-color-purple-400);
    --p-color-static-purple-background: var(--p-color-purple-800);
    --p-color-static-purple-background-white: var(--p-color-purple-800);
    --p-color-static-purple-background-grey: var(--p-color-purple-800);
    --p-color-static-red-foreground: var(--p-color-red-400);
    --p-color-static-red-foreground-white: var(--p-color-red-400);
    --p-color-static-red-foreground-grey: var(--p-color-red-400);
    --p-color-static-red-background: var(--p-color-red-800);
    --p-color-static-red-background-white: var(--p-color-red-800);
    --p-color-static-red-background-grey: var(--p-color-red-800);
    --p-color-static-grey-foreground: var(--p-color-grey-400);
    --p-color-static-grey-foreground-white: var(--p-color-grey-400);
    --p-color-static-grey-foreground-grey: var(--p-color-grey-400);
    --p-color-static-grey-background: var(--p-color-grey-800);
    --p-color-static-grey-background-white: var(--p-color-grey-800);
    --p-color-static-grey-background-grey: var(--p-color-grey-800);
    --p-color-static-risk-filled: var(--p-color-orange-300);
    --p-color-static-risk-filled-white: var(--p-color-orange-300);
    --p-color-static-risk-filled-grey: var(--p-color-orange-300);
    --p-color-static-risk-unfilled: var(--p-color-orange-pale-800);
    --p-color-static-risk-unfilled-white: var(--p-color-orange-pale-800);
    --p-color-static-risk-unfilled-grey: var(--p-color-orange-pale-800);
    --p-color-static-sustainability-filled: var(--p-color-purple-300);
    --p-color-static-sustainability-filled-white: var(--p-color-purple-300);
    --p-color-static-sustainability-filled-grey: var(--p-color-purple-300);
    --p-color-static-sustainability-unfilled: var(--p-color-purple-pale-800);
    --p-color-static-sustainability-unfilled-white: var(--p-color-purple-pale-800);
    --p-color-static-sustainability-unfilled-grey: var(--p-color-purple-pale-800);
    --p-color-states-focus: var(--p-color-focus-1);
    --p-color-states-focus-white: var(--p-color-focus-1);
    --p-color-states-focus-grey: var(--p-color-focus-1);
    --p-color-states-scrim: var(--p-color-scrim-1);
    --p-color-states-scrim-white: var(--p-color-scrim-1);
    --p-color-states-scrim-grey: var(--p-color-scrim-1);
    --p-color-states-toggle-off: var(--p-color-grey-600);
    --p-color-states-toggle-off-white: var(--p-color-grey-600);
    --p-color-states-toggle-off-grey: var(--p-color-grey-500);
    --p-color-states-toggle-off-hover: var(--p-color-grey-700);
    --p-color-states-toggle-off-hover-white: var(--p-color-grey-700);
    --p-color-states-toggle-off-hover-grey: var(--p-color-grey-600);
    --p-color-surface-1: var(--p-color-grey-900);
    --p-color-surface-1-white: var(--p-color-grey-900);
    --p-color-surface-1-grey: var(--p-color-grey-1000);
    --p-color-surface-2: var(--p-color-grey-800);
    --p-color-surface-2-white: var(--p-color-grey-800);
    --p-color-surface-2-grey: var(--p-color-grey-800);
    --p-color-surface-1-hover: var(--p-color-grey-800);
    --p-color-surface-1-hover-white: var(--p-color-grey-800);
    --p-color-surface-1-hover-grey: var(--p-color-grey-800);
    --p-color-surface-2-hover: var(--p-color-grey-800);
    --p-color-surface-2-hover-white: var(--p-color-grey-800);
    --p-color-surface-2-hover-grey: var(--p-color-grey-800);
    --p-color-surface-inverse: var(--p-color-red-100);
    --p-color-surface-inverse-white: var(--p-color-red-100);
    --p-color-surface-inverse-grey: var(--p-color-red-100);
    --p-color-surface-inverse-hover: var(--p-color-red-200);
    --p-color-surface-inverse-hover-white: var(--p-color-red-200);
    --p-color-surface-inverse-hover-grey: var(--p-color-red-200);
    --p-color-surface-inverse-pressed: var(--p-color-red-300);
    --p-color-surface-inverse-pressed-white: var(--p-color-red-300);
    --p-color-surface-inverse-pressed-grey: var(--p-color-red-300);
    --p-color-surface-selected: var(--p-color-red-400);
    --p-color-surface-selected-white: var(--p-color-red-400);
    --p-color-surface-selected-grey: var(--p-color-red-400);
    --p-color-surface-selected-hover: var(--p-color-red-300);
    --p-color-surface-selected-hover-white: var(--p-color-red-300);
    --p-color-surface-selected-hover-grey: var(--p-color-red-300);
    --p-color-surface-selected-pressed: var(--p-color-red-200);
    --p-color-surface-selected-pressed-white: var(--p-color-red-200);
    --p-color-surface-selected-pressed-grey: var(--p-color-red-200);
    --p-color-surface-selected-active: var(--p-color-red-200);
    --p-color-surface-selected-active-white: var(--p-color-red-200);
    --p-color-surface-selected-active-grey: var(--p-color-red-200);
    --p-color-surface-error: var(--p-color-red-800);
    --p-color-surface-error-white: var(--p-color-red-800);
    --p-color-surface-error-grey: var(--p-color-red-800);
    --p-color-surface-success: var(--p-color-green-800);
    --p-color-surface-success-white: var(--p-color-green-800);
    --p-color-surface-success-grey: var(--p-color-green-800);
    --p-color-surface-warning: var(--p-color-yellow-800);
    --p-color-surface-warning-white: var(--p-color-yellow-800);
    --p-color-surface-warning-grey: var(--p-color-yellow-800);
    --p-color-surface-info: var(--p-color-blue-800);
    --p-color-surface-info-white: var(--p-color-blue-800);
    --p-color-surface-info-grey: var(--p-color-blue-800);
    --p-color-surface-neutral: var(--p-color-grey-900);
    --p-color-surface-neutral-white: var(--p-color-grey-1000);
    --p-color-surface-neutral-grey: var(--p-color-grey-900);
    --p-color-surface-static: var(--p-color-grey-1000);
    --p-color-surface-static-white: var(--p-color-grey-900);
    --p-color-surface-static-grey: var(--p-color-grey-900);
    --p-color-stroke-strong: var(--p-color-red-200);
    --p-color-stroke-strong-white: var(--p-color-red-200);
    --p-color-stroke-strong-grey: var(--p-color-red-200);
    --p-color-stroke-strong-hover: var(--p-color-red-400);
    --p-color-stroke-strong-hover-white: var(--p-color-red-400);
    --p-color-stroke-strong-hover-grey: var(--p-color-red-400);
    --p-color-stroke-strong-pressed: var(--p-color-red-300);
    --p-color-stroke-strong-pressed-white: var(--p-color-red-300);
    --p-color-stroke-strong-pressed-grey: var(--p-color-red-300);
    --p-color-stroke: var(--p-color-grey-500);
    --p-color-stroke-white: var(--p-color-grey-500);
    --p-color-stroke-grey: var(--p-color-grey-500);
    --p-color-stroke-0: var(--p-color-stroke);
    --p-color-stroke-0-white: var(--p-color-stroke-white);
    --p-color-stroke-0-grey: var(--p-color-stroke-grey);
    --p-color-stroke-1: var(--p-color-stroke);
    --p-color-stroke-1-white: var(--p-color-stroke-white);
    --p-color-stroke-1-grey: var(--p-color-stroke-grey);
    --p-color-stroke-2: var(--p-color-stroke);
    --p-color-stroke-2-white: var(--p-color-stroke-white);
    --p-color-stroke-2-grey: var(--p-color-stroke-grey);
    --p-color-stroke-hover: var(--p-color-red-100);
    --p-color-stroke-white-hover: var(--p-color-red-100);
    --p-color-stroke-grey-hover: var(--p-color-red-100);
    --p-color-stroke-pressed: var(--p-color-red-200);
    --p-color-stroke-white-pressed: var(--p-color-red-200);
    --p-color-stroke-grey-pressed: var(--p-color-red-200);
    --p-color-stroke-on-white: var(--p-color-grey-700);
    --p-color-stroke-on-white-white: var(--p-color-grey-700);
    --p-color-stroke-on-white-grey: var(--p-color-grey-700);
    --p-color-stroke-subtle-0: var(--p-color-grey-800);
    --p-color-stroke-subtle-0-white: var(--p-color-grey-800);
    --p-color-stroke-subtle-0-grey: var(--p-color-grey-800);
    --p-color-stroke-subtle-1: var(--p-color-grey-700);
    --p-color-stroke-subtle-1-white: var(--p-color-grey-700);
    --p-color-stroke-subtle-1-grey: var(--p-color-grey-700);
    --p-color-stroke-subtle-2: var(--p-color-grey-600);
    --p-color-stroke-subtle-2-white: var(--p-color-grey-600);
    --p-color-stroke-subtle-2-grey: var(--p-color-grey-600);
    --p-color-stroke-subtle-on-white: var(--p-color-grey-800);
    --p-color-stroke-subtle-on-white-white: var(--p-color-grey-800);
    --p-color-stroke-subtle-on-white-grey: var(--p-color-grey-800);
    --p-color-stroke-subtle-hover: var(--p-color-red-200);
    --p-color-stroke-subtle-hover-white: var(--p-color-red-200);
    --p-color-stroke-subtle-hover-grey: var(--p-color-red-200);
    --p-color-stroke-subtle-pressed: var(--p-color-red-300);
    --p-color-stroke-subtle-pressed-white: var(--p-color-red-300);
    --p-color-stroke-subtle-pressed-grey: var(--p-color-red-300);
    --p-color-stroke-on-color: var(--p-color-red-900);
    --p-color-stroke-on-color-white: var(--p-color-red-900);
    --p-color-stroke-on-color-grey: var(--p-color-red-900);
    --p-color-stroke-interactive: var(--p-color-red-400);
    --p-color-stroke-interactive-white: var(--p-color-red-400);
    --p-color-stroke-interactive-grey: var(--p-color-red-400);
    --p-color-stroke-interactive-hover: var(--p-color-red-300);
    --p-color-stroke-interactive-hover-white: var(--p-color-red-300);
    --p-color-stroke-interactive-hover-grey: var(--p-color-red-300);
    --p-color-stroke-interactive-pressed: var(--p-color-red-200);
    --p-color-stroke-interactive-pressed-white: var(--p-color-red-200);
    --p-color-stroke-interactive-pressed-grey: var(--p-color-red-200);
    --p-color-stroke-selected: var(--p-color-red-300);
    --p-color-stroke-selected-white: var(--p-color-red-300);
    --p-color-stroke-selected-grey: var(--p-color-red-300);
    --p-color-stroke-selected-hover: var(--p-color-red-200);
    --p-color-stroke-selected-hover-white: var(--p-color-red-200);
    --p-color-stroke-selected-hover-grey: var(--p-color-red-200);
    --p-color-stroke-selected-pressed: var(--p-color-red-100);
    --p-color-stroke-selected-pressed-white: var(--p-color-red-100);
    --p-color-stroke-selected-pressed-grey: var(--p-color-red-100);
    --p-color-stroke-disabled: var(--p-color-grey-700);
    --p-color-stroke-disabled-white: var(--p-color-grey-700);
    --p-color-stroke-disabled-grey: var(--p-color-grey-700);
    --p-color-stroke-error: var(--p-color-red-400);
    --p-color-stroke-error-white: var(--p-color-red-400);
    --p-color-stroke-error-grey: var(--p-color-red-400);
    --p-color-stroke-success: var(--p-color-green-400);
    --p-color-stroke-success-white: var(--p-color-green-400);
    --p-color-stroke-success-grey: var(--p-color-green-400);
    --p-color-stroke-warning: var(--p-color-yellow-200);
    --p-color-stroke-warning-white: var(--p-color-yellow-200);
    --p-color-stroke-warning-grey: var(--p-color-yellow-200);
    --p-outline: 2px solid var(--p-color-states-focus);
    --p-outline-offset: 2px;
  }

  [data-theme="kron"] {
    --p-color-background: var(--p-color-grey-cold-000);
    --p-color-background-white: var(--p-color-grey-cold-000);
    --p-color-background-grey: var(--p-color-grey-cold-100);
    --p-color-background-hover: var(--p-color-grey-cold-100);
    --p-color-background-hover-white: var(--p-color-grey-cold-100);
    --p-color-background-hover-grey: var(--p-color-grey-cold-200);
    --p-color-background-pressed: var(--p-color-grey-cold-200);
    --p-color-background-pressed-white: var(--p-color-grey-cold-200);
    --p-color-background-pressed-grey: var(--p-color-grey-cold-300);
    --p-color-background-active: var(--p-color-red-600);
    --p-color-background-active-white: var(--p-color-red-600);
    --p-color-background-active-grey: var(--p-color-red-600);
    --p-color-background-disabled: var(--p-color-grey-cold-200);
    --p-color-background-disabled-white: var(--p-color-grey-cold-200);
    --p-color-background-disabled-grey: var(--p-color-grey-cold-300);
    --p-color-background-selected: var(--p-color-purple-700);
    --p-color-background-selected-white: var(--p-color-purple-700);
    --p-color-background-selected-grey: var(--p-color-purple-700);
    --p-color-background-selected-hover: var(--p-color-purple-800);
    --p-color-background-selected-hover-white: var(--p-color-purple-800);
    --p-color-background-selected-hover-grey: var(--p-color-purple-800);
    --p-color-background-selected-pressed: var(--p-color-purple-900);
    --p-color-background-selected-pressed-white: var(--p-color-purple-900);
    --p-color-background-selected-pressed-grey: var(--p-color-purple-900);
    --p-color-text-primary: var(--p-color-purple-900);
    --p-color-text-primary-white: var(--p-color-purple-900);
    --p-color-text-primary-grey: var(--p-color-purple-900);
    --p-color-text-primary-hover: var(--p-color-purple-800);
    --p-color-text-primary-hover-white: var(--p-color-purple-800);
    --p-color-text-primary-hover-grey: var(--p-color-purple-800);
    --p-color-text-primary-pressed: var(--p-color-purple-700);
    --p-color-text-primary-pressed-white: var(--p-color-purple-700);
    --p-color-text-primary-pressed-grey: var(--p-color-purple-700);
    --p-color-text-primary-active: var(--p-color-purple-700);
    --p-color-text-primary-active-white: var(--p-color-purple-700);
    --p-color-text-primary-active-grey: var(--p-color-purple-700);
    --p-color-text-interactive: var(--p-color-purple-800);
    --p-color-text-interactive-white: var(--p-color-purple-800);
    --p-color-text-interactive-grey: var(--p-color-purple-800);
    --p-color-text-interactive-hover: var(--p-color-purple-600);
    --p-color-text-interactive-hover-white: var(--p-color-purple-600);
    --p-color-text-interactive-hover-grey: var(--p-color-purple-600);
    --p-color-text-interactive-pressed: var(--p-color-purple-700);
    --p-color-text-interactive-pressed-white: var(--p-color-purple-700);
    --p-color-text-interactive-pressed-grey: var(--p-color-purple-700);
    --p-color-text-interactive-active: var(--p-color-purple-700);
    --p-color-text-interactive-active-white: var(--p-color-purple-700);
    --p-color-text-interactive-active-grey: var(--p-color-purple-700);
    --p-color-text-selected: var(--p-color-purple-700);
    --p-color-text-selected-white: var(--p-color-purple-700);
    --p-color-text-selected-grey: var(--p-color-purple-700);
    --p-color-text-selected-hover: var(--p-color-purple-800);
    --p-color-text-selected-hover-white: var(--p-color-purple-800);
    --p-color-text-selected-hover-grey: var(--p-color-purple-800);
    --p-color-text-selected-pressed: var(--p-color-purple-900);
    --p-color-text-selected-pressed-white: var(--p-color-purple-900);
    --p-color-text-selected-pressed-grey: var(--p-color-purple-900);
    --p-color-text-secondary: var(--p-color-grey-cold-700);
    --p-color-text-secondary-white: var(--p-color-grey-cold-700);
    --p-color-text-secondary-grey: var(--p-color-grey-cold-700);
    --p-color-text-placeholder: var(--p-color-grey-cold-600);
    --p-color-text-placeholder-white: var(--p-color-grey-cold-600);
    --p-color-text-placeholder-grey: var(--p-color-grey-cold-600);
    --p-color-text-on-color: var(--p-color-purple-100);
    --p-color-text-on-color-white: var(--p-color-purple-100);
    --p-color-text-on-color-grey: var(--p-color-purple-100);
    --p-color-text-disabled: var(--p-color-grey-cold-500);
    --p-color-text-disabled-white: var(--p-color-grey-cold-500);
    --p-color-text-disabled-grey: var(--p-color-grey-cold-500);
    --p-color-text-info: var(--p-color-blue-600);
    --p-color-text-info-white: var(--p-color-blue-600);
    --p-color-text-info-grey: var(--p-color-blue-600);
    --p-color-text-success: var(--p-color-green-600);
    --p-color-text-success-white: var(--p-color-green-600);
    --p-color-text-success-grey: var(--p-color-green-600);
    --p-color-text-warning: var(--p-color-yellow-600);
    --p-color-text-warning-white: var(--p-color-yellow-600);
    --p-color-text-warning-grey: var(--p-color-yellow-600);
    --p-color-text-error: var(--p-color-red-600);
    --p-color-text-error-white: var(--p-color-red-600);
    --p-color-text-error-grey: var(--p-color-red-600);
    --p-color-text-alert: var(--p-color-grey-cold-900);
    --p-color-text-alert-white: var(--p-color-grey-cold-900);
    --p-color-text-alert-grey: var(--p-color-grey-cold-900);
    --p-color-text-on-brand: var(--p-color-purple-100);
    --p-color-text-on-brand-white: var(--p-color-purple-100);
    --p-color-text-on-brand-grey: var(--p-color-purple-100);
    --p-color-text-on-error: var(--p-color-red-800);
    --p-color-text-on-info: var(--p-color-blue-800);
    --p-color-text-on-warning: var(--p-color-yellow-800);
    --p-color-text-on-success: var(--p-color-green-800);
    --p-color-text-on-purple: var(--p-color-purple-800);
    --p-color-text-on-orange: var(--p-color-red-800);
    --p-color-icon-primary: var(--p-color-purple-1000);
    --p-color-icon-primary-white: var(--p-color-purple-1000);
    --p-color-icon-primary-grey: var(--p-color-purple-1000);
    --p-color-icon-primary-hover: var(--p-color-purple-800);
    --p-color-icon-primary-hover-white: var(--p-color-purple-800);
    --p-color-icon-primary-hover-grey: var(--p-color-purple-800);
    --p-color-icon-primary-active: var(--p-color-purple-700);
    --p-color-icon-primary-active-white: var(--p-color-purple-700);
    --p-color-icon-primary-active-grey: var(--p-color-purple-700);
    --p-color-icon-primary-pressed: var(--p-color-purple-700);
    --p-color-icon-primary-pressed-white: var(--p-color-purple-700);
    --p-color-icon-primary-pressed-grey: var(--p-color-purple-700);
    --p-color-icon-interactive: var(--p-color-purple-800);
    --p-color-icon-interactive-white: var(--p-color-purple-800);
    --p-color-icon-interactive-grey: var(--p-color-purple-800);
    --p-color-icon-interactive-hover: var(--p-color-purple-600);
    --p-color-icon-interactive-hover-white: var(--p-color-purple-600);
    --p-color-icon-interactive-hover-grey: var(--p-color-purple-600);
    --p-color-icon-interactive-pressed: var(--p-color-purple-700);
    --p-color-icon-interactive-pressed-white: var(--p-color-purple-700);
    --p-color-icon-interactive-pressed-grey: var(--p-color-purple-700);
    --p-color-icon-interactive-active: var(--p-color-purple-700);
    --p-color-icon-interactive-active-white: var(--p-color-purple-700);
    --p-color-icon-interactive-active-grey: var(--p-color-purple-700);
    --p-color-icon-on-color: var(--p-color-purple-100);
    --p-color-icon-on-color-white: var(--p-color-purple-100);
    --p-color-icon-on-color-grey: var(--p-color-purple-100);
    --p-color-icon-disabled: var(--p-color-grey-cold-500);
    --p-color-icon-disabled-white: var(--p-color-grey-cold-500);
    --p-color-icon-disabled-grey: var(--p-color-grey-cold-500);
    --p-color-icon-error: var(--p-color-red-600);
    --p-color-icon-error-white: var(--p-color-red-600);
    --p-color-icon-error-grey: var(--p-color-red-600);
    --p-color-icon-success: var(--p-color-green-600);
    --p-color-icon-success-white: var(--p-color-green-600);
    --p-color-icon-success-grey: var(--p-color-green-600);
    --p-color-icon-warning: var(--p-color-yellow-600);
    --p-color-icon-warning-white: var(--p-color-yellow-600);
    --p-color-icon-warning-grey: var(--p-color-yellow-600);
    --p-color-icon-info: var(--p-color-blue-600);
    --p-color-icon-info-white: var(--p-color-blue-600);
    --p-color-icon-info-grey: var(--p-color-blue-600);
    --p-color-icon-neutral: var(--p-color-grey-cold-900);
    --p-color-icon-neutral-white: var(--p-color-grey-cold-900);
    --p-color-icon-neutral-grey: var(--p-color-grey-cold-900);
    --p-color-icon-on-brand: var(--p-color-purple-100);
    --p-color-icon-on-brand-white: var(--p-color-purple-100);
    --p-color-icon-on-brand-grey: var(--p-color-purple-100);
    --p-color-icon-on-error: var(--p-color-red-800);
    --p-color-icon-on-info: var(--p-color-blue-800);
    --p-color-icon-on-warning: var(--p-color-yellow-800);
    --p-color-icon-on-success: var(--p-color-green-800);
    --p-color-icon-on-purple: var(--p-color-purple-800);
    --p-color-icon-on-orange: var(--p-color-red-800);
    --p-color-button-brand-fill: var(--p-color-purple-500);
    --p-color-button-brand-fill-white: var(--p-color-purple-600);
    --p-color-button-brand-fill-grey: var(--p-color-purple-600);
    --p-color-button-brand-fill-hover: var(--p-color-purple-400);
    --p-color-button-brand-fill-hover-white: var(--p-color-purple-700);
    --p-color-button-brand-fill-hover-grey: var(--p-color-purple-700);
    --p-color-button-brand-fill-pressed: var(--p-color-purple-300);
    --p-color-button-brand-fill-pressed-white: var(--p-color-purple-800);
    --p-color-button-brand-fill-pressed-grey: var(--p-color-purple-800);
    --p-color-button-brand-fill-active: var(--p-color-purple-300);
    --p-color-button-brand-fill-active-white: var(--p-color-purple-800);
    --p-color-button-brand-fill-active-grey: var(--p-color-purple-800);
    --p-color-button-action-fill: var(--p-color-purple-400);
    --p-color-button-action-fill-white: var(--p-color-purple-900);
    --p-color-button-action-fill-grey: var(--p-color-purple-900);
    --p-color-button-action-fill-hover: var(--p-color-purple-300);
    --p-color-button-action-fill-hover-white: var(--p-color-purple-800);
    --p-color-button-action-fill-hover-grey: var(--p-color-purple-800);
    --p-color-button-action-fill-pressed: var(--p-color-purple-200);
    --p-color-button-action-fill-pressed-white: var(--p-color-purple-700);
    --p-color-button-action-fill-pressed-grey: var(--p-color-purple-700);
    --p-color-button-action-fill-active: var(--p-color-purple-200);
    --p-color-button-action-fill-active-white: var(--p-color-purple-700);
    --p-color-button-action-fill-active-grey: var(--p-color-purple-700);
    --p-color-button-disabled: var(--p-color-grey-cold-800);
    --p-color-button-disabled-white: var(--p-color-grey-cold-200);
    --p-color-button-disabled-grey: var(--p-color-grey-cold-300);
    --p-color-graphics-illustration-primary: var(--p-color-red-600);
    --p-color-graphics-illustration-primary-white: var(--p-color-red-600);
    --p-color-graphics-illustration-primary-grey: var(--p-color-red-600);
    --p-color-graphics-illustration-detail: var(--p-color-logo-red);
    --p-color-graphics-illustration-detail-white: var(--p-color-logo-red);
    --p-color-graphics-illustration-detail-grey: var(--p-color-logo-red);
    --p-color-graphics-illustration-base: var(--p-color-purple-900);
    --p-color-graphics-illustration-base-white: var(--p-color-purple-900);
    --p-color-graphics-illustration-base-grey: var(--p-color-purple-900);
    --p-color-graphics-illustration-white: var(--p-color-grey-cold-000);
    --p-color-graphics-illustration-white-white: var(--p-color-grey-cold-000);
    --p-color-graphics-illustration-white-grey: var(--p-color-grey-cold-000);
    --p-color-graphics-storebrand-icon-detail: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-detail-white: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-detail-grey: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-outline: var(--p-color-red-800);
    --p-color-graphics-storebrand-icon-outline-white: var(--p-color-red-800);
    --p-color-graphics-storebrand-icon-outline-grey: var(--p-color-red-800);
    --p-color-static-brand-foreground: var(--p-color-purple-600);
    --p-color-static-brand-foreground-white: var(--p-color-purple-600);
    --p-color-static-brand-foreground-grey: var(--p-color-purple-600);
    --p-color-static-brand-background: var(--p-color-purple-200);
    --p-color-static-brand-background-white: var(--p-color-purple-200);
    --p-color-static-brand-background-grey: var(--p-color-purple-200);
    --p-color-static-orange-foreground: var(--p-color-orange-600);
    --p-color-static-orange-foreground-white: var(--p-color-orange-600);
    --p-color-static-orange-foreground-grey: var(--p-color-orange-600);
    --p-color-static-orange-background: var(--p-color-orange-200);
    --p-color-static-orange-background-white: var(--p-color-orange-200);
    --p-color-static-orange-background-grey: var(--p-color-orange-300);
    --p-color-static-purple-foreground: var(--p-color-purple-600);
    --p-color-static-purple-foreground-white: var(--p-color-purple-600);
    --p-color-static-purple-foreground-grey: var(--p-color-purple-600);
    --p-color-static-purple-background: var(--p-color-purple-200);
    --p-color-static-purple-background-white: var(--p-color-purple-200);
    --p-color-static-purple-background-grey: var(--p-color-purple-300);
    --p-color-static-red-foreground: var(--p-color-red-600);
    --p-color-static-red-foreground-white: var(--p-color-red-600);
    --p-color-static-red-foreground-grey: var(--p-color-red-600);
    --p-color-static-red-background: var(--p-color-red-200);
    --p-color-static-red-background-white: var(--p-color-red-200);
    --p-color-static-red-background-grey: var(--p-color-red-200);
    --p-color-static-grey-foreground: var(--p-color-grey-cold-600);
    --p-color-static-grey-foreground-white: var(--p-color-grey-cold-600);
    --p-color-static-grey-foreground-grey: var(--p-color-grey-cold-600);
    --p-color-static-grey-background: var(--p-color-grey-cold-200);
    --p-color-static-grey-background-white: var(--p-color-grey-cold-200);
    --p-color-static-grey-background-grey: var(--p-color-grey-cold-300);
    --p-color-static-risk-filled: var(--p-color-purple-800);
    --p-color-static-risk-filled-white: var(--p-color-purple-800);
    --p-color-static-risk-filled-grey: var(--p-color-purple-800);
    --p-color-static-risk-unfilled: var(--p-color-purple-200);
    --p-color-static-risk-unfilled-white: var(--p-color-purple-200);
    --p-color-static-risk-unfilled-grey: var(--p-color-purple-200);
    --p-color-static-sustainability-filled: var(--p-color-green-700);
    --p-color-static-sustainability-filled-white: var(--p-color-green-700);
    --p-color-static-sustainability-filled-grey: var(--p-color-green-700);
    --p-color-static-sustainability-unfilled: var(--p-color-grey-cold-200);
    --p-color-static-sustainability-unfilled-white: var(--p-color-grey-cold-200);
    --p-color-static-sustainability-unfilled-grey: var(--p-color-grey-cold-200);
    --p-color-states-focus: var(--p-color-focus-1);
    --p-color-states-focus-white: var(--p-color-focus-1);
    --p-color-states-focus-grey: var(--p-color-focus-1);
    --p-color-states-scrim: var(--p-color-scrim-1);
    --p-color-states-scrim-white: var(--p-color-scrim-1);
    --p-color-states-scrim-grey: var(--p-color-scrim-1);
    --p-color-states-toggle-off: var(--p-color-grey-cold-400);
    --p-color-states-toggle-off-white: var(--p-color-grey-cold-400);
    --p-color-states-toggle-off-grey: var(--p-color-grey-cold-500);
    --p-color-states-toggle-off-hover: var(--p-color-grey-cold-300);
    --p-color-states-toggle-off-hover-white: var(--p-color-grey-cold-300);
    --p-color-states-toggle-off-hover-grey: var(--p-color-grey-cold-400);
    --p-color-surface-1: var(--p-color-grey-cold-100);
    --p-color-surface-1-white: var(--p-color-grey-cold-100);
    --p-color-surface-1-grey: var(--p-color-grey-cold-000);
    --p-color-surface-2: var(--p-color-grey-cold-000);
    --p-color-surface-2-white: var(--p-color-grey-cold-000);
    --p-color-surface-2-grey: var(--p-color-grey-cold-100);
    --p-color-surface-1-hover: var(--p-color-grey-cold-200);
    --p-color-surface-1-hover-white: var(--p-color-grey-cold-200);
    --p-color-surface-1-hover-grey: var(--p-color-grey-cold-200);
    --p-color-surface-2-hover: var(--p-color-grey-cold-200);
    --p-color-surface-2-hover-white: var(--p-color-grey-cold-200);
    --p-color-surface-2-hover-grey: var(--p-color-grey-cold-200);
    --p-color-surface-inverse: var(--p-color-purple-900);
    --p-color-surface-inverse-white: var(--p-color-purple-900);
    --p-color-surface-inverse-grey: var(--p-color-purple-900);
    --p-color-surface-inverse-hover: var(--p-color-purple-800);
    --p-color-surface-inverse-hover-white: var(--p-color-purple-800);
    --p-color-surface-inverse-hover-grey: var(--p-color-purple-800);
    --p-color-surface-inverse-pressed: var(--p-color-purple-700);
    --p-color-surface-inverse-pressed-white: var(--p-color-purple-700);
    --p-color-surface-inverse-pressed-grey: var(--p-color-purple-700);
    --p-color-surface-selected: var(--p-color-purple-600);
    --p-color-surface-selected-white: var(--p-color-purple-600);
    --p-color-surface-selected-grey: var(--p-color-purple-600);
    --p-color-surface-selected-hover: var(--p-color-purple-700);
    --p-color-surface-selected-hover-white: var(--p-color-purple-700);
    --p-color-surface-selected-hover-grey: var(--p-color-purple-700);
    --p-color-surface-selected-pressed: var(--p-color-purple-800);
    --p-color-surface-selected-pressed-white: var(--p-color-purple-800);
    --p-color-surface-selected-pressed-grey: var(--p-color-purple-800);
    --p-color-surface-selected-active: var(--p-color-purple-800);
    --p-color-surface-selected-active-white: var(--p-color-purple-800);
    --p-color-surface-selected-active-grey: var(--p-color-purple-800);
    --p-color-surface-error: var(--p-color-red-200);
    --p-color-surface-error-white: var(--p-color-red-200);
    --p-color-surface-error-grey: var(--p-color-red-200);
    --p-color-surface-success: var(--p-color-green-200);
    --p-color-surface-success-white: var(--p-color-green-200);
    --p-color-surface-success-grey: var(--p-color-green-200);
    --p-color-surface-warning: var(--p-color-yellow-200);
    --p-color-surface-warning-white: var(--p-color-yellow-200);
    --p-color-surface-warning-grey: var(--p-color-yellow-200);
    --p-color-surface-info: var(--p-color-blue-200);
    --p-color-surface-info-white: var(--p-color-blue-200);
    --p-color-surface-info-grey: var(--p-color-blue-200);
    --p-color-surface-neutral: var(--p-color-grey-cold-100);
    --p-color-surface-neutral-white: var(--p-color-grey-cold-000);
    --p-color-surface-neutral-grey: var(--p-color-grey-cold-100);
    --p-color-surface-static: var(--p-color-grey-cold-000);
    --p-color-surface-static-white: var(--p-color-grey-cold-000);
    --p-color-surface-static-grey: var(--p-color-grey-cold-000);
    --p-color-stroke-strong: var(--p-color-purple-900);
    --p-color-stroke-strong-white: var(--p-color-purple-900);
    --p-color-stroke-strong-grey: var(--p-color-purple-900);
    --p-color-stroke-strong-hover: var(--p-color-purple-800);
    --p-color-stroke-strong-hover-white: var(--p-color-purple-800);
    --p-color-stroke-strong-hover-grey: var(--p-color-purple-800);
    --p-color-stroke-strong-pressed: var(--p-color-purple-700);
    --p-color-stroke-strong-pressed-white: var(--p-color-purple-700);
    --p-color-stroke-strong-pressed-grey: var(--p-color-purple-700);
    --p-color-stroke: var(--p-color-grey-cold-500);
    --p-color-stroke-white: var(--p-color-grey-cold-500);
    --p-color-stroke-grey: var(--p-color-grey-cold-500);
    --p-color-stroke-0: var(--p-color-stroke);
    --p-color-stroke-0-white: var(--p-color-stroke-white);
    --p-color-stroke-0-grey: var(--p-color-stroke-grey);
    --p-color-stroke-1: var(--p-color-stroke);
    --p-color-stroke-1-white: var(--p-color-stroke-white);
    --p-color-stroke-1-grey: var(--p-color-stroke-grey);
    --p-color-stroke-2: var(--p-color-stroke);
    --p-color-stroke-2-white: var(--p-color-stroke-white);
    --p-color-stroke-2-grey: var(--p-color-stroke-grey);
    --p-color-stroke-hover: var(--p-color-purple-900);
    --p-color-stroke-white-hover: var(--p-color-purple-900);
    --p-color-stroke-grey-hover: var(--p-color-purple-900);
    --p-color-stroke-pressed: var(--p-color-purple-800);
    --p-color-stroke-white-pressed: var(--p-color-purple-800);
    --p-color-stroke-grey-pressed: var(--p-color-purple-800);
    --p-color-stroke-on-white: var(--p-color-grey-cold-300);
    --p-color-stroke-on-white-white: var(--p-color-grey-cold-300);
    --p-color-stroke-on-white-grey: var(--p-color-grey-cold-300);
    --p-color-stroke-subtle-0: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-0-white: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-0-grey: var(--p-color-grey-cold-300);
    --p-color-stroke-subtle-1: var(--p-color-grey-cold-300);
    --p-color-stroke-subtle-1-white: var(--p-color-grey-cold-300);
    --p-color-stroke-subtle-1-grey: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-2: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-2-white: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-2-grey: var(--p-color-grey-cold-300);
    --p-color-stroke-subtle-on-white: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-on-white-white: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-on-white-grey: var(--p-color-grey-cold-200);
    --p-color-stroke-on-color: var(--p-color-purple-100);
    --p-color-stroke-on-color-white: var(--p-color-purple-100);
    --p-color-stroke-on-color-grey: var(--p-color-purple-100);
    --p-color-stroke-interactive: var(--p-color-purple-600);
    --p-color-stroke-interactive-white: var(--p-color-purple-600);
    --p-color-stroke-interactive-grey: var(--p-color-purple-600);
    --p-color-stroke-interactive-hover: var(--p-color-purple-700);
    --p-color-stroke-interactive-hover-white: var(--p-color-purple-700);
    --p-color-stroke-interactive-hover-grey: var(--p-color-purple-700);
    --p-color-stroke-interactive-pressed: var(--p-color-purple-800);
    --p-color-stroke-interactive-pressed-white: var(--p-color-purple-800);
    --p-color-stroke-interactive-pressed-grey: var(--p-color-purple-800);
    --p-color-stroke-selected: var(--p-color-purple-700);
    --p-color-stroke-selected-white: var(--p-color-purple-700);
    --p-color-stroke-selected-grey: var(--p-color-purple-700);
    --p-color-stroke-selected-hover: var(--p-color-purple-800);
    --p-color-stroke-selected-hover-white: var(--p-color-purple-800);
    --p-color-stroke-selected-hover-grey: var(--p-color-purple-800);
    --p-color-stroke-selected-pressed: var(--p-color-purple-900);
    --p-color-stroke-selected-pressed-white: var(--p-color-purple-900);
    --p-color-stroke-selected-pressed-grey: var(--p-color-purple-900);
    --p-color-stroke-disabled: var(--p-color-grey-cold-400);
    --p-color-stroke-disabled-white: var(--p-color-grey-cold-400);
    --p-color-stroke-disabled-grey: var(--p-color-grey-cold-500);
    --p-color-stroke-error: var(--p-color-red-600);
    --p-color-stroke-error-white: var(--p-color-red-600);
    --p-color-stroke-error-grey: var(--p-color-red-600);
    --p-color-stroke-success: var(--p-color-green-600);
    --p-color-stroke-success-white: var(--p-color-green-600);
    --p-color-stroke-success-grey: var(--p-color-green-600);
    --p-color-stroke-warning: var(--p-color-yellow-600);
    --p-color-stroke-warning-white: var(--p-color-yellow-600);
    --p-color-stroke-warning-grey: var(--p-color-yellow-600);
    --p-color-monochromatic-red-1: var(--p-color-red-550);
    --p-color-monochromatic-red-1-white: var(--p-color-red-550);
    --p-color-monochromatic-red-1-grey: var(--p-color-red-550);
    --p-color-monochromatic-red-2: var(--p-color-red-600);
    --p-color-monochromatic-red-2-white: var(--p-color-red-600);
    --p-color-monochromatic-red-2-grey: var(--p-color-red-600);
    --p-color-monochromatic-red-3: var(--p-color-red-800);
    --p-color-monochromatic-red-3-white: var(--p-color-red-800);
    --p-color-monochromatic-red-3-grey: var(--p-color-red-800);
    --p-color-monochromatic-red-4: var(--p-color-red-900);
    --p-color-monochromatic-red-4-white: var(--p-color-red-900);
    --p-color-monochromatic-red-4-grey: var(--p-color-red-900);
    --p-color-monochromatic-purple-1: var(--p-color-purple-550);
    --p-color-monochromatic-purple-1-white: var(--p-color-purple-550);
    --p-color-monochromatic-purple-1-grey: var(--p-color-purple-550);
    --p-color-monochromatic-purple-2: var(--p-color-purple-600);
    --p-color-monochromatic-purple-2-white: var(--p-color-purple-600);
    --p-color-monochromatic-purple-2-grey: var(--p-color-purple-600);
    --p-color-monochromatic-purple-3: var(--p-color-purple-800);
    --p-color-monochromatic-purple-3-white: var(--p-color-purple-800);
    --p-color-monochromatic-purple-3-grey: var(--p-color-purple-800);
    --p-color-monochromatic-purple-4: var(--p-color-purple-900);
    --p-color-monochromatic-purple-4-white: var(--p-color-purple-900);
    --p-color-monochromatic-purple-4-grey: var(--p-color-purple-900);
    --p-color-categorical-1: var(--p-color-purple-800);
    --p-color-categorical-1-white: var(--p-color-purple-800);
    --p-color-categorical-1-grey: var(--p-color-purple-800);
    --p-color-categorical-2: var(--p-color-purple-550);
    --p-color-categorical-2-white: var(--p-color-purple-550);
    --p-color-categorical-2-grey: var(--p-color-purple-550);
    --p-color-categorical-3: var(--p-color-red-600);
    --p-color-categorical-3-white: var(--p-color-red-600);
    --p-color-categorical-3-grey: var(--p-color-red-600);
    --p-color-categorical-4: var(--p-color-purple-550);
    --p-color-categorical-4-white: var(--p-color-purple-550);
    --p-color-categorical-4-grey: var(--p-color-purple-550);
    --p-color-categorical-5: var(--p-color-purple-800);
    --p-color-categorical-5-white: var(--p-color-purple-800);
    --p-color-categorical-5-grey: var(--p-color-purple-800);
    --p-color-categorical-6: var(--p-color-grey-cold-500);
    --p-color-categorical-6-white: var(--p-color-grey-cold-500);
    --p-color-categorical-6-grey: var(--p-color-grey-cold-500);
    --p-color-categorical-7: var(--p-color-blue-700);
    --p-color-categorical-7-white: var(--p-color-blue-700);
    --p-color-categorical-7-grey: var(--p-color-blue-700);
    --p-color-categorical-8: var(--p-color-green-550);
    --p-color-categorical-8-white: var(--p-color-green-550);
    --p-color-categorical-8-grey: var(--p-color-green-550);
    --p-color-categorical-9: var(--p-color-purple-600);
    --p-color-categorical-9-white: var(--p-color-purple-600);
    --p-color-categorical-9-grey: var(--p-color-purple-600);
    --p-color-categorical-10: var(--p-color-blue-500);
    --p-color-categorical-10-white: var(--p-color-blue-500);
    --p-color-categorical-10-grey: var(--p-color-blue-500);
    --p-color-categorical-11: var(--p-color-green-700);
    --p-color-categorical-11-white: var(--p-color-green-700);
    --p-color-categorical-11-grey: var(--p-color-green-700);
    --p-color-categorical-12: var(--p-color-grey-cold-700);
    --p-color-categorical-12-white: var(--p-color-grey-cold-700);
    --p-color-categorical-12-grey: var(--p-color-grey-cold-700);
    --p-outline: 2px solid var(--p-color-states-focus);
    --p-outline-offset: 2px;
  }

  @media (prefers-color-scheme: dark) {
    [data-theme="kron"] {
      --p-color-background: var(--p-color-grey-cold-1000);
      --p-color-background-white: var(--p-color-grey-cold-1000);
      --p-color-background-grey: var(--p-color-grey-cold-900);
      --p-color-background-hover: var(--p-color-grey-cold-900);
      --p-color-background-hover-white: var(--p-color-grey-cold-900);
      --p-color-background-hover-grey: var(--p-color-grey-cold-800);
      --p-color-background-pressed: var(--p-color-grey-cold-800);
      --p-color-background-pressed-white: var(--p-color-grey-cold-800);
      --p-color-background-pressed-grey: var(--p-color-grey-cold-700);
      --p-color-background-active: var(--p-color-red-400);
      --p-color-background-active-white: var(--p-color-red-400);
      --p-color-background-active-grey: var(--p-color-red-400);
      --p-color-background-disabled: var(--p-color-grey-cold-800);
      --p-color-background-disabled-white: var(--p-color-grey-cold-800);
      --p-color-background-disabled-grey: var(--p-color-grey-cold-700);
      --p-color-background-selected: var(--p-color-purple-300);
      --p-color-background-selected-white: var(--p-color-purple-300);
      --p-color-background-selected-grey: var(--p-color-purple-300);
      --p-color-background-selected-hover: var(--p-color-purple-200);
      --p-color-background-selected-hover-white: var(--p-color-purple-200);
      --p-color-background-selected-hover-grey: var(--p-color-purple-200);
      --p-color-background-selected-pressed: var(--p-color-purple-100);
      --p-color-background-selected-pressed-white: var(--p-color-purple-100);
      --p-color-background-selected-pressed-grey: var(--p-color-purple-100);
      --p-color-text-primary: var(--p-color-purple-100);
      --p-color-text-primary-white: var(--p-color-purple-100);
      --p-color-text-primary-grey: var(--p-color-purple-100);
      --p-color-text-primary-hover: var(--p-color-purple-200);
      --p-color-text-primary-hover-white: var(--p-color-purple-200);
      --p-color-text-primary-hover-grey: var(--p-color-purple-200);
      --p-color-text-primary-pressed: var(--p-color-purple-300);
      --p-color-text-primary-pressed-white: var(--p-color-purple-300);
      --p-color-text-primary-pressed-grey: var(--p-color-purple-300);
      --p-color-text-primary-active: var(--p-color-purple-300);
      --p-color-text-primary-active-white: var(--p-color-purple-300);
      --p-color-text-primary-active-grey: var(--p-color-purple-300);
      --p-color-text-interactive: var(--p-color-purple-200);
      --p-color-text-interactive-white: var(--p-color-purple-200);
      --p-color-text-interactive-grey: var(--p-color-purple-200);
      --p-color-text-interactive-hover: var(--p-color-purple-400);
      --p-color-text-interactive-hover-white: var(--p-color-purple-400);
      --p-color-text-interactive-hover-grey: var(--p-color-purple-400);
      --p-color-text-interactive-pressed: var(--p-color-purple-300);
      --p-color-text-interactive-pressed-white: var(--p-color-purple-300);
      --p-color-text-interactive-pressed-grey: var(--p-color-purple-300);
      --p-color-text-interactive-active: var(--p-color-purple-300);
      --p-color-text-interactive-active-white: var(--p-color-purple-300);
      --p-color-text-interactive-active-grey: var(--p-color-purple-300);
      --p-color-text-selected: var(--p-color-purple-300);
      --p-color-text-selected-white: var(--p-color-purple-300);
      --p-color-text-selected-grey: var(--p-color-purple-300);
      --p-color-text-selected-hover: var(--p-color-purple-200);
      --p-color-text-selected-hover-white: var(--p-color-purple-200);
      --p-color-text-selected-hover-grey: var(--p-color-purple-200);
      --p-color-text-selected-pressed: var(--p-color-purple-100);
      --p-color-text-selected-pressed-white: var(--p-color-purple-100);
      --p-color-text-selected-pressed-grey: var(--p-color-purple-100);
      --p-color-text-secondary: var(--p-color-grey-cold-300);
      --p-color-text-secondary-white: var(--p-color-grey-cold-300);
      --p-color-text-secondary-grey: var(--p-color-grey-cold-300);
      --p-color-text-placeholder: var(--p-color-grey-cold-400);
      --p-color-text-placeholder-white: var(--p-color-grey-cold-400);
      --p-color-text-placeholder-grey: var(--p-color-grey-cold-400);
      --p-color-text-on-color: var(--p-color-purple-900);
      --p-color-text-on-color-white: var(--p-color-purple-900);
      --p-color-text-on-color-grey: var(--p-color-purple-900);
      --p-color-text-disabled: var(--p-color-grey-cold-700);
      --p-color-text-disabled-white: var(--p-color-grey-cold-700);
      --p-color-text-disabled-grey: var(--p-color-grey-cold-700);
      --p-color-text-info: var(--p-color-blue-400);
      --p-color-text-info-white: var(--p-color-blue-400);
      --p-color-text-info-grey: var(--p-color-blue-400);
      --p-color-text-success: var(--p-color-green-400);
      --p-color-text-success-white: var(--p-color-green-400);
      --p-color-text-success-grey: var(--p-color-green-400);
      --p-color-text-warning: var(--p-color-yellow-400);
      --p-color-text-warning-white: var(--p-color-yellow-400);
      --p-color-text-warning-grey: var(--p-color-yellow-400);
      --p-color-text-error: var(--p-color-red-400);
      --p-color-text-error-white: var(--p-color-red-400);
      --p-color-text-error-grey: var(--p-color-red-400);
      --p-color-text-alert: var(--p-color-grey-cold-100);
      --p-color-text-alert-white: var(--p-color-grey-cold-100);
      --p-color-text-alert-grey: var(--p-color-grey-cold-100);
      --p-color-text-on-brand: var(--p-color-purple-900);
      --p-color-text-on-brand-white: var(--p-color-purple-900);
      --p-color-text-on-brand-grey: var(--p-color-purple-900);
      --p-color-text-on-error: var(--p-color-red-200);
      --p-color-text-on-info: var(--p-color-blue-200);
      --p-color-text-on-warning: var(--p-color-yellow-200);
      --p-color-text-on-success: var(--p-color-green-200);
      --p-color-text-on-purple: var(--p-color-purple-200);
      --p-color-text-on-orange: var(--p-color-orange-200);
      --p-color-icon-primary: var(--p-color-purple-100);
      --p-color-icon-primary-white: var(--p-color-purple-100);
      --p-color-icon-primary-grey: var(--p-color-purple-100);
      --p-color-icon-primary-hover: var(--p-color-purple-200);
      --p-color-icon-primary-hover-white: var(--p-color-purple-200);
      --p-color-icon-primary-hover-grey: var(--p-color-purple-200);
      --p-color-icon-primary-active: var(--p-color-purple-300);
      --p-color-icon-primary-active-white: var(--p-color-purple-300);
      --p-color-icon-primary-active-grey: var(--p-color-purple-300);
      --p-color-icon-primary-pressed: var(--p-color-purple-300);
      --p-color-icon-primary-pressed-white: var(--p-color-purple-300);
      --p-color-icon-primary-pressed-grey: var(--p-color-purple-300);
      --p-color-icon-interactive: var(--p-color-purple-200);
      --p-color-icon-interactive-white: var(--p-color-purple-200);
      --p-color-icon-interactive-grey: var(--p-color-purple-200);
      --p-color-icon-interactive-hover: var(--p-color-purple-400);
      --p-color-icon-interactive-hover-white: var(--p-color-purple-400);
      --p-color-icon-interactive-hover-grey: var(--p-color-purple-400);
      --p-color-icon-interactive-pressed: var(--p-color-purple-300);
      --p-color-icon-interactive-pressed-white: var(--p-color-purple-300);
      --p-color-icon-interactive-pressed-grey: var(--p-color-purple-300);
      --p-color-icon-interactive-active: var(--p-color-purple-300);
      --p-color-icon-interactive-active-white: var(--p-color-purple-300);
      --p-color-icon-interactive-active-grey: var(--p-color-purple-300);
      --p-color-icon-on-color: var(--p-color-purple-900);
      --p-color-icon-on-color-white: var(--p-color-purple-900);
      --p-color-icon-on-color-grey: var(--p-color-purple-900);
      --p-color-icon-disabled: var(--p-color-grey-cold-700);
      --p-color-icon-disabled-white: var(--p-color-grey-cold-700);
      --p-color-icon-disabled-grey: var(--p-color-grey-cold-700);
      --p-color-icon-error: var(--p-color-red-400);
      --p-color-icon-error-white: var(--p-color-red-400);
      --p-color-icon-error-grey: var(--p-color-red-400);
      --p-color-icon-success: var(--p-color-green-400);
      --p-color-icon-success-white: var(--p-color-green-400);
      --p-color-icon-success-grey: var(--p-color-green-400);
      --p-color-icon-warning: var(--p-color-yellow-400);
      --p-color-icon-warning-white: var(--p-color-yellow-400);
      --p-color-icon-warning-grey: var(--p-color-yellow-400);
      --p-color-icon-info: var(--p-color-blue-400);
      --p-color-icon-info-white: var(--p-color-blue-400);
      --p-color-icon-info-grey: var(--p-color-blue-400);
      --p-color-icon-neutral: var(--p-color-grey-cold-100);
      --p-color-icon-neutral-white: var(--p-color-grey-cold-100);
      --p-color-icon-neutral-grey: var(--p-color-grey-cold-100);
      --p-color-icon-on-brand: var(--p-color-purple-900);
      --p-color-icon-on-brand-white: var(--p-color-purple-900);
      --p-color-icon-on-brand-grey: var(--p-color-purple-900);
      --p-color-icon-on-error: var(--p-color-red-200);
      --p-color-icon-on-info: var(--p-color-blue-200);
      --p-color-icon-on-warning: var(--p-color-yellow-200);
      --p-color-icon-on-success: var(--p-color-green-200);
      --p-color-icon-on-purple: var(--p-color-purple-200);
      --p-color-icon-on-orange: var(--p-color-orange-200);
      --p-color-button-brand-fill: var(--p-color-purple-400);
      --p-color-button-brand-fill-white: var(--p-color-purple-400);
      --p-color-button-brand-fill-grey: var(--p-color-purple-400);
      --p-color-button-brand-fill-hover: var(--p-color-purple-300);
      --p-color-button-brand-fill-hover-white: var(--p-color-purple-300);
      --p-color-button-brand-fill-hover-grey: var(--p-color-purple-300);
      --p-color-button-brand-fill-pressed: var(--p-color-purple-200);
      --p-color-button-brand-fill-pressed-white: var(--p-color-purple-200);
      --p-color-button-brand-fill-pressed-grey: var(--p-color-purple-200);
      --p-color-button-brand-fill-active: var(--p-color-purple-200);
      --p-color-button-brand-fill-active-white: var(--p-color-purple-200);
      --p-color-button-brand-fill-active-grey: var(--p-color-purple-200);
      --p-color-button-action-fill: var(--p-color-purple-200);
      --p-color-button-action-fill-white: var(--p-color-purple-200);
      --p-color-button-action-fill-grey: var(--p-color-purple-200);
      --p-color-button-action-fill-hover: var(--p-color-purple-400);
      --p-color-button-action-fill-hover-white: var(--p-color-purple-400);
      --p-color-button-action-fill-hover-grey: var(--p-color-purple-400);
      --p-color-button-action-fill-pressed: var(--p-color-purple-300);
      --p-color-button-action-fill-pressed-white: var(--p-color-purple-300);
      --p-color-button-action-fill-pressed-grey: var(--p-color-purple-300);
      --p-color-button-action-fill-active: var(--p-color-purple-300);
      --p-color-button-action-fill-active-white: var(--p-color-purple-300);
      --p-color-button-action-fill-active-grey: var(--p-color-purple-300);
      --p-color-button-disabled: var(--p-color-grey-cold-500);
      --p-color-button-disabled-white: var(--p-color-grey-cold-500);
      --p-color-button-disabled-grey: var(--p-color-grey-cold-600);
      --p-color-graphics-illustration-primary: var(--p-color-red-400);
      --p-color-graphics-illustration-primary-white: var(--p-color-red-400);
      --p-color-graphics-illustration-primary-grey: var(--p-color-red-400);
      --p-color-graphics-illustration-detail: var(--p-color-logo-red);
      --p-color-graphics-illustration-detail-white: var(--p-color-logo-red);
      --p-color-graphics-illustration-detail-grey: var(--p-color-logo-red);
      --p-color-graphics-illustration-base: var(--p-color-purple-100);
      --p-color-graphics-illustration-base-white: var(--p-color-purple-100);
      --p-color-graphics-illustration-base-grey: var(--p-color-purple-100);
      --p-color-graphics-illustration-white: var(--p-color-grey-cold-1000);
      --p-color-graphics-illustration-white-white: var(--p-color-grey-cold-1000);
      --p-color-graphics-illustration-white-grey: var(--p-color-grey-cold-1000);
      --p-color-graphics-storebrand-icon-detail: var(--p-color-logo-red);
      --p-color-graphics-storebrand-icon-detail-white: var(--p-color-logo-red);
      --p-color-graphics-storebrand-icon-detail-grey: var(--p-color-logo-red);
      --p-color-graphics-storebrand-icon-outline: var(--p-color-red-200);
      --p-color-graphics-storebrand-icon-outline-white: var(--p-color-red-200);
      --p-color-graphics-storebrand-icon-outline-grey: var(--p-color-red-200);
      --p-color-static-brand-foreground: var(--p-color-purple-400);
      --p-color-static-brand-foreground-white: var(--p-color-purple-400);
      --p-color-static-brand-foreground-grey: var(--p-color-purple-400);
      --p-color-static-brand-background: var(--p-color-purple-800);
      --p-color-static-brand-background-white: var(--p-color-purple-800);
      --p-color-static-brand-background-grey: var(--p-color-purple-800);
      --p-color-static-orange-foreground: var(--p-color-orange-400);
      --p-color-static-orange-foreground-white: var(--p-color-orange-400);
      --p-color-static-orange-foreground-grey: var(--p-color-orange-400);
      --p-color-static-orange-background: var(--p-color-orange-pale-800);
      --p-color-static-orange-background-white: var(--p-color-orange-pale-800);
      --p-color-static-orange-background-grey: var(--p-color-orange-pale-800);
      --p-color-static-purple-foreground: var(--p-color-purple-400);
      --p-color-static-purple-foreground-white: var(--p-color-purple-400);
      --p-color-static-purple-foreground-grey: var(--p-color-purple-400);
      --p-color-static-purple-background: var(--p-color-purple-800);
      --p-color-static-purple-background-white: var(--p-color-purple-800);
      --p-color-static-purple-background-grey: var(--p-color-purple-700);
      --p-color-static-red-foreground: var(--p-color-red-400);
      --p-color-static-red-foreground-white: var(--p-color-red-400);
      --p-color-static-red-foreground-grey: var(--p-color-red-400);
      --p-color-static-red-background: var(--p-color-red-800);
      --p-color-static-red-background-white: var(--p-color-red-800);
      --p-color-static-red-background-grey: var(--p-color-red-800);
      --p-color-static-grey-foreground: var(--p-color-grey-cold-400);
      --p-color-static-grey-foreground-white: var(--p-color-grey-cold-400);
      --p-color-static-grey-foreground-grey: var(--p-color-grey-cold-400);
      --p-color-static-grey-background: var(--p-color-grey-cold-800);
      --p-color-static-grey-background-white: var(--p-color-grey-cold-800);
      --p-color-static-grey-background-grey: var(--p-color-grey-cold-700);
      --p-color-static-risk-filled: var(--p-color-purple-400);
      --p-color-static-risk-filled-white: var(--p-color-purple-400);
      --p-color-static-risk-filled-grey: var(--p-color-purple-400);
      --p-color-static-risk-unfilled: var(--p-color-purple-600);
      --p-color-static-risk-unfilled-white: var(--p-color-purple-600);
      --p-color-static-risk-unfilled-grey: var(--p-color-purple-600);
      --p-color-static-sustainability-filled: var(--p-color-green-300);
      --p-color-static-sustainability-filled-white: var(--p-color-green-300);
      --p-color-static-sustainability-filled-grey: var(--p-color-green-300);
      --p-color-static-sustainability-unfilled: var(--p-color-grey-cold-800);
      --p-color-static-sustainability-unfilled-white: var(--p-color-grey-cold-800);
      --p-color-static-sustainability-unfilled-grey: var(--p-color-grey-cold-800);
      --p-color-states-focus: var(--p-color-focus-1);
      --p-color-states-focus-white: var(--p-color-focus-1);
      --p-color-states-focus-grey: var(--p-color-focus-1);
      --p-color-states-scrim: var(--p-color-scrim-1);
      --p-color-states-scrim-white: var(--p-color-scrim-1);
      --p-color-states-scrim-grey: var(--p-color-scrim-1);
      --p-color-states-toggle-off: var(--p-color-grey-cold-800);
      --p-color-states-toggle-off-white: var(--p-color-grey-cold-800);
      --p-color-states-toggle-off-grey: var(--p-color-grey-cold-500);
      --p-color-states-toggle-off-hover: var(--p-color-grey-cold-700);
      --p-color-states-toggle-off-hover-white: var(--p-color-grey-cold-700);
      --p-color-states-toggle-off-hover-grey: var(--p-color-grey-cold-600);
      --p-color-surface-1: var(--p-color-grey-cold-900);
      --p-color-surface-1-white: var(--p-color-grey-cold-900);
      --p-color-surface-1-grey: var(--p-color-grey-cold-1000);
      --p-color-surface-2: var(--p-color-grey-cold-1000);
      --p-color-surface-2-white: var(--p-color-grey-cold-1000);
      --p-color-surface-2-grey: var(--p-color-grey-cold-900);
      --p-color-surface-1-hover: var(--p-color-grey-cold-800);
      --p-color-surface-1-hover-white: var(--p-color-grey-cold-800);
      --p-color-surface-1-hover-grey: var(--p-color-grey-cold-800);
      --p-color-surface-2-hover: var(--p-color-grey-cold-800);
      --p-color-surface-2-hover-white: var(--p-color-grey-cold-800);
      --p-color-surface-2-hover-grey: var(--p-color-grey-cold-800);
      --p-color-surface-inverse: var(--p-color-purple-100);
      --p-color-surface-inverse-white: var(--p-color-purple-100);
      --p-color-surface-inverse-grey: var(--p-color-purple-100);
      --p-color-surface-inverse-hover: var(--p-color-purple-200);
      --p-color-surface-inverse-hover-white: var(--p-color-purple-200);
      --p-color-surface-inverse-hover-grey: var(--p-color-purple-200);
      --p-color-surface-inverse-pressed: var(--p-color-purple-300);
      --p-color-surface-inverse-pressed-white: var(--p-color-purple-300);
      --p-color-surface-inverse-pressed-grey: var(--p-color-purple-300);
      --p-color-surface-selected: var(--p-color-purple-400);
      --p-color-surface-selected-white: var(--p-color-purple-400);
      --p-color-surface-selected-grey: var(--p-color-purple-400);
      --p-color-surface-selected-hover: var(--p-color-purple-300);
      --p-color-surface-selected-hover-white: var(--p-color-purple-300);
      --p-color-surface-selected-hover-grey: var(--p-color-purple-300);
      --p-color-surface-selected-pressed: var(--p-color-purple-200);
      --p-color-surface-selected-pressed-white: var(--p-color-purple-200);
      --p-color-surface-selected-pressed-grey: var(--p-color-purple-200);
      --p-color-surface-selected-active: var(--p-color-purple-200);
      --p-color-surface-selected-active-white: var(--p-color-purple-200);
      --p-color-surface-selected-active-grey: var(--p-color-purple-200);
      --p-color-surface-error: var(--p-color-red-800);
      --p-color-surface-error-white: var(--p-color-red-800);
      --p-color-surface-error-grey: var(--p-color-red-800);
      --p-color-surface-success: var(--p-color-green-800);
      --p-color-surface-success-white: var(--p-color-green-800);
      --p-color-surface-success-grey: var(--p-color-green-800);
      --p-color-surface-warning: var(--p-color-yellow-800);
      --p-color-surface-warning-white: var(--p-color-yellow-800);
      --p-color-surface-warning-grey: var(--p-color-yellow-800);
      --p-color-surface-info: var(--p-color-blue-pale-800);
      --p-color-surface-info-white: var(--p-color-blue-pale-800);
      --p-color-surface-info-grey: var(--p-color-blue-pale-800);
      --p-color-surface-neutral: var(--p-color-grey-cold-900);
      --p-color-surface-neutral-white: var(--p-color-grey-cold-1000);
      --p-color-surface-neutral-grey: var(--p-color-grey-cold-900);
      --p-color-surface-static: var(--p-color-grey-cold-1000);
      --p-color-surface-static-white: var(--p-color-grey-cold-1000);
      --p-color-surface-static-grey: var(--p-color-grey-cold-1000);
      --p-color-stroke-strong: var(--p-color-purple-100);
      --p-color-stroke-strong-white: var(--p-color-purple-100);
      --p-color-stroke-strong-grey: var(--p-color-purple-100);
      --p-color-stroke-strong-hover: var(--p-color-purple-200);
      --p-color-stroke-strong-hover-white: var(--p-color-purple-200);
      --p-color-stroke-strong-hover-grey: var(--p-color-purple-200);
      --p-color-stroke-strong-pressed: var(--p-color-purple-300);
      --p-color-stroke-strong-pressed-white: var(--p-color-purple-300);
      --p-color-stroke-strong-pressed-grey: var(--p-color-purple-300);
      --p-color-stroke-0: var(--p-color-grey-cold-700);
      --p-color-stroke-0-white: var(--p-color-grey-cold-700);
      --p-color-stroke-0-grey: var(--p-color-grey-cold-600);
      --p-color-stroke-1: var(--p-color-grey-cold-600);
      --p-color-stroke-1-white: var(--p-color-grey-cold-600);
      --p-color-stroke-1-grey: var(--p-color-grey-cold-700);
      --p-color-stroke-2: var(--p-color-grey-cold-700);
      --p-color-stroke-2-white: var(--p-color-grey-cold-700);
      --p-color-stroke-2-grey: var(--p-color-grey-cold-600);
      --p-color-stroke-on-white: var(--p-color-grey-cold-700);
      --p-color-stroke-on-white-white: var(--p-color-grey-cold-700);
      --p-color-stroke-on-white-grey: var(--p-color-grey-cold-700);
      --p-color-stroke-subtle-0: var(--p-color-grey-cold-800);
      --p-color-stroke-subtle-0-white: var(--p-color-grey-cold-800);
      --p-color-stroke-subtle-0-grey: var(--p-color-grey-cold-700);
      --p-color-stroke-subtle-1: var(--p-color-grey-cold-700);
      --p-color-stroke-subtle-1-white: var(--p-color-grey-cold-700);
      --p-color-stroke-subtle-1-grey: var(--p-color-grey-cold-800);
      --p-color-stroke-subtle-2: var(--p-color-grey-cold-800);
      --p-color-stroke-subtle-2-white: var(--p-color-grey-cold-800);
      --p-color-stroke-subtle-2-grey: var(--p-color-grey-cold-700);
      --p-color-stroke-subtle-on-white: var(--p-color-grey-cold-800);
      --p-color-stroke-subtle-on-white-white: var(--p-color-grey-cold-800);
      --p-color-stroke-subtle-on-white-grey: var(--p-color-grey-cold-800);
      --p-color-stroke-on-color: var(--p-color-purple-900);
      --p-color-stroke-on-color-white: var(--p-color-purple-900);
      --p-color-stroke-on-color-grey: var(--p-color-purple-900);
      --p-color-stroke-interactive: var(--p-color-purple-400);
      --p-color-stroke-interactive-white: var(--p-color-purple-400);
      --p-color-stroke-interactive-grey: var(--p-color-purple-400);
      --p-color-stroke-interactive-hover: var(--p-color-purple-300);
      --p-color-stroke-interactive-hover-white: var(--p-color-purple-300);
      --p-color-stroke-interactive-hover-grey: var(--p-color-purple-300);
      --p-color-stroke-interactive-pressed: var(--p-color-purple-200);
      --p-color-stroke-interactive-pressed-white: var(--p-color-purple-200);
      --p-color-stroke-interactive-pressed-grey: var(--p-color-purple-200);
      --p-color-stroke-selected: var(--p-color-purple-300);
      --p-color-stroke-selected-white: var(--p-color-purple-300);
      --p-color-stroke-selected-grey: var(--p-color-purple-300);
      --p-color-stroke-selected-hover: var(--p-color-purple-200);
      --p-color-stroke-selected-hover-white: var(--p-color-purple-200);
      --p-color-stroke-selected-hover-grey: var(--p-color-purple-200);
      --p-color-stroke-selected-pressed: var(--p-color-purple-100);
      --p-color-stroke-selected-pressed-white: var(--p-color-purple-100);
      --p-color-stroke-selected-pressed-grey: var(--p-color-purple-100);
      --p-color-stroke-disabled: var(--p-color-grey-cold-600);
      --p-color-stroke-disabled-white: var(--p-color-grey-cold-600);
      --p-color-stroke-disabled-grey: var(--p-color-grey-cold-500);
      --p-color-stroke-error: var(--p-color-red-400);
      --p-color-stroke-error-white: var(--p-color-red-400);
      --p-color-stroke-error-grey: var(--p-color-red-400);
      --p-color-stroke-success: var(--p-color-green-400);
      --p-color-stroke-success-white: var(--p-color-green-400);
      --p-color-stroke-success-grey: var(--p-color-green-400);
      --p-color-stroke-warning: var(--p-color-yellow-400);
      --p-color-stroke-warning-white: var(--p-color-yellow-400);
      --p-color-stroke-warning-grey: var(--p-color-yellow-400);
      --p-color-monochromatic-red-1: var(--p-color-red-550);
      --p-color-monochromatic-red-1-white: var(--p-color-red-550);
      --p-color-monochromatic-red-1-grey: var(--p-color-red-550);
      --p-color-monochromatic-red-2: var(--p-color-red-400);
      --p-color-monochromatic-red-2-white: var(--p-color-red-400);
      --p-color-monochromatic-red-2-grey: var(--p-color-red-400);
      --p-color-monochromatic-red-3: var(--p-color-red-300);
      --p-color-monochromatic-red-3-white: var(--p-color-red-300);
      --p-color-monochromatic-red-3-grey: var(--p-color-red-300);
      --p-color-monochromatic-red-4: var(--p-color-red-200);
      --p-color-monochromatic-red-4-white: var(--p-color-red-200);
      --p-color-monochromatic-red-4-grey: var(--p-color-red-200);
      --p-color-monochromatic-purple-1: var(--p-color-purple-550);
      --p-color-monochromatic-purple-1-white: var(--p-color-purple-550);
      --p-color-monochromatic-purple-1-grey: var(--p-color-purple-550);
      --p-color-monochromatic-purple-2: var(--p-color-purple-400);
      --p-color-monochromatic-purple-2-white: var(--p-color-purple-400);
      --p-color-monochromatic-purple-2-grey: var(--p-color-purple-400);
      --p-color-monochromatic-purple-3: var(--p-color-purple-300);
      --p-color-monochromatic-purple-3-white: var(--p-color-purple-300);
      --p-color-monochromatic-purple-3-grey: var(--p-color-purple-300);
      --p-color-monochromatic-purple-4: var(--p-color-purple-200);
      --p-color-monochromatic-purple-4-white: var(--p-color-purple-200);
      --p-color-monochromatic-purple-4-grey: var(--p-color-purple-200);
      --p-color-categorical-1: var(--p-color-purple-800);
      --p-color-categorical-1-white: var(--p-color-purple-800);
      --p-color-categorical-1-grey: var(--p-color-purple-800);
      --p-color-categorical-2: var(--p-color-purple-600);
      --p-color-categorical-2-white: var(--p-color-purple-600);
      --p-color-categorical-2-grey: var(--p-color-purple-600);
      --p-color-categorical-3: var(--p-color-red-600);
      --p-color-categorical-3-white: var(--p-color-red-600);
      --p-color-categorical-3-grey: var(--p-color-red-600);
      --p-color-categorical-4: var(--p-color-purple-550);
      --p-color-categorical-4-white: var(--p-color-purple-550);
      --p-color-categorical-4-grey: var(--p-color-purple-550);
      --p-color-categorical-5: var(--p-color-purple-400);
      --p-color-categorical-5-white: var(--p-color-purple-400);
      --p-color-categorical-5-grey: var(--p-color-purple-400);
      --p-color-categorical-6: var(--p-color-grey-cold-500);
      --p-color-categorical-6-white: var(--p-color-grey-cold-500);
      --p-color-categorical-6-grey: var(--p-color-grey-cold-500);
      --p-color-categorical-7: var(--p-color-blue-300);
      --p-color-categorical-7-white: var(--p-color-blue-300);
      --p-color-categorical-7-grey: var(--p-color-blue-300);
      --p-color-categorical-8: var(--p-color-green-550);
      --p-color-categorical-8-white: var(--p-color-green-550);
      --p-color-categorical-8-grey: var(--p-color-green-550);
      --p-color-categorical-9: var(--p-color-purple-600);
      --p-color-categorical-9-white: var(--p-color-purple-600);
      --p-color-categorical-9-grey: var(--p-color-purple-600);
      --p-color-categorical-10: var(--p-color-blue-500);
      --p-color-categorical-10-white: var(--p-color-blue-500);
      --p-color-categorical-10-grey: var(--p-color-blue-500);
      --p-color-categorical-11: var(--p-color-green-700);
      --p-color-categorical-11-white: var(--p-color-green-700);
      --p-color-categorical-11-grey: var(--p-color-green-700);
      --p-color-categorical-12: var(--p-color-grey-cold-700);
      --p-color-categorical-12-white: var(--p-color-grey-cold-700);
      --p-color-categorical-12-grey: var(--p-color-grey-cold-700);
      --p-outline: 2px solid var(--p-color-states-focus);
      --p-outline-offset: 2px;
    }
  }

  [data-theme="kron-light"] {
    --p-color-background: var(--p-color-grey-cold-000);
    --p-color-background-white: var(--p-color-grey-cold-000);
    --p-color-background-grey: var(--p-color-grey-cold-100);
    --p-color-background-hover: var(--p-color-grey-cold-100);
    --p-color-background-hover-white: var(--p-color-grey-cold-100);
    --p-color-background-hover-grey: var(--p-color-grey-cold-200);
    --p-color-background-pressed: var(--p-color-grey-cold-200);
    --p-color-background-pressed-white: var(--p-color-grey-cold-200);
    --p-color-background-pressed-grey: var(--p-color-grey-cold-300);
    --p-color-background-active: var(--p-color-red-600);
    --p-color-background-active-white: var(--p-color-red-600);
    --p-color-background-active-grey: var(--p-color-red-600);
    --p-color-background-disabled: var(--p-color-grey-cold-200);
    --p-color-background-disabled-white: var(--p-color-grey-cold-200);
    --p-color-background-disabled-grey: var(--p-color-grey-cold-300);
    --p-color-background-selected: var(--p-color-purple-700);
    --p-color-background-selected-white: var(--p-color-purple-700);
    --p-color-background-selected-grey: var(--p-color-purple-700);
    --p-color-background-selected-hover: var(--p-color-purple-800);
    --p-color-background-selected-hover-white: var(--p-color-purple-800);
    --p-color-background-selected-hover-grey: var(--p-color-purple-800);
    --p-color-background-selected-pressed: var(--p-color-purple-900);
    --p-color-background-selected-pressed-white: var(--p-color-purple-900);
    --p-color-background-selected-pressed-grey: var(--p-color-purple-900);
    --p-color-text-primary: var(--p-color-purple-900);
    --p-color-text-primary-white: var(--p-color-purple-900);
    --p-color-text-primary-grey: var(--p-color-purple-900);
    --p-color-text-primary-hover: var(--p-color-purple-800);
    --p-color-text-primary-hover-white: var(--p-color-purple-800);
    --p-color-text-primary-hover-grey: var(--p-color-purple-800);
    --p-color-text-primary-pressed: var(--p-color-purple-700);
    --p-color-text-primary-pressed-white: var(--p-color-purple-700);
    --p-color-text-primary-pressed-grey: var(--p-color-purple-700);
    --p-color-text-primary-active: var(--p-color-purple-700);
    --p-color-text-primary-active-white: var(--p-color-purple-700);
    --p-color-text-primary-active-grey: var(--p-color-purple-700);
    --p-color-text-interactive: var(--p-color-purple-800);
    --p-color-text-interactive-white: var(--p-color-purple-800);
    --p-color-text-interactive-grey: var(--p-color-purple-800);
    --p-color-text-interactive-hover: var(--p-color-purple-600);
    --p-color-text-interactive-hover-white: var(--p-color-purple-600);
    --p-color-text-interactive-hover-grey: var(--p-color-purple-600);
    --p-color-text-interactive-pressed: var(--p-color-purple-700);
    --p-color-text-interactive-pressed-white: var(--p-color-purple-700);
    --p-color-text-interactive-pressed-grey: var(--p-color-purple-700);
    --p-color-text-interactive-active: var(--p-color-purple-700);
    --p-color-text-interactive-active-white: var(--p-color-purple-700);
    --p-color-text-interactive-active-grey: var(--p-color-purple-700);
    --p-color-text-selected: var(--p-color-purple-700);
    --p-color-text-selected-white: var(--p-color-purple-700);
    --p-color-text-selected-grey: var(--p-color-purple-700);
    --p-color-text-selected-hover: var(--p-color-purple-800);
    --p-color-text-selected-hover-white: var(--p-color-purple-800);
    --p-color-text-selected-hover-grey: var(--p-color-purple-800);
    --p-color-text-selected-pressed: var(--p-color-purple-900);
    --p-color-text-selected-pressed-white: var(--p-color-purple-900);
    --p-color-text-selected-pressed-grey: var(--p-color-purple-900);
    --p-color-text-secondary: var(--p-color-grey-cold-700);
    --p-color-text-secondary-white: var(--p-color-grey-cold-700);
    --p-color-text-secondary-grey: var(--p-color-grey-cold-700);
    --p-color-text-placeholder: var(--p-color-grey-cold-600);
    --p-color-text-placeholder-white: var(--p-color-grey-cold-600);
    --p-color-text-placeholder-grey: var(--p-color-grey-cold-600);
    --p-color-text-on-color: var(--p-color-purple-100);
    --p-color-text-on-color-white: var(--p-color-purple-100);
    --p-color-text-on-color-grey: var(--p-color-purple-100);
    --p-color-text-disabled: var(--p-color-grey-cold-500);
    --p-color-text-disabled-white: var(--p-color-grey-cold-500);
    --p-color-text-disabled-grey: var(--p-color-grey-cold-500);
    --p-color-text-info: var(--p-color-blue-600);
    --p-color-text-info-white: var(--p-color-blue-600);
    --p-color-text-info-grey: var(--p-color-blue-600);
    --p-color-text-success: var(--p-color-green-600);
    --p-color-text-success-white: var(--p-color-green-600);
    --p-color-text-success-grey: var(--p-color-green-600);
    --p-color-text-warning: var(--p-color-yellow-600);
    --p-color-text-warning-white: var(--p-color-yellow-600);
    --p-color-text-warning-grey: var(--p-color-yellow-600);
    --p-color-text-error: var(--p-color-red-600);
    --p-color-text-error-white: var(--p-color-red-600);
    --p-color-text-error-grey: var(--p-color-red-600);
    --p-color-text-alert: var(--p-color-grey-cold-900);
    --p-color-text-alert-white: var(--p-color-grey-cold-900);
    --p-color-text-alert-grey: var(--p-color-grey-cold-900);
    --p-color-text-on-brand: var(--p-color-purple-100);
    --p-color-text-on-brand-white: var(--p-color-purple-100);
    --p-color-text-on-brand-grey: var(--p-color-purple-100);
    --p-color-text-on-error: var(--p-color-red-800);
    --p-color-text-on-info: var(--p-color-blue-800);
    --p-color-text-on-warning: var(--p-color-yellow-800);
    --p-color-text-on-success: var(--p-color-green-800);
    --p-color-text-on-purple: var(--p-color-purple-800);
    --p-color-text-on-orange: var(--p-color-red-800);
    --p-color-icon-primary: var(--p-color-purple-1000);
    --p-color-icon-primary-white: var(--p-color-purple-1000);
    --p-color-icon-primary-grey: var(--p-color-purple-1000);
    --p-color-icon-primary-hover: var(--p-color-purple-800);
    --p-color-icon-primary-hover-white: var(--p-color-purple-800);
    --p-color-icon-primary-hover-grey: var(--p-color-purple-800);
    --p-color-icon-primary-active: var(--p-color-purple-700);
    --p-color-icon-primary-active-white: var(--p-color-purple-700);
    --p-color-icon-primary-active-grey: var(--p-color-purple-700);
    --p-color-icon-primary-pressed: var(--p-color-purple-700);
    --p-color-icon-primary-pressed-white: var(--p-color-purple-700);
    --p-color-icon-primary-pressed-grey: var(--p-color-purple-700);
    --p-color-icon-interactive: var(--p-color-purple-800);
    --p-color-icon-interactive-white: var(--p-color-purple-800);
    --p-color-icon-interactive-grey: var(--p-color-purple-800);
    --p-color-icon-interactive-hover: var(--p-color-purple-600);
    --p-color-icon-interactive-hover-white: var(--p-color-purple-600);
    --p-color-icon-interactive-hover-grey: var(--p-color-purple-600);
    --p-color-icon-interactive-pressed: var(--p-color-purple-700);
    --p-color-icon-interactive-pressed-white: var(--p-color-purple-700);
    --p-color-icon-interactive-pressed-grey: var(--p-color-purple-700);
    --p-color-icon-interactive-active: var(--p-color-purple-700);
    --p-color-icon-interactive-active-white: var(--p-color-purple-700);
    --p-color-icon-interactive-active-grey: var(--p-color-purple-700);
    --p-color-icon-on-color: var(--p-color-purple-100);
    --p-color-icon-on-color-white: var(--p-color-purple-100);
    --p-color-icon-on-color-grey: var(--p-color-purple-100);
    --p-color-icon-disabled: var(--p-color-grey-cold-500);
    --p-color-icon-disabled-white: var(--p-color-grey-cold-500);
    --p-color-icon-disabled-grey: var(--p-color-grey-cold-500);
    --p-color-icon-error: var(--p-color-red-600);
    --p-color-icon-error-white: var(--p-color-red-600);
    --p-color-icon-error-grey: var(--p-color-red-600);
    --p-color-icon-success: var(--p-color-green-600);
    --p-color-icon-success-white: var(--p-color-green-600);
    --p-color-icon-success-grey: var(--p-color-green-600);
    --p-color-icon-warning: var(--p-color-yellow-600);
    --p-color-icon-warning-white: var(--p-color-yellow-600);
    --p-color-icon-warning-grey: var(--p-color-yellow-600);
    --p-color-icon-info: var(--p-color-blue-600);
    --p-color-icon-info-white: var(--p-color-blue-600);
    --p-color-icon-info-grey: var(--p-color-blue-600);
    --p-color-icon-neutral: var(--p-color-grey-cold-900);
    --p-color-icon-neutral-white: var(--p-color-grey-cold-900);
    --p-color-icon-neutral-grey: var(--p-color-grey-cold-900);
    --p-color-icon-on-brand: var(--p-color-purple-100);
    --p-color-icon-on-brand-white: var(--p-color-purple-100);
    --p-color-icon-on-brand-grey: var(--p-color-purple-100);
    --p-color-icon-on-error: var(--p-color-red-800);
    --p-color-icon-on-info: var(--p-color-blue-800);
    --p-color-icon-on-warning: var(--p-color-yellow-800);
    --p-color-icon-on-success: var(--p-color-green-800);
    --p-color-icon-on-purple: var(--p-color-purple-800);
    --p-color-icon-on-orange: var(--p-color-red-800);
    --p-color-button-brand-fill: var(--p-color-purple-900);
    --p-color-button-brand-fill-white: var(--p-color-purple-900);
    --p-color-button-brand-fill-grey: var(--p-color-purple-900);
    --p-color-button-brand-fill-hover: var(--p-color-purple-800);
    --p-color-button-brand-fill-hover-white: var(--p-color-purple-800);
    --p-color-button-brand-fill-hover-grey: var(--p-color-purple-800);
    --p-color-button-brand-fill-pressed: var(--p-color-purple-800);
    --p-color-button-brand-fill-pressed-white: var(--p-color-purple-800);
    --p-color-button-brand-fill-pressed-grey: var(--p-color-purple-800);
    --p-color-button-brand-fill-active: var(--p-color-purple-800);
    --p-color-button-brand-fill-active-white: var(--p-color-purple-800);
    --p-color-button-brand-fill-active-grey: var(--p-color-purple-800);
    --p-color-button-action-fill: var(--p-color-purple-800);
    --p-color-button-action-fill-white: var(--p-color-purple-800);
    --p-color-button-action-fill-grey: var(--p-color-purple-800);
    --p-color-button-action-fill-hover: var(--p-color-purple-600);
    --p-color-button-action-fill-hover-white: var(--p-color-purple-600);
    --p-color-button-action-fill-hover-grey: var(--p-color-purple-600);
    --p-color-button-action-fill-pressed: var(--p-color-purple-700);
    --p-color-button-action-fill-pressed-white: var(--p-color-purple-700);
    --p-color-button-action-fill-pressed-grey: var(--p-color-purple-700);
    --p-color-button-action-fill-active: var(--p-color-purple-700);
    --p-color-button-action-fill-active-white: var(--p-color-purple-700);
    --p-color-button-action-fill-active-grey: var(--p-color-purple-700);
    --p-color-button-disabled: var(--p-color-grey-cold-200);
    --p-color-button-disabled-white: var(--p-color-grey-cold-200);
    --p-color-button-disabled-grey: var(--p-color-grey-cold-300);
    --p-color-graphics-illustration-primary: var(--p-color-red-600);
    --p-color-graphics-illustration-primary-white: var(--p-color-red-600);
    --p-color-graphics-illustration-primary-grey: var(--p-color-red-600);
    --p-color-graphics-illustration-detail: var(--p-color-logo-red);
    --p-color-graphics-illustration-detail-white: var(--p-color-logo-red);
    --p-color-graphics-illustration-detail-grey: var(--p-color-logo-red);
    --p-color-graphics-illustration-base: var(--p-color-purple-900);
    --p-color-graphics-illustration-base-white: var(--p-color-purple-900);
    --p-color-graphics-illustration-base-grey: var(--p-color-purple-900);
    --p-color-graphics-illustration-white: var(--p-color-grey-cold-000);
    --p-color-graphics-illustration-white-white: var(--p-color-grey-cold-000);
    --p-color-graphics-illustration-white-grey: var(--p-color-grey-cold-000);
    --p-color-graphics-storebrand-icon-detail: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-detail-white: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-detail-grey: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-outline: var(--p-color-red-800);
    --p-color-graphics-storebrand-icon-outline-white: var(--p-color-red-800);
    --p-color-graphics-storebrand-icon-outline-grey: var(--p-color-red-800);
    --p-color-static-brand-foreground: var(--p-color-purple-600);
    --p-color-static-brand-foreground-white: var(--p-color-purple-600);
    --p-color-static-brand-foreground-grey: var(--p-color-purple-600);
    --p-color-static-brand-background: var(--p-color-purple-200);
    --p-color-static-brand-background-white: var(--p-color-purple-200);
    --p-color-static-brand-background-grey: var(--p-color-purple-200);
    --p-color-static-orange-foreground: var(--p-color-orange-600);
    --p-color-static-orange-foreground-white: var(--p-color-orange-600);
    --p-color-static-orange-foreground-grey: var(--p-color-orange-600);
    --p-color-static-orange-background: var(--p-color-orange-200);
    --p-color-static-orange-background-white: var(--p-color-orange-200);
    --p-color-static-orange-background-grey: var(--p-color-orange-300);
    --p-color-static-purple-foreground: var(--p-color-purple-600);
    --p-color-static-purple-foreground-white: var(--p-color-purple-600);
    --p-color-static-purple-foreground-grey: var(--p-color-purple-600);
    --p-color-static-purple-background: var(--p-color-purple-200);
    --p-color-static-purple-background-white: var(--p-color-purple-200);
    --p-color-static-purple-background-grey: var(--p-color-purple-300);
    --p-color-static-red-foreground: var(--p-color-red-600);
    --p-color-static-red-foreground-white: var(--p-color-red-600);
    --p-color-static-red-foreground-grey: var(--p-color-red-600);
    --p-color-static-red-background: var(--p-color-red-200);
    --p-color-static-red-background-white: var(--p-color-red-200);
    --p-color-static-red-background-grey: var(--p-color-red-200);
    --p-color-static-grey-foreground: var(--p-color-grey-cold-600);
    --p-color-static-grey-foreground-white: var(--p-color-grey-cold-600);
    --p-color-static-grey-foreground-grey: var(--p-color-grey-cold-600);
    --p-color-static-grey-background: var(--p-color-grey-cold-200);
    --p-color-static-grey-background-white: var(--p-color-grey-cold-200);
    --p-color-static-grey-background-grey: var(--p-color-grey-cold-300);
    --p-color-static-risk-filled: var(--p-color-purple-800);
    --p-color-static-risk-filled-white: var(--p-color-purple-800);
    --p-color-static-risk-filled-grey: var(--p-color-purple-800);
    --p-color-static-risk-unfilled: var(--p-color-purple-200);
    --p-color-static-risk-unfilled-white: var(--p-color-purple-200);
    --p-color-static-risk-unfilled-grey: var(--p-color-purple-200);
    --p-color-static-sustainability-filled: var(--p-color-green-700);
    --p-color-static-sustainability-filled-white: var(--p-color-green-700);
    --p-color-static-sustainability-filled-grey: var(--p-color-green-700);
    --p-color-static-sustainability-unfilled: var(--p-color-grey-cold-200);
    --p-color-static-sustainability-unfilled-white: var(--p-color-grey-cold-200);
    --p-color-static-sustainability-unfilled-grey: var(--p-color-grey-cold-200);
    --p-color-states-focus: var(--p-color-focus-1);
    --p-color-states-focus-white: var(--p-color-focus-1);
    --p-color-states-focus-grey: var(--p-color-focus-1);
    --p-color-states-scrim: var(--p-color-scrim-1);
    --p-color-states-scrim-white: var(--p-color-scrim-1);
    --p-color-states-scrim-grey: var(--p-color-scrim-1);
    --p-color-states-toggle-off: var(--p-color-grey-cold-400);
    --p-color-states-toggle-off-white: var(--p-color-grey-cold-400);
    --p-color-states-toggle-off-grey: var(--p-color-grey-cold-500);
    --p-color-states-toggle-off-hover: var(--p-color-grey-cold-300);
    --p-color-states-toggle-off-hover-white: var(--p-color-grey-cold-300);
    --p-color-states-toggle-off-hover-grey: var(--p-color-grey-cold-400);
    --p-color-surface-1: var(--p-color-grey-cold-100);
    --p-color-surface-1-white: var(--p-color-grey-cold-100);
    --p-color-surface-1-grey: var(--p-color-grey-cold-000);
    --p-color-surface-2: var(--p-color-grey-cold-000);
    --p-color-surface-2-white: var(--p-color-grey-cold-000);
    --p-color-surface-2-grey: var(--p-color-grey-cold-100);
    --p-color-surface-1-hover: var(--p-color-grey-cold-200);
    --p-color-surface-1-hover-white: var(--p-color-grey-cold-200);
    --p-color-surface-1-hover-grey: var(--p-color-grey-cold-200);
    --p-color-surface-2-hover: var(--p-color-grey-cold-200);
    --p-color-surface-2-hover-white: var(--p-color-grey-cold-200);
    --p-color-surface-2-hover-grey: var(--p-color-grey-cold-200);
    --p-color-surface-inverse: var(--p-color-purple-900);
    --p-color-surface-inverse-white: var(--p-color-purple-900);
    --p-color-surface-inverse-grey: var(--p-color-purple-900);
    --p-color-surface-inverse-hover: var(--p-color-purple-800);
    --p-color-surface-inverse-hover-white: var(--p-color-purple-800);
    --p-color-surface-inverse-hover-grey: var(--p-color-purple-800);
    --p-color-surface-inverse-pressed: var(--p-color-purple-700);
    --p-color-surface-inverse-pressed-white: var(--p-color-purple-700);
    --p-color-surface-inverse-pressed-grey: var(--p-color-purple-700);
    --p-color-surface-selected: var(--p-color-purple-600);
    --p-color-surface-selected-white: var(--p-color-purple-600);
    --p-color-surface-selected-grey: var(--p-color-purple-600);
    --p-color-surface-selected-hover: var(--p-color-purple-700);
    --p-color-surface-selected-hover-white: var(--p-color-purple-700);
    --p-color-surface-selected-hover-grey: var(--p-color-purple-700);
    --p-color-surface-selected-pressed: var(--p-color-purple-800);
    --p-color-surface-selected-pressed-white: var(--p-color-purple-800);
    --p-color-surface-selected-pressed-grey: var(--p-color-purple-800);
    --p-color-surface-selected-active: var(--p-color-purple-800);
    --p-color-surface-selected-active-white: var(--p-color-purple-800);
    --p-color-surface-selected-active-grey: var(--p-color-purple-800);
    --p-color-surface-error: var(--p-color-red-200);
    --p-color-surface-error-white: var(--p-color-red-200);
    --p-color-surface-error-grey: var(--p-color-red-200);
    --p-color-surface-success: var(--p-color-green-200);
    --p-color-surface-success-white: var(--p-color-green-200);
    --p-color-surface-success-grey: var(--p-color-green-200);
    --p-color-surface-warning: var(--p-color-yellow-200);
    --p-color-surface-warning-white: var(--p-color-yellow-200);
    --p-color-surface-warning-grey: var(--p-color-yellow-200);
    --p-color-surface-info: var(--p-color-blue-200);
    --p-color-surface-info-white: var(--p-color-blue-200);
    --p-color-surface-info-grey: var(--p-color-blue-200);
    --p-color-surface-neutral: var(--p-color-grey-cold-100);
    --p-color-surface-neutral-white: var(--p-color-grey-cold-000);
    --p-color-surface-neutral-grey: var(--p-color-grey-cold-100);
    --p-color-surface-static: var(--p-color-grey-cold-000);
    --p-color-surface-static-white: var(--p-color-grey-cold-000);
    --p-color-surface-static-grey: var(--p-color-grey-cold-000);
    --p-color-stroke-strong: var(--p-color-purple-900);
    --p-color-stroke-strong-white: var(--p-color-purple-900);
    --p-color-stroke-strong-grey: var(--p-color-purple-900);
    --p-color-stroke-strong-hover: var(--p-color-purple-800);
    --p-color-stroke-strong-hover-white: var(--p-color-purple-800);
    --p-color-stroke-strong-hover-grey: var(--p-color-purple-800);
    --p-color-stroke-strong-pressed: var(--p-color-purple-700);
    --p-color-stroke-strong-pressed-white: var(--p-color-purple-700);
    --p-color-stroke-strong-pressed-grey: var(--p-color-purple-700);
    --p-color-stroke: var(--p-color-grey-cold-500);
    --p-color-stroke-white: var(--p-color-grey-cold-500);
    --p-color-stroke-grey: var(--p-color-grey-cold-500);
    --p-color-stroke-0: var(--p-color-stroke);
    --p-color-stroke-0-white: var(--p-color-stroke-white);
    --p-color-stroke-0-grey: var(--p-color-stroke-grey);
    --p-color-stroke-1: var(--p-color-stroke);
    --p-color-stroke-1-white: var(--p-color-stroke-white);
    --p-color-stroke-1-grey: var(--p-color-stroke-grey);
    --p-color-stroke-2: var(--p-color-stroke);
    --p-color-stroke-2-white: var(--p-color-stroke-white);
    --p-color-stroke-2-grey: var(--p-color-stroke-grey);
    --p-color-stroke-hover: var(--p-color-purple-900);
    --p-color-stroke-white-hover: var(--p-color-purple-900);
    --p-color-stroke-grey-hover: var(--p-color-purple-900);
    --p-color-stroke-pressed: var(--p-color-purple-800);
    --p-color-stroke-white-pressed: var(--p-color-purple-800);
    --p-color-stroke-grey-pressed: var(--p-color-purple-800);
    --p-color-stroke-on-white: var(--p-color-grey-cold-300);
    --p-color-stroke-on-white-white: var(--p-color-grey-cold-300);
    --p-color-stroke-on-white-grey: var(--p-color-grey-cold-300);
    --p-color-stroke-subtle-0: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-0-white: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-0-grey: var(--p-color-grey-cold-300);
    --p-color-stroke-subtle-1: var(--p-color-grey-cold-300);
    --p-color-stroke-subtle-1-white: var(--p-color-grey-cold-300);
    --p-color-stroke-subtle-1-grey: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-2: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-2-white: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-2-grey: var(--p-color-grey-cold-300);
    --p-color-stroke-subtle-on-white: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-on-white-white: var(--p-color-grey-cold-200);
    --p-color-stroke-subtle-on-white-grey: var(--p-color-grey-cold-200);
    --p-color-stroke-on-color: var(--p-color-purple-100);
    --p-color-stroke-on-color-white: var(--p-color-purple-100);
    --p-color-stroke-on-color-grey: var(--p-color-purple-100);
    --p-color-stroke-interactive: var(--p-color-purple-600);
    --p-color-stroke-interactive-white: var(--p-color-purple-600);
    --p-color-stroke-interactive-grey: var(--p-color-purple-600);
    --p-color-stroke-interactive-hover: var(--p-color-purple-700);
    --p-color-stroke-interactive-hover-white: var(--p-color-purple-700);
    --p-color-stroke-interactive-hover-grey: var(--p-color-purple-700);
    --p-color-stroke-interactive-pressed: var(--p-color-purple-800);
    --p-color-stroke-interactive-pressed-white: var(--p-color-purple-800);
    --p-color-stroke-interactive-pressed-grey: var(--p-color-purple-800);
    --p-color-stroke-selected: var(--p-color-purple-700);
    --p-color-stroke-selected-white: var(--p-color-purple-700);
    --p-color-stroke-selected-grey: var(--p-color-purple-700);
    --p-color-stroke-selected-hover: var(--p-color-purple-800);
    --p-color-stroke-selected-hover-white: var(--p-color-purple-800);
    --p-color-stroke-selected-hover-grey: var(--p-color-purple-800);
    --p-color-stroke-selected-pressed: var(--p-color-purple-900);
    --p-color-stroke-selected-pressed-white: var(--p-color-purple-900);
    --p-color-stroke-selected-pressed-grey: var(--p-color-purple-900);
    --p-color-stroke-disabled: var(--p-color-grey-cold-400);
    --p-color-stroke-disabled-white: var(--p-color-grey-cold-400);
    --p-color-stroke-disabled-grey: var(--p-color-grey-cold-500);
    --p-color-stroke-error: var(--p-color-red-600);
    --p-color-stroke-error-white: var(--p-color-red-600);
    --p-color-stroke-error-grey: var(--p-color-red-600);
    --p-color-stroke-success: var(--p-color-green-600);
    --p-color-stroke-success-white: var(--p-color-green-600);
    --p-color-stroke-success-grey: var(--p-color-green-600);
    --p-color-stroke-warning: var(--p-color-yellow-600);
    --p-color-stroke-warning-white: var(--p-color-yellow-600);
    --p-color-stroke-warning-grey: var(--p-color-yellow-600);
    --p-color-monochromatic-red-1: var(--p-color-red-550);
    --p-color-monochromatic-red-1-white: var(--p-color-red-550);
    --p-color-monochromatic-red-1-grey: var(--p-color-red-550);
    --p-color-monochromatic-red-2: var(--p-color-red-600);
    --p-color-monochromatic-red-2-white: var(--p-color-red-600);
    --p-color-monochromatic-red-2-grey: var(--p-color-red-600);
    --p-color-monochromatic-red-3: var(--p-color-red-800);
    --p-color-monochromatic-red-3-white: var(--p-color-red-800);
    --p-color-monochromatic-red-3-grey: var(--p-color-red-800);
    --p-color-monochromatic-red-4: var(--p-color-red-900);
    --p-color-monochromatic-red-4-white: var(--p-color-red-900);
    --p-color-monochromatic-red-4-grey: var(--p-color-red-900);
    --p-color-monochromatic-purple-1: var(--p-color-purple-550);
    --p-color-monochromatic-purple-1-white: var(--p-color-purple-550);
    --p-color-monochromatic-purple-1-grey: var(--p-color-purple-550);
    --p-color-monochromatic-purple-2: var(--p-color-purple-600);
    --p-color-monochromatic-purple-2-white: var(--p-color-purple-600);
    --p-color-monochromatic-purple-2-grey: var(--p-color-purple-600);
    --p-color-monochromatic-purple-3: var(--p-color-purple-800);
    --p-color-monochromatic-purple-3-white: var(--p-color-purple-800);
    --p-color-monochromatic-purple-3-grey: var(--p-color-purple-800);
    --p-color-monochromatic-purple-4: var(--p-color-purple-900);
    --p-color-monochromatic-purple-4-white: var(--p-color-purple-900);
    --p-color-monochromatic-purple-4-grey: var(--p-color-purple-900);
    --p-color-categorical-1: var(--p-color-purple-800);
    --p-color-categorical-1-white: var(--p-color-purple-800);
    --p-color-categorical-1-grey: var(--p-color-purple-800);
    --p-color-categorical-2: var(--p-color-purple-550);
    --p-color-categorical-2-white: var(--p-color-purple-550);
    --p-color-categorical-2-grey: var(--p-color-purple-550);
    --p-color-categorical-3: var(--p-color-red-600);
    --p-color-categorical-3-white: var(--p-color-red-600);
    --p-color-categorical-3-grey: var(--p-color-red-600);
    --p-color-categorical-4: var(--p-color-purple-550);
    --p-color-categorical-4-white: var(--p-color-purple-550);
    --p-color-categorical-4-grey: var(--p-color-purple-550);
    --p-color-categorical-5: var(--p-color-purple-800);
    --p-color-categorical-5-white: var(--p-color-purple-800);
    --p-color-categorical-5-grey: var(--p-color-purple-800);
    --p-color-categorical-6: var(--p-color-grey-cold-500);
    --p-color-categorical-6-white: var(--p-color-grey-cold-500);
    --p-color-categorical-6-grey: var(--p-color-grey-cold-500);
    --p-color-categorical-7: var(--p-color-blue-700);
    --p-color-categorical-7-white: var(--p-color-blue-700);
    --p-color-categorical-7-grey: var(--p-color-blue-700);
    --p-color-categorical-8: var(--p-color-green-550);
    --p-color-categorical-8-white: var(--p-color-green-550);
    --p-color-categorical-8-grey: var(--p-color-green-550);
    --p-color-categorical-9: var(--p-color-purple-600);
    --p-color-categorical-9-white: var(--p-color-purple-600);
    --p-color-categorical-9-grey: var(--p-color-purple-600);
    --p-color-categorical-10: var(--p-color-blue-500);
    --p-color-categorical-10-white: var(--p-color-blue-500);
    --p-color-categorical-10-grey: var(--p-color-blue-500);
    --p-color-categorical-11: var(--p-color-green-700);
    --p-color-categorical-11-white: var(--p-color-green-700);
    --p-color-categorical-11-grey: var(--p-color-green-700);
    --p-color-categorical-12: var(--p-color-grey-cold-700);
    --p-color-categorical-12-white: var(--p-color-grey-cold-700);
    --p-color-categorical-12-grey: var(--p-color-grey-cold-700);
    --p-outline: 2px solid var(--p-color-states-focus);
    --p-outline-offset: 2px;
  }

  [data-theme="kron-dark"] {
    --p-color-background: var(--p-color-grey-cold-1000);
    --p-color-background-white: var(--p-color-grey-cold-1000);
    --p-color-background-grey: var(--p-color-grey-cold-1000);
    --p-color-background-hover: var(--p-color-grey-cold-900);
    --p-color-background-hover-white: var(--p-color-grey-cold-900);
    --p-color-background-hover-grey: var(--p-color-grey-cold-800);
    --p-color-background-pressed: var(--p-color-grey-cold-800);
    --p-color-background-pressed-white: var(--p-color-grey-cold-800);
    --p-color-background-pressed-grey: var(--p-color-grey-cold-700);
    --p-color-background-active: var(--p-color-red-400);
    --p-color-background-active-white: var(--p-color-red-400);
    --p-color-background-active-grey: var(--p-color-red-400);
    --p-color-background-disabled: var(--p-color-grey-cold-800);
    --p-color-background-disabled-white: var(--p-color-grey-cold-800);
    --p-color-background-disabled-grey: var(--p-color-grey-cold-700);
    --p-color-background-selected: var(--p-color-purple-300);
    --p-color-background-selected-white: var(--p-color-purple-300);
    --p-color-background-selected-grey: var(--p-color-purple-300);
    --p-color-background-selected-hover: var(--p-color-purple-200);
    --p-color-background-selected-hover-white: var(--p-color-purple-200);
    --p-color-background-selected-hover-grey: var(--p-color-purple-200);
    --p-color-background-selected-pressed: var(--p-color-purple-100);
    --p-color-background-selected-pressed-white: var(--p-color-purple-100);
    --p-color-background-selected-pressed-grey: var(--p-color-purple-100);
    --p-color-text-primary: var(--p-color-purple-100);
    --p-color-text-primary-white: var(--p-color-purple-100);
    --p-color-text-primary-grey: var(--p-color-purple-100);
    --p-color-text-primary-hover: var(--p-color-purple-200);
    --p-color-text-primary-hover-white: var(--p-color-purple-200);
    --p-color-text-primary-hover-grey: var(--p-color-purple-200);
    --p-color-text-primary-pressed: var(--p-color-purple-300);
    --p-color-text-primary-pressed-white: var(--p-color-purple-300);
    --p-color-text-primary-pressed-grey: var(--p-color-purple-300);
    --p-color-text-primary-active: var(--p-color-purple-300);
    --p-color-text-primary-active-white: var(--p-color-purple-300);
    --p-color-text-primary-active-grey: var(--p-color-purple-300);
    --p-color-text-interactive: var(--p-color-purple-200);
    --p-color-text-interactive-white: var(--p-color-purple-200);
    --p-color-text-interactive-grey: var(--p-color-purple-200);
    --p-color-text-interactive-hover: var(--p-color-purple-400);
    --p-color-text-interactive-hover-white: var(--p-color-purple-400);
    --p-color-text-interactive-hover-grey: var(--p-color-purple-400);
    --p-color-text-interactive-pressed: var(--p-color-purple-300);
    --p-color-text-interactive-pressed-white: var(--p-color-purple-300);
    --p-color-text-interactive-pressed-grey: var(--p-color-purple-300);
    --p-color-text-interactive-active: var(--p-color-purple-300);
    --p-color-text-interactive-active-white: var(--p-color-purple-300);
    --p-color-text-interactive-active-grey: var(--p-color-purple-300);
    --p-color-text-selected: var(--p-color-purple-300);
    --p-color-text-selected-white: var(--p-color-purple-300);
    --p-color-text-selected-grey: var(--p-color-purple-300);
    --p-color-text-selected-hover: var(--p-color-purple-200);
    --p-color-text-selected-hover-white: var(--p-color-purple-200);
    --p-color-text-selected-hover-grey: var(--p-color-purple-200);
    --p-color-text-selected-pressed: var(--p-color-purple-100);
    --p-color-text-selected-pressed-white: var(--p-color-purple-100);
    --p-color-text-selected-pressed-grey: var(--p-color-purple-100);
    --p-color-text-secondary: var(--p-color-grey-cold-300);
    --p-color-text-secondary-white: var(--p-color-grey-cold-300);
    --p-color-text-secondary-grey: var(--p-color-grey-cold-300);
    --p-color-text-placeholder: var(--p-color-grey-cold-400);
    --p-color-text-placeholder-white: var(--p-color-grey-cold-400);
    --p-color-text-placeholder-grey: var(--p-color-grey-cold-400);
    --p-color-text-on-color: var(--p-color-purple-900);
    --p-color-text-on-color-white: var(--p-color-purple-900);
    --p-color-text-on-color-grey: var(--p-color-purple-900);
    --p-color-text-disabled: var(--p-color-grey-cold-700);
    --p-color-text-disabled-white: var(--p-color-grey-cold-700);
    --p-color-text-disabled-grey: var(--p-color-grey-cold-700);
    --p-color-text-info: var(--p-color-blue-400);
    --p-color-text-info-white: var(--p-color-blue-400);
    --p-color-text-info-grey: var(--p-color-blue-400);
    --p-color-text-success: var(--p-color-green-400);
    --p-color-text-success-white: var(--p-color-green-400);
    --p-color-text-success-grey: var(--p-color-green-400);
    --p-color-text-warning: var(--p-color-yellow-400);
    --p-color-text-warning-white: var(--p-color-yellow-400);
    --p-color-text-warning-grey: var(--p-color-yellow-400);
    --p-color-text-error: var(--p-color-red-400);
    --p-color-text-error-white: var(--p-color-red-400);
    --p-color-text-error-grey: var(--p-color-red-400);
    --p-color-text-alert: var(--p-color-grey-cold-100);
    --p-color-text-alert-white: var(--p-color-grey-cold-100);
    --p-color-text-alert-grey: var(--p-color-grey-cold-100);
    --p-color-text-on-brand: var(--p-color-purple-900);
    --p-color-text-on-brand-white: var(--p-color-purple-900);
    --p-color-text-on-brand-grey: var(--p-color-purple-900);
    --p-color-text-on-error: var(--p-color-red-200);
    --p-color-text-on-info: var(--p-color-blue-200);
    --p-color-text-on-warning: var(--p-color-yellow-200);
    --p-color-text-on-success: var(--p-color-green-200);
    --p-color-text-on-purple: var(--p-color-purple-200);
    --p-color-text-on-orange: var(--p-color-orange-200);
    --p-color-icon-primary: var(--p-color-purple-100);
    --p-color-icon-primary-white: var(--p-color-purple-100);
    --p-color-icon-primary-grey: var(--p-color-purple-100);
    --p-color-icon-primary-hover: var(--p-color-purple-200);
    --p-color-icon-primary-hover-white: var(--p-color-purple-200);
    --p-color-icon-primary-hover-grey: var(--p-color-purple-200);
    --p-color-icon-primary-active: var(--p-color-purple-300);
    --p-color-icon-primary-active-white: var(--p-color-purple-300);
    --p-color-icon-primary-active-grey: var(--p-color-purple-300);
    --p-color-icon-primary-pressed: var(--p-color-purple-300);
    --p-color-icon-primary-pressed-white: var(--p-color-purple-300);
    --p-color-icon-primary-pressed-grey: var(--p-color-purple-300);
    --p-color-icon-interactive: var(--p-color-purple-200);
    --p-color-icon-interactive-white: var(--p-color-purple-200);
    --p-color-icon-interactive-grey: var(--p-color-purple-200);
    --p-color-icon-interactive-hover: var(--p-color-purple-400);
    --p-color-icon-interactive-hover-white: var(--p-color-purple-400);
    --p-color-icon-interactive-hover-grey: var(--p-color-purple-400);
    --p-color-icon-interactive-pressed: var(--p-color-purple-300);
    --p-color-icon-interactive-pressed-white: var(--p-color-purple-300);
    --p-color-icon-interactive-pressed-grey: var(--p-color-purple-300);
    --p-color-icon-interactive-active: var(--p-color-purple-300);
    --p-color-icon-interactive-active-white: var(--p-color-purple-300);
    --p-color-icon-interactive-active-grey: var(--p-color-purple-300);
    --p-color-icon-on-color: var(--p-color-purple-900);
    --p-color-icon-on-color-white: var(--p-color-purple-900);
    --p-color-icon-on-color-grey: var(--p-color-purple-900);
    --p-color-icon-disabled: var(--p-color-grey-cold-700);
    --p-color-icon-disabled-white: var(--p-color-grey-cold-700);
    --p-color-icon-disabled-grey: var(--p-color-grey-cold-700);
    --p-color-icon-error: var(--p-color-red-400);
    --p-color-icon-error-white: var(--p-color-red-400);
    --p-color-icon-error-grey: var(--p-color-red-400);
    --p-color-icon-success: var(--p-color-green-400);
    --p-color-icon-success-white: var(--p-color-green-400);
    --p-color-icon-success-grey: var(--p-color-green-400);
    --p-color-icon-warning: var(--p-color-yellow-400);
    --p-color-icon-warning-white: var(--p-color-yellow-400);
    --p-color-icon-warning-grey: var(--p-color-yellow-400);
    --p-color-icon-info: var(--p-color-blue-400);
    --p-color-icon-info-white: var(--p-color-blue-400);
    --p-color-icon-info-grey: var(--p-color-blue-400);
    --p-color-icon-neutral: var(--p-color-grey-cold-100);
    --p-color-icon-neutral-white: var(--p-color-grey-cold-100);
    --p-color-icon-neutral-grey: var(--p-color-grey-cold-100);
    --p-color-icon-on-brand: var(--p-color-purple-900);
    --p-color-icon-on-brand-white: var(--p-color-purple-900);
    --p-color-icon-on-brand-grey: var(--p-color-purple-900);
    --p-color-icon-on-error: var(--p-color-red-200);
    --p-color-icon-on-info: var(--p-color-blue-200);
    --p-color-icon-on-warning: var(--p-color-yellow-200);
    --p-color-icon-on-success: var(--p-color-green-200);
    --p-color-icon-on-purple: var(--p-color-purple-200);
    --p-color-icon-on-orange: var(--p-color-orange-200);
    --p-color-button-brand-fill: var(--p-color-purple-500);
    --p-color-button-brand-fill-white: var(--p-color-purple-600);
    --p-color-button-brand-fill-grey: var(--p-color-purple-600);
    --p-color-button-brand-fill-hover: var(--p-color-purple-400);
    --p-color-button-brand-fill-hover-white: var(--p-color-purple-700);
    --p-color-button-brand-fill-hover-grey: var(--p-color-purple-700);
    --p-color-button-brand-fill-pressed: var(--p-color-purple-300);
    --p-color-button-brand-fill-pressed-white: var(--p-color-purple-800);
    --p-color-button-brand-fill-pressed-grey: var(--p-color-purple-800);
    --p-color-button-brand-fill-active: var(--p-color-purple-300);
    --p-color-button-brand-fill-active-white: var(--p-color-purple-800);
    --p-color-button-brand-fill-active-grey: var(--p-color-purple-800);
    --p-color-button-action-fill: var(--p-color-purple-400);
    --p-color-button-action-fill-white: var(--p-color-purple-900);
    --p-color-button-action-fill-grey: var(--p-color-purple-900);
    --p-color-button-action-fill-hover: var(--p-color-purple-300);
    --p-color-button-action-fill-hover-white: var(--p-color-purple-800);
    --p-color-button-action-fill-hover-grey: var(--p-color-purple-800);
    --p-color-button-action-fill-pressed: var(--p-color-purple-200);
    --p-color-button-action-fill-pressed-white: var(--p-color-purple-700);
    --p-color-button-action-fill-pressed-grey: var(--p-color-purple-700);
    --p-color-button-action-fill-active: var(--p-color-purple-200);
    --p-color-button-action-fill-active-white: var(--p-color-purple-700);
    --p-color-button-action-fill-active-grey: var(--p-color-purple-700);
    --p-color-button-disabled: var(--p-color-grey-cold-800);
    --p-color-button-disabled-white: var(--p-color-grey-cold-200);
    --p-color-button-disabled-grey: var(--p-color-grey-cold-300);
    --p-color-graphics-illustration-primary: var(--p-color-red-400);
    --p-color-graphics-illustration-primary-white: var(--p-color-red-400);
    --p-color-graphics-illustration-primary-grey: var(--p-color-red-400);
    --p-color-graphics-illustration-detail: var(--p-color-logo-red);
    --p-color-graphics-illustration-detail-white: var(--p-color-logo-red);
    --p-color-graphics-illustration-detail-grey: var(--p-color-logo-red);
    --p-color-graphics-illustration-base: var(--p-color-purple-100);
    --p-color-graphics-illustration-base-white: var(--p-color-purple-100);
    --p-color-graphics-illustration-base-grey: var(--p-color-purple-100);
    --p-color-graphics-illustration-white: var(--p-color-grey-cold-1000);
    --p-color-graphics-illustration-white-white: var(--p-color-grey-cold-1000);
    --p-color-graphics-illustration-white-grey: var(--p-color-grey-cold-1000);
    --p-color-graphics-storebrand-icon-detail: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-detail-white: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-detail-grey: var(--p-color-logo-red);
    --p-color-graphics-storebrand-icon-outline: var(--p-color-red-200);
    --p-color-graphics-storebrand-icon-outline-white: var(--p-color-red-200);
    --p-color-graphics-storebrand-icon-outline-grey: var(--p-color-red-200);
    --p-color-static-brand-foreground: var(--p-color-purple-400);
    --p-color-static-brand-foreground-white: var(--p-color-purple-400);
    --p-color-static-brand-foreground-grey: var(--p-color-purple-400);
    --p-color-static-brand-background: var(--p-color-purple-800);
    --p-color-static-brand-background-white: var(--p-color-purple-800);
    --p-color-static-brand-background-grey: var(--p-color-purple-800);
    --p-color-static-orange-foreground: var(--p-color-orange-400);
    --p-color-static-orange-foreground-white: var(--p-color-orange-400);
    --p-color-static-orange-foreground-grey: var(--p-color-orange-400);
    --p-color-static-orange-background: var(--p-color-orange-pale-800);
    --p-color-static-orange-background-white: var(--p-color-orange-pale-800);
    --p-color-static-orange-background-grey: var(--p-color-orange-pale-800);
    --p-color-static-purple-foreground: var(--p-color-purple-400);
    --p-color-static-purple-foreground-white: var(--p-color-purple-400);
    --p-color-static-purple-foreground-grey: var(--p-color-purple-400);
    --p-color-static-purple-background: var(--p-color-purple-800);
    --p-color-static-purple-background-white: var(--p-color-purple-800);
    --p-color-static-purple-background-grey: var(--p-color-purple-700);
    --p-color-static-red-foreground: var(--p-color-red-400);
    --p-color-static-red-foreground-white: var(--p-color-red-400);
    --p-color-static-red-foreground-grey: var(--p-color-red-400);
    --p-color-static-red-background: var(--p-color-red-800);
    --p-color-static-red-background-white: var(--p-color-red-800);
    --p-color-static-red-background-grey: var(--p-color-red-800);
    --p-color-static-grey-foreground: var(--p-color-grey-cold-400);
    --p-color-static-grey-foreground-white: var(--p-color-grey-cold-400);
    --p-color-static-grey-foreground-grey: var(--p-color-grey-cold-400);
    --p-color-static-grey-background: var(--p-color-grey-cold-800);
    --p-color-static-grey-background-white: var(--p-color-grey-cold-800);
    --p-color-static-grey-background-grey: var(--p-color-grey-cold-700);
    --p-color-static-risk-filled: var(--p-color-purple-400);
    --p-color-static-risk-filled-white: var(--p-color-purple-400);
    --p-color-static-risk-filled-grey: var(--p-color-purple-400);
    --p-color-static-risk-unfilled: var(--p-color-purple-600);
    --p-color-static-risk-unfilled-white: var(--p-color-purple-600);
    --p-color-static-risk-unfilled-grey: var(--p-color-purple-600);
    --p-color-static-sustainability-filled: var(--p-color-green-300);
    --p-color-static-sustainability-filled-white: var(--p-color-green-300);
    --p-color-static-sustainability-filled-grey: var(--p-color-green-300);
    --p-color-static-sustainability-unfilled: var(--p-color-grey-cold-800);
    --p-color-static-sustainability-unfilled-white: var(--p-color-grey-cold-800);
    --p-color-static-sustainability-unfilled-grey: var(--p-color-grey-cold-800);
    --p-color-states-focus: var(--p-color-focus-1);
    --p-color-states-focus-white: var(--p-color-focus-1);
    --p-color-states-focus-grey: var(--p-color-focus-1);
    --p-color-states-scrim: var(--p-color-scrim-1);
    --p-color-states-scrim-white: var(--p-color-scrim-1);
    --p-color-states-scrim-grey: var(--p-color-scrim-1);
    --p-color-states-toggle-off: var(--p-color-grey-cold-500);
    --p-color-states-toggle-off-white: var(--p-color-grey-cold-500);
    --p-color-states-toggle-off-grey: var(--p-color-grey-cold-500);
    --p-color-states-toggle-off-hover: var(--p-color-grey-cold-700);
    --p-color-states-toggle-off-hover-white: var(--p-color-grey-cold-700);
    --p-color-states-toggle-off-hover-grey: var(--p-color-grey-cold-600);
    --p-color-surface-1: var(--p-color-grey-cold-900);
    --p-color-surface-1-white: var(--p-color-grey-cold-900);
    --p-color-surface-1-grey: var(--p-color-grey-cold-900);
    --p-color-surface-2: var(--p-color-grey-cold-800);
    --p-color-surface-2-white: var(--p-color-grey-cold-800);
    --p-color-surface-2-grey: var(--p-color-grey-cold-800);
    --p-color-surface-1-hover: var(--p-color-grey-cold-800);
    --p-color-surface-1-hover-white: var(--p-color-grey-cold-800);
    --p-color-surface-1-hover-grey: var(--p-color-grey-cold-800);
    --p-color-surface-2-hover: var(--p-color-grey-cold-800);
    --p-color-surface-2-hover-white: var(--p-color-grey-cold-800);
    --p-color-surface-2-hover-grey: var(--p-color-grey-cold-800);
    --p-color-surface-inverse: var(--p-color-purple-100);
    --p-color-surface-inverse-white: var(--p-color-purple-100);
    --p-color-surface-inverse-grey: var(--p-color-purple-100);
    --p-color-surface-inverse-hover: var(--p-color-purple-200);
    --p-color-surface-inverse-hover-white: var(--p-color-purple-200);
    --p-color-surface-inverse-hover-grey: var(--p-color-purple-200);
    --p-color-surface-inverse-pressed: var(--p-color-purple-300);
    --p-color-surface-inverse-pressed-white: var(--p-color-purple-300);
    --p-color-surface-inverse-pressed-grey: var(--p-color-purple-300);
    --p-color-surface-selected: var(--p-color-purple-400);
    --p-color-surface-selected-white: var(--p-color-purple-400);
    --p-color-surface-selected-grey: var(--p-color-purple-400);
    --p-color-surface-selected-hover: var(--p-color-purple-300);
    --p-color-surface-selected-hover-white: var(--p-color-purple-300);
    --p-color-surface-selected-hover-grey: var(--p-color-purple-300);
    --p-color-surface-selected-pressed: var(--p-color-purple-200);
    --p-color-surface-selected-pressed-white: var(--p-color-purple-200);
    --p-color-surface-selected-pressed-grey: var(--p-color-purple-200);
    --p-color-surface-selected-active: var(--p-color-purple-200);
    --p-color-surface-selected-active-white: var(--p-color-purple-200);
    --p-color-surface-selected-active-grey: var(--p-color-purple-200);
    --p-color-surface-error: var(--p-color-red-800);
    --p-color-surface-error-white: var(--p-color-red-800);
    --p-color-surface-error-grey: var(--p-color-red-800);
    --p-color-surface-success: var(--p-color-green-800);
    --p-color-surface-success-white: var(--p-color-green-800);
    --p-color-surface-success-grey: var(--p-color-green-800);
    --p-color-surface-warning: var(--p-color-yellow-800);
    --p-color-surface-warning-white: var(--p-color-yellow-800);
    --p-color-surface-warning-grey: var(--p-color-yellow-800);
    --p-color-surface-info: var(--p-color-blue-pale-800);
    --p-color-surface-info-white: var(--p-color-blue-pale-800);
    --p-color-surface-info-grey: var(--p-color-blue-pale-800);
    --p-color-surface-neutral: var(--p-color-grey-cold-900);
    --p-color-surface-neutral-white: var(--p-color-grey-cold-1000);
    --p-color-surface-neutral-grey: var(--p-color-grey-cold-900);
    --p-color-surface-static: var(--p-color-grey-cold-1000);
    --p-color-surface-static-white: var(--p-color-grey-cold-1000);
    --p-color-surface-static-grey: var(--p-color-grey-cold-1000);
    --p-color-stroke-strong: var(--p-color-purple-100);
    --p-color-stroke-strong-white: var(--p-color-purple-100);
    --p-color-stroke-strong-grey: var(--p-color-purple-100);
    --p-color-stroke-strong-hover: var(--p-color-purple-200);
    --p-color-stroke-strong-hover-white: var(--p-color-purple-200);
    --p-color-stroke-strong-hover-grey: var(--p-color-purple-200);
    --p-color-stroke-strong-pressed: var(--p-color-purple-300);
    --p-color-stroke-strong-pressed-white: var(--p-color-purple-300);
    --p-color-stroke-strong-pressed-grey: var(--p-color-purple-300);
    --p-color-stroke: var(--p-color-grey-cold-500);
    --p-color-stroke-white: var(--p-color-grey-cold-500);
    --p-color-stroke-grey: var(--p-color-grey-cold-500);
    --p-color-stroke-0: var(--p-color-stroke);
    --p-color-stroke-0-white: var(--p-color-stroke-white);
    --p-color-stroke-0-grey: var(--p-color-stroke-grey);
    --p-color-stroke-1: var(--p-color-stroke);
    --p-color-stroke-1-white: var(--p-color-stroke-white);
    --p-color-stroke-1-grey: var(--p-color-stroke-grey);
    --p-color-stroke-2: var(--p-color-stroke);
    --p-color-stroke-2-white: var(--p-color-stroke-white);
    --p-color-stroke-2-grey: var(--p-color-stroke-grey);
    --p-color-stroke-hover: var(--p-color-purple-100);
    --p-color-stroke-white-hover: var(--p-color-purple-100);
    --p-color-stroke-grey-hover: var(--p-color-purple-100);
    --p-color-stroke-pressed: var(--p-color-purple-200);
    --p-color-stroke-white-pressed: var(--p-color-purple-200);
    --p-color-stroke-grey-pressed: var(--p-color-purple-200);
    --p-color-stroke-on-white: var(--p-color-grey-cold-700);
    --p-color-stroke-on-white-white: var(--p-color-grey-cold-700);
    --p-color-stroke-on-white-grey: var(--p-color-grey-cold-700);
    --p-color-stroke-subtle-0: var(--p-color-grey-cold-800);
    --p-color-stroke-subtle-0-white: var(--p-color-grey-cold-800);
    --p-color-stroke-subtle-0-grey: var(--p-color-grey-cold-700);
    --p-color-stroke-subtle-1: var(--p-color-grey-cold-700);
    --p-color-stroke-subtle-1-white: var(--p-color-grey-cold-700);
    --p-color-stroke-subtle-1-grey: var(--p-color-grey-cold-800);
    --p-color-stroke-subtle-2: var(--p-color-grey-cold-800);
    --p-color-stroke-subtle-2-white: var(--p-color-grey-cold-800);
    --p-color-stroke-subtle-2-grey: var(--p-color-grey-cold-700);
    --p-color-stroke-subtle-on-white: var(--p-color-grey-cold-800);
    --p-color-stroke-subtle-on-white-white: var(--p-color-grey-cold-800);
    --p-color-stroke-subtle-on-white-grey: var(--p-color-grey-cold-800);
    --p-color-stroke-on-color: var(--p-color-purple-900);
    --p-color-stroke-on-color-white: var(--p-color-purple-900);
    --p-color-stroke-on-color-grey: var(--p-color-purple-900);
    --p-color-stroke-interactive: var(--p-color-purple-400);
    --p-color-stroke-interactive-white: var(--p-color-purple-400);
    --p-color-stroke-interactive-grey: var(--p-color-purple-400);
    --p-color-stroke-interactive-hover: var(--p-color-purple-300);
    --p-color-stroke-interactive-hover-white: var(--p-color-purple-300);
    --p-color-stroke-interactive-hover-grey: var(--p-color-purple-300);
    --p-color-stroke-interactive-pressed: var(--p-color-purple-200);
    --p-color-stroke-interactive-pressed-white: var(--p-color-purple-200);
    --p-color-stroke-interactive-pressed-grey: var(--p-color-purple-200);
    --p-color-stroke-selected: var(--p-color-purple-300);
    --p-color-stroke-selected-white: var(--p-color-purple-300);
    --p-color-stroke-selected-grey: var(--p-color-purple-300);
    --p-color-stroke-selected-hover: var(--p-color-purple-200);
    --p-color-stroke-selected-hover-white: var(--p-color-purple-200);
    --p-color-stroke-selected-hover-grey: var(--p-color-purple-200);
    --p-color-stroke-selected-pressed: var(--p-color-purple-100);
    --p-color-stroke-selected-pressed-white: var(--p-color-purple-100);
    --p-color-stroke-selected-pressed-grey: var(--p-color-purple-100);
    --p-color-stroke-disabled: var(--p-color-grey-cold-600);
    --p-color-stroke-disabled-white: var(--p-color-grey-cold-600);
    --p-color-stroke-disabled-grey: var(--p-color-grey-cold-500);
    --p-color-stroke-error: var(--p-color-red-400);
    --p-color-stroke-error-white: var(--p-color-red-400);
    --p-color-stroke-error-grey: var(--p-color-red-400);
    --p-color-stroke-success: var(--p-color-green-400);
    --p-color-stroke-success-white: var(--p-color-green-400);
    --p-color-stroke-success-grey: var(--p-color-green-400);
    --p-color-stroke-warning: var(--p-color-yellow-400);
    --p-color-stroke-warning-white: var(--p-color-yellow-400);
    --p-color-stroke-warning-grey: var(--p-color-yellow-400);
    --p-color-monochromatic-red-1: var(--p-color-red-550);
    --p-color-monochromatic-red-1-white: var(--p-color-red-550);
    --p-color-monochromatic-red-1-grey: var(--p-color-red-550);
    --p-color-monochromatic-red-2: var(--p-color-red-400);
    --p-color-monochromatic-red-2-white: var(--p-color-red-400);
    --p-color-monochromatic-red-2-grey: var(--p-color-red-400);
    --p-color-monochromatic-red-3: var(--p-color-red-300);
    --p-color-monochromatic-red-3-white: var(--p-color-red-300);
    --p-color-monochromatic-red-3-grey: var(--p-color-red-300);
    --p-color-monochromatic-red-4: var(--p-color-red-200);
    --p-color-monochromatic-red-4-white: var(--p-color-red-200);
    --p-color-monochromatic-red-4-grey: var(--p-color-red-200);
    --p-color-monochromatic-purple-1: var(--p-color-purple-550);
    --p-color-monochromatic-purple-1-white: var(--p-color-purple-550);
    --p-color-monochromatic-purple-1-grey: var(--p-color-purple-550);
    --p-color-monochromatic-purple-2: var(--p-color-purple-400);
    --p-color-monochromatic-purple-2-white: var(--p-color-purple-400);
    --p-color-monochromatic-purple-2-grey: var(--p-color-purple-400);
    --p-color-monochromatic-purple-3: var(--p-color-purple-300);
    --p-color-monochromatic-purple-3-white: var(--p-color-purple-300);
    --p-color-monochromatic-purple-3-grey: var(--p-color-purple-300);
    --p-color-monochromatic-purple-4: var(--p-color-purple-200);
    --p-color-monochromatic-purple-4-white: var(--p-color-purple-200);
    --p-color-monochromatic-purple-4-grey: var(--p-color-purple-200);
    --p-color-categorical-1: var(--p-color-purple-800);
    --p-color-categorical-1-white: var(--p-color-purple-800);
    --p-color-categorical-1-grey: var(--p-color-purple-800);
    --p-color-categorical-2: var(--p-color-purple-600);
    --p-color-categorical-2-white: var(--p-color-purple-600);
    --p-color-categorical-2-grey: var(--p-color-purple-600);
    --p-color-categorical-3: var(--p-color-red-600);
    --p-color-categorical-3-white: var(--p-color-red-600);
    --p-color-categorical-3-grey: var(--p-color-red-600);
    --p-color-categorical-4: var(--p-color-purple-550);
    --p-color-categorical-4-white: var(--p-color-purple-550);
    --p-color-categorical-4-grey: var(--p-color-purple-550);
    --p-color-categorical-5: var(--p-color-purple-400);
    --p-color-categorical-5-white: var(--p-color-purple-400);
    --p-color-categorical-5-grey: var(--p-color-purple-400);
    --p-color-categorical-6: var(--p-color-grey-cold-500);
    --p-color-categorical-6-white: var(--p-color-grey-cold-500);
    --p-color-categorical-6-grey: var(--p-color-grey-cold-500);
    --p-color-categorical-7: var(--p-color-blue-300);
    --p-color-categorical-7-white: var(--p-color-blue-300);
    --p-color-categorical-7-grey: var(--p-color-blue-300);
    --p-color-categorical-8: var(--p-color-green-550);
    --p-color-categorical-8-white: var(--p-color-green-550);
    --p-color-categorical-8-grey: var(--p-color-green-550);
    --p-color-categorical-9: var(--p-color-purple-600);
    --p-color-categorical-9-white: var(--p-color-purple-600);
    --p-color-categorical-9-grey: var(--p-color-purple-600);
    --p-color-categorical-10: var(--p-color-blue-500);
    --p-color-categorical-10-white: var(--p-color-blue-500);
    --p-color-categorical-10-grey: var(--p-color-blue-500);
    --p-color-categorical-11: var(--p-color-green-700);
    --p-color-categorical-11-white: var(--p-color-green-700);
    --p-color-categorical-11-grey: var(--p-color-green-700);
    --p-color-categorical-12: var(--p-color-grey-cold-700);
    --p-color-categorical-12-white: var(--p-color-grey-cold-700);
    --p-color-categorical-12-grey: var(--p-color-grey-cold-700);
    --p-outline: 2px solid var(--p-color-states-focus);
    --p-outline-offset: 2px;
  }

  h1 {
    --font-size: 1.75rem;
    --line-height: 2.25rem;
  }

  @media (min-width: 600px) {
    h1 {
      --font-size: 2.5rem;
      --line-height: 3.25rem;
    }
  }

  h2 {
    --font-size: 1.5rem;
    --line-height: 2rem;
  }

  @media (min-width: 600px) {
    h2 {
      --font-size: 2rem;
      --line-height: 2.5rem;
    }
  }

  h3, h4 {
    --font-size: 1.25rem;
    --line-height: 1.75rem;
  }

  @media (min-width: 600px) {
    :is(h3, h4) {
      --font-size: 1.5rem;
      --line-height: 2rem;
    }
  }

  h5 {
    --font-size: 1rem;
    --line-height: 1.5rem;
  }

  @media (min-width: 600px) {
    h5 {
      --font-size: 1.25rem;
      --line-height: 1.75rem;
    }
  }

  h1, h2, h3, h4, h5 {
    font-family: Storebrand Display, sans-serif;
    font-size: var(--font-size);
    font-weight: 600;
    line-height: var(--line-height);
  }

  :where(:is(h1, h2, h3, h4, h5)) {
    color: var(--p-color-text-primary);
  }

  :is(.h4, .font-heading-4, p.font-heading-4) {
    font-family: Storebrand Display, sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.75rem;
  }

  :where(:is(.h4, .font-heading-4, p.font-heading-4)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.h4, .font-heading-4, p.font-heading-4) {
      font-size: 1.5rem;
      line-height: 2rem;
    }
  }

  :is(.h5, .font-heading-5, p.font-heading-5) {
    font-family: Storebrand Display, sans-serif;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.5rem;
  }

  :where(:is(.h5, .font-heading-5, p.font-heading-5)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.h5, .font-heading-5, p.font-heading-5) {
      font-size: 1.25rem;
      line-height: 1.75rem;
    }
  }

  .font-body-italic {
    font-family: Storebrand Text, sans-serif;
    font-size: 1rem;
    font-style: italic;
    font-weight: 400;
    line-height: 1.375rem;
  }

  :where(.font-body-italic) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    .font-body-italic {
      font-size: 1.125rem;
      line-height: 1.625rem;
    }
  }

  .font-button-mobile {
    font-family: Storebrand Text, sans-serif;
    font-size: 1rem;
    font-weight: 500;
  }

  :where(.font-button-mobile) {
    color: var(--p-color-text-primary);
  }

  :is(.key-statistic-1, .font-key-statistic-1) {
    font-family: Storebrand Display, sans-serif;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 2rem;
  }

  :where(:is(.key-statistic-1, .font-key-statistic-1)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.key-statistic-1, .font-key-statistic-1) {
      font-size: 2rem;
      line-height: 2.5rem;
    }
  }

  :is(.key-statistic-2, .font-key-statistic-2) {
    font-family: Storebrand Display, sans-serif;
    font-size: 1.25rem;
    font-weight: 600;
    line-height: 1.75rem;
  }

  :where(:is(.key-statistic-2, .font-key-statistic-2)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.key-statistic-2, .font-key-statistic-2) {
      font-size: 1.5rem;
      line-height: 2rem;
    }
  }

  :is(.key-statistic-3, .font-key-statistic-3) {
    font-family: Storebrand Display, sans-serif;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.625rem;
  }

  :where(:is(.key-statistic-3, .font-key-statistic-3)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.key-statistic-3, .font-key-statistic-3) {
      font-size: 1.25rem;
      line-height: 1.75rem;
    }
  }

  :is(.p, .font-paragraph, .font-body) {
    font-family: Storebrand Text, sans-serif;
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.375rem;
  }

  :where(:is(.p, .font-paragraph, .font-body)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.p, .font-paragraph, .font-body) {
      font-size: 1.125rem;
      line-height: 1.625rem;
    }
  }

  :is(.display, .font-display, p.font-display) {
    font-family: Storebrand Display, sans-serif;
    font-size: 2.25rem;
    font-weight: 600;
    line-height: 2.75rem;
  }

  :where(:is(.display, .font-display, p.font-display)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.display, .font-display, p.font-display) {
      font-size: 4rem;
      line-height: 4.5rem;
    }
  }

  .font-body-xl, .font-body-xl-demibold {
    font-family: Storebrand Text, sans-serif;
    font-size: 1.25rem;
    line-height: 1.75rem;
  }

  :where(:is(.font-body-xl, .font-body-xl-demibold)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.font-body-xl, .font-body-xl-demibold) {
      font-size: 1.5rem;
      line-height: 2rem;
    }
  }

  .font-body-xl-demibold {
    font-weight: 600;
  }

  :is(.font-large-demibold, .font-body-large-demibold, .font-body-lg-demibold) {
    font-family: Storebrand Text, sans-serif;
    font-size: 1.125rem;
    font-weight: 600;
    line-height: 1.625rem;
  }

  :where(:is(.font-large-demibold, .font-body-large-demibold, .font-body-lg-demibold)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.font-large-demibold, .font-body-large-demibold, .font-body-lg-demibold) {
      font-size: 1.25rem;
      line-height: 1.75rem;
    }
  }

  :is(.font-large, .font-body-large, .font-body-lg) {
    font-family: Storebrand Text, sans-serif;
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.625rem;
  }

  :where(:is(.font-large, .font-body-large, .font-body-lg)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.font-large, .font-body-large, .font-body-lg) {
      font-size: 1.25rem;
      line-height: 1.75rem;
    }
  }

  :is(.font-alert-title, .font-body-demibold) {
    font-family: Storebrand Text, sans-serif;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.375rem;
  }

  :where(:is(.font-alert-title, .font-body-demibold)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.font-alert-title, .font-body-demibold) {
      font-size: 1.125rem;
      line-height: 1.625rem;
    }
  }

  :is(.font-small, .font-body-small, .font-body-sm, .font-small-link, .font-body-small-link, .font-body-sm-link) {
    font-family: Storebrand Text, sans-serif;
    font-size: .875rem;
    font-weight: 400;
    line-height: 1.25rem;
  }

  :where(:is(.font-small, .font-body-small, .font-body-sm, .font-small-link, .font-body-small-link, .font-body-sm-link)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.font-small, .font-body-small, .font-body-sm, .font-small-link, .font-body-small-link, .font-body-sm-link) {
      font-size: 1rem;
      line-height: 1.375rem;
    }
  }

  :is(.font-small-demibold, .font-sm-demibold, .font-body-small-demibold, .font-body-sm-demibold) {
    font-family: Storebrand Text, sans-serif;
    font-size: .875rem;
    font-weight: 600;
    line-height: 1.25rem;
  }

  :where(:is(.font-small-demibold, .font-sm-demibold, .font-body-small-demibold, .font-body-sm-demibold)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.font-small-demibold, .font-sm-demibold, .font-body-small-demibold, .font-body-sm-demibold) {
      font-size: 1rem;
      line-height: 1.375rem;
    }
  }

  :is(.button, .font-button, .font-button-large, .font-button-lg) {
    font-family: Storebrand Text, sans-serif;
    font-size: 1rem;
    font-weight: 500;
    line-height: 1.375rem;
  }

  :where(:is(.button, .font-button, .font-button-large, .font-button-lg)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.button, .font-button, .font-button-large, .font-button-lg) {
      font-size: 1.125rem;
      line-height: 1.625rem;
    }
  }

  :is(.font-button-medium, .font-button-md) {
    font-family: Storebrand Text, sans-serif;
    font-size: .875rem;
    font-weight: 500;
    line-height: 1.25rem;
  }

  :where(:is(.font-button-medium, .font-button-md)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.font-button-medium, .font-button-md) {
      font-size: 1rem;
      line-height: 1.375rem;
    }
  }

  :is(.font-button-small, .font-button-sm) {
    font-family: Storebrand Text, sans-serif;
    font-size: .75rem;
    font-weight: 500;
    line-height: 1rem;
  }

  :where(:is(.font-button-small, .font-button-sm)) {
    color: var(--p-color-text-primary);
  }

  @media (min-width: 600px) {
    :is(.font-button-small, .font-button-sm) {
      font-size: .875rem;
      line-height: 1.125rem;
    }
  }

  :is(.hint, .font-hint, .font-caption, .font-details) {
    font-family: Storebrand Text, sans-serif;
    font-size: .75rem;
    font-weight: 400;
    line-height: 1rem;
  }

  :where(:is(.hint, .font-hint, .font-caption, .font-details)) {
    color: var(--p-color-text-secondary);
  }

  @media (min-width: 600px) {
    :is(.hint, .font-hint, .font-caption, .font-details) {
      font-size: .875rem;
      line-height: 1.125rem;
    }
  }

  :is(.font-caption-demibold, .font-details-demibold) {
    font-family: Storebrand Text, sans-serif;
    font-size: .75rem;
    font-weight: 600;
    line-height: 1rem;
  }

  :where(:is(.font-caption-demibold, .font-details-demibold)) {
    color: var(--p-color-text-secondary);
  }

  @media (min-width: 600px) {
    :is(.font-caption-demibold, .font-details-demibold) {
      font-size: .875rem;
      line-height: 1.125rem;
    }
  }

  .font-key-number, .font-key-number-sm, .font-key-number-details {
    font-family: Storebrand Display, sans-serif;
    font-weight: 500;
  }

  :where(:is(.font-key-number, .font-key-number-sm, .font-key-number-details)) {
    color: var(--p-color-text-primary);
  }

  .font-key-number {
    font-size: 1rem;
    line-height: 1.375rem;
  }

  @media (min-width: 600px) {
    .font-key-number {
      font-size: 1.125rem;
      line-height: 1.625rem;
    }
  }

  .font-key-number-sm {
    font-size: .875rem;
    line-height: 1.25rem;
  }

  @media (min-width: 600px) {
    .font-key-number-sm {
      font-size: 1.125rem;
      line-height: 1.375rem;
    }
  }

  .font-key-number-details {
    font-size: .75rem;
    line-height: 1rem;
  }

  @media (min-width: 600px) {
    .font-key-number-details {
      font-size: .875rem;
      line-height: 1.125rem;
    }
  }

  a, .font-link {
    text-underline-offset: 2px;
    text-decoration: underline;
  }

  :where(:is(a, .font-link)) {
    color: var(--p-color-text-interactive);
  }

  :where(:is(a, .font-link)):hover {
    color: var(--p-color-text-interactive-hover);
  }

  :is(a, .font-link):focus-visible {
    border-radius: var(--p-corner-radius-small);
    outline: var(--p-outline);
  }

  .font-weight-400 {
    font-weight: 400;
  }

  .font-weight-500 {
    font-weight: 500;
  }

  .font-weight-600 {
    font-weight: 600;
  }

  .font-weight-700 {
    font-weight: 700;
  }

  .font-style-italic {
    font-style: italic;
  }

  .text-underline {
    text-decoration: underline;
  }

  :is(.h1, .font-heading-1, p.font-heading-1) {
    --font-size: 1.75rem;
    --line-height: 2.25rem;
  }

  @media (min-width: 600px) {
    :is(.h1, .font-heading-1, p.font-heading-1) {
      --font-size: 2.5rem;
      --line-height: 3.25rem;
    }
  }

  :is(.h2, .font-heading-2, p.font-heading-2) {
    --font-size: 1.5rem;
    --line-height: 2rem;
  }

  @media (min-width: 600px) {
    :is(.h2, .font-heading-2, p.font-heading-2) {
      --font-size: 2rem;
      --line-height: 2.5rem;
    }
  }

  :is(.h3, .font-heading-3, p.font-heading-3) {
    --font-size: 1.25rem;
    --line-height: 1.75rem;
  }

  @media (min-width: 600px) {
    :is(.h3, .font-heading-3, p.font-heading-3) {
      --font-size: 1.5rem;
      --line-height: 2rem;
    }
  }

  :is(.h1, .font-heading-1, p.font-heading-1), :is(.h2, .font-heading-2, p.font-heading-2), :is(.h3, .font-heading-3, p.font-heading-3) {
    font-family: Storebrand Display, sans-serif;
    font-size: var(--font-size);
    font-weight: 600;
    line-height: var(--line-height);
  }

  :where(:is(:is(.h1, .font-heading-1, p.font-heading-1), :is(.h2, .font-heading-2, p.font-heading-2), :is(.h3, .font-heading-3, p.font-heading-3))) {
    color: var(--p-color-text-primary);
  }

  .font-color-inherit {
    color: inherit;
  }

  .font-color-primary {
    color: var(--p-color-text-primary);
  }

  .font-color-secondary {
    color: var(--p-color-text-secondary);
  }

  .font-color-interactive {
    color: var(--p-color-text-interactive);
  }

  .font-color-placeholder {
    color: var(--p-color-text-placeholder);
  }

  .font-color-disabled {
    color: var(--p-color-text-disabled);
  }

  .font-color-info {
    color: var(--p-color-text-info);
  }

  .font-color-success {
    color: var(--p-color-text-success);
  }

  .font-color-warning {
    color: var(--p-color-text-warning);
  }

  .font-color-alert {
    color: var(--p-color-text-alert);
  }

  .font-color-error {
    color: var(--p-color-text-error);
  }

  :root, :host {
    --p-z-index-base: 0;
    --p-z-index-above: 1;
    --p-z-index-below: -1;
    --p-z-index-input: calc(var(--p-z-index-base)  + var(--p-z-index-above));
    --p-z-index-tooltip: calc(var(--p-z-index-input)  + var(--p-z-index-above));
    --p-z-index-popover: calc(var(--p-z-index-tooltip)  + var(--p-z-index-above));
    --p-z-index-dropdown: calc(var(--p-z-index-popover)  + var(--p-z-index-above));
    --p-z-index-navbar-menu: calc(var(--p-z-index-dropdown)  + var(--p-z-index-above));
    --p-z-index-toast: calc(var(--p-z-index-navbar-menu)  + var(--p-z-index-above));
    --p-z-index-dialog: calc(var(--p-z-index-toast)  + var(--p-z-index-above));
    --p-z-index-modal: calc(var(--p-z-index-dialog)  + var(--p-z-index-above));
  }

  .grid-container {
    --grid-columns: 12;
    --grid-gap: 2rem;
    --grid-max-width: 1128px;
    --grid-span: 12;
    --grid-start: auto;
    column-gap: var(--grid-gap);
    grid-template-columns: repeat(var(--grid-columns), 1fr);
    max-width: var(--grid-max-width);
    width: 100%;
    margin: 0 auto;
    display: grid;
  }

  .grid-container .grid-item {
    grid-column: var(--grid-start) / span var(--grid-span);
  }

  @media screen and (min-width: 992px) {
    .grid-container .grid-item.lg_cols-1 {
      --grid-span: 1;
    }

    .grid-container .grid-item.lg_cols-2 {
      --grid-span: 2;
    }

    .grid-container .grid-item.lg_cols-3 {
      --grid-span: 3;
    }

    .grid-container .grid-item.lg_cols-4 {
      --grid-span: 4;
    }

    .grid-container .grid-item.lg_cols-5 {
      --grid-span: 5;
    }

    .grid-container .grid-item.lg_cols-6 {
      --grid-span: 6;
    }

    .grid-container .grid-item.lg_cols-7 {
      --grid-span: 7;
    }

    .grid-container .grid-item.lg_cols-8 {
      --grid-span: 8;
    }

    .grid-container .grid-item.lg_cols-9 {
      --grid-span: 9;
    }

    .grid-container .grid-item.lg_cols-10 {
      --grid-span: 10;
    }

    .grid-container .grid-item.lg_cols-11 {
      --grid-span: 11;
    }

    .grid-container .grid-item.lg_cols-12 {
      --grid-span: 12;
    }

    .grid-container .grid-item.lg_off-1 {
      --grid-start: 1;
    }

    .grid-container .grid-item.lg_off-2 {
      --grid-start: 2;
    }

    .grid-container .grid-item.lg_off-3 {
      --grid-start: 3;
    }

    .grid-container .grid-item.lg_off-4 {
      --grid-start: 4;
    }

    .grid-container .grid-item.lg_off-5 {
      --grid-start: 5;
    }

    .grid-container .grid-item.lg_off-6 {
      --grid-start: 6;
    }

    .grid-container .grid-item.lg_off-7 {
      --grid-start: 7;
    }

    .grid-container .grid-item.lg_off-8 {
      --grid-start: 8;
    }

    .grid-container .grid-item.lg_off-9 {
      --grid-start: 9;
    }

    .grid-container .grid-item.lg_off-10 {
      --grid-start: 10;
    }

    .grid-container .grid-item.lg_off-11 {
      --grid-start: 11;
    }

    .grid-container .grid-item.lg_off-12 {
      --grid-start: 12;
    }
  }

  @media screen and (max-width: 991px) and (min-width: 768px) {
    .grid-container {
      --grid-columns: 8;
      --grid-span: 8;
    }

    .grid-container .grid-item.md_cols-1 {
      --grid-span: 1;
    }

    .grid-container .grid-item.md_cols-2 {
      --grid-span: 2;
    }

    .grid-container .grid-item.md_cols-3 {
      --grid-span: 3;
    }

    .grid-container .grid-item.md_cols-4 {
      --grid-span: 4;
    }

    .grid-container .grid-item.md_cols-5 {
      --grid-span: 5;
    }

    .grid-container .grid-item.md_cols-6 {
      --grid-span: 6;
    }

    .grid-container .grid-item.md_cols-7 {
      --grid-span: 7;
    }

    .grid-container .grid-item.md_cols-8 {
      --grid-span: 8;
    }

    .grid-container .grid-item.md_off-1 {
      --grid-start: 1;
    }

    .grid-container .grid-item.md_off-2 {
      --grid-start: 2;
    }

    .grid-container .grid-item.md_off-3 {
      --grid-start: 3;
    }

    .grid-container .grid-item.md_off-4 {
      --grid-start: 4;
    }

    .grid-container .grid-item.md_off-5 {
      --grid-start: 5;
    }

    .grid-container .grid-item.md_off-6 {
      --grid-start: 6;
    }

    .grid-container .grid-item.md_off-7 {
      --grid-start: 7;
    }

    .grid-container .grid-item.md_off-8 {
      --grid-start: 8;
    }
  }

  @media screen and (max-width: 767px) {
    .grid-container {
      --grid-columns: 4;
      --grid-gap: 1rem;
      --grid-span: 4;
    }

    .grid-container .grid-item.sm_cols-1 {
      --grid-span: 1;
    }

    .grid-container .grid-item.sm_cols-2 {
      --grid-span: 2;
    }

    .grid-container .grid-item.sm_cols-3 {
      --grid-span: 3;
    }

    .grid-container .grid-item.sm_cols-4 {
      --grid-span: 4;
    }

    .grid-container .grid-item.sm_off-1 {
      --grid-start: 1;
    }

    .grid-container .grid-item.sm_off-2 {
      --grid-start: 2;
    }

    .grid-container .grid-item.sm_off-3 {
      --grid-start: 3;
    }

    .grid-container .grid-item.sm_off-4 {
      --grid-start: 4;
    }
  }

  * {
    font-synthesis: none;
    margin: 0;
  }

  html {
    font-size: 100%;
  }

  body {
    background: var(--p-color-background);
    color: var(--p-color-text-primary);
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-family: Storebrand Text, sans-serif;
  }
}

@layer foundation {
  @layer properties {
    @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
      *, :before, :after, ::backdrop {
        --tw-border-style: solid;
        --tw-blur: initial;
        --tw-brightness: initial;
        --tw-contrast: initial;
        --tw-grayscale: initial;
        --tw-hue-rotate: initial;
        --tw-invert: initial;
        --tw-opacity: initial;
        --tw-saturate: initial;
        --tw-sepia: initial;
        --tw-drop-shadow: initial;
        --tw-drop-shadow-color: initial;
        --tw-drop-shadow-alpha: 100%;
        --tw-drop-shadow-size: initial;
      }
    }
  }

  @layer pretzel-assets;

  @layer theme {
    :root, :host {
      --spacing: .25rem;
      --radius-medium: 16px;
    }
  }

  @layer base, components;

  @layer utilities {
    .pointer-events-none {
      pointer-events: none;
    }

    .fixed {
      position: fixed;
    }

    .relative {
      position: relative;
    }

    .static {
      position: static;
    }

    .top-0 {
      top: calc(var(--spacing) * 0);
    }

    .left-0 {
      left: calc(var(--spacing) * 0);
    }

    .mt-section-away {
      margin-top: var(--p-section-away);
    }

    .mb-body-away {
      margin-bottom: var(--p-body-away);
    }

    .mb-subsection-away {
      margin-bottom: var(--p-subsection-away);
    }

    .block {
      display: block;
    }

    .flex {
      display: flex;
    }

    .grid {
      display: grid;
    }

    .hidden {
      display: none;
    }

    .h-\[140px\] {
      height: 140px;
    }

    .h-full {
      height: 100%;
    }

    .w-\[80px\] {
      width: 80px;
    }

    .w-full {
      width: 100%;
    }

    .rotate-40 {
      rotate: 40deg;
    }

    .rotate-320 {
      rotate: 320deg;
    }

    .grid-cols-\[1fr_auto\] {
      grid-template-columns: 1fr auto;
    }

    .flex-wrap {
      flex-wrap: wrap;
    }

    .place-items-center {
      place-items: center;
    }

    .items-center {
      align-items: center;
    }

    .gap-08 {
      gap: 8px;
    }

    .gap-body-away {
      gap: var(--p-body-away);
    }

    .rounded-\[12px\] {
      border-radius: 12px;
    }

    .rounded-\[50\%\] {
      border-radius: 50%;
    }

    .border {
      border-style: var(--tw-border-style);
      border-width: 1px;
    }

    .bg-\[rgba\(255\,255\,255\,0\.8\)\] {
      background-color: #fffc;
    }

    .bg-static-brand-background {
      background-color: var(--p-color-static-brand-background);
    }

    .px-16 {
      padding-inline: 16px;
    }

    .py-20 {
      padding-block: 20px;
    }

    .text-center {
      text-align: center;
    }

    .text-static-brand-foreground {
      color: var(--p-color-static-brand-foreground);
    }

    .overline {
      text-decoration-line: overline;
    }

    .underline {
      text-decoration-line: underline;
    }

    .blur {
      --tw-blur: blur(8px);
      filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
    }

    @media (hover: hover) {
      .group-hover\:underline:is(:where(.group):hover *) {
        text-decoration-line: underline;
      }
    }

    @media (min-width: 64rem) {
      .lg\:px-20 {
        padding-inline: 20px;
      }

      .lg\:py-24 {
        padding-block: 24px;
      }
    }
  }

  @property --tw-border-style {
    syntax: "*"; inherits: false; initial-value: solid;
  }

  @property --tw-blur {
    syntax: "*"; inherits: false;
  }

  @property --tw-brightness {
    syntax: "*"; inherits: false;
  }

  @property --tw-contrast {
    syntax: "*"; inherits: false;
  }

  @property --tw-grayscale {
    syntax: "*"; inherits: false;
  }

  @property --tw-hue-rotate {
    syntax: "*"; inherits: false;
  }

  @property --tw-invert {
    syntax: "*"; inherits: false;
  }

  @property --tw-opacity {
    syntax: "*"; inherits: false;
  }

  @property --tw-saturate {
    syntax: "*"; inherits: false;
  }

  @property --tw-sepia {
    syntax: "*"; inherits: false;
  }

  @property --tw-drop-shadow {
    syntax: "*"; inherits: false;
  }

  @property --tw-drop-shadow-color {
    syntax: "*"; inherits: false;
  }

  @property --tw-drop-shadow-alpha {
    syntax: "<percentage>"; inherits: false; initial-value: 100%;
  }

  @property --tw-drop-shadow-size {
    syntax: "*"; inherits: false;
  }

  ._button_7nldf_1 {
    all: unset;
    outline-offset: 2px;
    border-radius: var(--radius-medium);
    cursor: pointer;
    width: 100%;
    display: grid;
  }

  ._button_7nldf_1:focus-visible {
    outline: var(--p-outline);
  }
}

@layer theme {
  :root, :host {
    --default-transition-duration: .15s;
    --default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
    --color-red-200: var(--p-color-red-200);
    --radius-medium: 16px;
    --spacing-0: 0;
    --spacing-4: 4px;
    --spacing-8: 8px;
    --spacing-12: 12px;
    --spacing-16: 16px;
    --spacing-24: 24px;
    --spacing-32: 32px;
    --spacing-40: 40px;
    --spacing-48: 48px;
    --container-standard: 600px;
  }
}

@layer utilities {
  .visible {
    visibility: visible;
  }

  .relative {
    position: relative;
  }

  .static {
    position: static;
  }

  .col-span-1 {
    grid-column: span 1 / span 1;
  }

  .container {
    width: 100%;
  }

  @media (min-width: 40rem) {
    .container {
      max-width: 40rem;
    }
  }

  @media (min-width: 48rem) {
    .container {
      max-width: 48rem;
    }
  }

  @media (min-width: 64rem) {
    .container {
      max-width: 64rem;
    }
  }

  @media (min-width: 80rem) {
    .container {
      max-width: 80rem;
    }
  }

  @media (min-width: 96rem) {
    .container {
      max-width: 96rem;
    }
  }

  .m-0 {
    margin: var(--spacing-0);
  }

  .mx-0 {
    margin-inline: var(--spacing-0);
  }

  .mx-auto {
    margin-inline: auto;
  }

  .my-8 {
    margin-block: var(--spacing-8);
  }

  .my-16 {
    margin-block: var(--spacing-16);
  }

  .mt-12 {
    margin-top: var(--spacing-12);
  }

  .mt-24 {
    margin-top: var(--spacing-24);
  }

  .mt-\[2rem\] {
    margin-top: 2rem;
  }

  .mr-\[16px\] {
    margin-right: 16px;
  }

  .mb-12 {
    margin-bottom: var(--spacing-12);
  }

  .mb-16 {
    margin-bottom: var(--spacing-16);
  }

  .mb-24 {
    margin-bottom: var(--spacing-24);
  }

  .mb-\[1rem\] {
    margin-bottom: 1rem;
  }

  .mb-\[3rem\] {
    margin-bottom: 3rem;
  }

  .mb-heading-near {
    margin-bottom: var(--p-heading-near);
  }

  .contents {
    display: contents;
  }

  .flex {
    display: flex;
  }

  .grid {
    display: grid;
  }

  .hidden {
    display: none;
  }

  .h-\[2px\] {
    height: 2px;
  }

  .h-\[24px\] {
    height: 24px;
  }

  .h-\[60px\] {
    height: 60px;
  }

  .h-fit {
    height: fit-content;
  }

  .h-full {
    height: 100%;
  }

  .min-h-\[360px\] {
    min-height: 360px;
  }

  .w-\[2px\] {
    width: 2px;
  }

  .w-\[24px\] {
    width: 24px;
  }

  .w-\[60px\] {
    width: 60px;
  }

  .w-full {
    width: 100%;
  }

  .max-w-\[110px\] {
    max-width: 110px;
  }

  .max-w-standard {
    max-width: var(--container-standard);
  }

  .flex-1 {
    flex: 1;
  }

  .flex-grow {
    flex-grow: 1;
  }

  .transform {
    transform: var(--tw-rotate-x, ) var(--tw-rotate-y, ) var(--tw-rotate-z, ) var(--tw-skew-x, ) var(--tw-skew-y, );
  }

  .cursor-pointer {
    cursor: pointer;
  }

  .grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }

  .grid-cols-\[1fr_auto\] {
    grid-template-columns: 1fr auto;
  }

  .grid-cols-\[auto_1fr\] {
    grid-template-columns: auto 1fr;
  }

  .grid-cols-\[auto_1fr_auto\] {
    grid-template-columns: auto 1fr auto;
  }

  .flex-col {
    flex-direction: column;
  }

  .flex-wrap {
    flex-wrap: wrap;
  }

  .place-items-center {
    place-items: center;
  }

  .items-center {
    align-items: center;
  }

  .justify-between {
    justify-content: space-between;
  }

  .justify-center {
    justify-content: center;
  }

  .gap-4 {
    gap: var(--spacing-4);
  }

  .gap-8 {
    gap: var(--spacing-8);
  }

  .gap-12 {
    gap: var(--spacing-12);
  }

  .gap-16 {
    gap: var(--spacing-16);
  }

  .gap-24 {
    gap: var(--spacing-24);
  }

  .gap-32 {
    gap: var(--spacing-32);
  }

  .gap-x-12 {
    column-gap: var(--spacing-12);
  }

  .gap-x-24 {
    column-gap: var(--spacing-24);
  }

  .gap-y-8 {
    row-gap: var(--spacing-8);
  }

  .gap-y-12 {
    row-gap: var(--spacing-12);
  }

  .self-center {
    align-self: center;
  }

  .self-start {
    align-self: flex-start;
  }

  .overflow-hidden {
    overflow: hidden;
  }

  .rounded-\[24px\] {
    border-radius: 24px;
  }

  .rounded-tr-\[100px\] {
    border-top-right-radius: 100px;
  }

  .border {
    border-style: var(--tw-border-style);
    border-width: 1px;
  }

  .border-0 {
    border-style: var(--tw-border-style);
    border-width: 0;
  }

  .border-b-2 {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 2px;
  }

  .border-b-4 {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 4px;
  }

  .border-none {
    --tw-border-style: none;
    border-style: none;
  }

  .border-solid {
    --tw-border-style: solid;
    border-style: solid;
  }

  .border-red-200 {
    border-color: var(--p-color-red-200);
  }

  .border-b-text-interactive {
    border-bottom-color: var(--p-color-text-interactive);
  }

  .border-b-text-primary {
    border-bottom-color: var(--p-color-text-primary);
  }

  .bg-grey-200 {
    background-color: var(--p-color-grey-200);
  }

  .bg-transparent {
    background-color: #0000;
  }

  .p-0 {
    padding: var(--spacing-0);
  }

  .p-24 {
    padding: var(--spacing-24);
  }

  .px-8 {
    padding-inline: var(--spacing-8);
  }

  .py-8 {
    padding-block: var(--spacing-8);
  }

  .text-center {
    text-align: center;
  }

  .text-start {
    text-align: start;
  }

  .text-stroke-0 {
    color: var(--p-color-stroke-0);
  }

  .text-text-interactive {
    color: var(--p-color-text-interactive);
  }

  .text-text-primary {
    color: var(--p-color-text-primary);
  }

  .capitalize {
    text-transform: capitalize;
  }

  .no-underline {
    text-decoration-line: none;
  }

  .filter {
    filter: var(--tw-blur, ) var(--tw-brightness, ) var(--tw-contrast, ) var(--tw-grayscale, ) var(--tw-hue-rotate, ) var(--tw-invert, ) var(--tw-saturate, ) var(--tw-sepia, ) var(--tw-drop-shadow, );
  }

  .transition {
    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate, filter, -webkit-backdrop-filter, backdrop-filter, display, content-visibility, overlay, pointer-events;
    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
    transition-duration: var(--tw-duration, var(--default-transition-duration));
  }

  .focus\:outline-none:focus {
    --tw-outline-style: none;
    outline-style: none;
  }

  .focus-visible\:ring-2:focus-visible {
    --tw-ring-shadow: var(--tw-ring-inset, ) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
  }

  .focus-visible\:ring-focus-1:focus-visible {
    --tw-ring-color: var(--p-color-focus-1);
  }

  .focus-visible\:ring-offset-2:focus-visible {
    --tw-ring-offset-width: 2px;
    --tw-ring-offset-shadow: var(--tw-ring-inset, ) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
  }

  @media (min-width: 921px) {
    .min-\[921px\]\:mr-24 {
      margin-right: var(--spacing-24);
    }

    .min-\[921px\]\:ml-\[64px\] {
      margin-left: 64px;
    }
  }

  @media (min-width: 40rem) {
    .sm\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  @media (min-width: 48rem) {
    .md\:col-span-2 {
      grid-column: span 2 / span 2;
    }

    .md\:block {
      display: block;
    }

    .md\:flex {
      display: flex;
    }

    .md\:grid-cols-2 {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .md\:grid-cols-\[1fr_auto_1fr\] {
      grid-template-columns: 1fr auto 1fr;
    }

    .md\:gap-24 {
      gap: var(--spacing-24);
    }

    .md\:gap-32 {
      gap: var(--spacing-32);
    }

    .md\:gap-40 {
      gap: var(--spacing-40);
    }

    .md\:gap-48 {
      gap: var(--spacing-48);
    }
  }

  @media (min-width: 64rem) {
    .lg\:grid-cols-3 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .lg\:flex-row {
      flex-direction: row;
    }
  }

  .\[\&\:not\(\:last-child\)\]\:border-b-2:not(:last-child) {
    border-bottom-style: var(--tw-border-style);
    border-bottom-width: 2px;
  }

  .\[\&\:not\(\:last-child\)\]\:border-\[var\(--color-red-200\)\]:not(:last-child) {
    border-color: var(--color-red-200);
  }
}

@layer base, components;

html, body {
  scrollbar-gutter: stable;
  height: 100%;
  margin: 0;
}

@property --tw-rotate-x {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-y {
  syntax: "*";
  inherits: false
}

@property --tw-rotate-z {
  syntax: "*";
  inherits: false
}

@property --tw-skew-x {
  syntax: "*";
  inherits: false
}

@property --tw-skew-y {
  syntax: "*";
  inherits: false
}

@property --tw-border-style {
  syntax: "*";
  inherits: false;
  initial-value: solid;
}

@property --tw-blur {
  syntax: "*";
  inherits: false
}

@property --tw-brightness {
  syntax: "*";
  inherits: false
}

@property --tw-contrast {
  syntax: "*";
  inherits: false
}

@property --tw-grayscale {
  syntax: "*";
  inherits: false
}

@property --tw-hue-rotate {
  syntax: "*";
  inherits: false
}

@property --tw-invert {
  syntax: "*";
  inherits: false
}

@property --tw-opacity {
  syntax: "*";
  inherits: false
}

@property --tw-saturate {
  syntax: "*";
  inherits: false
}

@property --tw-sepia {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-drop-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-drop-shadow-size {
  syntax: "*";
  inherits: false
}

@property --tw-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-inset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-shadow-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-shadow-alpha {
  syntax: "<percentage>";
  inherits: false;
  initial-value: 100%;
}

@property --tw-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-inset-ring-color {
  syntax: "*";
  inherits: false
}

@property --tw-inset-ring-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}

@property --tw-ring-inset {
  syntax: "*";
  inherits: false
}

@property --tw-ring-offset-width {
  syntax: "<length>";
  inherits: false;
  initial-value: 0;
}

@property --tw-ring-offset-color {
  syntax: "*";
  inherits: false;
  initial-value: #fff;
}

@property --tw-ring-offset-shadow {
  syntax: "*";
  inherits: false;
  initial-value: 0 0 #0000;
}
