@redvars/peacock 3.1.2 → 3.1.3

package/dist/peacock-loader.js

@@ -1,19 +1,23 @@
+import { s as styleInject } from './style-inject.es-tgCJW-Cu.js';
+import { Elevation } from './elevation.js';
+import { FocusRing } from './focus-ring.js';
+import { Ripple } from './ripple.js';
 import { Icon } from './icon.js';
 import { Avatar } from './avatar.js';
 import { Badge } from './badge.js';
 import { Divider } from './divider.js';
-import { r, i } from './property-D4Kn9TsY.js';
-import { f as focusRing, g as getTypography } from './styleMixins.css-CivfMYtB.js';
-import './state-CxzmLNIi.js';
+import { Button } from './button.js';
+import { i } from './lit-element-CkD27PXL.js';
+import './property-CR1ZrEd9.js';
+import './utils-CY3RyfcA.js';
 import './directive-BKuZRRPO.js';
-import './utils-_5no4mk7.js';
-import './class-map-DpvLRi0h.js';
+import './class-map-Cavm-B1S.js';
 
-var cssComponentsStyleSheet = "/* -------------------------------------------\n *  Autogenerated by ⛋ Terrazzo. DO NOT EDIT!\n * ------------------------------------------- */\n\n:root {\n  --color-black: #000000;\n  --color-blue: #305cde;\n  --color-blue-0: #000000;\n  --color-blue-10: #001550;\n  --color-blue-20: #00277f;\n  --color-blue-30: #003ab2;\n  --color-blue-40: #2352d5;\n  --color-blue-50: #446def;\n  --color-blue-60: #6789ff;\n  --color-blue-70: #90a7ff;\n  --color-blue-80: #b6c4ff;\n  --color-blue-90: #dce1ff;\n  --color-blue-95: #eff0ff;\n  --color-blue-98: #faf8ff;\n  --color-blue-100: #ffffff;\n  --color-error: var(--color-red);\n  --color-error-0: var(--color-red-0);\n  --color-error-10: var(--color-red-10);\n  --color-error-20: var(--color-red-20);\n  --color-error-30: var(--color-red-30);\n  --color-error-40: var(--color-red-40);\n  --color-error-50: var(--color-red-50);\n  --color-error-60: var(--color-red-60);\n  --color-error-70: var(--color-red-70);\n  --color-error-80: var(--color-red-80);\n  --color-error-90: var(--color-red-90);\n  --color-error-95: var(--color-red-95);\n  --color-error-98: var(--color-red-98);\n  --color-error-100: var(--color-red-100);\n  --color-error-container: var(--color-error-90);\n  --color-green: #2e6f40;\n  --color-green-0: #000000;\n  --color-green-10: #00210b;\n  --color-green-20: #003917;\n  --color-green-30: #005225;\n  --color-green-40: #0f6d35;\n  --color-green-50: #31874b;\n  --color-green-60: #4da163;\n  --color-green-70: #68bd7b;\n  --color-green-80: #83d995;\n  --color-green-90: #9ff6af;\n  --color-green-95: #c4ffcb;\n  --color-green-98: #eaffe9;\n  --color-green-100: #ffffff;\n  --color-inverse-error: var(--color-error-80);\n  --color-inverse-on-surface: var(--color-neutral-95);\n  --color-inverse-primary: var(--color-primary-80);\n  --color-inverse-secondary: var(--color-secondary-80);\n  --color-inverse-surface: var(--color-neutral-20);\n  --color-inverse-tertiary: var(--color-tertiary-80);\n  --color-neutral: #747878;\n  --color-neutral-0: #000000;\n  --color-neutral-4: #0b0f0f;\n  --color-neutral-6: #101415;\n  --color-neutral-10: #191c1d;\n  --color-neutral-12: #1d2021;\n  --color-neutral-17: #272b2b;\n  --color-neutral-20: #2e3132;\n  --color-neutral-22: #323536;\n  --color-neutral-30: #444748;\n  --color-neutral-40: #5c5f5f;\n  --color-neutral-50: #747878;\n  --color-neutral-60: #8e9192;\n  --color-neutral-70: #a9acac;\n  --color-neutral-80: #c4c7c7;\n  --color-neutral-87: #d8dadb;\n  --color-neutral-90: #e1e3e3;\n  --color-neutral-92: #e6e8e9;\n  --color-neutral-94: #eceeef;\n  --color-neutral-95: #eff1f1;\n  --color-neutral-96: #f2f4f4;\n  --color-neutral-98: #f8fafa;\n  --color-neutral-99: #fafdfd;\n  --color-neutral-100: #ffffff;\n  --color-neutral-variant: #6f797a;\n  --color-neutral-variant-0: #000000;\n  --color-neutral-variant-4: #071011;\n  --color-neutral-variant-6: #0c1516;\n  --color-neutral-variant-10: #141d1f;\n  --color-neutral-variant-12: #182123;\n  --color-neutral-variant-17: #222b2d;\n  --color-neutral-variant-20: #293234;\n  --color-neutral-variant-22: #2d3638;\n  --color-neutral-variant-30: #3f484a;\n  --color-neutral-variant-40: #576062;\n  --color-neutral-variant-50: #6f797a;\n  --color-neutral-variant-60: #899294;\n  --color-neutral-variant-70: #a3adaf;\n  --color-neutral-variant-80: #bfc8ca;\n  --color-neutral-variant-87: #d2dcde;\n  --color-neutral-variant-90: #dbe4e6;\n  --color-neutral-variant-92: #e0eaec;\n  --color-neutral-variant-94: #e6f0f1;\n  --color-neutral-variant-95: #e9f2f4;\n  --color-neutral-variant-96: #ecf5f7;\n  --color-neutral-variant-98: #f2fbfd;\n  --color-neutral-variant-99: #f6feff;\n  --color-neutral-variant-100: #ffffff;\n  --color-on-error: var(--color-error-100);\n  --color-on-error-container: var(--color-error-10);\n  --color-on-primary: var(--color-primary-100);\n  --color-on-primary-container: var(--color-primary-10);\n  --color-on-secondary: var(--color-secondary-100);\n  --color-on-secondary-container: var(--color-secondary-10);\n  --color-on-surface: var(--color-neutral-10);\n  --color-on-surface-variant: var(--color-neutral-variant-30);\n  --color-on-tertiary: var(--color-tertiary-100);\n  --color-on-tertiary-container: var(--color-tertiary-10);\n  --color-orange: #ff7518;\n  --color-orange-0: #000000;\n  --color-orange-10: #341100;\n  --color-orange-20: #552100;\n  --color-orange-30: #783100;\n  --color-orange-40: #9e4300;\n  --color-orange-50: #c55500;\n  --color-orange-60: #ee6803;\n  --color-orange-70: #ff8d4c;\n  --color-orange-80: #ffb691;\n  --color-orange-90: #ffdbcb;\n  --color-orange-95: #ffede6;\n  --color-orange-98: #fff8f6;\n  --color-orange-100: #ffffff;\n  --color-outline: var(--color-neutral-variant-50);\n  --color-outline-variant: var(--color-neutral-variant-80);\n  --color-primary: var(--color-primary-40);\n  --color-primary-0: #000000;\n  --color-primary-10: #001a42;\n  --color-primary-20: #002e6b;\n  --color-primary-30: #004396;\n  --color-primary-40: #005ac4;\n  --color-primary-50: #2673e8;\n  --color-primary-60: #4f8eff;\n  --color-primary-70: #82aaff;\n  --color-primary-80: #aec6ff;\n  --color-primary-90: #d8e2ff;\n  --color-primary-95: #edf0ff;\n  --color-primary-98: #faf9ff;\n  --color-primary-100: #ffffff;\n  --color-primary-container: var(--color-primary-90);\n  --color-purple: #e40078;\n  --color-purple-0: #000000;\n  --color-purple-10: #3f001c;\n  --color-purple-20: #650032;\n  --color-purple-30: #8e0048;\n  --color-purple-40: #ba0061;\n  --color-purple-50: #e6067a;\n  --color-purple-60: #ff4993;\n  --color-purple-70: #ff84ad;\n  --color-purple-80: #ffb1c7;\n  --color-purple-90: #ffd9e2;\n  --color-purple-95: #ffecef;\n  --color-purple-98: #fff8f8;\n  --color-purple-100: #ffffff;\n  --color-red: #e73121;\n  --color-red-0: #000000;\n  --color-red-10: #410000;\n  --color-red-20: #690000;\n  --color-red-30: #930000;\n  --color-red-40: #be0c05;\n  --color-red-50: #e32e1f;\n  --color-red-60: #ff5541;\n  --color-red-70: #ff8a78;\n  --color-red-80: #ffb4a8;\n  --color-red-90: #ffdad4;\n  --color-red-95: #ffedea;\n  --color-red-98: #fff8f6;\n  --color-red-100: #ffffff;\n  --color-scrim: var(--color-neutral-0);\n  --color-secondary: var(--color-secondary-40);\n  --color-secondary-0: #000000;\n  --color-secondary-10: #141b2c;\n  --color-secondary-20: #293041;\n  --color-secondary-30: #3f4759;\n  --color-secondary-40: #575e71;\n  --color-secondary-50: #6f778b;\n  --color-secondary-60: #8990a5;\n  --color-secondary-70: #a4abc0;\n  --color-secondary-80: #bfc6dc;\n  --color-secondary-90: #dbe2f9;\n  --color-secondary-95: #edf0ff;\n  --color-secondary-98: #faf9ff;\n  --color-secondary-100: #ffffff;\n  --color-secondary-container: var(--color-secondary-90);\n  --color-shadow: var(--color-neutral-0);\n  --color-success: var(--color-green);\n  --color-success-0: var(--color-green-0);\n  --color-success-10: var(--color-green-10);\n  --color-success-20: var(--color-green-20);\n  --color-success-30: var(--color-green-30);\n  --color-success-40: var(--color-green-40);\n  --color-success-50: var(--color-green-50);\n  --color-success-60: var(--color-green-60);\n  --color-success-70: var(--color-green-70);\n  --color-success-80: var(--color-green-80);\n  --color-success-90: var(--color-green-90);\n  --color-success-95: var(--color-green-95);\n  --color-success-98: var(--color-green-98);\n  --color-success-100: var(--color-green-100);\n  --color-surface: var(--color-neutral-99);\n  --color-surface-container: var(--color-neutral-94);\n  --color-surface-container-high: var(--color-neutral-92);\n  --color-surface-container-highest: var(--color-neutral-90);\n  --color-surface-container-low: var(--color-neutral-96);\n  --color-surface-container-lowest: var(--color-neutral-100);\n  --color-surface-dim: var(--color-neutral-87);\n  --color-surface-variant: var(--color-neutral-variant-90);\n  --color-tertiary: var(--color-tertiary-40);\n  --color-tertiary-0: #000000;\n  --color-tertiary-10: #29132d;\n  --color-tertiary-20: #402843;\n  --color-tertiary-30: #583e5a;\n  --color-tertiary-40: #715573;\n  --color-tertiary-50: #8b6d8d;\n  --color-tertiary-60: #a686a7;\n  --color-tertiary-70: #c2a1c2;\n  --color-tertiary-80: #dfbcdf;\n  --color-tertiary-90: #fcd7fb;\n  --color-tertiary-95: #ffebfc;\n  --color-tertiary-98: #fff7fa;\n  --color-tertiary-100: #ffffff;\n  --color-tertiary-container: var(--color-tertiary-90);\n  --color-warning: var(--color-yellow);\n  --color-warning-0: var(--color-yellow-0);\n  --color-warning-10: var(--color-yellow-10);\n  --color-warning-20: var(--color-yellow-20);\n  --color-warning-30: var(--color-yellow-30);\n  --color-warning-40: var(--color-yellow-40);\n  --color-warning-50: var(--color-yellow-50);\n  --color-warning-60: var(--color-yellow-60);\n  --color-warning-70: var(--color-yellow-70);\n  --color-warning-80: var(--color-yellow-80);\n  --color-warning-90: var(--color-yellow-90);\n  --color-warning-95: var(--color-yellow-95);\n  --color-warning-98: var(--color-yellow-98);\n  --color-warning-100: var(--color-yellow-100);\n  --color-white: #ffffff;\n  --color-yellow: #ffed29;\n  --color-yellow-0: #000000;\n  --color-yellow-10: #1f1c00;\n  --color-yellow-20: #363100;\n  --color-yellow-30: #4e4800;\n  --color-yellow-40: #686000;\n  --color-yellow-50: #837900;\n  --color-yellow-60: #9f9300;\n  --color-yellow-70: #bcae00;\n  --color-yellow-80: #d9c900;\n  --color-yellow-90: #f7e61e;\n  --color-yellow-95: #fff392;\n  --color-yellow-98: #fff9e6;\n  --color-yellow-100: #ffffff;\n  --container-lg: 1056px; /* Large container width. Intended for standard desktop layouts with typical content density. */\n  --container-max: 1584px; /* Maximum container width. Use when constraining very wide layouts to maintain readable line lengths. */\n  --container-md: 672px; /* Medium container width. Suitable for tablet layouts and compact desktop content areas. */\n  --container-sm: 320px; /* Small container width. Use for narrow layouts and small screens such as mobile devices. */\n  --container-xl: 1312px; /* Extra large container width. Use for wide desktop displays and content-heavy pages. */\n  --duration-long1: 450ms; /* These durations are often paired with Emphasized easing. */\n  --duration-long2: 500ms; /* These durations are often paired with Emphasized easing. */\n  --duration-medium1: 250ms; /* These are used for medium duration transitions, like modal animations. */\n  --duration-medium2: 300ms; /* These are used for medium duration transitions, like modal animations. */\n  --duration-short1: 50ms; /* These are used for small utility-focused transitions. Like checkbox animations. */\n  --duration-short2: 100ms; /* These are used for small utility-focused transitions. Like checkbox animations. */\n  --duration-short3: 150ms; /* These are used for small utility-focused transitions. Like checkbox animations. */\n  --duration-short4: 200ms; /* These are used for small utility-focused transitions. Like checkbox animations. */\n  --easing-linear: cubic-bezier(0, 0, 1, 1);\n  --easing-standard: cubic-bezier(0.2, 0, 0, 1);\n  --font-family-brand: \"Noto Sans\", sans-serif; /* The font family used for brand headings and titles. */\n  --font-family-monospace: \"Noto Sans Mono\", monospace; /* The font family used for code snippets and monospaced text. */\n  --font-family-sans: \"Noto Sans\", sans-serif; /* The primary font family used for body text and general content. */\n  --font-weight-bold: 700; /* Bold weight for emphasis. 700 weight. */\n  --font-weight-medium: 500; /* Slightly heavier than regular weight. 500 weight. */\n  --font-weight-regular: 400; /* Standard weight for regular text. 400 weight. */\n  --font-weight-semi-bold: 600; /* Heavier than medium weight. 600 weight. */\n  --global-avatar-border-radius: var(--shape-corner-full);\n  --global-badge-color: var(--color-error-40);\n  --shape-corner-full: 9999px;\n  --shape-corner-large: 12px;\n  --shape-corner-medium: 8px;\n  --shape-corner-none: 0;\n  --shape-corner-small: 4px;\n  --spacing-000: 0; /* No spacing (base × 0). */\n  --spacing-025: 0.125rem; /* 2px - Smallest increment (base × 0.125). */\n  --spacing-050: 0.25rem; /* 4px - Extra small spacing (base × 0.25). */\n  --spacing-100: 0.5rem; /* 8px - Small spacing (base × 0.5). */\n  --spacing-150: 0.75rem; /* 12px - Small-medium spacing (base × 0.75). */\n  --spacing-200: 1rem; /* 16px - Base spacing unit (base × 1). */\n  --spacing-300: 1.5rem; /* 24px - Medium spacing (base × 1.5). */\n  --spacing-400: 2rem; /* 32px - Medium-large spacing (base × 2). */\n  --spacing-500: 2.5rem; /* 40px - Large spacing (base × 2.5). */\n  --spacing-600: 3rem; /* 48px - Extra large spacing (base × 3). */\n  --spacing-800: 4rem; /* 64px - Huge spacing (base × 4). */\n  --spacing-1000: 5rem; /* 80px - Massive spacing (base × 5). */\n  --spacing-1200: 6rem; /* 96px - Gigantic spacing (base × 6). */\n  --spacing-2000: 10rem; /* 160px - Maximum defined spacing (base × 10). */\n  --spacing-base: 1rem; /* Base spacing unit (1rem = 16px). */\n  --typography-body-large-emphasized-font-family: var(--font-family-sans);\n  --typography-body-large-emphasized-font-size: 1rem;\n  --typography-body-large-emphasized-font-weight: var(--font-weight-medium);\n  --typography-body-large-emphasized-letter-spacing: 0.5px;\n  --typography-body-large-emphasized-line-height: 1.5rem;\n  --typography-body-large-font-family: var(--font-family-sans);\n  --typography-body-large-font-size: 1rem;\n  --typography-body-large-font-weight: var(--font-weight-regular);\n  --typography-body-large-letter-spacing: 0.5px;\n  --typography-body-large-line-height: 1.5rem;\n  --typography-body-medium-emphasized-font-family: var(--font-family-sans);\n  --typography-body-medium-emphasized-font-size: 0.875rem;\n  --typography-body-medium-emphasized-font-weight: var(--font-weight-medium);\n  --typography-body-medium-emphasized-letter-spacing: 0.25px;\n  --typography-body-medium-emphasized-line-height: 1.25rem;\n  --typography-body-medium-font-family: var(--font-family-sans);\n  --typography-body-medium-font-size: 0.875rem;\n  --typography-body-medium-font-weight: var(--font-weight-regular);\n  --typography-body-medium-letter-spacing: 0.25px;\n  --typography-body-medium-line-height: 1.25rem;\n  --typography-body-small-emphasized-font-family: var(--font-family-sans);\n  --typography-body-small-emphasized-font-size: 0.75rem;\n  --typography-body-small-emphasized-font-weight: var(--font-weight-medium);\n  --typography-body-small-emphasized-letter-spacing: 0.4000000059604645px;\n  --typography-body-small-emphasized-line-height: 1rem;\n  --typography-body-small-font-family: var(--font-family-sans);\n  --typography-body-small-font-size: 0.75rem;\n  --typography-body-small-font-weight: var(--font-weight-regular);\n  --typography-body-small-letter-spacing: 0.4000000059604645px;\n  --typography-body-small-line-height: 1rem;\n  --typography-code-large-emphasized-font-family: var(--font-family-monospace);\n  --typography-code-large-emphasized-font-size: 1rem;\n  --typography-code-large-emphasized-font-weight: var(--font-weight-medium);\n  --typography-code-large-emphasized-letter-spacing: 0.5px;\n  --typography-code-large-emphasized-line-height: 1.5rem;\n  --typography-code-large-font-family: var(--font-family-monospace);\n  --typography-code-large-font-size: 1rem;\n  --typography-code-large-font-weight: var(--font-weight-regular);\n  --typography-code-large-letter-spacing: 0.5px;\n  --typography-code-large-line-height: 1.5rem;\n  --typography-code-medium-emphasized-font-family: var(--font-family-monospace);\n  --typography-code-medium-emphasized-font-size: 0.875rem;\n  --typography-code-medium-emphasized-font-weight: var(--font-weight-medium);\n  --typography-code-medium-emphasized-letter-spacing: 0.25px;\n  --typography-code-medium-emphasized-line-height: 1.25rem;\n  --typography-code-medium-font-family: var(--font-family-monospace);\n  --typography-code-medium-font-size: 0.875rem;\n  --typography-code-medium-font-weight: var(--font-weight-regular);\n  --typography-code-medium-letter-spacing: 0.25px;\n  --typography-code-medium-line-height: 1.25rem;\n  --typography-code-small-emphasized-font-family: var(--font-family-monospace);\n  --typography-code-small-emphasized-font-size: 0.75rem;\n  --typography-code-small-emphasized-font-weight: var(--font-weight-medium);\n  --typography-code-small-emphasized-letter-spacing: 0.4000000059604645px;\n  --typography-code-small-emphasized-line-height: 1rem;\n  --typography-code-small-font-family: var(--font-family-monospace);\n  --typography-code-small-font-size: 0.75rem;\n  --typography-code-small-font-weight: var(--font-weight-regular);\n  --typography-code-small-letter-spacing: 0.4000000059604645px;\n  --typography-code-small-line-height: 1rem;\n  --typography-display-large-emphasized-font-family: var(--font-family-sans);\n  --typography-display-large-emphasized-font-size: 3.5625rem;\n  --typography-display-large-emphasized-font-weight: var(--font-weight-medium);\n  --typography-display-large-emphasized-letter-spacing: -0.25px;\n  --typography-display-large-emphasized-line-height: 4rem;\n  --typography-display-large-font-family: var(--font-family-sans);\n  --typography-display-large-font-size: 3.5625rem;\n  --typography-display-large-font-weight: var(--font-weight-regular);\n  --typography-display-large-letter-spacing: -0.25px;\n  --typography-display-large-line-height: 4rem;\n  --typography-display-medium-emphasized-font-family: var(--font-family-sans);\n  --typography-display-medium-emphasized-font-size: 2.8125rem;\n  --typography-display-medium-emphasized-font-weight: var(--font-weight-medium);\n  --typography-display-medium-emphasized-letter-spacing: 0;\n  --typography-display-medium-emphasized-line-height: 3.25rem;\n  --typography-display-medium-font-family: var(--font-family-sans);\n  --typography-display-medium-font-size: 2.8125rem;\n  --typography-display-medium-font-weight: var(--font-weight-regular);\n  --typography-display-medium-letter-spacing: 0;\n  --typography-display-medium-line-height: 3.25rem;\n  --typography-display-small-emphasized-font-family: var(--font-family-sans);\n  --typography-display-small-emphasized-font-size: 2.25rem;\n  --typography-display-small-emphasized-font-weight: var(--font-weight-medium);\n  --typography-display-small-emphasized-letter-spacing: 0;\n  --typography-display-small-emphasized-line-height: 2.75rem;\n  --typography-display-small-font-family: var(--font-family-sans);\n  --typography-display-small-font-size: 2.25rem;\n  --typography-display-small-font-weight: var(--font-weight-regular);\n  --typography-display-small-letter-spacing: 0;\n  --typography-display-small-line-height: 2.75rem;\n  --typography-headline-large-emphasized-font-family: var(--font-family-sans);\n  --typography-headline-large-emphasized-font-size: 2rem;\n  --typography-headline-large-emphasized-font-weight: var(--font-weight-medium);\n  --typography-headline-large-emphasized-letter-spacing: 0;\n  --typography-headline-large-emphasized-line-height: 2.5rem;\n  --typography-headline-large-font-family: var(--font-family-sans);\n  --typography-headline-large-font-size: 2rem;\n  --typography-headline-large-font-weight: var(--font-weight-regular);\n  --typography-headline-large-letter-spacing: 0;\n  --typography-headline-large-line-height: 2.5rem;\n  --typography-headline-medium-emphasized-font-family: var(--font-family-sans);\n  --typography-headline-medium-emphasized-font-size: 1.75rem;\n  --typography-headline-medium-emphasized-font-weight: var(--font-weight-medium);\n  --typography-headline-medium-emphasized-letter-spacing: 0;\n  --typography-headline-medium-emphasized-line-height: 2.25rem;\n  --typography-headline-medium-font-family: var(--font-family-sans);\n  --typography-headline-medium-font-size: 1.75rem;\n  --typography-headline-medium-font-weight: var(--font-weight-regular);\n  --typography-headline-medium-letter-spacing: 0;\n  --typography-headline-medium-line-height: 2.25rem;\n  --typography-headline-small-emphasized-font-family: var(--font-family-sans);\n  --typography-headline-small-emphasized-font-size: 1.5rem;\n  --typography-headline-small-emphasized-font-weight: var(--font-weight-medium);\n  --typography-headline-small-emphasized-letter-spacing: 0;\n  --typography-headline-small-emphasized-line-height: 2rem;\n  --typography-headline-small-font-family: var(--font-family-sans);\n  --typography-headline-small-font-size: 1.5rem;\n  --typography-headline-small-font-weight: var(--font-weight-regular);\n  --typography-headline-small-letter-spacing: 0;\n  --typography-headline-small-line-height: 2rem;\n  --typography-label-large-emphasized-font-family: var(--font-family-sans);\n  --typography-label-large-emphasized-font-size: 0.875rem;\n  --typography-label-large-emphasized-font-weight: var(--font-weight-semi-bold);\n  --typography-label-large-emphasized-letter-spacing: 0.10000000149011612px;\n  --typography-label-large-emphasized-line-height: 1.25rem;\n  --typography-label-large-font-family: var(--font-family-sans);\n  --typography-label-large-font-size: 0.875rem;\n  --typography-label-large-font-weight: var(--font-weight-medium);\n  --typography-label-large-letter-spacing: 0.10000000149011612px;\n  --typography-label-large-line-height: 1.25rem;\n  --typography-label-medium-emphasized-font-family: var(--font-family-sans);\n  --typography-label-medium-emphasized-font-size: 0.75rem;\n  --typography-label-medium-emphasized-font-weight: var(--font-weight-semi-bold);\n  --typography-label-medium-emphasized-letter-spacing: 0.5px;\n  --typography-label-medium-emphasized-line-height: 1rem;\n  --typography-label-medium-font-family: var(--font-family-sans);\n  --typography-label-medium-font-size: 0.75rem;\n  --typography-label-medium-font-weight: var(--font-weight-medium);\n  --typography-label-medium-letter-spacing: 0.5px;\n  --typography-label-medium-line-height: 1rem;\n  --typography-label-small-emphasized-font-family: var(--font-family-sans);\n  --typography-label-small-emphasized-font-size: 0.6875rem;\n  --typography-label-small-emphasized-font-weight: var(--font-weight-semi-bold);\n  --typography-label-small-emphasized-letter-spacing: 0.5px;\n  --typography-label-small-emphasized-line-height: 1rem;\n  --typography-label-small-font-family: var(--font-family-sans);\n  --typography-label-small-font-size: 0.6875rem;\n  --typography-label-small-font-weight: var(--font-weight-medium);\n  --typography-label-small-letter-spacing: 0.5px;\n  --typography-label-small-line-height: 1rem;\n  --typography-title-large-emphasized-font-family: var(--font-family-sans);\n  --typography-title-large-emphasized-font-size: 1.375rem;\n  --typography-title-large-emphasized-font-weight: var(--font-weight-medium);\n  --typography-title-large-emphasized-letter-spacing: 0;\n  --typography-title-large-emphasized-line-height: 1.75rem;\n  --typography-title-large-font-family: var(--font-family-sans);\n  --typography-title-large-font-size: 1.375rem;\n  --typography-title-large-font-weight: var(--font-weight-regular);\n  --typography-title-large-letter-spacing: 0;\n  --typography-title-large-line-height: 1.75rem;\n  --typography-title-medium-emphasized-font-family: var(--font-family-sans);\n  --typography-title-medium-emphasized-font-size: 1rem;\n  --typography-title-medium-emphasized-font-weight: var(--font-weight-semi-bold);\n  --typography-title-medium-emphasized-letter-spacing: 0.15000000596046448px;\n  --typography-title-medium-emphasized-line-height: 1.5rem;\n  --typography-title-medium-font-family: var(--font-family-sans);\n  --typography-title-medium-font-size: 1rem;\n  --typography-title-medium-font-weight: var(--font-weight-medium);\n  --typography-title-medium-letter-spacing: 0.15000000596046448px;\n  --typography-title-medium-line-height: 1.5rem;\n  --typography-title-small-emphasized-font-family: var(--font-family-sans);\n  --typography-title-small-emphasized-font-size: 0.875rem;\n  --typography-title-small-emphasized-font-weight: var(--font-weight-semi-bold);\n  --typography-title-small-emphasized-letter-spacing: 0.10000000149011612px;\n  --typography-title-small-emphasized-line-height: 1.25rem;\n  --typography-title-small-font-family: var(--font-family-sans);\n  --typography-title-small-font-size: 0.875rem;\n  --typography-title-small-font-weight: var(--font-weight-medium);\n  --typography-title-small-letter-spacing: 0.10000000149011612px;\n  --typography-title-small-line-height: 1.25rem;\n  color-scheme: light dark;\n}\n\n[data-theme='dark'] {\n  --color-error: var(--color-error-80);\n  --color-error-container: var(--color-error-30);\n  --color-inverse-error: var(--color-error-40);\n  --color-inverse-on-surface: var(--color-neutral-20);\n  --color-inverse-primary: var(--color-primary-40);\n  --color-inverse-secondary: var(--color-secondary-40);\n  --color-inverse-surface: var(--color-neutral-90);\n  --color-inverse-tertiary: var(--color-tertiary-40);\n  --color-on-error: var(--color-error-20);\n  --color-on-error-container: var(--color-error-90);\n  --color-on-primary: var(--color-primary-20);\n  --color-on-primary-container: var(--color-primary-90);\n  --color-on-secondary: var(--color-secondary-20);\n  --color-on-secondary-container: var(--color-secondary-90);\n  --color-on-surface: var(--color-neutral-90);\n  --color-on-surface-variant: var(--color-neutral-variant-80);\n  --color-on-tertiary: var(--color-tertiary-20);\n  --color-on-tertiary-container: var(--color-tertiary-90);\n  --color-outline: var(--color-neutral-variant-60);\n  --color-outline-variant: var(--color-neutral-variant-30);\n  --color-primary: var(--color-primary-80);\n  --color-primary-container: var(--color-primary-30);\n  --color-scrim: var(--color-neutral-0);\n  --color-secondary: var(--color-secondary-80);\n  --color-secondary-container: var(--color-secondary-30);\n  --color-shadow: var(--color-neutral-0);\n  --color-surface: var(--color-neutral-10);\n  --color-surface-container: var(--color-neutral-12);\n  --color-surface-container-high: var(--color-neutral-17);\n  --color-surface-container-highest: var(--color-neutral-22);\n  --color-surface-container-low: var(--color-neutral-10);\n  --color-surface-container-lowest: var(--color-neutral-4);\n  --color-surface-dim: var(--color-neutral-6);\n  --color-surface-variant: var(--color-neutral-variant-30);\n  --color-tertiary: var(--color-tertiary-80);\n  --color-tertiary-container: var(--color-tertiary-30);\n  --global-badge-color: var(--color-error-80);\n}\n\n";
+var css_248z$2 = "/* -------------------------------------------\n *  Autogenerated by ⛋ Terrazzo. DO NOT EDIT!\n * ------------------------------------------- */\n\n:root {\n  --color-black: #000000;\n  --color-blue: #305cde;\n  --color-blue-0: #000000;\n  --color-blue-10: #001550;\n  --color-blue-20: #00277f;\n  --color-blue-30: #003ab2;\n  --color-blue-40: #2352d5;\n  --color-blue-50: #446def;\n  --color-blue-60: #6789ff;\n  --color-blue-70: #90a7ff;\n  --color-blue-80: #b6c4ff;\n  --color-blue-90: #dce1ff;\n  --color-blue-95: #eff0ff;\n  --color-blue-98: #faf8ff;\n  --color-blue-100: #ffffff;\n  --color-error: var(--color-red-40);\n  --color-error-container: var(--color-red-90);\n  --color-green: #2e6f40;\n  --color-green-0: #000000;\n  --color-green-10: #00210b;\n  --color-green-20: #003917;\n  --color-green-30: #005225;\n  --color-green-40: #0f6d35;\n  --color-green-50: #31874b;\n  --color-green-60: #4da163;\n  --color-green-70: #68bd7b;\n  --color-green-80: #83d995;\n  --color-green-90: #9ff6af;\n  --color-green-95: #c4ffcb;\n  --color-green-98: #eaffe9;\n  --color-green-100: #ffffff;\n  --color-inverse-error: var(--color-red-80);\n  --color-inverse-on-surface: var(--color-neutral-95);\n  --color-inverse-primary: var(--color-primary-80);\n  --color-inverse-secondary: var(--color-secondary-80);\n  --color-inverse-success: var(--color-green-80);\n  --color-inverse-surface: var(--color-neutral-20);\n  --color-inverse-tertiary: var(--color-tertiary-80);\n  --color-neutral: #747878;\n  --color-neutral-0: #000000;\n  --color-neutral-4: #0b0f0f;\n  --color-neutral-6: #101415;\n  --color-neutral-10: #191c1d;\n  --color-neutral-12: #1d2021;\n  --color-neutral-17: #272b2b;\n  --color-neutral-20: #2e3132;\n  --color-neutral-22: #323536;\n  --color-neutral-30: #444748;\n  --color-neutral-40: #5c5f5f;\n  --color-neutral-50: #747878;\n  --color-neutral-60: #8e9192;\n  --color-neutral-70: #a9acac;\n  --color-neutral-80: #c4c7c7;\n  --color-neutral-87: #d8dadb;\n  --color-neutral-90: #e1e3e3;\n  --color-neutral-92: #e6e8e9;\n  --color-neutral-94: #eceeef;\n  --color-neutral-95: #eff1f1;\n  --color-neutral-96: #f2f4f4;\n  --color-neutral-98: #f8fafa;\n  --color-neutral-99: #fafdfd;\n  --color-neutral-100: #ffffff;\n  --color-neutral-variant: #6f797a;\n  --color-neutral-variant-0: #000000;\n  --color-neutral-variant-4: #071011;\n  --color-neutral-variant-6: #0c1516;\n  --color-neutral-variant-10: #141d1f;\n  --color-neutral-variant-12: #182123;\n  --color-neutral-variant-17: #222b2d;\n  --color-neutral-variant-20: #293234;\n  --color-neutral-variant-22: #2d3638;\n  --color-neutral-variant-30: #3f484a;\n  --color-neutral-variant-40: #576062;\n  --color-neutral-variant-50: #6f797a;\n  --color-neutral-variant-60: #899294;\n  --color-neutral-variant-70: #a3adaf;\n  --color-neutral-variant-80: #bfc8ca;\n  --color-neutral-variant-87: #d2dcde;\n  --color-neutral-variant-90: #dbe4e6;\n  --color-neutral-variant-92: #e0eaec;\n  --color-neutral-variant-94: #e6f0f1;\n  --color-neutral-variant-95: #e9f2f4;\n  --color-neutral-variant-96: #ecf5f7;\n  --color-neutral-variant-98: #f2fbfd;\n  --color-neutral-variant-99: #f6feff;\n  --color-neutral-variant-100: #ffffff;\n  --color-on-error: var(--color-red-100);\n  --color-on-error-container: var(--color-red-10);\n  --color-on-primary: var(--color-primary-100);\n  --color-on-primary-container: var(--color-primary-10);\n  --color-on-secondary: var(--color-secondary-100);\n  --color-on-secondary-container: var(--color-secondary-10);\n  --color-on-success: var(--color-green-100);\n  --color-on-success-container: var(--color-green-10);\n  --color-on-surface: var(--color-neutral-10);\n  --color-on-surface-variant: var(--color-neutral-variant-30);\n  --color-on-tertiary: var(--color-tertiary-100);\n  --color-on-tertiary-container: var(--color-tertiary-10);\n  --color-orange: #ff7518;\n  --color-orange-0: #000000;\n  --color-orange-10: #341100;\n  --color-orange-20: #552100;\n  --color-orange-30: #783100;\n  --color-orange-40: #9e4300;\n  --color-orange-50: #c55500;\n  --color-orange-60: #ee6803;\n  --color-orange-70: #ff8d4c;\n  --color-orange-80: #ffb691;\n  --color-orange-90: #ffdbcb;\n  --color-orange-95: #ffede6;\n  --color-orange-98: #fff8f6;\n  --color-orange-100: #ffffff;\n  --color-outline: var(--color-neutral-variant-50);\n  --color-outline-variant: var(--color-neutral-variant-80);\n  --color-primary: var(--color-primary-40);\n  --color-primary-0: #000000;\n  --color-primary-10: #001a42;\n  --color-primary-20: #002e6b;\n  --color-primary-30: #004396;\n  --color-primary-40: #005ac4;\n  --color-primary-50: #2673e8;\n  --color-primary-60: #4f8eff;\n  --color-primary-70: #82aaff;\n  --color-primary-80: #aec6ff;\n  --color-primary-90: #d8e2ff;\n  --color-primary-95: #edf0ff;\n  --color-primary-98: #faf9ff;\n  --color-primary-100: #ffffff;\n  --color-primary-container: var(--color-primary-90);\n  --color-purple: #e40078;\n  --color-purple-0: #000000;\n  --color-purple-10: #3f001c;\n  --color-purple-20: #650032;\n  --color-purple-30: #8e0048;\n  --color-purple-40: #ba0061;\n  --color-purple-50: #e6067a;\n  --color-purple-60: #ff4993;\n  --color-purple-70: #ff84ad;\n  --color-purple-80: #ffb1c7;\n  --color-purple-90: #ffd9e2;\n  --color-purple-95: #ffecef;\n  --color-purple-98: #fff8f8;\n  --color-purple-100: #ffffff;\n  --color-red: #e73121;\n  --color-red-0: #000000;\n  --color-red-10: #410000;\n  --color-red-20: #690000;\n  --color-red-30: #930000;\n  --color-red-40: #be0c05;\n  --color-red-50: #e32e1f;\n  --color-red-60: #ff5541;\n  --color-red-70: #ff8a78;\n  --color-red-80: #ffb4a8;\n  --color-red-90: #ffdad4;\n  --color-red-95: #ffedea;\n  --color-red-98: #fff8f6;\n  --color-red-100: #ffffff;\n  --color-scrim: var(--color-neutral-0);\n  --color-secondary: var(--color-secondary-40);\n  --color-secondary-0: #000000;\n  --color-secondary-10: #141b2c;\n  --color-secondary-20: #293041;\n  --color-secondary-30: #3f4759;\n  --color-secondary-40: #575e71;\n  --color-secondary-50: #6f778b;\n  --color-secondary-60: #8990a5;\n  --color-secondary-70: #a4abc0;\n  --color-secondary-80: #bfc6dc;\n  --color-secondary-90: #dbe2f9;\n  --color-secondary-95: #edf0ff;\n  --color-secondary-98: #faf9ff;\n  --color-secondary-100: #ffffff;\n  --color-secondary-container: var(--color-secondary-90);\n  --color-shadow: var(--color-neutral-0);\n  --color-success: var(--color-green-40);\n  --color-success-container: var(--color-green-90);\n  --color-surface: var(--color-neutral-99);\n  --color-surface-container: var(--color-neutral-94);\n  --color-surface-container-high: var(--color-neutral-92);\n  --color-surface-container-highest: var(--color-neutral-90);\n  --color-surface-container-low: var(--color-neutral-96);\n  --color-surface-container-lowest: var(--color-neutral-100);\n  --color-surface-dim: var(--color-neutral-87);\n  --color-surface-variant: var(--color-neutral-variant-90);\n  --color-tertiary: var(--color-tertiary-40);\n  --color-tertiary-0: #000000;\n  --color-tertiary-10: #29132d;\n  --color-tertiary-20: #402843;\n  --color-tertiary-30: #583e5a;\n  --color-tertiary-40: #715573;\n  --color-tertiary-50: #8b6d8d;\n  --color-tertiary-60: #a686a7;\n  --color-tertiary-70: #c2a1c2;\n  --color-tertiary-80: #dfbcdf;\n  --color-tertiary-90: #fcd7fb;\n  --color-tertiary-95: #ffebfc;\n  --color-tertiary-98: #fff7fa;\n  --color-tertiary-100: #ffffff;\n  --color-tertiary-container: var(--color-tertiary-90);\n  --color-white: #ffffff;\n  --color-yellow: #ffed29;\n  --color-yellow-0: #000000;\n  --color-yellow-10: #1f1c00;\n  --color-yellow-20: #363100;\n  --color-yellow-30: #4e4800;\n  --color-yellow-40: #686000;\n  --color-yellow-50: #837900;\n  --color-yellow-60: #9f9300;\n  --color-yellow-70: #bcae00;\n  --color-yellow-80: #d9c900;\n  --color-yellow-90: #f7e61e;\n  --color-yellow-95: #fff392;\n  --color-yellow-98: #fff9e6;\n  --color-yellow-100: #ffffff;\n  --container-lg: 1056px; /* Large container width. Intended for standard desktop layouts with typical content density. */\n  --container-max: 1584px; /* Maximum container width. Use when constraining very wide layouts to maintain readable line lengths. */\n  --container-md: 672px; /* Medium container width. Suitable for tablet layouts and compact desktop content areas. */\n  --container-sm: 320px; /* Small container width. Use for narrow layouts and small screens such as mobile devices. */\n  --container-xl: 1312px; /* Extra large container width. Use for wide desktop displays and content-heavy pages. */\n  --duration-long1: 450ms; /* These durations are often paired with Emphasized easing. */\n  --duration-long2: 500ms; /* These durations are often paired with Emphasized easing. */\n  --duration-medium1: 250ms; /* These are used for medium duration transitions, like modal animations. */\n  --duration-medium2: 300ms; /* These are used for medium duration transitions, like modal animations. */\n  --duration-short1: 50ms; /* These are used for small utility-focused transitions. Like checkbox animations. */\n  --duration-short2: 100ms; /* These are used for small utility-focused transitions. Like checkbox animations. */\n  --duration-short3: 150ms; /* These are used for small utility-focused transitions. Like checkbox animations. */\n  --duration-short4: 200ms; /* These are used for small utility-focused transitions. Like checkbox animations. */\n  --easing-linear: cubic-bezier(0, 0, 1, 1);\n  --easing-standard: cubic-bezier(0.2, 0, 0, 1);\n  --font-family-brand: \"Noto Sans\", sans-serif; /* The font family used for brand headings and titles. */\n  --font-family-monospace: \"Noto Sans Mono\", monospace; /* The font family used for code snippets and monospaced text. */\n  --font-family-sans: \"Noto Sans\", sans-serif; /* The primary font family used for body text and general content. */\n  --font-weight-bold: 700; /* Bold weight for emphasis. 700 weight. */\n  --font-weight-medium: 500; /* Slightly heavier than regular weight. 500 weight. */\n  --font-weight-regular: 400; /* Standard weight for regular text. 400 weight. */\n  --font-weight-semi-bold: 600; /* Heavier than medium weight. 600 weight. */\n  --global-avatar-border-radius: var(--shape-corner-full);\n  --global-badge-color: var(--color-error);\n  --shape-corner-full: 9999px;\n  --shape-corner-large: 12px;\n  --shape-corner-medium: 8px;\n  --shape-corner-none: 0;\n  --shape-corner-small: 4px;\n  --spacing-000: 0; /* No spacing (base × 0). */\n  --spacing-025: 0.125rem; /* 2px - Smallest increment (base × 0.125). */\n  --spacing-050: 0.25rem; /* 4px - Extra small spacing (base × 0.25). */\n  --spacing-100: 0.5rem; /* 8px - Small spacing (base × 0.5). */\n  --spacing-150: 0.75rem; /* 12px - Small-medium spacing (base × 0.75). */\n  --spacing-200: 1rem; /* 16px - Base spacing unit (base × 1). */\n  --spacing-300: 1.5rem; /* 24px - Medium spacing (base × 1.5). */\n  --spacing-400: 2rem; /* 32px - Medium-large spacing (base × 2). */\n  --spacing-500: 2.5rem; /* 40px - Large spacing (base × 2.5). */\n  --spacing-600: 3rem; /* 48px - Extra large spacing (base × 3). */\n  --spacing-800: 4rem; /* 64px - Huge spacing (base × 4). */\n  --spacing-1000: 5rem; /* 80px - Massive spacing (base × 5). */\n  --spacing-1200: 6rem; /* 96px - Gigantic spacing (base × 6). */\n  --spacing-2000: 10rem; /* 160px - Maximum defined spacing (base × 10). */\n  --spacing-base: 1rem; /* Base spacing unit (1rem = 16px). */\n  --typography-body-large-emphasized-font-family: var(--font-family-sans);\n  --typography-body-large-emphasized-font-size: 1rem;\n  --typography-body-large-emphasized-font-weight: var(--font-weight-medium);\n  --typography-body-large-emphasized-letter-spacing: 0.5px;\n  --typography-body-large-emphasized-line-height: 1.5rem;\n  --typography-body-large-font-family: var(--font-family-sans);\n  --typography-body-large-font-size: 1rem;\n  --typography-body-large-font-weight: var(--font-weight-regular);\n  --typography-body-large-letter-spacing: 0.5px;\n  --typography-body-large-line-height: 1.5rem;\n  --typography-body-medium-emphasized-font-family: var(--font-family-sans);\n  --typography-body-medium-emphasized-font-size: 0.875rem;\n  --typography-body-medium-emphasized-font-weight: var(--font-weight-medium);\n  --typography-body-medium-emphasized-letter-spacing: 0.25px;\n  --typography-body-medium-emphasized-line-height: 1.25rem;\n  --typography-body-medium-font-family: var(--font-family-sans);\n  --typography-body-medium-font-size: 0.875rem;\n  --typography-body-medium-font-weight: var(--font-weight-regular);\n  --typography-body-medium-letter-spacing: 0.25px;\n  --typography-body-medium-line-height: 1.25rem;\n  --typography-body-small-emphasized-font-family: var(--font-family-sans);\n  --typography-body-small-emphasized-font-size: 0.75rem;\n  --typography-body-small-emphasized-font-weight: var(--font-weight-medium);\n  --typography-body-small-emphasized-letter-spacing: 0.4000000059604645px;\n  --typography-body-small-emphasized-line-height: 1rem;\n  --typography-body-small-font-family: var(--font-family-sans);\n  --typography-body-small-font-size: 0.75rem;\n  --typography-body-small-font-weight: var(--font-weight-regular);\n  --typography-body-small-letter-spacing: 0.4000000059604645px;\n  --typography-body-small-line-height: 1rem;\n  --typography-code-large-emphasized-font-family: var(--font-family-monospace);\n  --typography-code-large-emphasized-font-size: 1rem;\n  --typography-code-large-emphasized-font-weight: var(--font-weight-medium);\n  --typography-code-large-emphasized-letter-spacing: 0.5px;\n  --typography-code-large-emphasized-line-height: 1.5rem;\n  --typography-code-large-font-family: var(--font-family-monospace);\n  --typography-code-large-font-size: 1rem;\n  --typography-code-large-font-weight: var(--font-weight-regular);\n  --typography-code-large-letter-spacing: 0.5px;\n  --typography-code-large-line-height: 1.5rem;\n  --typography-code-medium-emphasized-font-family: var(--font-family-monospace);\n  --typography-code-medium-emphasized-font-size: 0.875rem;\n  --typography-code-medium-emphasized-font-weight: var(--font-weight-medium);\n  --typography-code-medium-emphasized-letter-spacing: 0.25px;\n  --typography-code-medium-emphasized-line-height: 1.25rem;\n  --typography-code-medium-font-family: var(--font-family-monospace);\n  --typography-code-medium-font-size: 0.875rem;\n  --typography-code-medium-font-weight: var(--font-weight-regular);\n  --typography-code-medium-letter-spacing: 0.25px;\n  --typography-code-medium-line-height: 1.25rem;\n  --typography-code-small-emphasized-font-family: var(--font-family-monospace);\n  --typography-code-small-emphasized-font-size: 0.75rem;\n  --typography-code-small-emphasized-font-weight: var(--font-weight-medium);\n  --typography-code-small-emphasized-letter-spacing: 0.4000000059604645px;\n  --typography-code-small-emphasized-line-height: 1rem;\n  --typography-code-small-font-family: var(--font-family-monospace);\n  --typography-code-small-font-size: 0.75rem;\n  --typography-code-small-font-weight: var(--font-weight-regular);\n  --typography-code-small-letter-spacing: 0.4000000059604645px;\n  --typography-code-small-line-height: 1rem;\n  --typography-display-large-emphasized-font-family: var(--font-family-sans);\n  --typography-display-large-emphasized-font-size: 3.5625rem;\n  --typography-display-large-emphasized-font-weight: var(--font-weight-medium);\n  --typography-display-large-emphasized-letter-spacing: -0.25px;\n  --typography-display-large-emphasized-line-height: 4rem;\n  --typography-display-large-font-family: var(--font-family-sans);\n  --typography-display-large-font-size: 3.5625rem;\n  --typography-display-large-font-weight: var(--font-weight-regular);\n  --typography-display-large-letter-spacing: -0.25px;\n  --typography-display-large-line-height: 4rem;\n  --typography-display-medium-emphasized-font-family: var(--font-family-sans);\n  --typography-display-medium-emphasized-font-size: 2.8125rem;\n  --typography-display-medium-emphasized-font-weight: var(--font-weight-medium);\n  --typography-display-medium-emphasized-letter-spacing: 0;\n  --typography-display-medium-emphasized-line-height: 3.25rem;\n  --typography-display-medium-font-family: var(--font-family-sans);\n  --typography-display-medium-font-size: 2.8125rem;\n  --typography-display-medium-font-weight: var(--font-weight-regular);\n  --typography-display-medium-letter-spacing: 0;\n  --typography-display-medium-line-height: 3.25rem;\n  --typography-display-small-emphasized-font-family: var(--font-family-sans);\n  --typography-display-small-emphasized-font-size: 2.25rem;\n  --typography-display-small-emphasized-font-weight: var(--font-weight-medium);\n  --typography-display-small-emphasized-letter-spacing: 0;\n  --typography-display-small-emphasized-line-height: 2.75rem;\n  --typography-display-small-font-family: var(--font-family-sans);\n  --typography-display-small-font-size: 2.25rem;\n  --typography-display-small-font-weight: var(--font-weight-regular);\n  --typography-display-small-letter-spacing: 0;\n  --typography-display-small-line-height: 2.75rem;\n  --typography-headline-large-emphasized-font-family: var(--font-family-sans);\n  --typography-headline-large-emphasized-font-size: 2rem;\n  --typography-headline-large-emphasized-font-weight: var(--font-weight-medium);\n  --typography-headline-large-emphasized-letter-spacing: 0;\n  --typography-headline-large-emphasized-line-height: 2.5rem;\n  --typography-headline-large-font-family: var(--font-family-sans);\n  --typography-headline-large-font-size: 2rem;\n  --typography-headline-large-font-weight: var(--font-weight-regular);\n  --typography-headline-large-letter-spacing: 0;\n  --typography-headline-large-line-height: 2.5rem;\n  --typography-headline-medium-emphasized-font-family: var(--font-family-sans);\n  --typography-headline-medium-emphasized-font-size: 1.75rem;\n  --typography-headline-medium-emphasized-font-weight: var(--font-weight-medium);\n  --typography-headline-medium-emphasized-letter-spacing: 0;\n  --typography-headline-medium-emphasized-line-height: 2.25rem;\n  --typography-headline-medium-font-family: var(--font-family-sans);\n  --typography-headline-medium-font-size: 1.75rem;\n  --typography-headline-medium-font-weight: var(--font-weight-regular);\n  --typography-headline-medium-letter-spacing: 0;\n  --typography-headline-medium-line-height: 2.25rem;\n  --typography-headline-small-emphasized-font-family: var(--font-family-sans);\n  --typography-headline-small-emphasized-font-size: 1.5rem;\n  --typography-headline-small-emphasized-font-weight: var(--font-weight-medium);\n  --typography-headline-small-emphasized-letter-spacing: 0;\n  --typography-headline-small-emphasized-line-height: 2rem;\n  --typography-headline-small-font-family: var(--font-family-sans);\n  --typography-headline-small-font-size: 1.5rem;\n  --typography-headline-small-font-weight: var(--font-weight-regular);\n  --typography-headline-small-letter-spacing: 0;\n  --typography-headline-small-line-height: 2rem;\n  --typography-label-large-emphasized-font-family: var(--font-family-sans);\n  --typography-label-large-emphasized-font-size: 0.875rem;\n  --typography-label-large-emphasized-font-weight: var(--font-weight-semi-bold);\n  --typography-label-large-emphasized-letter-spacing: 0.10000000149011612px;\n  --typography-label-large-emphasized-line-height: 1.25rem;\n  --typography-label-large-font-family: var(--font-family-sans);\n  --typography-label-large-font-size: 0.875rem;\n  --typography-label-large-font-weight: var(--font-weight-medium);\n  --typography-label-large-letter-spacing: 0.10000000149011612px;\n  --typography-label-large-line-height: 1.25rem;\n  --typography-label-medium-emphasized-font-family: var(--font-family-sans);\n  --typography-label-medium-emphasized-font-size: 0.75rem;\n  --typography-label-medium-emphasized-font-weight: var(--font-weight-semi-bold);\n  --typography-label-medium-emphasized-letter-spacing: 0.5px;\n  --typography-label-medium-emphasized-line-height: 1rem;\n  --typography-label-medium-font-family: var(--font-family-sans);\n  --typography-label-medium-font-size: 0.75rem;\n  --typography-label-medium-font-weight: var(--font-weight-medium);\n  --typography-label-medium-letter-spacing: 0.5px;\n  --typography-label-medium-line-height: 1rem;\n  --typography-label-small-emphasized-font-family: var(--font-family-sans);\n  --typography-label-small-emphasized-font-size: 0.6875rem;\n  --typography-label-small-emphasized-font-weight: var(--font-weight-semi-bold);\n  --typography-label-small-emphasized-letter-spacing: 0.5px;\n  --typography-label-small-emphasized-line-height: 1rem;\n  --typography-label-small-font-family: var(--font-family-sans);\n  --typography-label-small-font-size: 0.6875rem;\n  --typography-label-small-font-weight: var(--font-weight-medium);\n  --typography-label-small-letter-spacing: 0.5px;\n  --typography-label-small-line-height: 1rem;\n  --typography-title-large-emphasized-font-family: var(--font-family-sans);\n  --typography-title-large-emphasized-font-size: 1.375rem;\n  --typography-title-large-emphasized-font-weight: var(--font-weight-medium);\n  --typography-title-large-emphasized-letter-spacing: 0;\n  --typography-title-large-emphasized-line-height: 1.75rem;\n  --typography-title-large-font-family: var(--font-family-sans);\n  --typography-title-large-font-size: 1.375rem;\n  --typography-title-large-font-weight: var(--font-weight-regular);\n  --typography-title-large-letter-spacing: 0;\n  --typography-title-large-line-height: 1.75rem;\n  --typography-title-medium-emphasized-font-family: var(--font-family-sans);\n  --typography-title-medium-emphasized-font-size: 1rem;\n  --typography-title-medium-emphasized-font-weight: var(--font-weight-semi-bold);\n  --typography-title-medium-emphasized-letter-spacing: 0.15000000596046448px;\n  --typography-title-medium-emphasized-line-height: 1.5rem;\n  --typography-title-medium-font-family: var(--font-family-sans);\n  --typography-title-medium-font-size: 1rem;\n  --typography-title-medium-font-weight: var(--font-weight-medium);\n  --typography-title-medium-letter-spacing: 0.15000000596046448px;\n  --typography-title-medium-line-height: 1.5rem;\n  --typography-title-small-emphasized-font-family: var(--font-family-sans);\n  --typography-title-small-emphasized-font-size: 0.875rem;\n  --typography-title-small-emphasized-font-weight: var(--font-weight-semi-bold);\n  --typography-title-small-emphasized-letter-spacing: 0.10000000149011612px;\n  --typography-title-small-emphasized-line-height: 1.25rem;\n  --typography-title-small-font-family: var(--font-family-sans);\n  --typography-title-small-font-size: 0.875rem;\n  --typography-title-small-font-weight: var(--font-weight-medium);\n  --typography-title-small-letter-spacing: 0.10000000149011612px;\n  --typography-title-small-line-height: 1.25rem;\n  color-scheme: light dark;\n}\n\n[data-theme='dark'] {\n  --color-error: var(--color-red-80);\n  --color-error-container: var(--color-red-30);\n  --color-inverse-error: var(--color-red-40);\n  --color-inverse-on-surface: var(--color-neutral-20);\n  --color-inverse-primary: var(--color-primary-40);\n  --color-inverse-secondary: var(--color-secondary-40);\n  --color-inverse-success: var(--color-green-40);\n  --color-inverse-surface: var(--color-neutral-90);\n  --color-inverse-tertiary: var(--color-tertiary-40);\n  --color-on-error: var(--color-red-20);\n  --color-on-error-container: var(--color-red-90);\n  --color-on-primary: var(--color-primary-20);\n  --color-on-primary-container: var(--color-primary-90);\n  --color-on-secondary: var(--color-secondary-20);\n  --color-on-secondary-container: var(--color-secondary-90);\n  --color-on-success: var(--color-green-20);\n  --color-on-success-container: var(--color-green-90);\n  --color-on-surface: var(--color-neutral-90);\n  --color-on-surface-variant: var(--color-neutral-variant-80);\n  --color-on-tertiary: var(--color-tertiary-20);\n  --color-on-tertiary-container: var(--color-tertiary-90);\n  --color-outline: var(--color-neutral-variant-60);\n  --color-outline-variant: var(--color-neutral-variant-30);\n  --color-primary: var(--color-primary-80);\n  --color-primary-container: var(--color-primary-30);\n  --color-scrim: var(--color-neutral-0);\n  --color-secondary: var(--color-secondary-80);\n  --color-secondary-container: var(--color-secondary-30);\n  --color-shadow: var(--color-neutral-0);\n  --color-success: var(--color-green-80);\n  --color-success-container: var(--color-green-30);\n  --color-surface: var(--color-neutral-10);\n  --color-surface-container: var(--color-neutral-12);\n  --color-surface-container-high: var(--color-neutral-17);\n  --color-surface-container-highest: var(--color-neutral-22);\n  --color-surface-container-low: var(--color-neutral-10);\n  --color-surface-container-lowest: var(--color-neutral-4);\n  --color-surface-dim: var(--color-neutral-6);\n  --color-surface-variant: var(--color-neutral-variant-30);\n  --color-tertiary: var(--color-tertiary-80);\n  --color-tertiary-container: var(--color-tertiary-30);\n}\n\n";
+styleInject(css_248z$2);
 
 class LoaderUtils {
     constructor(loaderConfig) {
-        this.loaderConfig = loaderConfig;
         this._loaderConfig = loaderConfig;
     }
     static registerComponent(tagName, CustomElementClass) {
@@ -92,107 +96,442 @@ class LoaderUtils {
     }
 }
 
-const createLinkStyles = (prefix) => i `
-  .${r(prefix)}-link {
-    border-radius: inherit;
-    corner-shape: inherit;
-
-    color: var(--color-primary);
-    --icon-color: var(--color-primary);
-  }
-
-  .${r(prefix)}-link:hover {
-    color: var(--color-on-primary-container);
-    --icon-color: var(--color-on-primary-container);
-  }
-
-  .${r(prefix)}-link:focus {
-    text-decoration: none;
-    ${focusRing()}
-  }
-
-  .${r(prefix)}-link.no-style {
-    color: var(--color-on-surface);
-    --icon-color: var(--color-on-surface);
-    text-decoration: none !important;
-  }
-
-  .${r(prefix)}-link.no-decoration {
-    text-decoration: none !important;
-  }
-
-  .${r(prefix)}-link.inline {
-    text-decoration: var(--link-decoration, underline);
-  }
-`;
-
-/**
- * Sass equivalents:
- * $types: "display", "headline", "body", "code", "label", "title";
- * $sizes: "large", "medium", "small";
- */
-const TYPES = [
-    'display',
-    'headline',
-    'body',
-    'code',
-    'label',
-    'title',
-];
-const SIZES = ['large', 'medium', 'small'];
-const createTagClass = (prefix, tag) => i `
-  .${r(prefix)}-text-${r(tag)} {
-    ${getTypography(tag)}
-  }
-
-  .${r(prefix)}-text-${r(tag)}-emphasized {
-    ${getTypography(`${tag}-emphasized`)}
-  }
-`;
-const createTypeClass = (prefix, type) => i `
-  .${r(prefix)}-text-${r(type)} {
-    ${getTypography(`${type}-medium`)}
-  }
-
-  .${r(prefix)}-text-${r(type)}-emphasized {
-    ${getTypography(`${type}-medium-emphasized`)}
-  }
-
-  ${r(SIZES.map(size => createTagClass(prefix, `${type}-${size}`)).join(''))}
-`;
-const createTextStyles = (prefix) => i `
-  /* === Margin rules (manual groups from Sass) === */
-
-  .${r(prefix)}-text-body,
-    .${r(prefix)}-text-body-medium,
-    .${r(prefix)}-text-body-large,
-    .${r(prefix)}-text-body-small {
-    margin-block-end: var(--spacing-200);
-  }
-
-  .${r(prefix)}-text-headline,
-    .${r(prefix)}-text-headline-medium,
-    .${r(prefix)}-text-headline-large,
-    .${r(prefix)}-text-headline-small {
-    margin-block-end: var(--spacing-400);
-  }
-
-  .${r(prefix)}-text-display,
-    .${r(prefix)}-text-display-medium,
-    .${r(prefix)}-text-display-large,
-    .${r(prefix)}-text-display-small {
-    margin-block-end: var(--spacing-400);
-  }
-
-  .${r(prefix)}-text-title,
-    .${r(prefix)}-text-title-medium,
-    .${r(prefix)}-text-title-large,
-    .${r(prefix)}-text-title-small {
-    margin-block-end: var(--spacing-400);
-  }
-
-  ${r(TYPES.map(type => createTypeClass(prefix, type)).join(''))}
-`;
+var css_248z$1 = i`.link {
+  border-radius: inherit;
+  corner-shape: inherit;
+  color: var(--color-primary);
+  --icon-color: currentColor;
+  text-decoration: none;
+}
+.link:hover, .link:focus-visible {
+  text-decoration: underline;
+}
+.link.inherit {
+  color: inherit;
+}
+.link.with-icon {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.5em;
+}`;
+styleInject(css_248z$1);
+
+var css_248z = i`.text-display {
+  font-family: var(--typography-display-medium-font-family) !important;
+  font-size: var(--typography-display-medium-font-size) !important;
+  font-weight: var(--typography-display-medium-font-weight) !important;
+  line-height: var(--typography-display-medium-line-height) !important;
+  letter-spacing: var(--typography-display-medium-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-display-emphasized {
+  font-family: var(--typography-display-medium-emphasized-font-family) !important;
+  font-size: var(--typography-display-medium-emphasized-font-size) !important;
+  font-weight: var(--typography-display-medium-emphasized-font-weight) !important;
+  line-height: var(--typography-display-medium-emphasized-line-height) !important;
+  letter-spacing: var(--typography-display-medium-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-display-large {
+  font-family: var(--typography-display-large-font-family) !important;
+  font-size: var(--typography-display-large-font-size) !important;
+  font-weight: var(--typography-display-large-font-weight) !important;
+  line-height: var(--typography-display-large-line-height) !important;
+  letter-spacing: var(--typography-display-large-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-display-large-emphasized {
+  font-family: var(--typography-display-large-emphasized-font-family) !important;
+  font-size: var(--typography-display-large-emphasized-font-size) !important;
+  font-weight: var(--typography-display-large-emphasized-font-weight) !important;
+  line-height: var(--typography-display-large-emphasized-line-height) !important;
+  letter-spacing: var(--typography-display-large-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-display-medium {
+  font-family: var(--typography-display-medium-font-family) !important;
+  font-size: var(--typography-display-medium-font-size) !important;
+  font-weight: var(--typography-display-medium-font-weight) !important;
+  line-height: var(--typography-display-medium-line-height) !important;
+  letter-spacing: var(--typography-display-medium-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-display-medium-emphasized {
+  font-family: var(--typography-display-medium-emphasized-font-family) !important;
+  font-size: var(--typography-display-medium-emphasized-font-size) !important;
+  font-weight: var(--typography-display-medium-emphasized-font-weight) !important;
+  line-height: var(--typography-display-medium-emphasized-line-height) !important;
+  letter-spacing: var(--typography-display-medium-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-display-small {
+  font-family: var(--typography-display-small-font-family) !important;
+  font-size: var(--typography-display-small-font-size) !important;
+  font-weight: var(--typography-display-small-font-weight) !important;
+  line-height: var(--typography-display-small-line-height) !important;
+  letter-spacing: var(--typography-display-small-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-display-small-emphasized {
+  font-family: var(--typography-display-small-emphasized-font-family) !important;
+  font-size: var(--typography-display-small-emphasized-font-size) !important;
+  font-weight: var(--typography-display-small-emphasized-font-weight) !important;
+  line-height: var(--typography-display-small-emphasized-line-height) !important;
+  letter-spacing: var(--typography-display-small-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-headline {
+  font-family: var(--typography-headline-medium-font-family) !important;
+  font-size: var(--typography-headline-medium-font-size) !important;
+  font-weight: var(--typography-headline-medium-font-weight) !important;
+  line-height: var(--typography-headline-medium-line-height) !important;
+  letter-spacing: var(--typography-headline-medium-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-headline-emphasized {
+  font-family: var(--typography-headline-medium-emphasized-font-family) !important;
+  font-size: var(--typography-headline-medium-emphasized-font-size) !important;
+  font-weight: var(--typography-headline-medium-emphasized-font-weight) !important;
+  line-height: var(--typography-headline-medium-emphasized-line-height) !important;
+  letter-spacing: var(--typography-headline-medium-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-headline-large {
+  font-family: var(--typography-headline-large-font-family) !important;
+  font-size: var(--typography-headline-large-font-size) !important;
+  font-weight: var(--typography-headline-large-font-weight) !important;
+  line-height: var(--typography-headline-large-line-height) !important;
+  letter-spacing: var(--typography-headline-large-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-headline-large-emphasized {
+  font-family: var(--typography-headline-large-emphasized-font-family) !important;
+  font-size: var(--typography-headline-large-emphasized-font-size) !important;
+  font-weight: var(--typography-headline-large-emphasized-font-weight) !important;
+  line-height: var(--typography-headline-large-emphasized-line-height) !important;
+  letter-spacing: var(--typography-headline-large-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-headline-medium {
+  font-family: var(--typography-headline-medium-font-family) !important;
+  font-size: var(--typography-headline-medium-font-size) !important;
+  font-weight: var(--typography-headline-medium-font-weight) !important;
+  line-height: var(--typography-headline-medium-line-height) !important;
+  letter-spacing: var(--typography-headline-medium-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-headline-medium-emphasized {
+  font-family: var(--typography-headline-medium-emphasized-font-family) !important;
+  font-size: var(--typography-headline-medium-emphasized-font-size) !important;
+  font-weight: var(--typography-headline-medium-emphasized-font-weight) !important;
+  line-height: var(--typography-headline-medium-emphasized-line-height) !important;
+  letter-spacing: var(--typography-headline-medium-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-headline-small {
+  font-family: var(--typography-headline-small-font-family) !important;
+  font-size: var(--typography-headline-small-font-size) !important;
+  font-weight: var(--typography-headline-small-font-weight) !important;
+  line-height: var(--typography-headline-small-line-height) !important;
+  letter-spacing: var(--typography-headline-small-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-headline-small-emphasized {
+  font-family: var(--typography-headline-small-emphasized-font-family) !important;
+  font-size: var(--typography-headline-small-emphasized-font-size) !important;
+  font-weight: var(--typography-headline-small-emphasized-font-weight) !important;
+  line-height: var(--typography-headline-small-emphasized-line-height) !important;
+  letter-spacing: var(--typography-headline-small-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-body {
+  font-family: var(--typography-body-medium-font-family) !important;
+  font-size: var(--typography-body-medium-font-size) !important;
+  font-weight: var(--typography-body-medium-font-weight) !important;
+  line-height: var(--typography-body-medium-line-height) !important;
+  letter-spacing: var(--typography-body-medium-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-body-emphasized {
+  font-family: var(--typography-body-medium-emphasized-font-family) !important;
+  font-size: var(--typography-body-medium-emphasized-font-size) !important;
+  font-weight: var(--typography-body-medium-emphasized-font-weight) !important;
+  line-height: var(--typography-body-medium-emphasized-line-height) !important;
+  letter-spacing: var(--typography-body-medium-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-body-large {
+  font-family: var(--typography-body-large-font-family) !important;
+  font-size: var(--typography-body-large-font-size) !important;
+  font-weight: var(--typography-body-large-font-weight) !important;
+  line-height: var(--typography-body-large-line-height) !important;
+  letter-spacing: var(--typography-body-large-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-body-large-emphasized {
+  font-family: var(--typography-body-large-emphasized-font-family) !important;
+  font-size: var(--typography-body-large-emphasized-font-size) !important;
+  font-weight: var(--typography-body-large-emphasized-font-weight) !important;
+  line-height: var(--typography-body-large-emphasized-line-height) !important;
+  letter-spacing: var(--typography-body-large-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-body-medium {
+  font-family: var(--typography-body-medium-font-family) !important;
+  font-size: var(--typography-body-medium-font-size) !important;
+  font-weight: var(--typography-body-medium-font-weight) !important;
+  line-height: var(--typography-body-medium-line-height) !important;
+  letter-spacing: var(--typography-body-medium-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-body-medium-emphasized {
+  font-family: var(--typography-body-medium-emphasized-font-family) !important;
+  font-size: var(--typography-body-medium-emphasized-font-size) !important;
+  font-weight: var(--typography-body-medium-emphasized-font-weight) !important;
+  line-height: var(--typography-body-medium-emphasized-line-height) !important;
+  letter-spacing: var(--typography-body-medium-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-body-small {
+  font-family: var(--typography-body-small-font-family) !important;
+  font-size: var(--typography-body-small-font-size) !important;
+  font-weight: var(--typography-body-small-font-weight) !important;
+  line-height: var(--typography-body-small-line-height) !important;
+  letter-spacing: var(--typography-body-small-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-body-small-emphasized {
+  font-family: var(--typography-body-small-emphasized-font-family) !important;
+  font-size: var(--typography-body-small-emphasized-font-size) !important;
+  font-weight: var(--typography-body-small-emphasized-font-weight) !important;
+  line-height: var(--typography-body-small-emphasized-line-height) !important;
+  letter-spacing: var(--typography-body-small-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-200);
+}
+
+.text-code {
+  font-family: var(--typography-code-medium-font-family) !important;
+  font-size: var(--typography-code-medium-font-size) !important;
+  font-weight: var(--typography-code-medium-font-weight) !important;
+  line-height: var(--typography-code-medium-line-height) !important;
+  letter-spacing: var(--typography-code-medium-letter-spacing) !important;
+}
+
+.text-code-emphasized {
+  font-family: var(--typography-code-medium-emphasized-font-family) !important;
+  font-size: var(--typography-code-medium-emphasized-font-size) !important;
+  font-weight: var(--typography-code-medium-emphasized-font-weight) !important;
+  line-height: var(--typography-code-medium-emphasized-line-height) !important;
+  letter-spacing: var(--typography-code-medium-emphasized-letter-spacing) !important;
+}
+
+.text-code-large {
+  font-family: var(--typography-code-large-font-family) !important;
+  font-size: var(--typography-code-large-font-size) !important;
+  font-weight: var(--typography-code-large-font-weight) !important;
+  line-height: var(--typography-code-large-line-height) !important;
+  letter-spacing: var(--typography-code-large-letter-spacing) !important;
+}
+
+.text-code-large-emphasized {
+  font-family: var(--typography-code-large-emphasized-font-family) !important;
+  font-size: var(--typography-code-large-emphasized-font-size) !important;
+  font-weight: var(--typography-code-large-emphasized-font-weight) !important;
+  line-height: var(--typography-code-large-emphasized-line-height) !important;
+  letter-spacing: var(--typography-code-large-emphasized-letter-spacing) !important;
+}
+
+.text-code-medium {
+  font-family: var(--typography-code-medium-font-family) !important;
+  font-size: var(--typography-code-medium-font-size) !important;
+  font-weight: var(--typography-code-medium-font-weight) !important;
+  line-height: var(--typography-code-medium-line-height) !important;
+  letter-spacing: var(--typography-code-medium-letter-spacing) !important;
+}
+
+.text-code-medium-emphasized {
+  font-family: var(--typography-code-medium-emphasized-font-family) !important;
+  font-size: var(--typography-code-medium-emphasized-font-size) !important;
+  font-weight: var(--typography-code-medium-emphasized-font-weight) !important;
+  line-height: var(--typography-code-medium-emphasized-line-height) !important;
+  letter-spacing: var(--typography-code-medium-emphasized-letter-spacing) !important;
+}
+
+.text-code-small {
+  font-family: var(--typography-code-small-font-family) !important;
+  font-size: var(--typography-code-small-font-size) !important;
+  font-weight: var(--typography-code-small-font-weight) !important;
+  line-height: var(--typography-code-small-line-height) !important;
+  letter-spacing: var(--typography-code-small-letter-spacing) !important;
+}
+
+.text-code-small-emphasized {
+  font-family: var(--typography-code-small-emphasized-font-family) !important;
+  font-size: var(--typography-code-small-emphasized-font-size) !important;
+  font-weight: var(--typography-code-small-emphasized-font-weight) !important;
+  line-height: var(--typography-code-small-emphasized-line-height) !important;
+  letter-spacing: var(--typography-code-small-emphasized-letter-spacing) !important;
+}
+
+.text-label {
+  font-family: var(--typography-label-medium-font-family) !important;
+  font-size: var(--typography-label-medium-font-size) !important;
+  font-weight: var(--typography-label-medium-font-weight) !important;
+  line-height: var(--typography-label-medium-line-height) !important;
+  letter-spacing: var(--typography-label-medium-letter-spacing) !important;
+}
+
+.text-label-emphasized {
+  font-family: var(--typography-label-medium-emphasized-font-family) !important;
+  font-size: var(--typography-label-medium-emphasized-font-size) !important;
+  font-weight: var(--typography-label-medium-emphasized-font-weight) !important;
+  line-height: var(--typography-label-medium-emphasized-line-height) !important;
+  letter-spacing: var(--typography-label-medium-emphasized-letter-spacing) !important;
+}
+
+.text-label-large {
+  font-family: var(--typography-label-large-font-family) !important;
+  font-size: var(--typography-label-large-font-size) !important;
+  font-weight: var(--typography-label-large-font-weight) !important;
+  line-height: var(--typography-label-large-line-height) !important;
+  letter-spacing: var(--typography-label-large-letter-spacing) !important;
+}
+
+.text-label-large-emphasized {
+  font-family: var(--typography-label-large-emphasized-font-family) !important;
+  font-size: var(--typography-label-large-emphasized-font-size) !important;
+  font-weight: var(--typography-label-large-emphasized-font-weight) !important;
+  line-height: var(--typography-label-large-emphasized-line-height) !important;
+  letter-spacing: var(--typography-label-large-emphasized-letter-spacing) !important;
+}
+
+.text-label-medium {
+  font-family: var(--typography-label-medium-font-family) !important;
+  font-size: var(--typography-label-medium-font-size) !important;
+  font-weight: var(--typography-label-medium-font-weight) !important;
+  line-height: var(--typography-label-medium-line-height) !important;
+  letter-spacing: var(--typography-label-medium-letter-spacing) !important;
+}
+
+.text-label-medium-emphasized {
+  font-family: var(--typography-label-medium-emphasized-font-family) !important;
+  font-size: var(--typography-label-medium-emphasized-font-size) !important;
+  font-weight: var(--typography-label-medium-emphasized-font-weight) !important;
+  line-height: var(--typography-label-medium-emphasized-line-height) !important;
+  letter-spacing: var(--typography-label-medium-emphasized-letter-spacing) !important;
+}
+
+.text-label-small {
+  font-family: var(--typography-label-small-font-family) !important;
+  font-size: var(--typography-label-small-font-size) !important;
+  font-weight: var(--typography-label-small-font-weight) !important;
+  line-height: var(--typography-label-small-line-height) !important;
+  letter-spacing: var(--typography-label-small-letter-spacing) !important;
+}
+
+.text-label-small-emphasized {
+  font-family: var(--typography-label-small-emphasized-font-family) !important;
+  font-size: var(--typography-label-small-emphasized-font-size) !important;
+  font-weight: var(--typography-label-small-emphasized-font-weight) !important;
+  line-height: var(--typography-label-small-emphasized-line-height) !important;
+  letter-spacing: var(--typography-label-small-emphasized-letter-spacing) !important;
+}
+
+.text-title {
+  font-family: var(--typography-title-medium-font-family) !important;
+  font-size: var(--typography-title-medium-font-size) !important;
+  font-weight: var(--typography-title-medium-font-weight) !important;
+  line-height: var(--typography-title-medium-line-height) !important;
+  letter-spacing: var(--typography-title-medium-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-title-emphasized {
+  font-family: var(--typography-title-medium-emphasized-font-family) !important;
+  font-size: var(--typography-title-medium-emphasized-font-size) !important;
+  font-weight: var(--typography-title-medium-emphasized-font-weight) !important;
+  line-height: var(--typography-title-medium-emphasized-line-height) !important;
+  letter-spacing: var(--typography-title-medium-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-title-large {
+  font-family: var(--typography-title-large-font-family) !important;
+  font-size: var(--typography-title-large-font-size) !important;
+  font-weight: var(--typography-title-large-font-weight) !important;
+  line-height: var(--typography-title-large-line-height) !important;
+  letter-spacing: var(--typography-title-large-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-title-large-emphasized {
+  font-family: var(--typography-title-large-emphasized-font-family) !important;
+  font-size: var(--typography-title-large-emphasized-font-size) !important;
+  font-weight: var(--typography-title-large-emphasized-font-weight) !important;
+  line-height: var(--typography-title-large-emphasized-line-height) !important;
+  letter-spacing: var(--typography-title-large-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-title-medium {
+  font-family: var(--typography-title-medium-font-family) !important;
+  font-size: var(--typography-title-medium-font-size) !important;
+  font-weight: var(--typography-title-medium-font-weight) !important;
+  line-height: var(--typography-title-medium-line-height) !important;
+  letter-spacing: var(--typography-title-medium-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-title-medium-emphasized {
+  font-family: var(--typography-title-medium-emphasized-font-family) !important;
+  font-size: var(--typography-title-medium-emphasized-font-size) !important;
+  font-weight: var(--typography-title-medium-emphasized-font-weight) !important;
+  line-height: var(--typography-title-medium-emphasized-line-height) !important;
+  letter-spacing: var(--typography-title-medium-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-title-small {
+  font-family: var(--typography-title-small-font-family) !important;
+  font-size: var(--typography-title-small-font-size) !important;
+  font-weight: var(--typography-title-small-font-weight) !important;
+  line-height: var(--typography-title-small-line-height) !important;
+  letter-spacing: var(--typography-title-small-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}
+
+.text-title-small-emphasized {
+  font-family: var(--typography-title-small-emphasized-font-family) !important;
+  font-size: var(--typography-title-small-emphasized-font-size) !important;
+  font-weight: var(--typography-title-small-emphasized-font-weight) !important;
+  line-height: var(--typography-title-small-emphasized-line-height) !important;
+  letter-spacing: var(--typography-title-small-emphasized-letter-spacing) !important;
+  margin-block-end: var(--spacing-400);
+}`;
+styleInject(css_248z);
 
 // Eager loaded
 const libraryPrefix = 'p';
@@ -202,13 +541,11 @@ function buildSheet(styleSheet) {
     sheet.replaceSync(styleSheet.toString());
     return sheet;
 }
-const styleSheets = [buildSheet(cssComponentsStyleSheet)];
-const linkStylesheet = createLinkStyles(libraryPrefix).styleSheet;
-if (linkStylesheet)
-    styleSheets.push(linkStylesheet);
-const textStylesheet = createTextStyles(libraryPrefix).styleSheet;
-if (textStylesheet)
-    styleSheets.push(textStylesheet);
+const styleSheets = [
+    buildSheet(css_248z$2),
+    buildSheet(css_248z$1),
+    buildSheet(css_248z),
+];
 document.adoptedStyleSheets = styleSheets;
 const loaderConfig = {
     prefix: libraryPrefix,
@@ -217,17 +554,29 @@ const loaderConfig = {
             CustomElementClass: Icon,
             // importPath: './component/icon.js', - for lazy load give path instead of CustomElementClass
         },
+        'focus-ring': {
+            CustomElementClass: FocusRing,
+        },
         avatar: {
             CustomElementClass: Avatar,
         },
         badge: {
             CustomElementClass: Badge,
         },
+        button: {
+            CustomElementClass: Button,
+        },
         divider: {
             CustomElementClass: Divider,
         },
+        elevation: {
+            CustomElementClass: Elevation,
+        },
         clock: {
-            importPath: '.' + '/clock.js',
+            importPath: './clock.js',
+        },
+        ripple: {
+            CustomElementClass: Ripple,
         },
     },
 };