@vonage/vivid-vue 5.6.0 → 5.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -0,0 +1,7 @@
1
+ import { VNode } from 'vue';
2
+ import VContextualHelpVue2 from './VContextualHelp.vue2';
3
+ import VContextualHelpVue3 from './VContextualHelp.vue3';
4
+
5
+ type IsVue2 = "data" extends keyof VNode ? true : false;
6
+ declare const _default: IsVue2 extends true ? typeof VContextualHelpVue2 : typeof VContextualHelpVue3;
7
+ export default _default;
@@ -0,0 +1,30 @@
1
+ import type { VwcContextualHelpElement } from '@vonage/vivid';
2
+ export interface VContextualHelpEvents {
3
+ blur: FocusEvent & {
4
+ currentTarget: VwcContextualHelpElement;
5
+ };
6
+ click: MouseEvent & {
7
+ currentTarget: VwcContextualHelpElement;
8
+ };
9
+ focus: FocusEvent & {
10
+ currentTarget: VwcContextualHelpElement;
11
+ };
12
+ input: Event & {
13
+ currentTarget: VwcContextualHelpElement;
14
+ };
15
+ keydown: KeyboardEvent & {
16
+ currentTarget: VwcContextualHelpElement;
17
+ };
18
+ keyup: KeyboardEvent & {
19
+ currentTarget: VwcContextualHelpElement;
20
+ };
21
+ }
22
+ export interface VContextualHelpProps {
23
+ placement?: 'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'right-start' | 'right-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end';
24
+ onBlur?: (event: VContextualHelpEvents['blur']) => void;
25
+ onClick?: (event: VContextualHelpEvents['click']) => void;
26
+ onFocus?: (event: VContextualHelpEvents['focus']) => void;
27
+ onInput?: (event: VContextualHelpEvents['input']) => void;
28
+ onKeydown?: (event: VContextualHelpEvents['keydown']) => void;
29
+ onKeyup?: (event: VContextualHelpEvents['keyup']) => void;
30
+ }
@@ -0,0 +1,19 @@
1
+ import { PropType } from 'vue';
2
+ import type { VwcContextualHelpElement } from '@vonage/vivid';
3
+ declare const _default: import("vue").DefineComponent<{
4
+ placement: {
5
+ type: PropType<"top" | "right" | "bottom" | "left" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end">;
6
+ default: undefined;
7
+ };
8
+ }, {
9
+ componentName: import("vue").Ref<string>;
10
+ element: import("vue").Ref<VwcContextualHelpElement | null>;
11
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("blur" | "click" | "focus" | "input" | "keydown" | "keyup")[], string, Readonly<import("vue").ExtractPropTypes<{
12
+ placement: {
13
+ type: PropType<"top" | "right" | "bottom" | "left" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end">;
14
+ default: undefined;
15
+ };
16
+ }>>, {
17
+ placement: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "right" | "left" | "right-start" | "right-end" | "left-start" | "left-end";
18
+ }>;
19
+ export default _default;
@@ -0,0 +1,61 @@
1
+ import { PropType } from 'vue';
2
+ import type { VwcContextualHelpElement } from '@vonage/vivid';
3
+ import type { SlotsType } from 'vue';
4
+ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
5
+ placement: {
6
+ type: PropType<"top" | "right" | "bottom" | "left" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end">;
7
+ default: undefined;
8
+ };
9
+ }>, {
10
+ componentName: import("vue").Ref<string>;
11
+ element: import("vue").Ref<VwcContextualHelpElement | null, VwcContextualHelpElement | null>;
12
+ }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
13
+ blur(event: FocusEvent & {
14
+ currentTarget: VwcContextualHelpElement;
15
+ }): true;
16
+ click(event: MouseEvent & {
17
+ currentTarget: VwcContextualHelpElement;
18
+ }): true;
19
+ focus(event: FocusEvent & {
20
+ currentTarget: VwcContextualHelpElement;
21
+ }): true;
22
+ input(event: Event & {
23
+ currentTarget: VwcContextualHelpElement;
24
+ }): true;
25
+ keydown(event: KeyboardEvent & {
26
+ currentTarget: VwcContextualHelpElement;
27
+ }): true;
28
+ keyup(event: KeyboardEvent & {
29
+ currentTarget: VwcContextualHelpElement;
30
+ }): true;
31
+ }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
32
+ placement: {
33
+ type: PropType<"top" | "right" | "bottom" | "left" | "top-start" | "top-end" | "right-start" | "right-end" | "bottom-start" | "bottom-end" | "left-start" | "left-end">;
34
+ default: undefined;
35
+ };
36
+ }>> & Readonly<{
37
+ onBlur?: ((event: FocusEvent & {
38
+ currentTarget: VwcContextualHelpElement;
39
+ }) => any) | undefined;
40
+ onClick?: ((event: MouseEvent & {
41
+ currentTarget: VwcContextualHelpElement;
42
+ }) => any) | undefined;
43
+ onFocus?: ((event: FocusEvent & {
44
+ currentTarget: VwcContextualHelpElement;
45
+ }) => any) | undefined;
46
+ onInput?: ((event: Event & {
47
+ currentTarget: VwcContextualHelpElement;
48
+ }) => any) | undefined;
49
+ onKeydown?: ((event: KeyboardEvent & {
50
+ currentTarget: VwcContextualHelpElement;
51
+ }) => any) | undefined;
52
+ onKeyup?: ((event: KeyboardEvent & {
53
+ currentTarget: VwcContextualHelpElement;
54
+ }) => any) | undefined;
55
+ }>, {
56
+ placement: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "right" | "left" | "right-start" | "right-end" | "left-start" | "left-end";
57
+ }, SlotsType<{
58
+ default: Record<string, never>;
59
+ icon: Record<string, never>;
60
+ }>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
61
+ export default _default;
@@ -117,6 +117,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
117
117
  scrollablePanel: boolean;
118
118
  tabsLayout: "align-start" | "stretch";
119
119
  }, SlotsType<{
120
+ 'action-items': Record<string, never>;
120
121
  default: Record<string, never>;
121
122
  }>, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
122
123
  export default _default;
@@ -15,6 +15,7 @@ export { default as VCard } from './VCard';
15
15
  export { default as VCheckbox } from './VCheckbox';
16
16
  export { default as VColorPicker } from './VColorPicker';
17
17
  export { default as VCombobox } from './VCombobox';
18
+ export { default as VContextualHelp } from './VContextualHelp';
18
19
  export { default as VDataGrid } from './VDataGrid';
19
20
  export { default as VDataGridCell } from './VDataGridCell';
20
21
  export { default as VDataGridRow } from './VDataGridRow';
@@ -32,6 +32,8 @@ import type { VColorPicker } from './components';
32
32
  import type { VColorPickerProps, VColorPickerEvents } from './components/VColorPicker.types';
33
33
  import type { VCombobox } from './components';
34
34
  import type { VComboboxProps, VComboboxEvents } from './components/VCombobox.types';
35
+ import type { VContextualHelp } from './components';
36
+ import type { VContextualHelpProps, VContextualHelpEvents } from './components/VContextualHelp.types';
35
37
  import type { VDataGrid } from './components';
36
38
  import type { VDataGridProps, VDataGridEvents } from './components/VDataGrid.types';
37
39
  import type { VDataGridCell } from './components';
@@ -153,6 +155,7 @@ export type VProps = {
153
155
  VCheckbox: VCheckboxProps;
154
156
  VColorPicker: VColorPickerProps;
155
157
  VCombobox: VComboboxProps;
158
+ VContextualHelp: VContextualHelpProps;
156
159
  VDataGrid: VDataGridProps;
157
160
  VDataGridCell: VDataGridCellProps;
158
161
  VDataGridRow: VDataGridRowProps;
@@ -223,6 +226,7 @@ export type VEvents = {
223
226
  VCheckbox: VCheckboxEvents;
224
227
  VColorPicker: VColorPickerEvents;
225
228
  VCombobox: VComboboxEvents;
229
+ VContextualHelp: VContextualHelpEvents;
226
230
  VDataGrid: VDataGridEvents;
227
231
  VDataGridCell: VDataGridCellEvents;
228
232
  VDataGridRow: VDataGridRowEvents;
@@ -293,6 +297,7 @@ export type VSlots = {
293
297
  VCheckbox: ComponentSlots<typeof VCheckbox>;
294
298
  VColorPicker: ComponentSlots<typeof VColorPicker>;
295
299
  VCombobox: ComponentSlots<typeof VCombobox>;
300
+ VContextualHelp: ComponentSlots<typeof VContextualHelp>;
296
301
  VDataGrid: ComponentSlots<typeof VDataGrid>;
297
302
  VDataGridCell: ComponentSlots<typeof VDataGridCell>;
298
303
  VDataGridRow: ComponentSlots<typeof VDataGridRow>;
package/dist/index.cjs CHANGED
@@ -3558,6 +3558,133 @@ const VCombobox = vue.defineComponent({
3558
3558
  }
3559
3559
  });
3560
3560
 
3561
+ const VContextualHelp = vue.defineComponent({
3562
+ name: "VContextualHelp",
3563
+ props: {
3564
+ /**
3565
+ * Placement of the toggletip
3566
+ */
3567
+ placement: {
3568
+ type: String,
3569
+ default: void 0
3570
+ }
3571
+ },
3572
+ emits: [
3573
+ /**
3574
+ * Fires when the element loses focus.
3575
+ * @type {FocusEvent}
3576
+ */
3577
+ "blur",
3578
+ /**
3579
+ * Fires when a pointing device button (such as a mouse's primary mouse button) is both pressed and released while the pointer is located inside the element.
3580
+ * @type {MouseEvent}
3581
+ */
3582
+ "click",
3583
+ /**
3584
+ * Fires when the element receives focus.
3585
+ * @type {FocusEvent}
3586
+ */
3587
+ "focus",
3588
+ /**
3589
+ * Fires when the value of an element has been changed.
3590
+ * @type {Event}
3591
+ */
3592
+ "input",
3593
+ /**
3594
+ * Fires when a key is pressed.
3595
+ * @type {KeyboardEvent}
3596
+ */
3597
+ "keydown",
3598
+ /**
3599
+ * Fires when a key is released.
3600
+ * @type {KeyboardEvent}
3601
+ */
3602
+ "keyup"
3603
+ ],
3604
+ methods: {},
3605
+ setup(props, ctx) {
3606
+ const componentName = registerComponent(
3607
+ "contextual-help",
3608
+ vivid.registerContextualHelp
3609
+ );
3610
+ const element = vue.ref(null);
3611
+ return { componentName, element };
3612
+ },
3613
+ render() {
3614
+ if (isVue2) {
3615
+ return vue.h(
3616
+ this.componentName,
3617
+ {
3618
+ ref: "element",
3619
+ attrs: {
3620
+ ...this.placement !== void 0 ? { placement: this.placement } : {}
3621
+ },
3622
+ class: "vvd-component",
3623
+ on: {
3624
+ blur: (event) => {
3625
+ this.$emit("blur", event);
3626
+ },
3627
+ click: (event) => {
3628
+ this.$emit("click", event);
3629
+ },
3630
+ focus: (event) => {
3631
+ this.$emit("focus", event);
3632
+ },
3633
+ input: (event) => {
3634
+ this.$emit("input", event);
3635
+ },
3636
+ keydown: (event) => {
3637
+ this.$emit("keydown", event);
3638
+ },
3639
+ keyup: (event) => {
3640
+ this.$emit("keyup", event);
3641
+ }
3642
+ }
3643
+ },
3644
+ [
3645
+ this.$slots.default,
3646
+ // @slot icon Custom icon slot (optional).
3647
+ handleNamedSlotV2("icon", this.$slots["icon"])
3648
+ ]
3649
+ );
3650
+ }
3651
+ return vue.h(
3652
+ this.componentName,
3653
+ {
3654
+ ref: "element",
3655
+ class: "vvd-component",
3656
+ ...handleVue3Props({
3657
+ ...this.placement !== void 0 ? { "^placement": this.placement } : {}
3658
+ }),
3659
+ onBlur: (event) => {
3660
+ this.$emit("blur", event);
3661
+ },
3662
+ onClick: (event) => {
3663
+ this.$emit("click", event);
3664
+ },
3665
+ onFocus: (event) => {
3666
+ this.$emit("focus", event);
3667
+ },
3668
+ onInput: (event) => {
3669
+ this.$emit("input", event);
3670
+ },
3671
+ onKeydown: (event) => {
3672
+ this.$emit("keydown", event);
3673
+ },
3674
+ onKeyup: (event) => {
3675
+ this.$emit("keyup", event);
3676
+ }
3677
+ },
3678
+ [
3679
+ // @ts-ignore
3680
+ this.$slots.default && this.$slots.default(),
3681
+ // @slot icon Custom icon slot (optional).
3682
+ handleNamedSlotV3("icon", this.$slots["icon"])
3683
+ ]
3684
+ );
3685
+ }
3686
+ });
3687
+
3561
3688
  const VDataGrid = vue.defineComponent({
3562
3689
  name: "VDataGrid",
3563
3690
  props: {
@@ -11905,7 +12032,11 @@ const VTabs = vue.defineComponent({
11905
12032
  }
11906
12033
  }
11907
12034
  },
11908
- [this.$slots.default]
12035
+ [
12036
+ this.$slots.default,
12037
+ // @slot action-items Slot for action items such as buttons or controls.
12038
+ handleNamedSlotV2("action-items", this.$slots["action-items"])
12039
+ ]
11909
12040
  );
11910
12041
  }
11911
12042
  return vue.h(
@@ -11946,7 +12077,9 @@ const VTabs = vue.defineComponent({
11946
12077
  },
11947
12078
  [
11948
12079
  // @ts-ignore
11949
- this.$slots.default && this.$slots.default()
12080
+ this.$slots.default && this.$slots.default(),
12081
+ // @slot action-items Slot for action items such as buttons or controls.
12082
+ handleNamedSlotV3("action-items", this.$slots["action-items"])
11950
12083
  ]
11951
12084
  );
11952
12085
  }
@@ -15197,17 +15330,17 @@ var Icon = /* @__PURE__ */ ((Icon2) => {
15197
15330
  return Icon2;
15198
15331
  })(Icon || {});
15199
15332
 
15200
- const tokensThemeLightCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n@property --vvd-size-density {\n syntax: \"<integer>\";\n inherits: true;\n initial-value: 0;\n}\n@property --vvd-size-font-scale-base {\n syntax: \"<length>\";\n inherits: true;\n initial-value: 16px;\n}\n.vvd-root, ::part(vvd-root) {\n --vvd-color-scheme: light;\n --vvd-color-canvas: #ffffff;\n --vvd-color-canvas-text: #0d0d0d;\n --vvd-color-neutral-50: #F2F2F2;\n --vvd-color-neutral-100: #E6E6E6;\n --vvd-color-neutral-200: #cccccc;\n --vvd-color-neutral-300: #b3b3b3;\n --vvd-color-neutral-400: #929292;\n --vvd-color-neutral-500: #757575;\n --vvd-color-neutral-600: #666666;\n --vvd-color-neutral-700: #4d4d4d;\n --vvd-color-neutral-800: #333333;\n --vvd-color-neutral-900: #1a1a1a;\n --vvd-color-neutral-950: #0d0d0d;\n --vvd-color-cta-50: #f5f0fd;\n --vvd-color-cta-100: #ece2fa;\n --vvd-color-cta-200: #dcc1fc;\n --vvd-color-cta-300: #cba1fa;\n --vvd-color-cta-400: #b27bf2;\n --vvd-color-cta-500: #9941ff;\n --vvd-color-cta-600: #871eff;\n --vvd-color-cta-700: #6405d1;\n --vvd-color-cta-800: #440291;\n --vvd-color-cta-900: #26044d;\n --vvd-color-cta-950: #140623;\n --vvd-color-warning-50: #FDF5D4;\n --vvd-color-warning-100: #FDEAA0;\n --vvd-color-warning-200: #FACC4B;\n --vvd-color-warning-300: #fa9f00;\n --vvd-color-warning-400: #e07902;\n --vvd-color-warning-500: #be5702;\n --vvd-color-warning-600: #A64C03;\n --vvd-color-warning-700: #893000;\n --vvd-color-warning-800: #522801;\n --vvd-color-warning-900: #2A1502;\n --vvd-color-warning-950: #150B01;\n --vvd-color-information-50: #e8f4fb;\n --vvd-color-information-100: #d3e9fc;\n --vvd-color-information-200: #9dd2fe;\n --vvd-color-information-300: #65baff;\n --vvd-color-information-400: #2997f0;\n --vvd-color-information-500: #0276d5;\n --vvd-color-information-600: #0e65c2;\n --vvd-color-information-700: #094a9e;\n --vvd-color-information-800: #0e306d;\n --vvd-color-information-900: #071939;\n --vvd-color-information-950: #040d1d;\n --vvd-color-announcement-50: #ffedfb;\n --vvd-color-announcement-100: #ffdcf7;\n --vvd-color-announcement-200: #f8b9e7;\n --vvd-color-announcement-300: #fb8fd8;\n --vvd-color-announcement-400: #e560bb;\n --vvd-color-announcement-500: #d6219c;\n --vvd-color-announcement-600: #bb1e89;\n --vvd-color-announcement-700: #8f1669;\n --vvd-color-announcement-800: #620256;\n --vvd-color-announcement-900: #32082c;\n --vvd-color-announcement-950: #1d031a;\n --vvd-color-success-50: #e1f8e5;\n --vvd-color-success-100: #cfeed4;\n --vvd-color-success-200: #86e090;\n --vvd-color-success-300: #53ca6a;\n --vvd-color-success-400: #30a849;\n --vvd-color-success-500: #1c8731;\n --vvd-color-success-600: #167629;\n --vvd-color-success-700: #155923;\n --vvd-color-success-800: #183a1e;\n --vvd-color-success-900: #0a1e11;\n --vvd-color-success-950: #060f09;\n --vvd-color-alert-50: #ffeef2;\n --vvd-color-alert-100: #fedfdf;\n --vvd-color-alert-200: #ffbbbb;\n --vvd-color-alert-300: #fe9696;\n --vvd-color-alert-400: #f75959;\n --vvd-color-alert-500: #e61d1d;\n --vvd-color-alert-600: #cd0d0d;\n --vvd-color-alert-700: #9f0202;\n --vvd-color-alert-800: #6e0000;\n --vvd-color-alert-900: #3e0004;\n --vvd-color-alert-950: #250004;\n --vvd-color-neutral-tint-50: #f2f3f9;\n --vvd-color-neutral-tint-100: #e5e5ec;\n --vvd-color-neutral-tint-200: #cbcbd9;\n --vvd-color-neutral-tint-300: #b2b1c7;\n --vvd-color-neutral-tint-400: #908fae;\n --vvd-color-neutral-tint-500: #727198;\n --vvd-color-neutral-tint-600: #63628d;\n --vvd-color-neutral-tint-700: #494977;\n --vvd-color-neutral-tint-800: #31304f;\n --vvd-color-neutral-tint-900: #191828;\n --vvd-color-neutral-tint-950: #0d0c15;\n --vvd-color-surface-0dp: #ffffff;\n --vvd-color-surface-2dp: #ffffff;\n --vvd-color-surface-4dp: #ffffff;\n --vvd-color-surface-8dp: #ffffff;\n --vvd-color-surface-12dp: #ffffff;\n --vvd-color-surface-16dp: #ffffff;\n --vvd-color-surface-24dp: #ffffff;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #cccccc) drop-shadow(0px 1px 0px #cccccc) drop-shadow(0px -1px 0px #cccccc) drop-shadow(-1px 0px 0px #cccccc);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #0000001a) drop-shadow(0px 1px 2px #0000000d) drop-shadow(0px 2px 1px #0000000d);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #0000001a) drop-shadow(0px 2px 4px #0000000d) drop-shadow(0px 4px 2px #0000000d);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #0000001a) drop-shadow(0px 8px 8px #0000000d) drop-shadow(0px 4px 4px #0000000d);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #0000001a) drop-shadow(0px 12px 16px #0000000d) drop-shadow(0px 6px 8px #0000000d);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #0000001a) drop-shadow(0px 16px 24px #0000000d) drop-shadow(0px 8px 12px #0000000d);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000033) drop-shadow(0px 24px 32px #0000000d) drop-shadow(0px 12px 16px #0000000d);\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #31304f1a) drop-shadow(0px 1px 0px #31304f1a) drop-shadow(0px -1px 0px #31304f1a) drop-shadow(-1px 0px 0px #31304f1a);\n --vvd-neutral-tint-shadow-surface-2dp: drop-shadow(0px 1px 4px #26044d1a) drop-shadow(0px 1px 2px #26044d0d) drop-shadow(0px 2px 1px #26044d0d);\n --vvd-neutral-tint-shadow-surface-4dp: drop-shadow(0px 2px 8px #26044d1a) drop-shadow(0px 2px 4px #26044d0d) drop-shadow(0px 4px 2px #26044d0d);\n --vvd-neutral-tint-shadow-surface-8dp: drop-shadow(0px 2px 16px #26044d1a) drop-shadow(0px 8px 8px #26044d0d) drop-shadow(0px 4px 4px #26044d0d);\n --vvd-neutral-tint-shadow-surface-12dp: drop-shadow(0px 4px 24px #26044d1a) drop-shadow(0px 12px 16px #26044d0d) drop-shadow(0px 6px 8px #26044d0d);\n --vvd-neutral-tint-shadow-surface-16dp: drop-shadow(0px 6px 32px #26044d1a) drop-shadow(0px 16px 24px #26044d0d) drop-shadow(0px 8px 12px #26044d0d);\n --vvd-neutral-tint-shadow-surface-24dp: drop-shadow(0px 12px 48px #26044d33) drop-shadow(0px 24px 32px #26044d0d) drop-shadow(0px 12px 16px #26044d0d);\n --vvd-typography-headline: 500 calc(var(--vvd-size-font-scale-base, 16px) * 4.125)/1.3333333333333333 Montserrat;\n --vvd-typography-subtitle: 500 calc(var(--vvd-size-font-scale-base, 16px) * 3.25)/1.3076923076923077 Montserrat;\n --vvd-typography-heading-1: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2.5)/1.3 Montserrat;\n --vvd-typography-heading-2: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2)/1.375 Montserrat;\n --vvd-typography-heading-3: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.625)/1.3846153846153846 Montserrat;\n --vvd-typography-heading-4: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.25)/1.4 Montserrat;\n --vvd-typography-base: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-code: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Roboto Mono;\n --vvd-typography-base-condensed: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-condensed-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-extended: 400 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n --vvd-typography-base-extended-bold: 600 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n}\n\n.vvd-theme-alternate, ::part(vvd-theme-alternate) {\n --vvd-color-scheme: dark;\n --vvd-color-canvas: #000000;\n --vvd-color-canvas-text: #ffffff;\n --vvd-color-neutral-50: #1a1a1a;\n --vvd-color-neutral-100: #333333;\n --vvd-color-neutral-200: #4d4d4d;\n --vvd-color-neutral-300: #666666;\n --vvd-color-neutral-400: #757575;\n --vvd-color-neutral-500: #929292;\n --vvd-color-neutral-600: #b3b3b3;\n --vvd-color-neutral-700: #cccccc;\n --vvd-color-neutral-800: #E6E6E6;\n --vvd-color-neutral-900: #F2F2F2;\n --vvd-color-neutral-950: #ffffff;\n --vvd-color-cta-50: #26044d;\n --vvd-color-cta-100: #440291;\n --vvd-color-cta-200: #6405d1;\n --vvd-color-cta-300: #871eff;\n --vvd-color-cta-400: #9941ff;\n --vvd-color-cta-500: #b27bf2;\n --vvd-color-cta-600: #cba1fa;\n --vvd-color-cta-700: #dcc1fc;\n --vvd-color-cta-800: #ece2fa;\n --vvd-color-cta-900: #f5f0fd;\n --vvd-color-warning-50: #2A1502;\n --vvd-color-warning-100: #522801;\n --vvd-color-warning-200: #803807;\n --vvd-color-warning-300: #A64C03;\n --vvd-color-warning-400: #be5702;\n --vvd-color-warning-500: #e07902;\n --vvd-color-warning-600: #fa9f00;\n --vvd-color-warning-700: #FACC4B;\n --vvd-color-warning-800: #FDEAA0;\n --vvd-color-warning-900: #FDF5D4;\n --vvd-color-information-50: #071939;\n --vvd-color-information-100: #0e306d;\n --vvd-color-information-200: #094a9e;\n --vvd-color-information-300: #0e65c2;\n --vvd-color-information-400: #0276d5;\n --vvd-color-information-500: #2997f0;\n --vvd-color-information-600: #65baff;\n --vvd-color-information-700: #9dd2fe;\n --vvd-color-information-800: #d3e9fc;\n --vvd-color-information-900: #e8f4fb;\n --vvd-color-announcement-50: #32082c;\n --vvd-color-announcement-100: #620256;\n --vvd-color-announcement-200: #8f1669;\n --vvd-color-announcement-300: #bb1e89;\n --vvd-color-announcement-400: #d6219c;\n --vvd-color-announcement-500: #e560bb;\n --vvd-color-announcement-600: #fb8fd8;\n --vvd-color-announcement-700: #f8b9e7;\n --vvd-color-announcement-800: #ffdcf7;\n --vvd-color-announcement-900: #ffedfb;\n --vvd-color-success-50: #0a1e11;\n --vvd-color-success-100: #183a1e;\n --vvd-color-success-200: #155923;\n --vvd-color-success-300: #167629;\n --vvd-color-success-400: #1c8731;\n --vvd-color-success-500: #30a849;\n --vvd-color-success-600: #53ca6a;\n --vvd-color-success-700: #86e090;\n --vvd-color-success-800: #cfeed4;\n --vvd-color-success-900: #e1f8e5;\n --vvd-color-alert-50: #3e0004;\n --vvd-color-alert-100: #6e0000;\n --vvd-color-alert-200: #9f0202;\n --vvd-color-alert-300: #cd0d0d;\n --vvd-color-alert-400: #e61d1d;\n --vvd-color-alert-500: #f75959;\n --vvd-color-alert-600: #fe9696;\n --vvd-color-alert-700: #ffbbbb;\n --vvd-color-alert-800: #fedfdf;\n --vvd-color-alert-900: #ffeef2;\n --vvd-color-neutral-tint-50: #191828;\n --vvd-color-neutral-tint-100: #31304f;\n --vvd-color-neutral-tint-200: #494977;\n --vvd-color-neutral-tint-300: #63628d;\n --vvd-color-neutral-tint-400: #727198;\n --vvd-color-neutral-tint-500: #908fae;\n --vvd-color-neutral-tint-600: #b2b1c7;\n --vvd-color-neutral-tint-700: #cbcbd9;\n --vvd-color-neutral-tint-800: #e5e5ec;\n --vvd-color-neutral-tint-900: #f2f3f9;\n --vvd-color-surface-0dp: #0d0d0d;\n --vvd-color-surface-2dp: linear-gradient(#ffffff0f, #ffffff0f), #0d0d0d;\n --vvd-color-surface-4dp: linear-gradient(#ffffff14, #ffffff14), #0d0d0d;\n --vvd-color-surface-8dp: linear-gradient(#ffffff1a, #ffffff1a), #0d0d0d;\n --vvd-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #0d0d0d;\n --vvd-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #0d0d0d;\n --vvd-color-surface-24dp: linear-gradient(#ffffff29, #ffffff29), #0d0d0d;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #4d4d4d) drop-shadow(0px 1px 0px #4d4d4d) drop-shadow(0px -1px 0px #4d4d4d) drop-shadow(-1px 0px 0px #4d4d4d);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #00000040) drop-shadow(0px 1px 2px #00000040) drop-shadow(0px 2px 1px #00000040);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #00000040) drop-shadow(0px 2px 4px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #00000040) drop-shadow(0px 8px 8px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #00000040) drop-shadow(0px 12px 16px #00000040) drop-shadow(0px 6px 8px #00000040);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #00000040) drop-shadow(0px 16px 24px #00000040) drop-shadow(0px 8px 12px #00000040);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000040) drop-shadow(0px 24px 32px #00000040) drop-shadow(0px 12px 16px #00000040);\n --vvd-neutral-tint-color-surface-0dp: #191828;\n --vvd-neutral-tint-color-surface-2dp: linear-gradient(#ffffff08, #ffffff08), #191828;\n --vvd-neutral-tint-color-surface-4dp: linear-gradient(#ffffff0f, #ffffff0f), #191828;\n --vvd-neutral-tint-color-surface-8dp: linear-gradient(#ffffff14, #ffffff14), #191828;\n --vvd-neutral-tint-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #191828;\n --vvd-neutral-tint-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #191828;\n --vvd-neutral-tint-color-surface-24dp: linear-gradient(#ffffff33, #ffffff33), #191828;\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #f2f3f91a) drop-shadow(0px 1px 0px #f2f3f91a) drop-shadow(0px -1px 0px #f2f3f91a) drop-shadow(-1px 0px 0px #f2f3f91a);\n --vvd-neutral-tint-shadow-surface-2dp: none;\n --vvd-neutral-tint-shadow-surface-4dp: none;\n --vvd-neutral-tint-shadow-surface-8dp: none;\n --vvd-neutral-tint-shadow-surface-12dp: none;\n --vvd-neutral-tint-shadow-surface-16dp: none;\n --vvd-neutral-tint-shadow-surface-24dp: none;\n}\n";
15333
+ const tokensThemeLightCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n@property --vvd-size-density {\n syntax: \"<integer>\";\n inherits: true;\n initial-value: 0;\n}\n@property --vvd-size-font-scale-base {\n syntax: \"<length>\";\n inherits: true;\n initial-value: 16px;\n}\n.vvd-root, ::part(vvd-root) {\n --vvd-color-scheme: light;\n --vvd-color-canvas: #ffffff;\n --vvd-color-canvas-text: #0d0d0d;\n --vvd-color-neutral-50: #F2F2F2;\n --vvd-color-neutral-100: #E6E6E6;\n --vvd-color-neutral-200: #cccccc;\n --vvd-color-neutral-300: #b3b3b3;\n --vvd-color-neutral-400: #929292;\n --vvd-color-neutral-500: #757575;\n --vvd-color-neutral-600: #666666;\n --vvd-color-neutral-700: #4d4d4d;\n --vvd-color-neutral-800: #333333;\n --vvd-color-neutral-900: #1a1a1a;\n --vvd-color-neutral-950: #0d0d0d;\n --vvd-color-cta-50: #f5f0fd;\n --vvd-color-cta-100: #ece2fa;\n --vvd-color-cta-200: #dcc1fc;\n --vvd-color-cta-300: #cba1fa;\n --vvd-color-cta-400: #b27bf2;\n --vvd-color-cta-500: #9941ff;\n --vvd-color-cta-600: #871eff;\n --vvd-color-cta-700: #6405d1;\n --vvd-color-cta-800: #440291;\n --vvd-color-cta-900: #26044d;\n --vvd-color-cta-950: #140623;\n --vvd-color-warning-50: #FDF5D4;\n --vvd-color-warning-100: #FDEAA0;\n --vvd-color-warning-200: #FACC4B;\n --vvd-color-warning-300: #fa9f00;\n --vvd-color-warning-400: #e07902;\n --vvd-color-warning-500: #be5702;\n --vvd-color-warning-600: #A64C03;\n --vvd-color-warning-700: #893000;\n --vvd-color-warning-800: #522801;\n --vvd-color-warning-900: #2A1502;\n --vvd-color-warning-950: #150B01;\n --vvd-color-information-50: #e8f4fb;\n --vvd-color-information-100: #d3e9fc;\n --vvd-color-information-200: #9dd2fe;\n --vvd-color-information-300: #65baff;\n --vvd-color-information-400: #2997f0;\n --vvd-color-information-500: #0276d5;\n --vvd-color-information-600: #0e65c2;\n --vvd-color-information-700: #094a9e;\n --vvd-color-information-800: #0e306d;\n --vvd-color-information-900: #071939;\n --vvd-color-information-950: #040d1d;\n --vvd-color-announcement-50: #ffedfb;\n --vvd-color-announcement-100: #ffdcf7;\n --vvd-color-announcement-200: #f8b9e7;\n --vvd-color-announcement-300: #fb8fd8;\n --vvd-color-announcement-400: #e560bb;\n --vvd-color-announcement-500: #d6219c;\n --vvd-color-announcement-600: #bb1e89;\n --vvd-color-announcement-700: #8f1669;\n --vvd-color-announcement-800: #620256;\n --vvd-color-announcement-900: #32082c;\n --vvd-color-announcement-950: #1d031a;\n --vvd-color-success-50: #e1f8e5;\n --vvd-color-success-100: #cfeed4;\n --vvd-color-success-200: #86e090;\n --vvd-color-success-300: #53ca6a;\n --vvd-color-success-400: #30a849;\n --vvd-color-success-500: #1c8731;\n --vvd-color-success-600: #167629;\n --vvd-color-success-700: #155923;\n --vvd-color-success-800: #183a1e;\n --vvd-color-success-900: #0a1e11;\n --vvd-color-success-950: #060f09;\n --vvd-color-alert-50: #ffeef2;\n --vvd-color-alert-100: #fedfdf;\n --vvd-color-alert-200: #ffbbbb;\n --vvd-color-alert-300: #fe9696;\n --vvd-color-alert-400: #f75959;\n --vvd-color-alert-500: #e61d1d;\n --vvd-color-alert-600: #cd0d0d;\n --vvd-color-alert-700: #9f0202;\n --vvd-color-alert-800: #6e0000;\n --vvd-color-alert-900: #3e0004;\n --vvd-color-alert-950: #250004;\n --vvd-color-neutral-tint-50: #f2f3f9;\n --vvd-color-neutral-tint-100: #e5e5ec;\n --vvd-color-neutral-tint-200: #cbcbd9;\n --vvd-color-neutral-tint-300: #b2b1c7;\n --vvd-color-neutral-tint-400: #908fae;\n --vvd-color-neutral-tint-500: #727198;\n --vvd-color-neutral-tint-600: #63628d;\n --vvd-color-neutral-tint-700: #494977;\n --vvd-color-neutral-tint-800: #31304f;\n --vvd-color-neutral-tint-900: #191828;\n --vvd-color-neutral-tint-950: #0d0c15;\n --vvd-color-surface-0dp: #ffffff;\n --vvd-color-surface-2dp: #ffffff;\n --vvd-color-surface-4dp: #ffffff;\n --vvd-color-surface-8dp: #ffffff;\n --vvd-color-surface-12dp: #ffffff;\n --vvd-color-surface-16dp: #ffffff;\n --vvd-color-surface-24dp: #ffffff;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #cccccc) drop-shadow(0px 1px 0px #cccccc) drop-shadow(0px -1px 0px #cccccc) drop-shadow(-1px 0px 0px #cccccc);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #0000001a) drop-shadow(0px 1px 2px #0000000d) drop-shadow(0px 2px 1px #0000000d);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #0000001a) drop-shadow(0px 2px 4px #0000000d) drop-shadow(0px 4px 2px #0000000d);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #0000001a) drop-shadow(0px 8px 8px #0000000d) drop-shadow(0px 4px 4px #0000000d);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #0000001a) drop-shadow(0px 12px 16px #0000000d) drop-shadow(0px 6px 8px #0000000d);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #0000001a) drop-shadow(0px 16px 24px #0000000d) drop-shadow(0px 8px 12px #0000000d);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000033) drop-shadow(0px 24px 32px #0000000d) drop-shadow(0px 12px 16px #0000000d);\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #31304f1a) drop-shadow(0px 1px 0px #31304f1a) drop-shadow(0px -1px 0px #31304f1a) drop-shadow(-1px 0px 0px #31304f1a);\n --vvd-neutral-tint-shadow-surface-2dp: drop-shadow(0px 1px 4px #26044d1a) drop-shadow(0px 1px 2px #26044d0d) drop-shadow(0px 2px 1px #26044d0d);\n --vvd-neutral-tint-shadow-surface-4dp: drop-shadow(0px 2px 8px #26044d1a) drop-shadow(0px 2px 4px #26044d0d) drop-shadow(0px 4px 2px #26044d0d);\n --vvd-neutral-tint-shadow-surface-8dp: drop-shadow(0px 2px 16px #26044d1a) drop-shadow(0px 8px 8px #26044d0d) drop-shadow(0px 4px 4px #26044d0d);\n --vvd-neutral-tint-shadow-surface-12dp: drop-shadow(0px 4px 24px #26044d1a) drop-shadow(0px 12px 16px #26044d0d) drop-shadow(0px 6px 8px #26044d0d);\n --vvd-neutral-tint-shadow-surface-16dp: drop-shadow(0px 6px 32px #26044d1a) drop-shadow(0px 16px 24px #26044d0d) drop-shadow(0px 8px 12px #26044d0d);\n --vvd-neutral-tint-shadow-surface-24dp: drop-shadow(0px 12px 48px #26044d33) drop-shadow(0px 24px 32px #26044d0d) drop-shadow(0px 12px 16px #26044d0d);\n --vvd-typography-headline: 500 calc(var(--vvd-size-font-scale-base, 16px) * 4.125)/1.3333333333333333 Montserrat;\n --vvd-typography-subtitle: 500 calc(var(--vvd-size-font-scale-base, 16px) * 3.25)/1.3076923076923077 Montserrat;\n --vvd-typography-heading-1: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2.5)/1.3 Montserrat;\n --vvd-typography-heading-2: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2)/1.375 Montserrat;\n --vvd-typography-heading-3: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.625)/1.3846153846153846 Montserrat;\n --vvd-typography-heading-4: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.25)/1.4 Montserrat;\n --vvd-typography-base: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-code: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Roboto Mono;\n --vvd-typography-base-condensed: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-condensed-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-extended: 400 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n --vvd-typography-base-extended-bold: 600 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n}\n\n.vvd-theme-alternate, ::part(vvd-theme-alternate) {\n --vvd-color-scheme: dark;\n --vvd-color-canvas: #000000;\n --vvd-color-canvas-text: #ffffff;\n --vvd-color-neutral-50: #1a1a1a;\n --vvd-color-neutral-100: #333333;\n --vvd-color-neutral-200: #4d4d4d;\n --vvd-color-neutral-300: #666666;\n --vvd-color-neutral-400: #757575;\n --vvd-color-neutral-500: #929292;\n --vvd-color-neutral-600: #b3b3b3;\n --vvd-color-neutral-700: #cccccc;\n --vvd-color-neutral-800: #E6E6E6;\n --vvd-color-neutral-900: #F2F2F2;\n --vvd-color-neutral-950: #ffffff;\n --vvd-color-cta-50: #26044d;\n --vvd-color-cta-100: #440291;\n --vvd-color-cta-200: #6405d1;\n --vvd-color-cta-300: #871eff;\n --vvd-color-cta-400: #9941ff;\n --vvd-color-cta-500: #b27bf2;\n --vvd-color-cta-600: #cba1fa;\n --vvd-color-cta-700: #dcc1fc;\n --vvd-color-cta-800: #ece2fa;\n --vvd-color-cta-900: #f5f0fd;\n --vvd-color-warning-50: #2A1502;\n --vvd-color-warning-100: #522801;\n --vvd-color-warning-200: #803807;\n --vvd-color-warning-300: #A64C03;\n --vvd-color-warning-400: #be5702;\n --vvd-color-warning-500: #e07902;\n --vvd-color-warning-600: #fa9f00;\n --vvd-color-warning-700: #FACC4B;\n --vvd-color-warning-800: #FDEAA0;\n --vvd-color-warning-900: #FDF5D4;\n --vvd-color-information-50: #071939;\n --vvd-color-information-100: #0e306d;\n --vvd-color-information-200: #094a9e;\n --vvd-color-information-300: #0e65c2;\n --vvd-color-information-400: #0276d5;\n --vvd-color-information-500: #2997f0;\n --vvd-color-information-600: #65baff;\n --vvd-color-information-700: #9dd2fe;\n --vvd-color-information-800: #d3e9fc;\n --vvd-color-information-900: #e8f4fb;\n --vvd-color-announcement-50: #32082c;\n --vvd-color-announcement-100: #620256;\n --vvd-color-announcement-200: #8f1669;\n --vvd-color-announcement-300: #bb1e89;\n --vvd-color-announcement-400: #d6219c;\n --vvd-color-announcement-500: #e560bb;\n --vvd-color-announcement-600: #fb8fd8;\n --vvd-color-announcement-700: #f8b9e7;\n --vvd-color-announcement-800: #ffdcf7;\n --vvd-color-announcement-900: #ffedfb;\n --vvd-color-success-50: #0a1e11;\n --vvd-color-success-100: #183a1e;\n --vvd-color-success-200: #155923;\n --vvd-color-success-300: #167629;\n --vvd-color-success-400: #1c8731;\n --vvd-color-success-500: #30a849;\n --vvd-color-success-600: #53ca6a;\n --vvd-color-success-700: #86e090;\n --vvd-color-success-800: #cfeed4;\n --vvd-color-success-900: #e1f8e5;\n --vvd-color-alert-50: #3e0004;\n --vvd-color-alert-100: #6e0000;\n --vvd-color-alert-200: #9f0202;\n --vvd-color-alert-300: #cd0d0d;\n --vvd-color-alert-400: #e61d1d;\n --vvd-color-alert-500: #f75959;\n --vvd-color-alert-600: #fe9696;\n --vvd-color-alert-700: #ffbbbb;\n --vvd-color-alert-800: #fedfdf;\n --vvd-color-alert-900: #ffeef2;\n --vvd-color-neutral-tint-50: #191828;\n --vvd-color-neutral-tint-100: #31304f;\n --vvd-color-neutral-tint-200: #494977;\n --vvd-color-neutral-tint-300: #63628d;\n --vvd-color-neutral-tint-400: #727198;\n --vvd-color-neutral-tint-500: #908fae;\n --vvd-color-neutral-tint-600: #b2b1c7;\n --vvd-color-neutral-tint-700: #cbcbd9;\n --vvd-color-neutral-tint-800: #e5e5ec;\n --vvd-color-neutral-tint-900: #f2f3f9;\n --vvd-color-surface-0dp: #0d0d0d;\n --vvd-color-surface-2dp: linear-gradient(#ffffff0f, #ffffff0f), #0d0d0d;\n --vvd-color-surface-4dp: linear-gradient(#ffffff14, #ffffff14), #0d0d0d;\n --vvd-color-surface-8dp: linear-gradient(#ffffff1a, #ffffff1a), #0d0d0d;\n --vvd-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #0d0d0d;\n --vvd-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #0d0d0d;\n --vvd-color-surface-24dp: linear-gradient(#ffffff29, #ffffff29), #0d0d0d;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #4d4d4d) drop-shadow(0px 1px 0px #4d4d4d) drop-shadow(0px -1px 0px #4d4d4d) drop-shadow(-1px 0px 0px #4d4d4d);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #00000040) drop-shadow(0px 1px 2px #00000040) drop-shadow(0px 2px 1px #00000040);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #00000040) drop-shadow(0px 2px 4px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #00000040) drop-shadow(0px 8px 8px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #00000040) drop-shadow(0px 12px 16px #00000040) drop-shadow(0px 6px 8px #00000040);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #00000040) drop-shadow(0px 16px 24px #00000040) drop-shadow(0px 8px 12px #00000040);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000040) drop-shadow(0px 24px 32px #00000040) drop-shadow(0px 12px 16px #00000040);\n --vvd-neutral-tint-color-surface-0dp: #191828;\n --vvd-neutral-tint-color-surface-2dp: linear-gradient(#ffffff08, #ffffff08), #191828;\n --vvd-neutral-tint-color-surface-4dp: linear-gradient(#ffffff0f, #ffffff0f), #191828;\n --vvd-neutral-tint-color-surface-8dp: linear-gradient(#ffffff14, #ffffff14), #191828;\n --vvd-neutral-tint-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #191828;\n --vvd-neutral-tint-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #191828;\n --vvd-neutral-tint-color-surface-24dp: linear-gradient(#ffffff33, #ffffff33), #191828;\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #f2f3f91a) drop-shadow(0px 1px 0px #f2f3f91a) drop-shadow(0px -1px 0px #f2f3f91a) drop-shadow(-1px 0px 0px #f2f3f91a);\n --vvd-neutral-tint-shadow-surface-2dp: none;\n --vvd-neutral-tint-shadow-surface-4dp: none;\n --vvd-neutral-tint-shadow-surface-8dp: none;\n --vvd-neutral-tint-shadow-surface-12dp: none;\n --vvd-neutral-tint-shadow-surface-16dp: none;\n --vvd-neutral-tint-shadow-surface-24dp: none;\n}\n";
15201
15334
 
15202
- const tokensThemeDarkCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n@property --vvd-size-density {\n syntax: \"<integer>\";\n inherits: true;\n initial-value: 0;\n}\n@property --vvd-size-font-scale-base {\n syntax: \"<length>\";\n inherits: true;\n initial-value: 16px;\n}\n.vvd-root, ::part(vvd-root) {\n --vvd-color-scheme: dark;\n --vvd-color-canvas: #000000;\n --vvd-color-canvas-text: #ffffff;\n --vvd-color-neutral-50: #1a1a1a;\n --vvd-color-neutral-100: #333333;\n --vvd-color-neutral-200: #4d4d4d;\n --vvd-color-neutral-300: #666666;\n --vvd-color-neutral-400: #757575;\n --vvd-color-neutral-500: #929292;\n --vvd-color-neutral-600: #b3b3b3;\n --vvd-color-neutral-700: #cccccc;\n --vvd-color-neutral-800: #E6E6E6;\n --vvd-color-neutral-900: #F2F2F2;\n --vvd-color-neutral-950: #ffffff;\n --vvd-color-cta-50: #26044d;\n --vvd-color-cta-100: #440291;\n --vvd-color-cta-200: #6405d1;\n --vvd-color-cta-300: #871eff;\n --vvd-color-cta-400: #9941ff;\n --vvd-color-cta-500: #b27bf2;\n --vvd-color-cta-600: #cba1fa;\n --vvd-color-cta-700: #dcc1fc;\n --vvd-color-cta-800: #ece2fa;\n --vvd-color-cta-900: #f5f0fd;\n --vvd-color-warning-50: #2A1502;\n --vvd-color-warning-100: #522801;\n --vvd-color-warning-200: #803807;\n --vvd-color-warning-300: #A64C03;\n --vvd-color-warning-400: #be5702;\n --vvd-color-warning-500: #e07902;\n --vvd-color-warning-600: #fa9f00;\n --vvd-color-warning-700: #FACC4B;\n --vvd-color-warning-800: #FDEAA0;\n --vvd-color-warning-900: #FDF5D4;\n --vvd-color-information-50: #071939;\n --vvd-color-information-100: #0e306d;\n --vvd-color-information-200: #094a9e;\n --vvd-color-information-300: #0e65c2;\n --vvd-color-information-400: #0276d5;\n --vvd-color-information-500: #2997f0;\n --vvd-color-information-600: #65baff;\n --vvd-color-information-700: #9dd2fe;\n --vvd-color-information-800: #d3e9fc;\n --vvd-color-information-900: #e8f4fb;\n --vvd-color-announcement-50: #32082c;\n --vvd-color-announcement-100: #620256;\n --vvd-color-announcement-200: #8f1669;\n --vvd-color-announcement-300: #bb1e89;\n --vvd-color-announcement-400: #d6219c;\n --vvd-color-announcement-500: #e560bb;\n --vvd-color-announcement-600: #fb8fd8;\n --vvd-color-announcement-700: #f8b9e7;\n --vvd-color-announcement-800: #ffdcf7;\n --vvd-color-announcement-900: #ffedfb;\n --vvd-color-success-50: #0a1e11;\n --vvd-color-success-100: #183a1e;\n --vvd-color-success-200: #155923;\n --vvd-color-success-300: #167629;\n --vvd-color-success-400: #1c8731;\n --vvd-color-success-500: #30a849;\n --vvd-color-success-600: #53ca6a;\n --vvd-color-success-700: #86e090;\n --vvd-color-success-800: #cfeed4;\n --vvd-color-success-900: #e1f8e5;\n --vvd-color-alert-50: #3e0004;\n --vvd-color-alert-100: #6e0000;\n --vvd-color-alert-200: #9f0202;\n --vvd-color-alert-300: #cd0d0d;\n --vvd-color-alert-400: #e61d1d;\n --vvd-color-alert-500: #f75959;\n --vvd-color-alert-600: #fe9696;\n --vvd-color-alert-700: #ffbbbb;\n --vvd-color-alert-800: #fedfdf;\n --vvd-color-alert-900: #ffeef2;\n --vvd-color-neutral-tint-50: #191828;\n --vvd-color-neutral-tint-100: #31304f;\n --vvd-color-neutral-tint-200: #494977;\n --vvd-color-neutral-tint-300: #63628d;\n --vvd-color-neutral-tint-400: #727198;\n --vvd-color-neutral-tint-500: #908fae;\n --vvd-color-neutral-tint-600: #b2b1c7;\n --vvd-color-neutral-tint-700: #cbcbd9;\n --vvd-color-neutral-tint-800: #e5e5ec;\n --vvd-color-neutral-tint-900: #f2f3f9;\n --vvd-color-surface-0dp: #0d0d0d;\n --vvd-color-surface-2dp: linear-gradient(#ffffff0f, #ffffff0f), #0d0d0d;\n --vvd-color-surface-4dp: linear-gradient(#ffffff14, #ffffff14), #0d0d0d;\n --vvd-color-surface-8dp: linear-gradient(#ffffff1a, #ffffff1a), #0d0d0d;\n --vvd-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #0d0d0d;\n --vvd-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #0d0d0d;\n --vvd-color-surface-24dp: linear-gradient(#ffffff29, #ffffff29), #0d0d0d;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #4d4d4d) drop-shadow(0px 1px 0px #4d4d4d) drop-shadow(0px -1px 0px #4d4d4d) drop-shadow(-1px 0px 0px #4d4d4d);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #00000040) drop-shadow(0px 1px 2px #00000040) drop-shadow(0px 2px 1px #00000040);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #00000040) drop-shadow(0px 2px 4px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #00000040) drop-shadow(0px 8px 8px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #00000040) drop-shadow(0px 12px 16px #00000040) drop-shadow(0px 6px 8px #00000040);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #00000040) drop-shadow(0px 16px 24px #00000040) drop-shadow(0px 8px 12px #00000040);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000040) drop-shadow(0px 24px 32px #00000040) drop-shadow(0px 12px 16px #00000040);\n --vvd-neutral-tint-color-surface-0dp: #191828;\n --vvd-neutral-tint-color-surface-2dp: linear-gradient(#ffffff08, #ffffff08), #191828;\n --vvd-neutral-tint-color-surface-4dp: linear-gradient(#ffffff0f, #ffffff0f), #191828;\n --vvd-neutral-tint-color-surface-8dp: linear-gradient(#ffffff14, #ffffff14), #191828;\n --vvd-neutral-tint-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #191828;\n --vvd-neutral-tint-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #191828;\n --vvd-neutral-tint-color-surface-24dp: linear-gradient(#ffffff33, #ffffff33), #191828;\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #f2f3f91a) drop-shadow(0px 1px 0px #f2f3f91a) drop-shadow(0px -1px 0px #f2f3f91a) drop-shadow(-1px 0px 0px #f2f3f91a);\n --vvd-neutral-tint-shadow-surface-2dp: none;\n --vvd-neutral-tint-shadow-surface-4dp: none;\n --vvd-neutral-tint-shadow-surface-8dp: none;\n --vvd-neutral-tint-shadow-surface-12dp: none;\n --vvd-neutral-tint-shadow-surface-16dp: none;\n --vvd-neutral-tint-shadow-surface-24dp: none;\n --vvd-typography-headline: 500 calc(var(--vvd-size-font-scale-base, 16px) * 4.125)/1.3333333333333333 Montserrat;\n --vvd-typography-subtitle: 500 calc(var(--vvd-size-font-scale-base, 16px) * 3.25)/1.3076923076923077 Montserrat;\n --vvd-typography-heading-1: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2.5)/1.3 Montserrat;\n --vvd-typography-heading-2: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2)/1.375 Montserrat;\n --vvd-typography-heading-3: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.625)/1.3846153846153846 Montserrat;\n --vvd-typography-heading-4: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.25)/1.4 Montserrat;\n --vvd-typography-base: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-code: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Roboto Mono;\n --vvd-typography-base-condensed: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-condensed-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-extended: 400 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n --vvd-typography-base-extended-bold: 600 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n}\n\n.vvd-theme-alternate, ::part(vvd-theme-alternate) {\n --vvd-color-scheme: light;\n --vvd-color-canvas: #ffffff;\n --vvd-color-canvas-text: #0d0d0d;\n --vvd-color-neutral-50: #F2F2F2;\n --vvd-color-neutral-100: #E6E6E6;\n --vvd-color-neutral-200: #cccccc;\n --vvd-color-neutral-300: #b3b3b3;\n --vvd-color-neutral-400: #929292;\n --vvd-color-neutral-500: #757575;\n --vvd-color-neutral-600: #666666;\n --vvd-color-neutral-700: #4d4d4d;\n --vvd-color-neutral-800: #333333;\n --vvd-color-neutral-900: #1a1a1a;\n --vvd-color-neutral-950: #0d0d0d;\n --vvd-color-cta-50: #f5f0fd;\n --vvd-color-cta-100: #ece2fa;\n --vvd-color-cta-200: #dcc1fc;\n --vvd-color-cta-300: #cba1fa;\n --vvd-color-cta-400: #b27bf2;\n --vvd-color-cta-500: #9941ff;\n --vvd-color-cta-600: #871eff;\n --vvd-color-cta-700: #6405d1;\n --vvd-color-cta-800: #440291;\n --vvd-color-cta-900: #26044d;\n --vvd-color-cta-950: #140623;\n --vvd-color-warning-50: #FDF5D4;\n --vvd-color-warning-100: #FDEAA0;\n --vvd-color-warning-200: #FACC4B;\n --vvd-color-warning-300: #fa9f00;\n --vvd-color-warning-400: #e07902;\n --vvd-color-warning-500: #be5702;\n --vvd-color-warning-600: #A64C03;\n --vvd-color-warning-700: #893000;\n --vvd-color-warning-800: #522801;\n --vvd-color-warning-900: #2A1502;\n --vvd-color-warning-950: #150B01;\n --vvd-color-information-50: #e8f4fb;\n --vvd-color-information-100: #d3e9fc;\n --vvd-color-information-200: #9dd2fe;\n --vvd-color-information-300: #65baff;\n --vvd-color-information-400: #2997f0;\n --vvd-color-information-500: #0276d5;\n --vvd-color-information-600: #0e65c2;\n --vvd-color-information-700: #094a9e;\n --vvd-color-information-800: #0e306d;\n --vvd-color-information-900: #071939;\n --vvd-color-information-950: #040d1d;\n --vvd-color-announcement-50: #ffedfb;\n --vvd-color-announcement-100: #ffdcf7;\n --vvd-color-announcement-200: #f8b9e7;\n --vvd-color-announcement-300: #fb8fd8;\n --vvd-color-announcement-400: #e560bb;\n --vvd-color-announcement-500: #d6219c;\n --vvd-color-announcement-600: #bb1e89;\n --vvd-color-announcement-700: #8f1669;\n --vvd-color-announcement-800: #620256;\n --vvd-color-announcement-900: #32082c;\n --vvd-color-announcement-950: #1d031a;\n --vvd-color-success-50: #e1f8e5;\n --vvd-color-success-100: #cfeed4;\n --vvd-color-success-200: #86e090;\n --vvd-color-success-300: #53ca6a;\n --vvd-color-success-400: #30a849;\n --vvd-color-success-500: #1c8731;\n --vvd-color-success-600: #167629;\n --vvd-color-success-700: #155923;\n --vvd-color-success-800: #183a1e;\n --vvd-color-success-900: #0a1e11;\n --vvd-color-success-950: #060f09;\n --vvd-color-alert-50: #ffeef2;\n --vvd-color-alert-100: #fedfdf;\n --vvd-color-alert-200: #ffbbbb;\n --vvd-color-alert-300: #fe9696;\n --vvd-color-alert-400: #f75959;\n --vvd-color-alert-500: #e61d1d;\n --vvd-color-alert-600: #cd0d0d;\n --vvd-color-alert-700: #9f0202;\n --vvd-color-alert-800: #6e0000;\n --vvd-color-alert-900: #3e0004;\n --vvd-color-alert-950: #250004;\n --vvd-color-neutral-tint-50: #f2f3f9;\n --vvd-color-neutral-tint-100: #e5e5ec;\n --vvd-color-neutral-tint-200: #cbcbd9;\n --vvd-color-neutral-tint-300: #b2b1c7;\n --vvd-color-neutral-tint-400: #908fae;\n --vvd-color-neutral-tint-500: #727198;\n --vvd-color-neutral-tint-600: #63628d;\n --vvd-color-neutral-tint-700: #494977;\n --vvd-color-neutral-tint-800: #31304f;\n --vvd-color-neutral-tint-900: #191828;\n --vvd-color-neutral-tint-950: #0d0c15;\n --vvd-color-surface-0dp: #ffffff;\n --vvd-color-surface-2dp: #ffffff;\n --vvd-color-surface-4dp: #ffffff;\n --vvd-color-surface-8dp: #ffffff;\n --vvd-color-surface-12dp: #ffffff;\n --vvd-color-surface-16dp: #ffffff;\n --vvd-color-surface-24dp: #ffffff;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #cccccc) drop-shadow(0px 1px 0px #cccccc) drop-shadow(0px -1px 0px #cccccc) drop-shadow(-1px 0px 0px #cccccc);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #0000001a) drop-shadow(0px 1px 2px #0000000d) drop-shadow(0px 2px 1px #0000000d);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #0000001a) drop-shadow(0px 2px 4px #0000000d) drop-shadow(0px 4px 2px #0000000d);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #0000001a) drop-shadow(0px 8px 8px #0000000d) drop-shadow(0px 4px 4px #0000000d);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #0000001a) drop-shadow(0px 12px 16px #0000000d) drop-shadow(0px 6px 8px #0000000d);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #0000001a) drop-shadow(0px 16px 24px #0000000d) drop-shadow(0px 8px 12px #0000000d);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000033) drop-shadow(0px 24px 32px #0000000d) drop-shadow(0px 12px 16px #0000000d);\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #31304f1a) drop-shadow(0px 1px 0px #31304f1a) drop-shadow(0px -1px 0px #31304f1a) drop-shadow(-1px 0px 0px #31304f1a);\n --vvd-neutral-tint-shadow-surface-2dp: drop-shadow(0px 1px 4px #26044d1a) drop-shadow(0px 1px 2px #26044d0d) drop-shadow(0px 2px 1px #26044d0d);\n --vvd-neutral-tint-shadow-surface-4dp: drop-shadow(0px 2px 8px #26044d1a) drop-shadow(0px 2px 4px #26044d0d) drop-shadow(0px 4px 2px #26044d0d);\n --vvd-neutral-tint-shadow-surface-8dp: drop-shadow(0px 2px 16px #26044d1a) drop-shadow(0px 8px 8px #26044d0d) drop-shadow(0px 4px 4px #26044d0d);\n --vvd-neutral-tint-shadow-surface-12dp: drop-shadow(0px 4px 24px #26044d1a) drop-shadow(0px 12px 16px #26044d0d) drop-shadow(0px 6px 8px #26044d0d);\n --vvd-neutral-tint-shadow-surface-16dp: drop-shadow(0px 6px 32px #26044d1a) drop-shadow(0px 16px 24px #26044d0d) drop-shadow(0px 8px 12px #26044d0d);\n --vvd-neutral-tint-shadow-surface-24dp: drop-shadow(0px 12px 48px #26044d33) drop-shadow(0px 24px 32px #26044d0d) drop-shadow(0px 12px 16px #26044d0d);\n}\n";
15335
+ const tokensThemeDarkCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n@property --vvd-size-density {\n syntax: \"<integer>\";\n inherits: true;\n initial-value: 0;\n}\n@property --vvd-size-font-scale-base {\n syntax: \"<length>\";\n inherits: true;\n initial-value: 16px;\n}\n.vvd-root, ::part(vvd-root) {\n --vvd-color-scheme: dark;\n --vvd-color-canvas: #000000;\n --vvd-color-canvas-text: #ffffff;\n --vvd-color-neutral-50: #1a1a1a;\n --vvd-color-neutral-100: #333333;\n --vvd-color-neutral-200: #4d4d4d;\n --vvd-color-neutral-300: #666666;\n --vvd-color-neutral-400: #757575;\n --vvd-color-neutral-500: #929292;\n --vvd-color-neutral-600: #b3b3b3;\n --vvd-color-neutral-700: #cccccc;\n --vvd-color-neutral-800: #E6E6E6;\n --vvd-color-neutral-900: #F2F2F2;\n --vvd-color-neutral-950: #ffffff;\n --vvd-color-cta-50: #26044d;\n --vvd-color-cta-100: #440291;\n --vvd-color-cta-200: #6405d1;\n --vvd-color-cta-300: #871eff;\n --vvd-color-cta-400: #9941ff;\n --vvd-color-cta-500: #b27bf2;\n --vvd-color-cta-600: #cba1fa;\n --vvd-color-cta-700: #dcc1fc;\n --vvd-color-cta-800: #ece2fa;\n --vvd-color-cta-900: #f5f0fd;\n --vvd-color-warning-50: #2A1502;\n --vvd-color-warning-100: #522801;\n --vvd-color-warning-200: #803807;\n --vvd-color-warning-300: #A64C03;\n --vvd-color-warning-400: #be5702;\n --vvd-color-warning-500: #e07902;\n --vvd-color-warning-600: #fa9f00;\n --vvd-color-warning-700: #FACC4B;\n --vvd-color-warning-800: #FDEAA0;\n --vvd-color-warning-900: #FDF5D4;\n --vvd-color-information-50: #071939;\n --vvd-color-information-100: #0e306d;\n --vvd-color-information-200: #094a9e;\n --vvd-color-information-300: #0e65c2;\n --vvd-color-information-400: #0276d5;\n --vvd-color-information-500: #2997f0;\n --vvd-color-information-600: #65baff;\n --vvd-color-information-700: #9dd2fe;\n --vvd-color-information-800: #d3e9fc;\n --vvd-color-information-900: #e8f4fb;\n --vvd-color-announcement-50: #32082c;\n --vvd-color-announcement-100: #620256;\n --vvd-color-announcement-200: #8f1669;\n --vvd-color-announcement-300: #bb1e89;\n --vvd-color-announcement-400: #d6219c;\n --vvd-color-announcement-500: #e560bb;\n --vvd-color-announcement-600: #fb8fd8;\n --vvd-color-announcement-700: #f8b9e7;\n --vvd-color-announcement-800: #ffdcf7;\n --vvd-color-announcement-900: #ffedfb;\n --vvd-color-success-50: #0a1e11;\n --vvd-color-success-100: #183a1e;\n --vvd-color-success-200: #155923;\n --vvd-color-success-300: #167629;\n --vvd-color-success-400: #1c8731;\n --vvd-color-success-500: #30a849;\n --vvd-color-success-600: #53ca6a;\n --vvd-color-success-700: #86e090;\n --vvd-color-success-800: #cfeed4;\n --vvd-color-success-900: #e1f8e5;\n --vvd-color-alert-50: #3e0004;\n --vvd-color-alert-100: #6e0000;\n --vvd-color-alert-200: #9f0202;\n --vvd-color-alert-300: #cd0d0d;\n --vvd-color-alert-400: #e61d1d;\n --vvd-color-alert-500: #f75959;\n --vvd-color-alert-600: #fe9696;\n --vvd-color-alert-700: #ffbbbb;\n --vvd-color-alert-800: #fedfdf;\n --vvd-color-alert-900: #ffeef2;\n --vvd-color-neutral-tint-50: #191828;\n --vvd-color-neutral-tint-100: #31304f;\n --vvd-color-neutral-tint-200: #494977;\n --vvd-color-neutral-tint-300: #63628d;\n --vvd-color-neutral-tint-400: #727198;\n --vvd-color-neutral-tint-500: #908fae;\n --vvd-color-neutral-tint-600: #b2b1c7;\n --vvd-color-neutral-tint-700: #cbcbd9;\n --vvd-color-neutral-tint-800: #e5e5ec;\n --vvd-color-neutral-tint-900: #f2f3f9;\n --vvd-color-surface-0dp: #0d0d0d;\n --vvd-color-surface-2dp: linear-gradient(#ffffff0f, #ffffff0f), #0d0d0d;\n --vvd-color-surface-4dp: linear-gradient(#ffffff14, #ffffff14), #0d0d0d;\n --vvd-color-surface-8dp: linear-gradient(#ffffff1a, #ffffff1a), #0d0d0d;\n --vvd-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #0d0d0d;\n --vvd-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #0d0d0d;\n --vvd-color-surface-24dp: linear-gradient(#ffffff29, #ffffff29), #0d0d0d;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #4d4d4d) drop-shadow(0px 1px 0px #4d4d4d) drop-shadow(0px -1px 0px #4d4d4d) drop-shadow(-1px 0px 0px #4d4d4d);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #00000040) drop-shadow(0px 1px 2px #00000040) drop-shadow(0px 2px 1px #00000040);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #00000040) drop-shadow(0px 2px 4px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #00000040) drop-shadow(0px 8px 8px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #00000040) drop-shadow(0px 12px 16px #00000040) drop-shadow(0px 6px 8px #00000040);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #00000040) drop-shadow(0px 16px 24px #00000040) drop-shadow(0px 8px 12px #00000040);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000040) drop-shadow(0px 24px 32px #00000040) drop-shadow(0px 12px 16px #00000040);\n --vvd-neutral-tint-color-surface-0dp: #191828;\n --vvd-neutral-tint-color-surface-2dp: linear-gradient(#ffffff08, #ffffff08), #191828;\n --vvd-neutral-tint-color-surface-4dp: linear-gradient(#ffffff0f, #ffffff0f), #191828;\n --vvd-neutral-tint-color-surface-8dp: linear-gradient(#ffffff14, #ffffff14), #191828;\n --vvd-neutral-tint-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #191828;\n --vvd-neutral-tint-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #191828;\n --vvd-neutral-tint-color-surface-24dp: linear-gradient(#ffffff33, #ffffff33), #191828;\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #f2f3f91a) drop-shadow(0px 1px 0px #f2f3f91a) drop-shadow(0px -1px 0px #f2f3f91a) drop-shadow(-1px 0px 0px #f2f3f91a);\n --vvd-neutral-tint-shadow-surface-2dp: none;\n --vvd-neutral-tint-shadow-surface-4dp: none;\n --vvd-neutral-tint-shadow-surface-8dp: none;\n --vvd-neutral-tint-shadow-surface-12dp: none;\n --vvd-neutral-tint-shadow-surface-16dp: none;\n --vvd-neutral-tint-shadow-surface-24dp: none;\n --vvd-typography-headline: 500 calc(var(--vvd-size-font-scale-base, 16px) * 4.125)/1.3333333333333333 Montserrat;\n --vvd-typography-subtitle: 500 calc(var(--vvd-size-font-scale-base, 16px) * 3.25)/1.3076923076923077 Montserrat;\n --vvd-typography-heading-1: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2.5)/1.3 Montserrat;\n --vvd-typography-heading-2: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2)/1.375 Montserrat;\n --vvd-typography-heading-3: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.625)/1.3846153846153846 Montserrat;\n --vvd-typography-heading-4: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.25)/1.4 Montserrat;\n --vvd-typography-base: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-code: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Roboto Mono;\n --vvd-typography-base-condensed: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-condensed-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-extended: 400 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n --vvd-typography-base-extended-bold: 600 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n}\n\n.vvd-theme-alternate, ::part(vvd-theme-alternate) {\n --vvd-color-scheme: light;\n --vvd-color-canvas: #ffffff;\n --vvd-color-canvas-text: #0d0d0d;\n --vvd-color-neutral-50: #F2F2F2;\n --vvd-color-neutral-100: #E6E6E6;\n --vvd-color-neutral-200: #cccccc;\n --vvd-color-neutral-300: #b3b3b3;\n --vvd-color-neutral-400: #929292;\n --vvd-color-neutral-500: #757575;\n --vvd-color-neutral-600: #666666;\n --vvd-color-neutral-700: #4d4d4d;\n --vvd-color-neutral-800: #333333;\n --vvd-color-neutral-900: #1a1a1a;\n --vvd-color-neutral-950: #0d0d0d;\n --vvd-color-cta-50: #f5f0fd;\n --vvd-color-cta-100: #ece2fa;\n --vvd-color-cta-200: #dcc1fc;\n --vvd-color-cta-300: #cba1fa;\n --vvd-color-cta-400: #b27bf2;\n --vvd-color-cta-500: #9941ff;\n --vvd-color-cta-600: #871eff;\n --vvd-color-cta-700: #6405d1;\n --vvd-color-cta-800: #440291;\n --vvd-color-cta-900: #26044d;\n --vvd-color-cta-950: #140623;\n --vvd-color-warning-50: #FDF5D4;\n --vvd-color-warning-100: #FDEAA0;\n --vvd-color-warning-200: #FACC4B;\n --vvd-color-warning-300: #fa9f00;\n --vvd-color-warning-400: #e07902;\n --vvd-color-warning-500: #be5702;\n --vvd-color-warning-600: #A64C03;\n --vvd-color-warning-700: #893000;\n --vvd-color-warning-800: #522801;\n --vvd-color-warning-900: #2A1502;\n --vvd-color-warning-950: #150B01;\n --vvd-color-information-50: #e8f4fb;\n --vvd-color-information-100: #d3e9fc;\n --vvd-color-information-200: #9dd2fe;\n --vvd-color-information-300: #65baff;\n --vvd-color-information-400: #2997f0;\n --vvd-color-information-500: #0276d5;\n --vvd-color-information-600: #0e65c2;\n --vvd-color-information-700: #094a9e;\n --vvd-color-information-800: #0e306d;\n --vvd-color-information-900: #071939;\n --vvd-color-information-950: #040d1d;\n --vvd-color-announcement-50: #ffedfb;\n --vvd-color-announcement-100: #ffdcf7;\n --vvd-color-announcement-200: #f8b9e7;\n --vvd-color-announcement-300: #fb8fd8;\n --vvd-color-announcement-400: #e560bb;\n --vvd-color-announcement-500: #d6219c;\n --vvd-color-announcement-600: #bb1e89;\n --vvd-color-announcement-700: #8f1669;\n --vvd-color-announcement-800: #620256;\n --vvd-color-announcement-900: #32082c;\n --vvd-color-announcement-950: #1d031a;\n --vvd-color-success-50: #e1f8e5;\n --vvd-color-success-100: #cfeed4;\n --vvd-color-success-200: #86e090;\n --vvd-color-success-300: #53ca6a;\n --vvd-color-success-400: #30a849;\n --vvd-color-success-500: #1c8731;\n --vvd-color-success-600: #167629;\n --vvd-color-success-700: #155923;\n --vvd-color-success-800: #183a1e;\n --vvd-color-success-900: #0a1e11;\n --vvd-color-success-950: #060f09;\n --vvd-color-alert-50: #ffeef2;\n --vvd-color-alert-100: #fedfdf;\n --vvd-color-alert-200: #ffbbbb;\n --vvd-color-alert-300: #fe9696;\n --vvd-color-alert-400: #f75959;\n --vvd-color-alert-500: #e61d1d;\n --vvd-color-alert-600: #cd0d0d;\n --vvd-color-alert-700: #9f0202;\n --vvd-color-alert-800: #6e0000;\n --vvd-color-alert-900: #3e0004;\n --vvd-color-alert-950: #250004;\n --vvd-color-neutral-tint-50: #f2f3f9;\n --vvd-color-neutral-tint-100: #e5e5ec;\n --vvd-color-neutral-tint-200: #cbcbd9;\n --vvd-color-neutral-tint-300: #b2b1c7;\n --vvd-color-neutral-tint-400: #908fae;\n --vvd-color-neutral-tint-500: #727198;\n --vvd-color-neutral-tint-600: #63628d;\n --vvd-color-neutral-tint-700: #494977;\n --vvd-color-neutral-tint-800: #31304f;\n --vvd-color-neutral-tint-900: #191828;\n --vvd-color-neutral-tint-950: #0d0c15;\n --vvd-color-surface-0dp: #ffffff;\n --vvd-color-surface-2dp: #ffffff;\n --vvd-color-surface-4dp: #ffffff;\n --vvd-color-surface-8dp: #ffffff;\n --vvd-color-surface-12dp: #ffffff;\n --vvd-color-surface-16dp: #ffffff;\n --vvd-color-surface-24dp: #ffffff;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #cccccc) drop-shadow(0px 1px 0px #cccccc) drop-shadow(0px -1px 0px #cccccc) drop-shadow(-1px 0px 0px #cccccc);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #0000001a) drop-shadow(0px 1px 2px #0000000d) drop-shadow(0px 2px 1px #0000000d);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #0000001a) drop-shadow(0px 2px 4px #0000000d) drop-shadow(0px 4px 2px #0000000d);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #0000001a) drop-shadow(0px 8px 8px #0000000d) drop-shadow(0px 4px 4px #0000000d);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #0000001a) drop-shadow(0px 12px 16px #0000000d) drop-shadow(0px 6px 8px #0000000d);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #0000001a) drop-shadow(0px 16px 24px #0000000d) drop-shadow(0px 8px 12px #0000000d);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000033) drop-shadow(0px 24px 32px #0000000d) drop-shadow(0px 12px 16px #0000000d);\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #31304f1a) drop-shadow(0px 1px 0px #31304f1a) drop-shadow(0px -1px 0px #31304f1a) drop-shadow(-1px 0px 0px #31304f1a);\n --vvd-neutral-tint-shadow-surface-2dp: drop-shadow(0px 1px 4px #26044d1a) drop-shadow(0px 1px 2px #26044d0d) drop-shadow(0px 2px 1px #26044d0d);\n --vvd-neutral-tint-shadow-surface-4dp: drop-shadow(0px 2px 8px #26044d1a) drop-shadow(0px 2px 4px #26044d0d) drop-shadow(0px 4px 2px #26044d0d);\n --vvd-neutral-tint-shadow-surface-8dp: drop-shadow(0px 2px 16px #26044d1a) drop-shadow(0px 8px 8px #26044d0d) drop-shadow(0px 4px 4px #26044d0d);\n --vvd-neutral-tint-shadow-surface-12dp: drop-shadow(0px 4px 24px #26044d1a) drop-shadow(0px 12px 16px #26044d0d) drop-shadow(0px 6px 8px #26044d0d);\n --vvd-neutral-tint-shadow-surface-16dp: drop-shadow(0px 6px 32px #26044d1a) drop-shadow(0px 16px 24px #26044d0d) drop-shadow(0px 8px 12px #26044d0d);\n --vvd-neutral-tint-shadow-surface-24dp: drop-shadow(0px 12px 48px #26044d33) drop-shadow(0px 24px 32px #26044d0d) drop-shadow(0px 12px 16px #26044d0d);\n}\n";
15203
15336
 
15204
15337
  const fontsSpeziaVariableCss = "@font-face {\n font-display: block;\n font-family: SpeziaCompleteVariableUpright;\n font-stretch: 50% 200%;\n font-weight: 1 1000;\n src: url(\"https://fonts.resources.vonage.com/fonts/v2/SpeziaCompleteVariableUprightWeb.woff2\") format(\"woff2\");\n}\n@font-face {\n font-display: block;\n font-family: SpeziaMonoCompleteVariable;\n font-stretch: 50% 200%;\n font-weight: 1 1000;\n src: url(\"https://fonts.resources.vonage.com/fonts/v2/SpeziaMonoCompleteVariableWeb.woff2\") format(\"woff2\");\n}\n.vvd-root {\n --vvd-typography-headline: 500 condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 4.125) / 1.3333333333333333\n \tspeziacompletevariableupright;\n --vvd-typography-subtitle: 500 condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 3.25) / 1.3076923076923077\n \tspeziacompletevariableupright;\n --vvd-typography-heading-1: 500 condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 2.5) / 1.3\n \tspeziacompletevariableupright;\n --vvd-typography-heading-2: 500 condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 2) / 1.375\n \tspeziacompletevariableupright;\n --vvd-typography-heading-3: 500 condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 1.625) / 1.3846153846153846\n \tspeziacompletevariableupright;\n --vvd-typography-heading-4: 500 condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 1.25) / 1.4\n \tspeziacompletevariableupright;\n --vvd-typography-base: 400 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 0.875) / 1.4285714285714286\n \tspeziacompletevariableupright;\n --vvd-typography-base-bold: 600 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 0.875) / 1.4285714285714286\n \tspeziacompletevariableupright;\n --vvd-typography-base-code: 400 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 0.875) / 1.4285714285714286\n \tspeziamonocompletevariable;\n --vvd-typography-base-condensed: 400 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 0.75) / 1.3333333333333333\n \tspeziacompletevariableupright;\n --vvd-typography-base-condensed-bold: 600 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 0.75) / 1.3333333333333333\n \tspeziacompletevariableupright;\n --vvd-typography-base-extended: 400 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px)) / 1.5\n \tspeziacompletevariableupright;\n --vvd-typography-base-extended-bold: 600 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px)) / 1.5\n \tspeziacompletevariableupright;\n}\n";
15205
15338
 
15206
- const tokensVivid2CompatCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n.vvd-root, ::part(vvd-root),\n.vvd-theme-alternate, ::part(vvd-theme-alternate) {\n --_vvd3--vvd-color-neutral-50: var(\n \t--vvd-color-neutral-50\n );\n}\n\n.vvd-component:not(.vvd-theme-alternate) {\n --vvd-color-neutral-50: var(--_vvd3--vvd-color-neutral-50);\n}\n";
15339
+ const tokensVivid2CompatCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n.vvd-root, ::part(vvd-root),\n.vvd-theme-alternate, ::part(vvd-theme-alternate) {\n --_vvd3--vvd-color-neutral-50: var(\n \t--vvd-color-neutral-50\n );\n}\n\n.vvd-component:not(.vvd-theme-alternate) {\n --vvd-color-neutral-50: var(--_vvd3--vvd-color-neutral-50);\n}\n";
15207
15340
 
15208
- const coreThemeCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n.vvd-root {\n background-color: var(--vvd-color-canvas);\n color: var(--vvd-color-canvas-text);\n color-scheme: var(--vvd-color-scheme);\n}\n\n.vvd-scrollbar {\n --scrollbar-track-color: transparent;\n --scrollbar-thumb-color: color-mix(in srgb, var(--vvd-color-neutral-950), transparent 70%);\n}\n.vvd-scrollbar {\n scrollbar-color: var(--scrollbar-thumb-color) var(--scrollbar-track-color);\n scrollbar-width: thin;\n}\n.vvd-scrollbar ::-webkit-scrollbar {\n width: 4px;\n}\n.vvd-scrollbar ::-webkit-scrollbar-track {\n background: var(--scrollbar-track-color);\n}\n.vvd-scrollbar ::-webkit-scrollbar-thumb {\n border: 0;\n border-radius: 4px;\n background-color: var(--scrollbar-fallback-track-color, var(--scrollbar-thumb-color));\n}\n\n.vvd-neutral-tint-elevation {\n --_vvd-tinted-color-surface-0dp: var(--vvd-neutral-tint-color-surface-0dp);\n --_vvd-tinted-color-surface-2dp: var(--vvd-neutral-tint-color-surface-2dp);\n --_vvd-tinted-color-surface-4dp: var(--vvd-neutral-tint-color-surface-4dp);\n --_vvd-tinted-color-surface-8dp: var(--vvd-neutral-tint-color-surface-8dp);\n --_vvd-tinted-color-surface-12dp: var(--vvd-neutral-tint-color-surface-12dp);\n --_vvd-tinted-color-surface-16dp: var(--vvd-neutral-tint-color-surface-16dp);\n --_vvd-tinted-color-surface-24dp: var(--vvd-neutral-tint-color-surface-24dp);\n --_vvd-tinted-shadow-surface-0dp: var(--vvd-neutral-tint-shadow-surface-0dp);\n --_vvd-tinted-shadow-surface-2dp: var(--vvd-neutral-tint-shadow-surface-2dp);\n --_vvd-tinted-shadow-surface-4dp: var(--vvd-neutral-tint-shadow-surface-4dp);\n --_vvd-tinted-shadow-surface-8dp: var(--vvd-neutral-tint-shadow-surface-8dp);\n --_vvd-tinted-shadow-surface-12dp: var(\n \t--vvd-neutral-tint-shadow-surface-12dp\n );\n --_vvd-tinted-shadow-surface-16dp: var(\n \t--vvd-neutral-tint-shadow-surface-16dp\n );\n --_vvd-tinted-shadow-surface-24dp: var(\n \t--vvd-neutral-tint-shadow-surface-24dp\n );\n}\n.vvd-neutral-tint-elevation > * {\n --_vvd-tinted-color-surface-0dp: var(--vvd-color-surface-0dp);\n --_vvd-tinted-color-surface-2dp: var(--vvd-color-surface-2dp);\n --_vvd-tinted-color-surface-4dp: var(--vvd-color-surface-4dp);\n --_vvd-tinted-color-surface-8dp: var(--vvd-color-surface-8dp);\n --_vvd-tinted-color-surface-12dp: var(--vvd-color-surface-12dp);\n --_vvd-tinted-color-surface-16dp: var(--vvd-color-surface-16dp);\n --_vvd-tinted-color-surface-24dp: var(--vvd-color-surface-24dp);\n --_vvd-tinted-shadow-surface-0dp: var(--vvd-shadow-surface-0dp);\n --_vvd-tinted-shadow-surface-2dp: var(--vvd-shadow-surface-2dp);\n --_vvd-tinted-shadow-surface-4dp: var(--vvd-shadow-surface-4dp);\n --_vvd-tinted-shadow-surface-8dp: var(--vvd-shadow-surface-8dp);\n --_vvd-tinted-shadow-surface-12dp: var(--vvd-shadow-surface-12dp);\n --_vvd-tinted-shadow-surface-16dp: var(--vvd-shadow-surface-16dp);\n --_vvd-tinted-shadow-surface-24dp: var(--vvd-shadow-surface-24dp);\n}\n";
15341
+ const coreThemeCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n.vvd-root {\n background-color: var(--vvd-color-canvas);\n color: var(--vvd-color-canvas-text);\n color-scheme: var(--vvd-color-scheme);\n}\n\n.vvd-scrollbar {\n --scrollbar-track-color: transparent;\n --scrollbar-thumb-color: color-mix(in srgb, var(--vvd-color-neutral-950), transparent 70%);\n}\n.vvd-scrollbar {\n scrollbar-color: var(--scrollbar-thumb-color) var(--scrollbar-track-color);\n scrollbar-width: thin;\n}\n.vvd-scrollbar ::-webkit-scrollbar {\n width: 4px;\n}\n.vvd-scrollbar ::-webkit-scrollbar-track {\n background: var(--scrollbar-track-color);\n}\n.vvd-scrollbar ::-webkit-scrollbar-thumb {\n border: 0;\n border-radius: 4px;\n background-color: var(--scrollbar-fallback-track-color, var(--scrollbar-thumb-color));\n}\n\n.vvd-neutral-tint-elevation {\n --_vvd-tinted-color-surface-0dp: var(--vvd-neutral-tint-color-surface-0dp);\n --_vvd-tinted-color-surface-2dp: var(--vvd-neutral-tint-color-surface-2dp);\n --_vvd-tinted-color-surface-4dp: var(--vvd-neutral-tint-color-surface-4dp);\n --_vvd-tinted-color-surface-8dp: var(--vvd-neutral-tint-color-surface-8dp);\n --_vvd-tinted-color-surface-12dp: var(--vvd-neutral-tint-color-surface-12dp);\n --_vvd-tinted-color-surface-16dp: var(--vvd-neutral-tint-color-surface-16dp);\n --_vvd-tinted-color-surface-24dp: var(--vvd-neutral-tint-color-surface-24dp);\n --_vvd-tinted-shadow-surface-0dp: var(--vvd-neutral-tint-shadow-surface-0dp);\n --_vvd-tinted-shadow-surface-2dp: var(--vvd-neutral-tint-shadow-surface-2dp);\n --_vvd-tinted-shadow-surface-4dp: var(--vvd-neutral-tint-shadow-surface-4dp);\n --_vvd-tinted-shadow-surface-8dp: var(--vvd-neutral-tint-shadow-surface-8dp);\n --_vvd-tinted-shadow-surface-12dp: var(\n \t--vvd-neutral-tint-shadow-surface-12dp\n );\n --_vvd-tinted-shadow-surface-16dp: var(\n \t--vvd-neutral-tint-shadow-surface-16dp\n );\n --_vvd-tinted-shadow-surface-24dp: var(\n \t--vvd-neutral-tint-shadow-surface-24dp\n );\n}\n.vvd-neutral-tint-elevation > * {\n --_vvd-tinted-color-surface-0dp: var(--vvd-color-surface-0dp);\n --_vvd-tinted-color-surface-2dp: var(--vvd-color-surface-2dp);\n --_vvd-tinted-color-surface-4dp: var(--vvd-color-surface-4dp);\n --_vvd-tinted-color-surface-8dp: var(--vvd-color-surface-8dp);\n --_vvd-tinted-color-surface-12dp: var(--vvd-color-surface-12dp);\n --_vvd-tinted-color-surface-16dp: var(--vvd-color-surface-16dp);\n --_vvd-tinted-color-surface-24dp: var(--vvd-color-surface-24dp);\n --_vvd-tinted-shadow-surface-0dp: var(--vvd-shadow-surface-0dp);\n --_vvd-tinted-shadow-surface-2dp: var(--vvd-shadow-surface-2dp);\n --_vvd-tinted-shadow-surface-4dp: var(--vvd-shadow-surface-4dp);\n --_vvd-tinted-shadow-surface-8dp: var(--vvd-shadow-surface-8dp);\n --_vvd-tinted-shadow-surface-12dp: var(--vvd-shadow-surface-12dp);\n --_vvd-tinted-shadow-surface-16dp: var(--vvd-shadow-surface-16dp);\n --_vvd-tinted-shadow-surface-24dp: var(--vvd-shadow-surface-24dp);\n}\n";
15209
15342
 
15210
- const coreTypographyCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n.vvd-root:root {\n --vvd-size-font-scale-base: 1rem;\n font-size: unset;\n}\n.vvd-root:root > body {\n font: var(--vvd-typography-base);\n font-feature-settings: \"kern\"; /* turns on kerning */\n -webkit-font-smoothing: antialiased; /* apply font anti-aliasing for Webkit on OSX */\n -moz-osx-font-smoothing: grayscale; /* apply font anti-aliasing for Firefox on OSX */\n text-rendering: optimizeLegibility; /* emphasise on legibility when rendering, turns on ligatures and kerning */\n}\n.vvd-root:not(:root) {\n font: var(--vvd-typography-base);\n font-feature-settings: \"kern\"; /* turns on kerning */\n -webkit-font-smoothing: antialiased; /* apply font anti-aliasing for Webkit on OSX */\n -moz-osx-font-smoothing: grayscale; /* apply font anti-aliasing for Firefox on OSX */\n text-rendering: optimizeLegibility; /* emphasise on legibility when rendering, turns on ligatures and kerning */\n}\n.vvd-root p,\n.vvd-root .font-base {\n font: var(--vvd-typography-base);\n margin-block: 16px;\n}\n.vvd-root p.tight,\n.vvd-root .font-base.tight {\n margin-block: 0;\n}\n.vvd-root .font-base-bold {\n font: var(--vvd-typography-base-bold);\n}\n.vvd-root .font-base-condensed {\n font: var(--vvd-typography-base-condensed);\n}\n.vvd-root .font-base-condensed-bold {\n font: var(--vvd-typography-base-condensed-bold);\n}\n.vvd-root .font-base-extended {\n font: var(--vvd-typography-base-extended);\n}\n.vvd-root .font-base-extended-bold {\n font: var(--vvd-typography-base-extended-bold);\n}\n.vvd-root .font-base-code {\n font: var(--vvd-typography-base-code);\n}\n.vvd-root b, .vvd-root strong {\n font-weight: 600;\n}\n.vvd-root pre, .vvd-root var, .vvd-root code, .vvd-root kbd, .vvd-root samp {\n font: var(--vvd-typography-base-code);\n}\n.vvd-root .headline {\n font: var(--vvd-typography-headline);\n margin-block: 40px;\n}\n.vvd-root .subtitle {\n font: var(--vvd-typography-subtitle);\n margin-block: 40px;\n}\n.vvd-root h1,\n.vvd-root .heading1 {\n font: var(--vvd-typography-heading-1);\n margin-block: 32px;\n}\n.vvd-root h2,\n.vvd-root .heading2 {\n font: var(--vvd-typography-heading-2);\n margin-block: 32px;\n}\n.vvd-root h3,\n.vvd-root .heading3 {\n font: var(--vvd-typography-heading-3);\n margin-block: 24px;\n}\n.vvd-root h4,\n.vvd-root .heading4 {\n font: var(--vvd-typography-heading-4);\n margin-block: 24px;\n}\n.vvd-root .headline b, .vvd-root .headline strong,\n.vvd-root .subtitle b,\n.vvd-root .subtitle strong,\n.vvd-root h1 b,\n.vvd-root h1 strong,\n.vvd-root .heading1 b,\n.vvd-root .heading1 strong,\n.vvd-root h2 b,\n.vvd-root h2 strong,\n.vvd-root .heading2 b,\n.vvd-root .heading2 strong,\n.vvd-root h3 b,\n.vvd-root h3 strong,\n.vvd-root .heading3 b,\n.vvd-root .heading3 strong,\n.vvd-root h4 b,\n.vvd-root h4 strong,\n.vvd-root .heading4 b,\n.vvd-root .heading4 strong {\n font-weight: 500;\n}\n.vvd-root .headline.tight,\n.vvd-root .subtitle.tight,\n.vvd-root h1.tight,\n.vvd-root .heading1.tight,\n.vvd-root h2.tight,\n.vvd-root .heading2.tight,\n.vvd-root h3.tight,\n.vvd-root .heading3.tight,\n.vvd-root h4.tight,\n.vvd-root .heading4.tight {\n margin-block: 0;\n}\n.vvd-root small,\n.vvd-root figcaption {\n font: var(--vvd-typography-base-condensed);\n}\n.vvd-root sub,\n.vvd-root sup {\n position: relative;\n font: var(--vvd-typography-base-condensed);\n font-size: 75%;\n line-height: 0;\n vertical-align: baseline;\n}\n.vvd-root sub {\n bottom: -0.25em;\n}\n.vvd-root sup {\n top: -0.5em;\n}\n";
15343
+ const coreTypographyCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n.vvd-root:root {\n --vvd-size-font-scale-base: 1rem;\n font-size: unset;\n}\n.vvd-root:root > body {\n font: var(--vvd-typography-base);\n font-feature-settings: \"kern\"; /* turns on kerning */\n -webkit-font-smoothing: antialiased; /* apply font anti-aliasing for Webkit on OSX */\n -moz-osx-font-smoothing: grayscale; /* apply font anti-aliasing for Firefox on OSX */\n text-rendering: optimizeLegibility; /* emphasise on legibility when rendering, turns on ligatures and kerning */\n}\n.vvd-root:not(:root) {\n font: var(--vvd-typography-base);\n font-feature-settings: \"kern\"; /* turns on kerning */\n -webkit-font-smoothing: antialiased; /* apply font anti-aliasing for Webkit on OSX */\n -moz-osx-font-smoothing: grayscale; /* apply font anti-aliasing for Firefox on OSX */\n text-rendering: optimizeLegibility; /* emphasise on legibility when rendering, turns on ligatures and kerning */\n}\n.vvd-root p,\n.vvd-root .font-base {\n font: var(--vvd-typography-base);\n margin-block: 16px;\n}\n.vvd-root p.tight,\n.vvd-root .font-base.tight {\n margin-block: 0;\n}\n.vvd-root .font-base-bold {\n font: var(--vvd-typography-base-bold);\n}\n.vvd-root .font-base-condensed {\n font: var(--vvd-typography-base-condensed);\n}\n.vvd-root .font-base-condensed-bold {\n font: var(--vvd-typography-base-condensed-bold);\n}\n.vvd-root .font-base-extended {\n font: var(--vvd-typography-base-extended);\n}\n.vvd-root .font-base-extended-bold {\n font: var(--vvd-typography-base-extended-bold);\n}\n.vvd-root .font-base-code {\n font: var(--vvd-typography-base-code);\n}\n.vvd-root b, .vvd-root strong {\n font-weight: 600;\n}\n.vvd-root pre, .vvd-root var, .vvd-root code, .vvd-root kbd, .vvd-root samp {\n font: var(--vvd-typography-base-code);\n}\n.vvd-root .headline {\n font: var(--vvd-typography-headline);\n margin-block: 40px;\n}\n.vvd-root .subtitle {\n font: var(--vvd-typography-subtitle);\n margin-block: 40px;\n}\n.vvd-root h1,\n.vvd-root .heading1 {\n font: var(--vvd-typography-heading-1);\n margin-block: 32px;\n}\n.vvd-root h2,\n.vvd-root .heading2 {\n font: var(--vvd-typography-heading-2);\n margin-block: 32px;\n}\n.vvd-root h3,\n.vvd-root .heading3 {\n font: var(--vvd-typography-heading-3);\n margin-block: 24px;\n}\n.vvd-root h4,\n.vvd-root .heading4 {\n font: var(--vvd-typography-heading-4);\n margin-block: 24px;\n}\n.vvd-root .headline b, .vvd-root .headline strong,\n.vvd-root .subtitle b,\n.vvd-root .subtitle strong,\n.vvd-root h1 b,\n.vvd-root h1 strong,\n.vvd-root .heading1 b,\n.vvd-root .heading1 strong,\n.vvd-root h2 b,\n.vvd-root h2 strong,\n.vvd-root .heading2 b,\n.vvd-root .heading2 strong,\n.vvd-root h3 b,\n.vvd-root h3 strong,\n.vvd-root .heading3 b,\n.vvd-root .heading3 strong,\n.vvd-root h4 b,\n.vvd-root h4 strong,\n.vvd-root .heading4 b,\n.vvd-root .heading4 strong {\n font-weight: 500;\n}\n.vvd-root .headline.tight,\n.vvd-root .subtitle.tight,\n.vvd-root h1.tight,\n.vvd-root .heading1.tight,\n.vvd-root h2.tight,\n.vvd-root .heading2.tight,\n.vvd-root h3.tight,\n.vvd-root .heading3.tight,\n.vvd-root h4.tight,\n.vvd-root .heading4.tight {\n margin-block: 0;\n}\n.vvd-root small,\n.vvd-root figcaption {\n font: var(--vvd-typography-base-condensed);\n}\n.vvd-root sub,\n.vvd-root sup {\n position: relative;\n font: var(--vvd-typography-base-condensed);\n font-size: 75%;\n line-height: 0;\n vertical-align: baseline;\n}\n.vvd-root sub {\n bottom: -0.25em;\n}\n.vvd-root sup {\n top: -0.5em;\n}\n";
15211
15344
 
15212
15345
  const theme = {
15213
15346
  name: "core/theme",
@@ -15324,6 +15457,7 @@ exports.VCard = VCard;
15324
15457
  exports.VCheckbox = VCheckbox;
15325
15458
  exports.VColorPicker = VColorPicker;
15326
15459
  exports.VCombobox = VCombobox;
15460
+ exports.VContextualHelp = VContextualHelp;
15327
15461
  exports.VDataGrid = VDataGrid;
15328
15462
  exports.VDataGridCell = VDataGridCell;
15329
15463
  exports.VDataGridRow = VDataGridRow;
package/dist/index.js CHANGED
@@ -1,5 +1,5 @@
1
1
  import { ref, version, onBeforeMount, defineComponent, h } from 'vue';
2
- import { registerAccordion, registerAccordionItem, registerActionGroup, registerAlert, registerAudioPlayer, registerAvatar, registerBadge, registerBanner, registerBreadcrumb, registerBreadcrumbItem, registerButton, registerCalendar, registerCalendarEvent, registerCard, registerCheckbox, registerColorPicker, registerCombobox, registerDataGrid, registerDatePicker, registerDateRangePicker, registerDateTimePicker, registerDialPad, registerDialog, registerDivider, registerEmptyState, registerFab, registerFilePicker, registerHeader, registerIcon, registerLayout, registerMenu, registerMenuItem, registerNav, registerNavDisclosure, registerNavItem, registerNote, registerNumberField, registerOption, registerPagination, registerProgress, registerProgressRing, registerRadio, registerRadioGroup, registerRangeSlider, registerRichTextEditor, registerSearchableSelect, registerSelect, registerSelectableBox, registerSideDrawer, registerSimpleColorPicker, registerSlider, registerSplitButton, registerSwitch, registerTab, registerTabPanel, registerTabs, registerTag, registerTagGroup, registerTextArea, registerTextField, registerTimePicker, registerToggletip, registerTooltip, registerTreeItem, registerTreeView, registerVideoPlayer } from '@vonage/vivid';
2
+ import { registerAccordion, registerAccordionItem, registerActionGroup, registerAlert, registerAudioPlayer, registerAvatar, registerBadge, registerBanner, registerBreadcrumb, registerBreadcrumbItem, registerButton, registerCalendar, registerCalendarEvent, registerCard, registerCheckbox, registerColorPicker, registerCombobox, registerContextualHelp, registerDataGrid, registerDatePicker, registerDateRangePicker, registerDateTimePicker, registerDialPad, registerDialog, registerDivider, registerEmptyState, registerFab, registerFilePicker, registerHeader, registerIcon, registerLayout, registerMenu, registerMenuItem, registerNav, registerNavDisclosure, registerNavItem, registerNote, registerNumberField, registerOption, registerPagination, registerProgress, registerProgressRing, registerRadio, registerRadioGroup, registerRangeSlider, registerRichTextEditor, registerSearchableSelect, registerSelect, registerSelectableBox, registerSideDrawer, registerSimpleColorPicker, registerSlider, registerSplitButton, registerSwitch, registerTab, registerTabPanel, registerTabs, registerTag, registerTagGroup, registerTextArea, registerTextField, registerTimePicker, registerToggletip, registerTooltip, registerTreeItem, registerTreeView, registerVideoPlayer } from '@vonage/vivid';
3
3
 
4
4
  const CustomComponentPrefix = ref("vvd3");
5
5
  function setCustomComponentPrefix(prefix) {
@@ -3554,6 +3554,133 @@ const VCombobox = defineComponent({
3554
3554
  }
3555
3555
  });
3556
3556
 
3557
+ const VContextualHelp = defineComponent({
3558
+ name: "VContextualHelp",
3559
+ props: {
3560
+ /**
3561
+ * Placement of the toggletip
3562
+ */
3563
+ placement: {
3564
+ type: String,
3565
+ default: void 0
3566
+ }
3567
+ },
3568
+ emits: [
3569
+ /**
3570
+ * Fires when the element loses focus.
3571
+ * @type {FocusEvent}
3572
+ */
3573
+ "blur",
3574
+ /**
3575
+ * Fires when a pointing device button (such as a mouse's primary mouse button) is both pressed and released while the pointer is located inside the element.
3576
+ * @type {MouseEvent}
3577
+ */
3578
+ "click",
3579
+ /**
3580
+ * Fires when the element receives focus.
3581
+ * @type {FocusEvent}
3582
+ */
3583
+ "focus",
3584
+ /**
3585
+ * Fires when the value of an element has been changed.
3586
+ * @type {Event}
3587
+ */
3588
+ "input",
3589
+ /**
3590
+ * Fires when a key is pressed.
3591
+ * @type {KeyboardEvent}
3592
+ */
3593
+ "keydown",
3594
+ /**
3595
+ * Fires when a key is released.
3596
+ * @type {KeyboardEvent}
3597
+ */
3598
+ "keyup"
3599
+ ],
3600
+ methods: {},
3601
+ setup(props, ctx) {
3602
+ const componentName = registerComponent(
3603
+ "contextual-help",
3604
+ registerContextualHelp
3605
+ );
3606
+ const element = ref(null);
3607
+ return { componentName, element };
3608
+ },
3609
+ render() {
3610
+ if (isVue2) {
3611
+ return h(
3612
+ this.componentName,
3613
+ {
3614
+ ref: "element",
3615
+ attrs: {
3616
+ ...this.placement !== void 0 ? { placement: this.placement } : {}
3617
+ },
3618
+ class: "vvd-component",
3619
+ on: {
3620
+ blur: (event) => {
3621
+ this.$emit("blur", event);
3622
+ },
3623
+ click: (event) => {
3624
+ this.$emit("click", event);
3625
+ },
3626
+ focus: (event) => {
3627
+ this.$emit("focus", event);
3628
+ },
3629
+ input: (event) => {
3630
+ this.$emit("input", event);
3631
+ },
3632
+ keydown: (event) => {
3633
+ this.$emit("keydown", event);
3634
+ },
3635
+ keyup: (event) => {
3636
+ this.$emit("keyup", event);
3637
+ }
3638
+ }
3639
+ },
3640
+ [
3641
+ this.$slots.default,
3642
+ // @slot icon Custom icon slot (optional).
3643
+ handleNamedSlotV2("icon", this.$slots["icon"])
3644
+ ]
3645
+ );
3646
+ }
3647
+ return h(
3648
+ this.componentName,
3649
+ {
3650
+ ref: "element",
3651
+ class: "vvd-component",
3652
+ ...handleVue3Props({
3653
+ ...this.placement !== void 0 ? { "^placement": this.placement } : {}
3654
+ }),
3655
+ onBlur: (event) => {
3656
+ this.$emit("blur", event);
3657
+ },
3658
+ onClick: (event) => {
3659
+ this.$emit("click", event);
3660
+ },
3661
+ onFocus: (event) => {
3662
+ this.$emit("focus", event);
3663
+ },
3664
+ onInput: (event) => {
3665
+ this.$emit("input", event);
3666
+ },
3667
+ onKeydown: (event) => {
3668
+ this.$emit("keydown", event);
3669
+ },
3670
+ onKeyup: (event) => {
3671
+ this.$emit("keyup", event);
3672
+ }
3673
+ },
3674
+ [
3675
+ // @ts-ignore
3676
+ this.$slots.default && this.$slots.default(),
3677
+ // @slot icon Custom icon slot (optional).
3678
+ handleNamedSlotV3("icon", this.$slots["icon"])
3679
+ ]
3680
+ );
3681
+ }
3682
+ });
3683
+
3557
3684
  const VDataGrid = defineComponent({
3558
3685
  name: "VDataGrid",
3559
3686
  props: {
@@ -11901,7 +12028,11 @@ const VTabs = defineComponent({
11901
12028
  }
11902
12029
  }
11903
12030
  },
11904
- [this.$slots.default]
12031
+ [
12032
+ this.$slots.default,
12033
+ // @slot action-items Slot for action items such as buttons or controls.
12034
+ handleNamedSlotV2("action-items", this.$slots["action-items"])
12035
+ ]
11905
12036
  );
11906
12037
  }
11907
12038
  return h(
@@ -11942,7 +12073,9 @@ const VTabs = defineComponent({
11942
12073
  },
11943
12074
  [
11944
12075
  // @ts-ignore
11945
- this.$slots.default && this.$slots.default()
12076
+ this.$slots.default && this.$slots.default(),
12077
+ // @slot action-items Slot for action items such as buttons or controls.
12078
+ handleNamedSlotV3("action-items", this.$slots["action-items"])
11946
12079
  ]
11947
12080
  );
11948
12081
  }
@@ -15193,17 +15326,17 @@ var Icon = /* @__PURE__ */ ((Icon2) => {
15193
15326
  return Icon2;
15194
15327
  })(Icon || {});
15195
15328
 
15196
- const tokensThemeLightCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n@property --vvd-size-density {\n syntax: \"<integer>\";\n inherits: true;\n initial-value: 0;\n}\n@property --vvd-size-font-scale-base {\n syntax: \"<length>\";\n inherits: true;\n initial-value: 16px;\n}\n.vvd-root, ::part(vvd-root) {\n --vvd-color-scheme: light;\n --vvd-color-canvas: #ffffff;\n --vvd-color-canvas-text: #0d0d0d;\n --vvd-color-neutral-50: #F2F2F2;\n --vvd-color-neutral-100: #E6E6E6;\n --vvd-color-neutral-200: #cccccc;\n --vvd-color-neutral-300: #b3b3b3;\n --vvd-color-neutral-400: #929292;\n --vvd-color-neutral-500: #757575;\n --vvd-color-neutral-600: #666666;\n --vvd-color-neutral-700: #4d4d4d;\n --vvd-color-neutral-800: #333333;\n --vvd-color-neutral-900: #1a1a1a;\n --vvd-color-neutral-950: #0d0d0d;\n --vvd-color-cta-50: #f5f0fd;\n --vvd-color-cta-100: #ece2fa;\n --vvd-color-cta-200: #dcc1fc;\n --vvd-color-cta-300: #cba1fa;\n --vvd-color-cta-400: #b27bf2;\n --vvd-color-cta-500: #9941ff;\n --vvd-color-cta-600: #871eff;\n --vvd-color-cta-700: #6405d1;\n --vvd-color-cta-800: #440291;\n --vvd-color-cta-900: #26044d;\n --vvd-color-cta-950: #140623;\n --vvd-color-warning-50: #FDF5D4;\n --vvd-color-warning-100: #FDEAA0;\n --vvd-color-warning-200: #FACC4B;\n --vvd-color-warning-300: #fa9f00;\n --vvd-color-warning-400: #e07902;\n --vvd-color-warning-500: #be5702;\n --vvd-color-warning-600: #A64C03;\n --vvd-color-warning-700: #893000;\n --vvd-color-warning-800: #522801;\n --vvd-color-warning-900: #2A1502;\n --vvd-color-warning-950: #150B01;\n --vvd-color-information-50: #e8f4fb;\n --vvd-color-information-100: #d3e9fc;\n --vvd-color-information-200: #9dd2fe;\n --vvd-color-information-300: #65baff;\n --vvd-color-information-400: #2997f0;\n --vvd-color-information-500: #0276d5;\n --vvd-color-information-600: #0e65c2;\n --vvd-color-information-700: #094a9e;\n --vvd-color-information-800: #0e306d;\n --vvd-color-information-900: #071939;\n --vvd-color-information-950: #040d1d;\n --vvd-color-announcement-50: #ffedfb;\n --vvd-color-announcement-100: #ffdcf7;\n --vvd-color-announcement-200: #f8b9e7;\n --vvd-color-announcement-300: #fb8fd8;\n --vvd-color-announcement-400: #e560bb;\n --vvd-color-announcement-500: #d6219c;\n --vvd-color-announcement-600: #bb1e89;\n --vvd-color-announcement-700: #8f1669;\n --vvd-color-announcement-800: #620256;\n --vvd-color-announcement-900: #32082c;\n --vvd-color-announcement-950: #1d031a;\n --vvd-color-success-50: #e1f8e5;\n --vvd-color-success-100: #cfeed4;\n --vvd-color-success-200: #86e090;\n --vvd-color-success-300: #53ca6a;\n --vvd-color-success-400: #30a849;\n --vvd-color-success-500: #1c8731;\n --vvd-color-success-600: #167629;\n --vvd-color-success-700: #155923;\n --vvd-color-success-800: #183a1e;\n --vvd-color-success-900: #0a1e11;\n --vvd-color-success-950: #060f09;\n --vvd-color-alert-50: #ffeef2;\n --vvd-color-alert-100: #fedfdf;\n --vvd-color-alert-200: #ffbbbb;\n --vvd-color-alert-300: #fe9696;\n --vvd-color-alert-400: #f75959;\n --vvd-color-alert-500: #e61d1d;\n --vvd-color-alert-600: #cd0d0d;\n --vvd-color-alert-700: #9f0202;\n --vvd-color-alert-800: #6e0000;\n --vvd-color-alert-900: #3e0004;\n --vvd-color-alert-950: #250004;\n --vvd-color-neutral-tint-50: #f2f3f9;\n --vvd-color-neutral-tint-100: #e5e5ec;\n --vvd-color-neutral-tint-200: #cbcbd9;\n --vvd-color-neutral-tint-300: #b2b1c7;\n --vvd-color-neutral-tint-400: #908fae;\n --vvd-color-neutral-tint-500: #727198;\n --vvd-color-neutral-tint-600: #63628d;\n --vvd-color-neutral-tint-700: #494977;\n --vvd-color-neutral-tint-800: #31304f;\n --vvd-color-neutral-tint-900: #191828;\n --vvd-color-neutral-tint-950: #0d0c15;\n --vvd-color-surface-0dp: #ffffff;\n --vvd-color-surface-2dp: #ffffff;\n --vvd-color-surface-4dp: #ffffff;\n --vvd-color-surface-8dp: #ffffff;\n --vvd-color-surface-12dp: #ffffff;\n --vvd-color-surface-16dp: #ffffff;\n --vvd-color-surface-24dp: #ffffff;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #cccccc) drop-shadow(0px 1px 0px #cccccc) drop-shadow(0px -1px 0px #cccccc) drop-shadow(-1px 0px 0px #cccccc);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #0000001a) drop-shadow(0px 1px 2px #0000000d) drop-shadow(0px 2px 1px #0000000d);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #0000001a) drop-shadow(0px 2px 4px #0000000d) drop-shadow(0px 4px 2px #0000000d);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #0000001a) drop-shadow(0px 8px 8px #0000000d) drop-shadow(0px 4px 4px #0000000d);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #0000001a) drop-shadow(0px 12px 16px #0000000d) drop-shadow(0px 6px 8px #0000000d);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #0000001a) drop-shadow(0px 16px 24px #0000000d) drop-shadow(0px 8px 12px #0000000d);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000033) drop-shadow(0px 24px 32px #0000000d) drop-shadow(0px 12px 16px #0000000d);\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #31304f1a) drop-shadow(0px 1px 0px #31304f1a) drop-shadow(0px -1px 0px #31304f1a) drop-shadow(-1px 0px 0px #31304f1a);\n --vvd-neutral-tint-shadow-surface-2dp: drop-shadow(0px 1px 4px #26044d1a) drop-shadow(0px 1px 2px #26044d0d) drop-shadow(0px 2px 1px #26044d0d);\n --vvd-neutral-tint-shadow-surface-4dp: drop-shadow(0px 2px 8px #26044d1a) drop-shadow(0px 2px 4px #26044d0d) drop-shadow(0px 4px 2px #26044d0d);\n --vvd-neutral-tint-shadow-surface-8dp: drop-shadow(0px 2px 16px #26044d1a) drop-shadow(0px 8px 8px #26044d0d) drop-shadow(0px 4px 4px #26044d0d);\n --vvd-neutral-tint-shadow-surface-12dp: drop-shadow(0px 4px 24px #26044d1a) drop-shadow(0px 12px 16px #26044d0d) drop-shadow(0px 6px 8px #26044d0d);\n --vvd-neutral-tint-shadow-surface-16dp: drop-shadow(0px 6px 32px #26044d1a) drop-shadow(0px 16px 24px #26044d0d) drop-shadow(0px 8px 12px #26044d0d);\n --vvd-neutral-tint-shadow-surface-24dp: drop-shadow(0px 12px 48px #26044d33) drop-shadow(0px 24px 32px #26044d0d) drop-shadow(0px 12px 16px #26044d0d);\n --vvd-typography-headline: 500 calc(var(--vvd-size-font-scale-base, 16px) * 4.125)/1.3333333333333333 Montserrat;\n --vvd-typography-subtitle: 500 calc(var(--vvd-size-font-scale-base, 16px) * 3.25)/1.3076923076923077 Montserrat;\n --vvd-typography-heading-1: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2.5)/1.3 Montserrat;\n --vvd-typography-heading-2: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2)/1.375 Montserrat;\n --vvd-typography-heading-3: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.625)/1.3846153846153846 Montserrat;\n --vvd-typography-heading-4: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.25)/1.4 Montserrat;\n --vvd-typography-base: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-code: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Roboto Mono;\n --vvd-typography-base-condensed: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-condensed-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-extended: 400 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n --vvd-typography-base-extended-bold: 600 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n}\n\n.vvd-theme-alternate, ::part(vvd-theme-alternate) {\n --vvd-color-scheme: dark;\n --vvd-color-canvas: #000000;\n --vvd-color-canvas-text: #ffffff;\n --vvd-color-neutral-50: #1a1a1a;\n --vvd-color-neutral-100: #333333;\n --vvd-color-neutral-200: #4d4d4d;\n --vvd-color-neutral-300: #666666;\n --vvd-color-neutral-400: #757575;\n --vvd-color-neutral-500: #929292;\n --vvd-color-neutral-600: #b3b3b3;\n --vvd-color-neutral-700: #cccccc;\n --vvd-color-neutral-800: #E6E6E6;\n --vvd-color-neutral-900: #F2F2F2;\n --vvd-color-neutral-950: #ffffff;\n --vvd-color-cta-50: #26044d;\n --vvd-color-cta-100: #440291;\n --vvd-color-cta-200: #6405d1;\n --vvd-color-cta-300: #871eff;\n --vvd-color-cta-400: #9941ff;\n --vvd-color-cta-500: #b27bf2;\n --vvd-color-cta-600: #cba1fa;\n --vvd-color-cta-700: #dcc1fc;\n --vvd-color-cta-800: #ece2fa;\n --vvd-color-cta-900: #f5f0fd;\n --vvd-color-warning-50: #2A1502;\n --vvd-color-warning-100: #522801;\n --vvd-color-warning-200: #803807;\n --vvd-color-warning-300: #A64C03;\n --vvd-color-warning-400: #be5702;\n --vvd-color-warning-500: #e07902;\n --vvd-color-warning-600: #fa9f00;\n --vvd-color-warning-700: #FACC4B;\n --vvd-color-warning-800: #FDEAA0;\n --vvd-color-warning-900: #FDF5D4;\n --vvd-color-information-50: #071939;\n --vvd-color-information-100: #0e306d;\n --vvd-color-information-200: #094a9e;\n --vvd-color-information-300: #0e65c2;\n --vvd-color-information-400: #0276d5;\n --vvd-color-information-500: #2997f0;\n --vvd-color-information-600: #65baff;\n --vvd-color-information-700: #9dd2fe;\n --vvd-color-information-800: #d3e9fc;\n --vvd-color-information-900: #e8f4fb;\n --vvd-color-announcement-50: #32082c;\n --vvd-color-announcement-100: #620256;\n --vvd-color-announcement-200: #8f1669;\n --vvd-color-announcement-300: #bb1e89;\n --vvd-color-announcement-400: #d6219c;\n --vvd-color-announcement-500: #e560bb;\n --vvd-color-announcement-600: #fb8fd8;\n --vvd-color-announcement-700: #f8b9e7;\n --vvd-color-announcement-800: #ffdcf7;\n --vvd-color-announcement-900: #ffedfb;\n --vvd-color-success-50: #0a1e11;\n --vvd-color-success-100: #183a1e;\n --vvd-color-success-200: #155923;\n --vvd-color-success-300: #167629;\n --vvd-color-success-400: #1c8731;\n --vvd-color-success-500: #30a849;\n --vvd-color-success-600: #53ca6a;\n --vvd-color-success-700: #86e090;\n --vvd-color-success-800: #cfeed4;\n --vvd-color-success-900: #e1f8e5;\n --vvd-color-alert-50: #3e0004;\n --vvd-color-alert-100: #6e0000;\n --vvd-color-alert-200: #9f0202;\n --vvd-color-alert-300: #cd0d0d;\n --vvd-color-alert-400: #e61d1d;\n --vvd-color-alert-500: #f75959;\n --vvd-color-alert-600: #fe9696;\n --vvd-color-alert-700: #ffbbbb;\n --vvd-color-alert-800: #fedfdf;\n --vvd-color-alert-900: #ffeef2;\n --vvd-color-neutral-tint-50: #191828;\n --vvd-color-neutral-tint-100: #31304f;\n --vvd-color-neutral-tint-200: #494977;\n --vvd-color-neutral-tint-300: #63628d;\n --vvd-color-neutral-tint-400: #727198;\n --vvd-color-neutral-tint-500: #908fae;\n --vvd-color-neutral-tint-600: #b2b1c7;\n --vvd-color-neutral-tint-700: #cbcbd9;\n --vvd-color-neutral-tint-800: #e5e5ec;\n --vvd-color-neutral-tint-900: #f2f3f9;\n --vvd-color-surface-0dp: #0d0d0d;\n --vvd-color-surface-2dp: linear-gradient(#ffffff0f, #ffffff0f), #0d0d0d;\n --vvd-color-surface-4dp: linear-gradient(#ffffff14, #ffffff14), #0d0d0d;\n --vvd-color-surface-8dp: linear-gradient(#ffffff1a, #ffffff1a), #0d0d0d;\n --vvd-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #0d0d0d;\n --vvd-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #0d0d0d;\n --vvd-color-surface-24dp: linear-gradient(#ffffff29, #ffffff29), #0d0d0d;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #4d4d4d) drop-shadow(0px 1px 0px #4d4d4d) drop-shadow(0px -1px 0px #4d4d4d) drop-shadow(-1px 0px 0px #4d4d4d);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #00000040) drop-shadow(0px 1px 2px #00000040) drop-shadow(0px 2px 1px #00000040);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #00000040) drop-shadow(0px 2px 4px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #00000040) drop-shadow(0px 8px 8px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #00000040) drop-shadow(0px 12px 16px #00000040) drop-shadow(0px 6px 8px #00000040);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #00000040) drop-shadow(0px 16px 24px #00000040) drop-shadow(0px 8px 12px #00000040);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000040) drop-shadow(0px 24px 32px #00000040) drop-shadow(0px 12px 16px #00000040);\n --vvd-neutral-tint-color-surface-0dp: #191828;\n --vvd-neutral-tint-color-surface-2dp: linear-gradient(#ffffff08, #ffffff08), #191828;\n --vvd-neutral-tint-color-surface-4dp: linear-gradient(#ffffff0f, #ffffff0f), #191828;\n --vvd-neutral-tint-color-surface-8dp: linear-gradient(#ffffff14, #ffffff14), #191828;\n --vvd-neutral-tint-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #191828;\n --vvd-neutral-tint-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #191828;\n --vvd-neutral-tint-color-surface-24dp: linear-gradient(#ffffff33, #ffffff33), #191828;\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #f2f3f91a) drop-shadow(0px 1px 0px #f2f3f91a) drop-shadow(0px -1px 0px #f2f3f91a) drop-shadow(-1px 0px 0px #f2f3f91a);\n --vvd-neutral-tint-shadow-surface-2dp: none;\n --vvd-neutral-tint-shadow-surface-4dp: none;\n --vvd-neutral-tint-shadow-surface-8dp: none;\n --vvd-neutral-tint-shadow-surface-12dp: none;\n --vvd-neutral-tint-shadow-surface-16dp: none;\n --vvd-neutral-tint-shadow-surface-24dp: none;\n}\n";
15329
+ const tokensThemeLightCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n@property --vvd-size-density {\n syntax: \"<integer>\";\n inherits: true;\n initial-value: 0;\n}\n@property --vvd-size-font-scale-base {\n syntax: \"<length>\";\n inherits: true;\n initial-value: 16px;\n}\n.vvd-root, ::part(vvd-root) {\n --vvd-color-scheme: light;\n --vvd-color-canvas: #ffffff;\n --vvd-color-canvas-text: #0d0d0d;\n --vvd-color-neutral-50: #F2F2F2;\n --vvd-color-neutral-100: #E6E6E6;\n --vvd-color-neutral-200: #cccccc;\n --vvd-color-neutral-300: #b3b3b3;\n --vvd-color-neutral-400: #929292;\n --vvd-color-neutral-500: #757575;\n --vvd-color-neutral-600: #666666;\n --vvd-color-neutral-700: #4d4d4d;\n --vvd-color-neutral-800: #333333;\n --vvd-color-neutral-900: #1a1a1a;\n --vvd-color-neutral-950: #0d0d0d;\n --vvd-color-cta-50: #f5f0fd;\n --vvd-color-cta-100: #ece2fa;\n --vvd-color-cta-200: #dcc1fc;\n --vvd-color-cta-300: #cba1fa;\n --vvd-color-cta-400: #b27bf2;\n --vvd-color-cta-500: #9941ff;\n --vvd-color-cta-600: #871eff;\n --vvd-color-cta-700: #6405d1;\n --vvd-color-cta-800: #440291;\n --vvd-color-cta-900: #26044d;\n --vvd-color-cta-950: #140623;\n --vvd-color-warning-50: #FDF5D4;\n --vvd-color-warning-100: #FDEAA0;\n --vvd-color-warning-200: #FACC4B;\n --vvd-color-warning-300: #fa9f00;\n --vvd-color-warning-400: #e07902;\n --vvd-color-warning-500: #be5702;\n --vvd-color-warning-600: #A64C03;\n --vvd-color-warning-700: #893000;\n --vvd-color-warning-800: #522801;\n --vvd-color-warning-900: #2A1502;\n --vvd-color-warning-950: #150B01;\n --vvd-color-information-50: #e8f4fb;\n --vvd-color-information-100: #d3e9fc;\n --vvd-color-information-200: #9dd2fe;\n --vvd-color-information-300: #65baff;\n --vvd-color-information-400: #2997f0;\n --vvd-color-information-500: #0276d5;\n --vvd-color-information-600: #0e65c2;\n --vvd-color-information-700: #094a9e;\n --vvd-color-information-800: #0e306d;\n --vvd-color-information-900: #071939;\n --vvd-color-information-950: #040d1d;\n --vvd-color-announcement-50: #ffedfb;\n --vvd-color-announcement-100: #ffdcf7;\n --vvd-color-announcement-200: #f8b9e7;\n --vvd-color-announcement-300: #fb8fd8;\n --vvd-color-announcement-400: #e560bb;\n --vvd-color-announcement-500: #d6219c;\n --vvd-color-announcement-600: #bb1e89;\n --vvd-color-announcement-700: #8f1669;\n --vvd-color-announcement-800: #620256;\n --vvd-color-announcement-900: #32082c;\n --vvd-color-announcement-950: #1d031a;\n --vvd-color-success-50: #e1f8e5;\n --vvd-color-success-100: #cfeed4;\n --vvd-color-success-200: #86e090;\n --vvd-color-success-300: #53ca6a;\n --vvd-color-success-400: #30a849;\n --vvd-color-success-500: #1c8731;\n --vvd-color-success-600: #167629;\n --vvd-color-success-700: #155923;\n --vvd-color-success-800: #183a1e;\n --vvd-color-success-900: #0a1e11;\n --vvd-color-success-950: #060f09;\n --vvd-color-alert-50: #ffeef2;\n --vvd-color-alert-100: #fedfdf;\n --vvd-color-alert-200: #ffbbbb;\n --vvd-color-alert-300: #fe9696;\n --vvd-color-alert-400: #f75959;\n --vvd-color-alert-500: #e61d1d;\n --vvd-color-alert-600: #cd0d0d;\n --vvd-color-alert-700: #9f0202;\n --vvd-color-alert-800: #6e0000;\n --vvd-color-alert-900: #3e0004;\n --vvd-color-alert-950: #250004;\n --vvd-color-neutral-tint-50: #f2f3f9;\n --vvd-color-neutral-tint-100: #e5e5ec;\n --vvd-color-neutral-tint-200: #cbcbd9;\n --vvd-color-neutral-tint-300: #b2b1c7;\n --vvd-color-neutral-tint-400: #908fae;\n --vvd-color-neutral-tint-500: #727198;\n --vvd-color-neutral-tint-600: #63628d;\n --vvd-color-neutral-tint-700: #494977;\n --vvd-color-neutral-tint-800: #31304f;\n --vvd-color-neutral-tint-900: #191828;\n --vvd-color-neutral-tint-950: #0d0c15;\n --vvd-color-surface-0dp: #ffffff;\n --vvd-color-surface-2dp: #ffffff;\n --vvd-color-surface-4dp: #ffffff;\n --vvd-color-surface-8dp: #ffffff;\n --vvd-color-surface-12dp: #ffffff;\n --vvd-color-surface-16dp: #ffffff;\n --vvd-color-surface-24dp: #ffffff;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #cccccc) drop-shadow(0px 1px 0px #cccccc) drop-shadow(0px -1px 0px #cccccc) drop-shadow(-1px 0px 0px #cccccc);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #0000001a) drop-shadow(0px 1px 2px #0000000d) drop-shadow(0px 2px 1px #0000000d);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #0000001a) drop-shadow(0px 2px 4px #0000000d) drop-shadow(0px 4px 2px #0000000d);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #0000001a) drop-shadow(0px 8px 8px #0000000d) drop-shadow(0px 4px 4px #0000000d);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #0000001a) drop-shadow(0px 12px 16px #0000000d) drop-shadow(0px 6px 8px #0000000d);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #0000001a) drop-shadow(0px 16px 24px #0000000d) drop-shadow(0px 8px 12px #0000000d);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000033) drop-shadow(0px 24px 32px #0000000d) drop-shadow(0px 12px 16px #0000000d);\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #31304f1a) drop-shadow(0px 1px 0px #31304f1a) drop-shadow(0px -1px 0px #31304f1a) drop-shadow(-1px 0px 0px #31304f1a);\n --vvd-neutral-tint-shadow-surface-2dp: drop-shadow(0px 1px 4px #26044d1a) drop-shadow(0px 1px 2px #26044d0d) drop-shadow(0px 2px 1px #26044d0d);\n --vvd-neutral-tint-shadow-surface-4dp: drop-shadow(0px 2px 8px #26044d1a) drop-shadow(0px 2px 4px #26044d0d) drop-shadow(0px 4px 2px #26044d0d);\n --vvd-neutral-tint-shadow-surface-8dp: drop-shadow(0px 2px 16px #26044d1a) drop-shadow(0px 8px 8px #26044d0d) drop-shadow(0px 4px 4px #26044d0d);\n --vvd-neutral-tint-shadow-surface-12dp: drop-shadow(0px 4px 24px #26044d1a) drop-shadow(0px 12px 16px #26044d0d) drop-shadow(0px 6px 8px #26044d0d);\n --vvd-neutral-tint-shadow-surface-16dp: drop-shadow(0px 6px 32px #26044d1a) drop-shadow(0px 16px 24px #26044d0d) drop-shadow(0px 8px 12px #26044d0d);\n --vvd-neutral-tint-shadow-surface-24dp: drop-shadow(0px 12px 48px #26044d33) drop-shadow(0px 24px 32px #26044d0d) drop-shadow(0px 12px 16px #26044d0d);\n --vvd-typography-headline: 500 calc(var(--vvd-size-font-scale-base, 16px) * 4.125)/1.3333333333333333 Montserrat;\n --vvd-typography-subtitle: 500 calc(var(--vvd-size-font-scale-base, 16px) * 3.25)/1.3076923076923077 Montserrat;\n --vvd-typography-heading-1: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2.5)/1.3 Montserrat;\n --vvd-typography-heading-2: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2)/1.375 Montserrat;\n --vvd-typography-heading-3: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.625)/1.3846153846153846 Montserrat;\n --vvd-typography-heading-4: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.25)/1.4 Montserrat;\n --vvd-typography-base: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-code: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Roboto Mono;\n --vvd-typography-base-condensed: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-condensed-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-extended: 400 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n --vvd-typography-base-extended-bold: 600 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n}\n\n.vvd-theme-alternate, ::part(vvd-theme-alternate) {\n --vvd-color-scheme: dark;\n --vvd-color-canvas: #000000;\n --vvd-color-canvas-text: #ffffff;\n --vvd-color-neutral-50: #1a1a1a;\n --vvd-color-neutral-100: #333333;\n --vvd-color-neutral-200: #4d4d4d;\n --vvd-color-neutral-300: #666666;\n --vvd-color-neutral-400: #757575;\n --vvd-color-neutral-500: #929292;\n --vvd-color-neutral-600: #b3b3b3;\n --vvd-color-neutral-700: #cccccc;\n --vvd-color-neutral-800: #E6E6E6;\n --vvd-color-neutral-900: #F2F2F2;\n --vvd-color-neutral-950: #ffffff;\n --vvd-color-cta-50: #26044d;\n --vvd-color-cta-100: #440291;\n --vvd-color-cta-200: #6405d1;\n --vvd-color-cta-300: #871eff;\n --vvd-color-cta-400: #9941ff;\n --vvd-color-cta-500: #b27bf2;\n --vvd-color-cta-600: #cba1fa;\n --vvd-color-cta-700: #dcc1fc;\n --vvd-color-cta-800: #ece2fa;\n --vvd-color-cta-900: #f5f0fd;\n --vvd-color-warning-50: #2A1502;\n --vvd-color-warning-100: #522801;\n --vvd-color-warning-200: #803807;\n --vvd-color-warning-300: #A64C03;\n --vvd-color-warning-400: #be5702;\n --vvd-color-warning-500: #e07902;\n --vvd-color-warning-600: #fa9f00;\n --vvd-color-warning-700: #FACC4B;\n --vvd-color-warning-800: #FDEAA0;\n --vvd-color-warning-900: #FDF5D4;\n --vvd-color-information-50: #071939;\n --vvd-color-information-100: #0e306d;\n --vvd-color-information-200: #094a9e;\n --vvd-color-information-300: #0e65c2;\n --vvd-color-information-400: #0276d5;\n --vvd-color-information-500: #2997f0;\n --vvd-color-information-600: #65baff;\n --vvd-color-information-700: #9dd2fe;\n --vvd-color-information-800: #d3e9fc;\n --vvd-color-information-900: #e8f4fb;\n --vvd-color-announcement-50: #32082c;\n --vvd-color-announcement-100: #620256;\n --vvd-color-announcement-200: #8f1669;\n --vvd-color-announcement-300: #bb1e89;\n --vvd-color-announcement-400: #d6219c;\n --vvd-color-announcement-500: #e560bb;\n --vvd-color-announcement-600: #fb8fd8;\n --vvd-color-announcement-700: #f8b9e7;\n --vvd-color-announcement-800: #ffdcf7;\n --vvd-color-announcement-900: #ffedfb;\n --vvd-color-success-50: #0a1e11;\n --vvd-color-success-100: #183a1e;\n --vvd-color-success-200: #155923;\n --vvd-color-success-300: #167629;\n --vvd-color-success-400: #1c8731;\n --vvd-color-success-500: #30a849;\n --vvd-color-success-600: #53ca6a;\n --vvd-color-success-700: #86e090;\n --vvd-color-success-800: #cfeed4;\n --vvd-color-success-900: #e1f8e5;\n --vvd-color-alert-50: #3e0004;\n --vvd-color-alert-100: #6e0000;\n --vvd-color-alert-200: #9f0202;\n --vvd-color-alert-300: #cd0d0d;\n --vvd-color-alert-400: #e61d1d;\n --vvd-color-alert-500: #f75959;\n --vvd-color-alert-600: #fe9696;\n --vvd-color-alert-700: #ffbbbb;\n --vvd-color-alert-800: #fedfdf;\n --vvd-color-alert-900: #ffeef2;\n --vvd-color-neutral-tint-50: #191828;\n --vvd-color-neutral-tint-100: #31304f;\n --vvd-color-neutral-tint-200: #494977;\n --vvd-color-neutral-tint-300: #63628d;\n --vvd-color-neutral-tint-400: #727198;\n --vvd-color-neutral-tint-500: #908fae;\n --vvd-color-neutral-tint-600: #b2b1c7;\n --vvd-color-neutral-tint-700: #cbcbd9;\n --vvd-color-neutral-tint-800: #e5e5ec;\n --vvd-color-neutral-tint-900: #f2f3f9;\n --vvd-color-surface-0dp: #0d0d0d;\n --vvd-color-surface-2dp: linear-gradient(#ffffff0f, #ffffff0f), #0d0d0d;\n --vvd-color-surface-4dp: linear-gradient(#ffffff14, #ffffff14), #0d0d0d;\n --vvd-color-surface-8dp: linear-gradient(#ffffff1a, #ffffff1a), #0d0d0d;\n --vvd-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #0d0d0d;\n --vvd-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #0d0d0d;\n --vvd-color-surface-24dp: linear-gradient(#ffffff29, #ffffff29), #0d0d0d;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #4d4d4d) drop-shadow(0px 1px 0px #4d4d4d) drop-shadow(0px -1px 0px #4d4d4d) drop-shadow(-1px 0px 0px #4d4d4d);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #00000040) drop-shadow(0px 1px 2px #00000040) drop-shadow(0px 2px 1px #00000040);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #00000040) drop-shadow(0px 2px 4px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #00000040) drop-shadow(0px 8px 8px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #00000040) drop-shadow(0px 12px 16px #00000040) drop-shadow(0px 6px 8px #00000040);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #00000040) drop-shadow(0px 16px 24px #00000040) drop-shadow(0px 8px 12px #00000040);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000040) drop-shadow(0px 24px 32px #00000040) drop-shadow(0px 12px 16px #00000040);\n --vvd-neutral-tint-color-surface-0dp: #191828;\n --vvd-neutral-tint-color-surface-2dp: linear-gradient(#ffffff08, #ffffff08), #191828;\n --vvd-neutral-tint-color-surface-4dp: linear-gradient(#ffffff0f, #ffffff0f), #191828;\n --vvd-neutral-tint-color-surface-8dp: linear-gradient(#ffffff14, #ffffff14), #191828;\n --vvd-neutral-tint-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #191828;\n --vvd-neutral-tint-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #191828;\n --vvd-neutral-tint-color-surface-24dp: linear-gradient(#ffffff33, #ffffff33), #191828;\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #f2f3f91a) drop-shadow(0px 1px 0px #f2f3f91a) drop-shadow(0px -1px 0px #f2f3f91a) drop-shadow(-1px 0px 0px #f2f3f91a);\n --vvd-neutral-tint-shadow-surface-2dp: none;\n --vvd-neutral-tint-shadow-surface-4dp: none;\n --vvd-neutral-tint-shadow-surface-8dp: none;\n --vvd-neutral-tint-shadow-surface-12dp: none;\n --vvd-neutral-tint-shadow-surface-16dp: none;\n --vvd-neutral-tint-shadow-surface-24dp: none;\n}\n";
15197
15330
 
15198
- const tokensThemeDarkCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n@property --vvd-size-density {\n syntax: \"<integer>\";\n inherits: true;\n initial-value: 0;\n}\n@property --vvd-size-font-scale-base {\n syntax: \"<length>\";\n inherits: true;\n initial-value: 16px;\n}\n.vvd-root, ::part(vvd-root) {\n --vvd-color-scheme: dark;\n --vvd-color-canvas: #000000;\n --vvd-color-canvas-text: #ffffff;\n --vvd-color-neutral-50: #1a1a1a;\n --vvd-color-neutral-100: #333333;\n --vvd-color-neutral-200: #4d4d4d;\n --vvd-color-neutral-300: #666666;\n --vvd-color-neutral-400: #757575;\n --vvd-color-neutral-500: #929292;\n --vvd-color-neutral-600: #b3b3b3;\n --vvd-color-neutral-700: #cccccc;\n --vvd-color-neutral-800: #E6E6E6;\n --vvd-color-neutral-900: #F2F2F2;\n --vvd-color-neutral-950: #ffffff;\n --vvd-color-cta-50: #26044d;\n --vvd-color-cta-100: #440291;\n --vvd-color-cta-200: #6405d1;\n --vvd-color-cta-300: #871eff;\n --vvd-color-cta-400: #9941ff;\n --vvd-color-cta-500: #b27bf2;\n --vvd-color-cta-600: #cba1fa;\n --vvd-color-cta-700: #dcc1fc;\n --vvd-color-cta-800: #ece2fa;\n --vvd-color-cta-900: #f5f0fd;\n --vvd-color-warning-50: #2A1502;\n --vvd-color-warning-100: #522801;\n --vvd-color-warning-200: #803807;\n --vvd-color-warning-300: #A64C03;\n --vvd-color-warning-400: #be5702;\n --vvd-color-warning-500: #e07902;\n --vvd-color-warning-600: #fa9f00;\n --vvd-color-warning-700: #FACC4B;\n --vvd-color-warning-800: #FDEAA0;\n --vvd-color-warning-900: #FDF5D4;\n --vvd-color-information-50: #071939;\n --vvd-color-information-100: #0e306d;\n --vvd-color-information-200: #094a9e;\n --vvd-color-information-300: #0e65c2;\n --vvd-color-information-400: #0276d5;\n --vvd-color-information-500: #2997f0;\n --vvd-color-information-600: #65baff;\n --vvd-color-information-700: #9dd2fe;\n --vvd-color-information-800: #d3e9fc;\n --vvd-color-information-900: #e8f4fb;\n --vvd-color-announcement-50: #32082c;\n --vvd-color-announcement-100: #620256;\n --vvd-color-announcement-200: #8f1669;\n --vvd-color-announcement-300: #bb1e89;\n --vvd-color-announcement-400: #d6219c;\n --vvd-color-announcement-500: #e560bb;\n --vvd-color-announcement-600: #fb8fd8;\n --vvd-color-announcement-700: #f8b9e7;\n --vvd-color-announcement-800: #ffdcf7;\n --vvd-color-announcement-900: #ffedfb;\n --vvd-color-success-50: #0a1e11;\n --vvd-color-success-100: #183a1e;\n --vvd-color-success-200: #155923;\n --vvd-color-success-300: #167629;\n --vvd-color-success-400: #1c8731;\n --vvd-color-success-500: #30a849;\n --vvd-color-success-600: #53ca6a;\n --vvd-color-success-700: #86e090;\n --vvd-color-success-800: #cfeed4;\n --vvd-color-success-900: #e1f8e5;\n --vvd-color-alert-50: #3e0004;\n --vvd-color-alert-100: #6e0000;\n --vvd-color-alert-200: #9f0202;\n --vvd-color-alert-300: #cd0d0d;\n --vvd-color-alert-400: #e61d1d;\n --vvd-color-alert-500: #f75959;\n --vvd-color-alert-600: #fe9696;\n --vvd-color-alert-700: #ffbbbb;\n --vvd-color-alert-800: #fedfdf;\n --vvd-color-alert-900: #ffeef2;\n --vvd-color-neutral-tint-50: #191828;\n --vvd-color-neutral-tint-100: #31304f;\n --vvd-color-neutral-tint-200: #494977;\n --vvd-color-neutral-tint-300: #63628d;\n --vvd-color-neutral-tint-400: #727198;\n --vvd-color-neutral-tint-500: #908fae;\n --vvd-color-neutral-tint-600: #b2b1c7;\n --vvd-color-neutral-tint-700: #cbcbd9;\n --vvd-color-neutral-tint-800: #e5e5ec;\n --vvd-color-neutral-tint-900: #f2f3f9;\n --vvd-color-surface-0dp: #0d0d0d;\n --vvd-color-surface-2dp: linear-gradient(#ffffff0f, #ffffff0f), #0d0d0d;\n --vvd-color-surface-4dp: linear-gradient(#ffffff14, #ffffff14), #0d0d0d;\n --vvd-color-surface-8dp: linear-gradient(#ffffff1a, #ffffff1a), #0d0d0d;\n --vvd-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #0d0d0d;\n --vvd-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #0d0d0d;\n --vvd-color-surface-24dp: linear-gradient(#ffffff29, #ffffff29), #0d0d0d;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #4d4d4d) drop-shadow(0px 1px 0px #4d4d4d) drop-shadow(0px -1px 0px #4d4d4d) drop-shadow(-1px 0px 0px #4d4d4d);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #00000040) drop-shadow(0px 1px 2px #00000040) drop-shadow(0px 2px 1px #00000040);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #00000040) drop-shadow(0px 2px 4px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #00000040) drop-shadow(0px 8px 8px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #00000040) drop-shadow(0px 12px 16px #00000040) drop-shadow(0px 6px 8px #00000040);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #00000040) drop-shadow(0px 16px 24px #00000040) drop-shadow(0px 8px 12px #00000040);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000040) drop-shadow(0px 24px 32px #00000040) drop-shadow(0px 12px 16px #00000040);\n --vvd-neutral-tint-color-surface-0dp: #191828;\n --vvd-neutral-tint-color-surface-2dp: linear-gradient(#ffffff08, #ffffff08), #191828;\n --vvd-neutral-tint-color-surface-4dp: linear-gradient(#ffffff0f, #ffffff0f), #191828;\n --vvd-neutral-tint-color-surface-8dp: linear-gradient(#ffffff14, #ffffff14), #191828;\n --vvd-neutral-tint-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #191828;\n --vvd-neutral-tint-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #191828;\n --vvd-neutral-tint-color-surface-24dp: linear-gradient(#ffffff33, #ffffff33), #191828;\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #f2f3f91a) drop-shadow(0px 1px 0px #f2f3f91a) drop-shadow(0px -1px 0px #f2f3f91a) drop-shadow(-1px 0px 0px #f2f3f91a);\n --vvd-neutral-tint-shadow-surface-2dp: none;\n --vvd-neutral-tint-shadow-surface-4dp: none;\n --vvd-neutral-tint-shadow-surface-8dp: none;\n --vvd-neutral-tint-shadow-surface-12dp: none;\n --vvd-neutral-tint-shadow-surface-16dp: none;\n --vvd-neutral-tint-shadow-surface-24dp: none;\n --vvd-typography-headline: 500 calc(var(--vvd-size-font-scale-base, 16px) * 4.125)/1.3333333333333333 Montserrat;\n --vvd-typography-subtitle: 500 calc(var(--vvd-size-font-scale-base, 16px) * 3.25)/1.3076923076923077 Montserrat;\n --vvd-typography-heading-1: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2.5)/1.3 Montserrat;\n --vvd-typography-heading-2: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2)/1.375 Montserrat;\n --vvd-typography-heading-3: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.625)/1.3846153846153846 Montserrat;\n --vvd-typography-heading-4: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.25)/1.4 Montserrat;\n --vvd-typography-base: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-code: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Roboto Mono;\n --vvd-typography-base-condensed: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-condensed-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-extended: 400 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n --vvd-typography-base-extended-bold: 600 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n}\n\n.vvd-theme-alternate, ::part(vvd-theme-alternate) {\n --vvd-color-scheme: light;\n --vvd-color-canvas: #ffffff;\n --vvd-color-canvas-text: #0d0d0d;\n --vvd-color-neutral-50: #F2F2F2;\n --vvd-color-neutral-100: #E6E6E6;\n --vvd-color-neutral-200: #cccccc;\n --vvd-color-neutral-300: #b3b3b3;\n --vvd-color-neutral-400: #929292;\n --vvd-color-neutral-500: #757575;\n --vvd-color-neutral-600: #666666;\n --vvd-color-neutral-700: #4d4d4d;\n --vvd-color-neutral-800: #333333;\n --vvd-color-neutral-900: #1a1a1a;\n --vvd-color-neutral-950: #0d0d0d;\n --vvd-color-cta-50: #f5f0fd;\n --vvd-color-cta-100: #ece2fa;\n --vvd-color-cta-200: #dcc1fc;\n --vvd-color-cta-300: #cba1fa;\n --vvd-color-cta-400: #b27bf2;\n --vvd-color-cta-500: #9941ff;\n --vvd-color-cta-600: #871eff;\n --vvd-color-cta-700: #6405d1;\n --vvd-color-cta-800: #440291;\n --vvd-color-cta-900: #26044d;\n --vvd-color-cta-950: #140623;\n --vvd-color-warning-50: #FDF5D4;\n --vvd-color-warning-100: #FDEAA0;\n --vvd-color-warning-200: #FACC4B;\n --vvd-color-warning-300: #fa9f00;\n --vvd-color-warning-400: #e07902;\n --vvd-color-warning-500: #be5702;\n --vvd-color-warning-600: #A64C03;\n --vvd-color-warning-700: #893000;\n --vvd-color-warning-800: #522801;\n --vvd-color-warning-900: #2A1502;\n --vvd-color-warning-950: #150B01;\n --vvd-color-information-50: #e8f4fb;\n --vvd-color-information-100: #d3e9fc;\n --vvd-color-information-200: #9dd2fe;\n --vvd-color-information-300: #65baff;\n --vvd-color-information-400: #2997f0;\n --vvd-color-information-500: #0276d5;\n --vvd-color-information-600: #0e65c2;\n --vvd-color-information-700: #094a9e;\n --vvd-color-information-800: #0e306d;\n --vvd-color-information-900: #071939;\n --vvd-color-information-950: #040d1d;\n --vvd-color-announcement-50: #ffedfb;\n --vvd-color-announcement-100: #ffdcf7;\n --vvd-color-announcement-200: #f8b9e7;\n --vvd-color-announcement-300: #fb8fd8;\n --vvd-color-announcement-400: #e560bb;\n --vvd-color-announcement-500: #d6219c;\n --vvd-color-announcement-600: #bb1e89;\n --vvd-color-announcement-700: #8f1669;\n --vvd-color-announcement-800: #620256;\n --vvd-color-announcement-900: #32082c;\n --vvd-color-announcement-950: #1d031a;\n --vvd-color-success-50: #e1f8e5;\n --vvd-color-success-100: #cfeed4;\n --vvd-color-success-200: #86e090;\n --vvd-color-success-300: #53ca6a;\n --vvd-color-success-400: #30a849;\n --vvd-color-success-500: #1c8731;\n --vvd-color-success-600: #167629;\n --vvd-color-success-700: #155923;\n --vvd-color-success-800: #183a1e;\n --vvd-color-success-900: #0a1e11;\n --vvd-color-success-950: #060f09;\n --vvd-color-alert-50: #ffeef2;\n --vvd-color-alert-100: #fedfdf;\n --vvd-color-alert-200: #ffbbbb;\n --vvd-color-alert-300: #fe9696;\n --vvd-color-alert-400: #f75959;\n --vvd-color-alert-500: #e61d1d;\n --vvd-color-alert-600: #cd0d0d;\n --vvd-color-alert-700: #9f0202;\n --vvd-color-alert-800: #6e0000;\n --vvd-color-alert-900: #3e0004;\n --vvd-color-alert-950: #250004;\n --vvd-color-neutral-tint-50: #f2f3f9;\n --vvd-color-neutral-tint-100: #e5e5ec;\n --vvd-color-neutral-tint-200: #cbcbd9;\n --vvd-color-neutral-tint-300: #b2b1c7;\n --vvd-color-neutral-tint-400: #908fae;\n --vvd-color-neutral-tint-500: #727198;\n --vvd-color-neutral-tint-600: #63628d;\n --vvd-color-neutral-tint-700: #494977;\n --vvd-color-neutral-tint-800: #31304f;\n --vvd-color-neutral-tint-900: #191828;\n --vvd-color-neutral-tint-950: #0d0c15;\n --vvd-color-surface-0dp: #ffffff;\n --vvd-color-surface-2dp: #ffffff;\n --vvd-color-surface-4dp: #ffffff;\n --vvd-color-surface-8dp: #ffffff;\n --vvd-color-surface-12dp: #ffffff;\n --vvd-color-surface-16dp: #ffffff;\n --vvd-color-surface-24dp: #ffffff;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #cccccc) drop-shadow(0px 1px 0px #cccccc) drop-shadow(0px -1px 0px #cccccc) drop-shadow(-1px 0px 0px #cccccc);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #0000001a) drop-shadow(0px 1px 2px #0000000d) drop-shadow(0px 2px 1px #0000000d);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #0000001a) drop-shadow(0px 2px 4px #0000000d) drop-shadow(0px 4px 2px #0000000d);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #0000001a) drop-shadow(0px 8px 8px #0000000d) drop-shadow(0px 4px 4px #0000000d);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #0000001a) drop-shadow(0px 12px 16px #0000000d) drop-shadow(0px 6px 8px #0000000d);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #0000001a) drop-shadow(0px 16px 24px #0000000d) drop-shadow(0px 8px 12px #0000000d);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000033) drop-shadow(0px 24px 32px #0000000d) drop-shadow(0px 12px 16px #0000000d);\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #31304f1a) drop-shadow(0px 1px 0px #31304f1a) drop-shadow(0px -1px 0px #31304f1a) drop-shadow(-1px 0px 0px #31304f1a);\n --vvd-neutral-tint-shadow-surface-2dp: drop-shadow(0px 1px 4px #26044d1a) drop-shadow(0px 1px 2px #26044d0d) drop-shadow(0px 2px 1px #26044d0d);\n --vvd-neutral-tint-shadow-surface-4dp: drop-shadow(0px 2px 8px #26044d1a) drop-shadow(0px 2px 4px #26044d0d) drop-shadow(0px 4px 2px #26044d0d);\n --vvd-neutral-tint-shadow-surface-8dp: drop-shadow(0px 2px 16px #26044d1a) drop-shadow(0px 8px 8px #26044d0d) drop-shadow(0px 4px 4px #26044d0d);\n --vvd-neutral-tint-shadow-surface-12dp: drop-shadow(0px 4px 24px #26044d1a) drop-shadow(0px 12px 16px #26044d0d) drop-shadow(0px 6px 8px #26044d0d);\n --vvd-neutral-tint-shadow-surface-16dp: drop-shadow(0px 6px 32px #26044d1a) drop-shadow(0px 16px 24px #26044d0d) drop-shadow(0px 8px 12px #26044d0d);\n --vvd-neutral-tint-shadow-surface-24dp: drop-shadow(0px 12px 48px #26044d33) drop-shadow(0px 24px 32px #26044d0d) drop-shadow(0px 12px 16px #26044d0d);\n}\n";
15331
+ const tokensThemeDarkCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n@property --vvd-size-density {\n syntax: \"<integer>\";\n inherits: true;\n initial-value: 0;\n}\n@property --vvd-size-font-scale-base {\n syntax: \"<length>\";\n inherits: true;\n initial-value: 16px;\n}\n.vvd-root, ::part(vvd-root) {\n --vvd-color-scheme: dark;\n --vvd-color-canvas: #000000;\n --vvd-color-canvas-text: #ffffff;\n --vvd-color-neutral-50: #1a1a1a;\n --vvd-color-neutral-100: #333333;\n --vvd-color-neutral-200: #4d4d4d;\n --vvd-color-neutral-300: #666666;\n --vvd-color-neutral-400: #757575;\n --vvd-color-neutral-500: #929292;\n --vvd-color-neutral-600: #b3b3b3;\n --vvd-color-neutral-700: #cccccc;\n --vvd-color-neutral-800: #E6E6E6;\n --vvd-color-neutral-900: #F2F2F2;\n --vvd-color-neutral-950: #ffffff;\n --vvd-color-cta-50: #26044d;\n --vvd-color-cta-100: #440291;\n --vvd-color-cta-200: #6405d1;\n --vvd-color-cta-300: #871eff;\n --vvd-color-cta-400: #9941ff;\n --vvd-color-cta-500: #b27bf2;\n --vvd-color-cta-600: #cba1fa;\n --vvd-color-cta-700: #dcc1fc;\n --vvd-color-cta-800: #ece2fa;\n --vvd-color-cta-900: #f5f0fd;\n --vvd-color-warning-50: #2A1502;\n --vvd-color-warning-100: #522801;\n --vvd-color-warning-200: #803807;\n --vvd-color-warning-300: #A64C03;\n --vvd-color-warning-400: #be5702;\n --vvd-color-warning-500: #e07902;\n --vvd-color-warning-600: #fa9f00;\n --vvd-color-warning-700: #FACC4B;\n --vvd-color-warning-800: #FDEAA0;\n --vvd-color-warning-900: #FDF5D4;\n --vvd-color-information-50: #071939;\n --vvd-color-information-100: #0e306d;\n --vvd-color-information-200: #094a9e;\n --vvd-color-information-300: #0e65c2;\n --vvd-color-information-400: #0276d5;\n --vvd-color-information-500: #2997f0;\n --vvd-color-information-600: #65baff;\n --vvd-color-information-700: #9dd2fe;\n --vvd-color-information-800: #d3e9fc;\n --vvd-color-information-900: #e8f4fb;\n --vvd-color-announcement-50: #32082c;\n --vvd-color-announcement-100: #620256;\n --vvd-color-announcement-200: #8f1669;\n --vvd-color-announcement-300: #bb1e89;\n --vvd-color-announcement-400: #d6219c;\n --vvd-color-announcement-500: #e560bb;\n --vvd-color-announcement-600: #fb8fd8;\n --vvd-color-announcement-700: #f8b9e7;\n --vvd-color-announcement-800: #ffdcf7;\n --vvd-color-announcement-900: #ffedfb;\n --vvd-color-success-50: #0a1e11;\n --vvd-color-success-100: #183a1e;\n --vvd-color-success-200: #155923;\n --vvd-color-success-300: #167629;\n --vvd-color-success-400: #1c8731;\n --vvd-color-success-500: #30a849;\n --vvd-color-success-600: #53ca6a;\n --vvd-color-success-700: #86e090;\n --vvd-color-success-800: #cfeed4;\n --vvd-color-success-900: #e1f8e5;\n --vvd-color-alert-50: #3e0004;\n --vvd-color-alert-100: #6e0000;\n --vvd-color-alert-200: #9f0202;\n --vvd-color-alert-300: #cd0d0d;\n --vvd-color-alert-400: #e61d1d;\n --vvd-color-alert-500: #f75959;\n --vvd-color-alert-600: #fe9696;\n --vvd-color-alert-700: #ffbbbb;\n --vvd-color-alert-800: #fedfdf;\n --vvd-color-alert-900: #ffeef2;\n --vvd-color-neutral-tint-50: #191828;\n --vvd-color-neutral-tint-100: #31304f;\n --vvd-color-neutral-tint-200: #494977;\n --vvd-color-neutral-tint-300: #63628d;\n --vvd-color-neutral-tint-400: #727198;\n --vvd-color-neutral-tint-500: #908fae;\n --vvd-color-neutral-tint-600: #b2b1c7;\n --vvd-color-neutral-tint-700: #cbcbd9;\n --vvd-color-neutral-tint-800: #e5e5ec;\n --vvd-color-neutral-tint-900: #f2f3f9;\n --vvd-color-surface-0dp: #0d0d0d;\n --vvd-color-surface-2dp: linear-gradient(#ffffff0f, #ffffff0f), #0d0d0d;\n --vvd-color-surface-4dp: linear-gradient(#ffffff14, #ffffff14), #0d0d0d;\n --vvd-color-surface-8dp: linear-gradient(#ffffff1a, #ffffff1a), #0d0d0d;\n --vvd-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #0d0d0d;\n --vvd-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #0d0d0d;\n --vvd-color-surface-24dp: linear-gradient(#ffffff29, #ffffff29), #0d0d0d;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #4d4d4d) drop-shadow(0px 1px 0px #4d4d4d) drop-shadow(0px -1px 0px #4d4d4d) drop-shadow(-1px 0px 0px #4d4d4d);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #00000040) drop-shadow(0px 1px 2px #00000040) drop-shadow(0px 2px 1px #00000040);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #00000040) drop-shadow(0px 2px 4px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #00000040) drop-shadow(0px 8px 8px #00000040) drop-shadow(0px 4px 4px #00000040);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #00000040) drop-shadow(0px 12px 16px #00000040) drop-shadow(0px 6px 8px #00000040);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #00000040) drop-shadow(0px 16px 24px #00000040) drop-shadow(0px 8px 12px #00000040);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000040) drop-shadow(0px 24px 32px #00000040) drop-shadow(0px 12px 16px #00000040);\n --vvd-neutral-tint-color-surface-0dp: #191828;\n --vvd-neutral-tint-color-surface-2dp: linear-gradient(#ffffff08, #ffffff08), #191828;\n --vvd-neutral-tint-color-surface-4dp: linear-gradient(#ffffff0f, #ffffff0f), #191828;\n --vvd-neutral-tint-color-surface-8dp: linear-gradient(#ffffff14, #ffffff14), #191828;\n --vvd-neutral-tint-color-surface-12dp: linear-gradient(#ffffff1f, #ffffff1f), #191828;\n --vvd-neutral-tint-color-surface-16dp: linear-gradient(#ffffff24, #ffffff24), #191828;\n --vvd-neutral-tint-color-surface-24dp: linear-gradient(#ffffff33, #ffffff33), #191828;\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #f2f3f91a) drop-shadow(0px 1px 0px #f2f3f91a) drop-shadow(0px -1px 0px #f2f3f91a) drop-shadow(-1px 0px 0px #f2f3f91a);\n --vvd-neutral-tint-shadow-surface-2dp: none;\n --vvd-neutral-tint-shadow-surface-4dp: none;\n --vvd-neutral-tint-shadow-surface-8dp: none;\n --vvd-neutral-tint-shadow-surface-12dp: none;\n --vvd-neutral-tint-shadow-surface-16dp: none;\n --vvd-neutral-tint-shadow-surface-24dp: none;\n --vvd-typography-headline: 500 calc(var(--vvd-size-font-scale-base, 16px) * 4.125)/1.3333333333333333 Montserrat;\n --vvd-typography-subtitle: 500 calc(var(--vvd-size-font-scale-base, 16px) * 3.25)/1.3076923076923077 Montserrat;\n --vvd-typography-heading-1: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2.5)/1.3 Montserrat;\n --vvd-typography-heading-2: 500 calc(var(--vvd-size-font-scale-base, 16px) * 2)/1.375 Montserrat;\n --vvd-typography-heading-3: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.625)/1.3846153846153846 Montserrat;\n --vvd-typography-heading-4: 500 calc(var(--vvd-size-font-scale-base, 16px) * 1.25)/1.4 Montserrat;\n --vvd-typography-base: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Montserrat;\n --vvd-typography-base-code: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.875)/1.4285714285714286 Roboto Mono;\n --vvd-typography-base-condensed: 400 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-condensed-bold: 600 calc(var(--vvd-size-font-scale-base, 16px) * 0.75)/1.3333333333333333 Montserrat;\n --vvd-typography-base-extended: 400 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n --vvd-typography-base-extended-bold: 600 calc(var(--vvd-size-font-scale-base, 16px))/1.5 Montserrat;\n}\n\n.vvd-theme-alternate, ::part(vvd-theme-alternate) {\n --vvd-color-scheme: light;\n --vvd-color-canvas: #ffffff;\n --vvd-color-canvas-text: #0d0d0d;\n --vvd-color-neutral-50: #F2F2F2;\n --vvd-color-neutral-100: #E6E6E6;\n --vvd-color-neutral-200: #cccccc;\n --vvd-color-neutral-300: #b3b3b3;\n --vvd-color-neutral-400: #929292;\n --vvd-color-neutral-500: #757575;\n --vvd-color-neutral-600: #666666;\n --vvd-color-neutral-700: #4d4d4d;\n --vvd-color-neutral-800: #333333;\n --vvd-color-neutral-900: #1a1a1a;\n --vvd-color-neutral-950: #0d0d0d;\n --vvd-color-cta-50: #f5f0fd;\n --vvd-color-cta-100: #ece2fa;\n --vvd-color-cta-200: #dcc1fc;\n --vvd-color-cta-300: #cba1fa;\n --vvd-color-cta-400: #b27bf2;\n --vvd-color-cta-500: #9941ff;\n --vvd-color-cta-600: #871eff;\n --vvd-color-cta-700: #6405d1;\n --vvd-color-cta-800: #440291;\n --vvd-color-cta-900: #26044d;\n --vvd-color-cta-950: #140623;\n --vvd-color-warning-50: #FDF5D4;\n --vvd-color-warning-100: #FDEAA0;\n --vvd-color-warning-200: #FACC4B;\n --vvd-color-warning-300: #fa9f00;\n --vvd-color-warning-400: #e07902;\n --vvd-color-warning-500: #be5702;\n --vvd-color-warning-600: #A64C03;\n --vvd-color-warning-700: #893000;\n --vvd-color-warning-800: #522801;\n --vvd-color-warning-900: #2A1502;\n --vvd-color-warning-950: #150B01;\n --vvd-color-information-50: #e8f4fb;\n --vvd-color-information-100: #d3e9fc;\n --vvd-color-information-200: #9dd2fe;\n --vvd-color-information-300: #65baff;\n --vvd-color-information-400: #2997f0;\n --vvd-color-information-500: #0276d5;\n --vvd-color-information-600: #0e65c2;\n --vvd-color-information-700: #094a9e;\n --vvd-color-information-800: #0e306d;\n --vvd-color-information-900: #071939;\n --vvd-color-information-950: #040d1d;\n --vvd-color-announcement-50: #ffedfb;\n --vvd-color-announcement-100: #ffdcf7;\n --vvd-color-announcement-200: #f8b9e7;\n --vvd-color-announcement-300: #fb8fd8;\n --vvd-color-announcement-400: #e560bb;\n --vvd-color-announcement-500: #d6219c;\n --vvd-color-announcement-600: #bb1e89;\n --vvd-color-announcement-700: #8f1669;\n --vvd-color-announcement-800: #620256;\n --vvd-color-announcement-900: #32082c;\n --vvd-color-announcement-950: #1d031a;\n --vvd-color-success-50: #e1f8e5;\n --vvd-color-success-100: #cfeed4;\n --vvd-color-success-200: #86e090;\n --vvd-color-success-300: #53ca6a;\n --vvd-color-success-400: #30a849;\n --vvd-color-success-500: #1c8731;\n --vvd-color-success-600: #167629;\n --vvd-color-success-700: #155923;\n --vvd-color-success-800: #183a1e;\n --vvd-color-success-900: #0a1e11;\n --vvd-color-success-950: #060f09;\n --vvd-color-alert-50: #ffeef2;\n --vvd-color-alert-100: #fedfdf;\n --vvd-color-alert-200: #ffbbbb;\n --vvd-color-alert-300: #fe9696;\n --vvd-color-alert-400: #f75959;\n --vvd-color-alert-500: #e61d1d;\n --vvd-color-alert-600: #cd0d0d;\n --vvd-color-alert-700: #9f0202;\n --vvd-color-alert-800: #6e0000;\n --vvd-color-alert-900: #3e0004;\n --vvd-color-alert-950: #250004;\n --vvd-color-neutral-tint-50: #f2f3f9;\n --vvd-color-neutral-tint-100: #e5e5ec;\n --vvd-color-neutral-tint-200: #cbcbd9;\n --vvd-color-neutral-tint-300: #b2b1c7;\n --vvd-color-neutral-tint-400: #908fae;\n --vvd-color-neutral-tint-500: #727198;\n --vvd-color-neutral-tint-600: #63628d;\n --vvd-color-neutral-tint-700: #494977;\n --vvd-color-neutral-tint-800: #31304f;\n --vvd-color-neutral-tint-900: #191828;\n --vvd-color-neutral-tint-950: #0d0c15;\n --vvd-color-surface-0dp: #ffffff;\n --vvd-color-surface-2dp: #ffffff;\n --vvd-color-surface-4dp: #ffffff;\n --vvd-color-surface-8dp: #ffffff;\n --vvd-color-surface-12dp: #ffffff;\n --vvd-color-surface-16dp: #ffffff;\n --vvd-color-surface-24dp: #ffffff;\n --vvd-shadow-surface-0dp: drop-shadow(1px 0px 0px #cccccc) drop-shadow(0px 1px 0px #cccccc) drop-shadow(0px -1px 0px #cccccc) drop-shadow(-1px 0px 0px #cccccc);\n --vvd-shadow-surface-2dp: drop-shadow(0px 1px 4px #0000001a) drop-shadow(0px 1px 2px #0000000d) drop-shadow(0px 2px 1px #0000000d);\n --vvd-shadow-surface-4dp: drop-shadow(0px 2px 8px #0000001a) drop-shadow(0px 2px 4px #0000000d) drop-shadow(0px 4px 2px #0000000d);\n --vvd-shadow-surface-8dp: drop-shadow(0px 2px 16px #0000001a) drop-shadow(0px 8px 8px #0000000d) drop-shadow(0px 4px 4px #0000000d);\n --vvd-shadow-surface-12dp: drop-shadow(0px 4px 24px #0000001a) drop-shadow(0px 12px 16px #0000000d) drop-shadow(0px 6px 8px #0000000d);\n --vvd-shadow-surface-16dp: drop-shadow(0px 6px 32px #0000001a) drop-shadow(0px 16px 24px #0000000d) drop-shadow(0px 8px 12px #0000000d);\n --vvd-shadow-surface-24dp: drop-shadow(0px 12px 48px #00000033) drop-shadow(0px 24px 32px #0000000d) drop-shadow(0px 12px 16px #0000000d);\n --vvd-neutral-tint-shadow-surface-0dp: drop-shadow(1px 0px 0px #31304f1a) drop-shadow(0px 1px 0px #31304f1a) drop-shadow(0px -1px 0px #31304f1a) drop-shadow(-1px 0px 0px #31304f1a);\n --vvd-neutral-tint-shadow-surface-2dp: drop-shadow(0px 1px 4px #26044d1a) drop-shadow(0px 1px 2px #26044d0d) drop-shadow(0px 2px 1px #26044d0d);\n --vvd-neutral-tint-shadow-surface-4dp: drop-shadow(0px 2px 8px #26044d1a) drop-shadow(0px 2px 4px #26044d0d) drop-shadow(0px 4px 2px #26044d0d);\n --vvd-neutral-tint-shadow-surface-8dp: drop-shadow(0px 2px 16px #26044d1a) drop-shadow(0px 8px 8px #26044d0d) drop-shadow(0px 4px 4px #26044d0d);\n --vvd-neutral-tint-shadow-surface-12dp: drop-shadow(0px 4px 24px #26044d1a) drop-shadow(0px 12px 16px #26044d0d) drop-shadow(0px 6px 8px #26044d0d);\n --vvd-neutral-tint-shadow-surface-16dp: drop-shadow(0px 6px 32px #26044d1a) drop-shadow(0px 16px 24px #26044d0d) drop-shadow(0px 8px 12px #26044d0d);\n --vvd-neutral-tint-shadow-surface-24dp: drop-shadow(0px 12px 48px #26044d33) drop-shadow(0px 24px 32px #26044d0d) drop-shadow(0px 12px 16px #26044d0d);\n}\n";
15199
15332
 
15200
15333
  const fontsSpeziaVariableCss = "@font-face {\n font-display: block;\n font-family: SpeziaCompleteVariableUpright;\n font-stretch: 50% 200%;\n font-weight: 1 1000;\n src: url(\"https://fonts.resources.vonage.com/fonts/v2/SpeziaCompleteVariableUprightWeb.woff2\") format(\"woff2\");\n}\n@font-face {\n font-display: block;\n font-family: SpeziaMonoCompleteVariable;\n font-stretch: 50% 200%;\n font-weight: 1 1000;\n src: url(\"https://fonts.resources.vonage.com/fonts/v2/SpeziaMonoCompleteVariableWeb.woff2\") format(\"woff2\");\n}\n.vvd-root {\n --vvd-typography-headline: 500 condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 4.125) / 1.3333333333333333\n \tspeziacompletevariableupright;\n --vvd-typography-subtitle: 500 condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 3.25) / 1.3076923076923077\n \tspeziacompletevariableupright;\n --vvd-typography-heading-1: 500 condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 2.5) / 1.3\n \tspeziacompletevariableupright;\n --vvd-typography-heading-2: 500 condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 2) / 1.375\n \tspeziacompletevariableupright;\n --vvd-typography-heading-3: 500 condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 1.625) / 1.3846153846153846\n \tspeziacompletevariableupright;\n --vvd-typography-heading-4: 500 condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 1.25) / 1.4\n \tspeziacompletevariableupright;\n --vvd-typography-base: 400 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 0.875) / 1.4285714285714286\n \tspeziacompletevariableupright;\n --vvd-typography-base-bold: 600 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 0.875) / 1.4285714285714286\n \tspeziacompletevariableupright;\n --vvd-typography-base-code: 400 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 0.875) / 1.4285714285714286\n \tspeziamonocompletevariable;\n --vvd-typography-base-condensed: 400 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 0.75) / 1.3333333333333333\n \tspeziacompletevariableupright;\n --vvd-typography-base-condensed-bold: 600 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px) * 0.75) / 1.3333333333333333\n \tspeziacompletevariableupright;\n --vvd-typography-base-extended: 400 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px)) / 1.5\n \tspeziacompletevariableupright;\n --vvd-typography-base-extended-bold: 600 ultra-condensed\n \tcalc(var(--vvd-size-font-scale-base, 16px)) / 1.5\n \tspeziacompletevariableupright;\n}\n";
15201
15334
 
15202
- const tokensVivid2CompatCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n.vvd-root, ::part(vvd-root),\n.vvd-theme-alternate, ::part(vvd-theme-alternate) {\n --_vvd3--vvd-color-neutral-50: var(\n \t--vvd-color-neutral-50\n );\n}\n\n.vvd-component:not(.vvd-theme-alternate) {\n --vvd-color-neutral-50: var(--_vvd3--vvd-color-neutral-50);\n}\n";
15335
+ const tokensVivid2CompatCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n.vvd-root, ::part(vvd-root),\n.vvd-theme-alternate, ::part(vvd-theme-alternate) {\n --_vvd3--vvd-color-neutral-50: var(\n \t--vvd-color-neutral-50\n );\n}\n\n.vvd-component:not(.vvd-theme-alternate) {\n --vvd-color-neutral-50: var(--_vvd3--vvd-color-neutral-50);\n}\n";
15203
15336
 
15204
- const coreThemeCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n.vvd-root {\n background-color: var(--vvd-color-canvas);\n color: var(--vvd-color-canvas-text);\n color-scheme: var(--vvd-color-scheme);\n}\n\n.vvd-scrollbar {\n --scrollbar-track-color: transparent;\n --scrollbar-thumb-color: color-mix(in srgb, var(--vvd-color-neutral-950), transparent 70%);\n}\n.vvd-scrollbar {\n scrollbar-color: var(--scrollbar-thumb-color) var(--scrollbar-track-color);\n scrollbar-width: thin;\n}\n.vvd-scrollbar ::-webkit-scrollbar {\n width: 4px;\n}\n.vvd-scrollbar ::-webkit-scrollbar-track {\n background: var(--scrollbar-track-color);\n}\n.vvd-scrollbar ::-webkit-scrollbar-thumb {\n border: 0;\n border-radius: 4px;\n background-color: var(--scrollbar-fallback-track-color, var(--scrollbar-thumb-color));\n}\n\n.vvd-neutral-tint-elevation {\n --_vvd-tinted-color-surface-0dp: var(--vvd-neutral-tint-color-surface-0dp);\n --_vvd-tinted-color-surface-2dp: var(--vvd-neutral-tint-color-surface-2dp);\n --_vvd-tinted-color-surface-4dp: var(--vvd-neutral-tint-color-surface-4dp);\n --_vvd-tinted-color-surface-8dp: var(--vvd-neutral-tint-color-surface-8dp);\n --_vvd-tinted-color-surface-12dp: var(--vvd-neutral-tint-color-surface-12dp);\n --_vvd-tinted-color-surface-16dp: var(--vvd-neutral-tint-color-surface-16dp);\n --_vvd-tinted-color-surface-24dp: var(--vvd-neutral-tint-color-surface-24dp);\n --_vvd-tinted-shadow-surface-0dp: var(--vvd-neutral-tint-shadow-surface-0dp);\n --_vvd-tinted-shadow-surface-2dp: var(--vvd-neutral-tint-shadow-surface-2dp);\n --_vvd-tinted-shadow-surface-4dp: var(--vvd-neutral-tint-shadow-surface-4dp);\n --_vvd-tinted-shadow-surface-8dp: var(--vvd-neutral-tint-shadow-surface-8dp);\n --_vvd-tinted-shadow-surface-12dp: var(\n \t--vvd-neutral-tint-shadow-surface-12dp\n );\n --_vvd-tinted-shadow-surface-16dp: var(\n \t--vvd-neutral-tint-shadow-surface-16dp\n );\n --_vvd-tinted-shadow-surface-24dp: var(\n \t--vvd-neutral-tint-shadow-surface-24dp\n );\n}\n.vvd-neutral-tint-elevation > * {\n --_vvd-tinted-color-surface-0dp: var(--vvd-color-surface-0dp);\n --_vvd-tinted-color-surface-2dp: var(--vvd-color-surface-2dp);\n --_vvd-tinted-color-surface-4dp: var(--vvd-color-surface-4dp);\n --_vvd-tinted-color-surface-8dp: var(--vvd-color-surface-8dp);\n --_vvd-tinted-color-surface-12dp: var(--vvd-color-surface-12dp);\n --_vvd-tinted-color-surface-16dp: var(--vvd-color-surface-16dp);\n --_vvd-tinted-color-surface-24dp: var(--vvd-color-surface-24dp);\n --_vvd-tinted-shadow-surface-0dp: var(--vvd-shadow-surface-0dp);\n --_vvd-tinted-shadow-surface-2dp: var(--vvd-shadow-surface-2dp);\n --_vvd-tinted-shadow-surface-4dp: var(--vvd-shadow-surface-4dp);\n --_vvd-tinted-shadow-surface-8dp: var(--vvd-shadow-surface-8dp);\n --_vvd-tinted-shadow-surface-12dp: var(--vvd-shadow-surface-12dp);\n --_vvd-tinted-shadow-surface-16dp: var(--vvd-shadow-surface-16dp);\n --_vvd-tinted-shadow-surface-24dp: var(--vvd-shadow-surface-24dp);\n}\n";
15337
+ const coreThemeCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n.vvd-root {\n background-color: var(--vvd-color-canvas);\n color: var(--vvd-color-canvas-text);\n color-scheme: var(--vvd-color-scheme);\n}\n\n.vvd-scrollbar {\n --scrollbar-track-color: transparent;\n --scrollbar-thumb-color: color-mix(in srgb, var(--vvd-color-neutral-950), transparent 70%);\n}\n.vvd-scrollbar {\n scrollbar-color: var(--scrollbar-thumb-color) var(--scrollbar-track-color);\n scrollbar-width: thin;\n}\n.vvd-scrollbar ::-webkit-scrollbar {\n width: 4px;\n}\n.vvd-scrollbar ::-webkit-scrollbar-track {\n background: var(--scrollbar-track-color);\n}\n.vvd-scrollbar ::-webkit-scrollbar-thumb {\n border: 0;\n border-radius: 4px;\n background-color: var(--scrollbar-fallback-track-color, var(--scrollbar-thumb-color));\n}\n\n.vvd-neutral-tint-elevation {\n --_vvd-tinted-color-surface-0dp: var(--vvd-neutral-tint-color-surface-0dp);\n --_vvd-tinted-color-surface-2dp: var(--vvd-neutral-tint-color-surface-2dp);\n --_vvd-tinted-color-surface-4dp: var(--vvd-neutral-tint-color-surface-4dp);\n --_vvd-tinted-color-surface-8dp: var(--vvd-neutral-tint-color-surface-8dp);\n --_vvd-tinted-color-surface-12dp: var(--vvd-neutral-tint-color-surface-12dp);\n --_vvd-tinted-color-surface-16dp: var(--vvd-neutral-tint-color-surface-16dp);\n --_vvd-tinted-color-surface-24dp: var(--vvd-neutral-tint-color-surface-24dp);\n --_vvd-tinted-shadow-surface-0dp: var(--vvd-neutral-tint-shadow-surface-0dp);\n --_vvd-tinted-shadow-surface-2dp: var(--vvd-neutral-tint-shadow-surface-2dp);\n --_vvd-tinted-shadow-surface-4dp: var(--vvd-neutral-tint-shadow-surface-4dp);\n --_vvd-tinted-shadow-surface-8dp: var(--vvd-neutral-tint-shadow-surface-8dp);\n --_vvd-tinted-shadow-surface-12dp: var(\n \t--vvd-neutral-tint-shadow-surface-12dp\n );\n --_vvd-tinted-shadow-surface-16dp: var(\n \t--vvd-neutral-tint-shadow-surface-16dp\n );\n --_vvd-tinted-shadow-surface-24dp: var(\n \t--vvd-neutral-tint-shadow-surface-24dp\n );\n}\n.vvd-neutral-tint-elevation > * {\n --_vvd-tinted-color-surface-0dp: var(--vvd-color-surface-0dp);\n --_vvd-tinted-color-surface-2dp: var(--vvd-color-surface-2dp);\n --_vvd-tinted-color-surface-4dp: var(--vvd-color-surface-4dp);\n --_vvd-tinted-color-surface-8dp: var(--vvd-color-surface-8dp);\n --_vvd-tinted-color-surface-12dp: var(--vvd-color-surface-12dp);\n --_vvd-tinted-color-surface-16dp: var(--vvd-color-surface-16dp);\n --_vvd-tinted-color-surface-24dp: var(--vvd-color-surface-24dp);\n --_vvd-tinted-shadow-surface-0dp: var(--vvd-shadow-surface-0dp);\n --_vvd-tinted-shadow-surface-2dp: var(--vvd-shadow-surface-2dp);\n --_vvd-tinted-shadow-surface-4dp: var(--vvd-shadow-surface-4dp);\n --_vvd-tinted-shadow-surface-8dp: var(--vvd-shadow-surface-8dp);\n --_vvd-tinted-shadow-surface-12dp: var(--vvd-shadow-surface-12dp);\n --_vvd-tinted-shadow-surface-16dp: var(--vvd-shadow-surface-16dp);\n --_vvd-tinted-shadow-surface-24dp: var(--vvd-shadow-surface-24dp);\n}\n";
15205
15338
 
15206
- const coreTypographyCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:09 GMT\n */\n.vvd-root:root {\n --vvd-size-font-scale-base: 1rem;\n font-size: unset;\n}\n.vvd-root:root > body {\n font: var(--vvd-typography-base);\n font-feature-settings: \"kern\"; /* turns on kerning */\n -webkit-font-smoothing: antialiased; /* apply font anti-aliasing for Webkit on OSX */\n -moz-osx-font-smoothing: grayscale; /* apply font anti-aliasing for Firefox on OSX */\n text-rendering: optimizeLegibility; /* emphasise on legibility when rendering, turns on ligatures and kerning */\n}\n.vvd-root:not(:root) {\n font: var(--vvd-typography-base);\n font-feature-settings: \"kern\"; /* turns on kerning */\n -webkit-font-smoothing: antialiased; /* apply font anti-aliasing for Webkit on OSX */\n -moz-osx-font-smoothing: grayscale; /* apply font anti-aliasing for Firefox on OSX */\n text-rendering: optimizeLegibility; /* emphasise on legibility when rendering, turns on ligatures and kerning */\n}\n.vvd-root p,\n.vvd-root .font-base {\n font: var(--vvd-typography-base);\n margin-block: 16px;\n}\n.vvd-root p.tight,\n.vvd-root .font-base.tight {\n margin-block: 0;\n}\n.vvd-root .font-base-bold {\n font: var(--vvd-typography-base-bold);\n}\n.vvd-root .font-base-condensed {\n font: var(--vvd-typography-base-condensed);\n}\n.vvd-root .font-base-condensed-bold {\n font: var(--vvd-typography-base-condensed-bold);\n}\n.vvd-root .font-base-extended {\n font: var(--vvd-typography-base-extended);\n}\n.vvd-root .font-base-extended-bold {\n font: var(--vvd-typography-base-extended-bold);\n}\n.vvd-root .font-base-code {\n font: var(--vvd-typography-base-code);\n}\n.vvd-root b, .vvd-root strong {\n font-weight: 600;\n}\n.vvd-root pre, .vvd-root var, .vvd-root code, .vvd-root kbd, .vvd-root samp {\n font: var(--vvd-typography-base-code);\n}\n.vvd-root .headline {\n font: var(--vvd-typography-headline);\n margin-block: 40px;\n}\n.vvd-root .subtitle {\n font: var(--vvd-typography-subtitle);\n margin-block: 40px;\n}\n.vvd-root h1,\n.vvd-root .heading1 {\n font: var(--vvd-typography-heading-1);\n margin-block: 32px;\n}\n.vvd-root h2,\n.vvd-root .heading2 {\n font: var(--vvd-typography-heading-2);\n margin-block: 32px;\n}\n.vvd-root h3,\n.vvd-root .heading3 {\n font: var(--vvd-typography-heading-3);\n margin-block: 24px;\n}\n.vvd-root h4,\n.vvd-root .heading4 {\n font: var(--vvd-typography-heading-4);\n margin-block: 24px;\n}\n.vvd-root .headline b, .vvd-root .headline strong,\n.vvd-root .subtitle b,\n.vvd-root .subtitle strong,\n.vvd-root h1 b,\n.vvd-root h1 strong,\n.vvd-root .heading1 b,\n.vvd-root .heading1 strong,\n.vvd-root h2 b,\n.vvd-root h2 strong,\n.vvd-root .heading2 b,\n.vvd-root .heading2 strong,\n.vvd-root h3 b,\n.vvd-root h3 strong,\n.vvd-root .heading3 b,\n.vvd-root .heading3 strong,\n.vvd-root h4 b,\n.vvd-root h4 strong,\n.vvd-root .heading4 b,\n.vvd-root .heading4 strong {\n font-weight: 500;\n}\n.vvd-root .headline.tight,\n.vvd-root .subtitle.tight,\n.vvd-root h1.tight,\n.vvd-root .heading1.tight,\n.vvd-root h2.tight,\n.vvd-root .heading2.tight,\n.vvd-root h3.tight,\n.vvd-root .heading3.tight,\n.vvd-root h4.tight,\n.vvd-root .heading4.tight {\n margin-block: 0;\n}\n.vvd-root small,\n.vvd-root figcaption {\n font: var(--vvd-typography-base-condensed);\n}\n.vvd-root sub,\n.vvd-root sup {\n position: relative;\n font: var(--vvd-typography-base-condensed);\n font-size: 75%;\n line-height: 0;\n vertical-align: baseline;\n}\n.vvd-root sub {\n bottom: -0.25em;\n}\n.vvd-root sup {\n top: -0.5em;\n}\n";
15339
+ const coreTypographyCss = "/**\n * Do not edit directly\n * Generated on Mon, 08 Dec 2025 18:08:08 GMT\n */\n.vvd-root:root {\n --vvd-size-font-scale-base: 1rem;\n font-size: unset;\n}\n.vvd-root:root > body {\n font: var(--vvd-typography-base);\n font-feature-settings: \"kern\"; /* turns on kerning */\n -webkit-font-smoothing: antialiased; /* apply font anti-aliasing for Webkit on OSX */\n -moz-osx-font-smoothing: grayscale; /* apply font anti-aliasing for Firefox on OSX */\n text-rendering: optimizeLegibility; /* emphasise on legibility when rendering, turns on ligatures and kerning */\n}\n.vvd-root:not(:root) {\n font: var(--vvd-typography-base);\n font-feature-settings: \"kern\"; /* turns on kerning */\n -webkit-font-smoothing: antialiased; /* apply font anti-aliasing for Webkit on OSX */\n -moz-osx-font-smoothing: grayscale; /* apply font anti-aliasing for Firefox on OSX */\n text-rendering: optimizeLegibility; /* emphasise on legibility when rendering, turns on ligatures and kerning */\n}\n.vvd-root p,\n.vvd-root .font-base {\n font: var(--vvd-typography-base);\n margin-block: 16px;\n}\n.vvd-root p.tight,\n.vvd-root .font-base.tight {\n margin-block: 0;\n}\n.vvd-root .font-base-bold {\n font: var(--vvd-typography-base-bold);\n}\n.vvd-root .font-base-condensed {\n font: var(--vvd-typography-base-condensed);\n}\n.vvd-root .font-base-condensed-bold {\n font: var(--vvd-typography-base-condensed-bold);\n}\n.vvd-root .font-base-extended {\n font: var(--vvd-typography-base-extended);\n}\n.vvd-root .font-base-extended-bold {\n font: var(--vvd-typography-base-extended-bold);\n}\n.vvd-root .font-base-code {\n font: var(--vvd-typography-base-code);\n}\n.vvd-root b, .vvd-root strong {\n font-weight: 600;\n}\n.vvd-root pre, .vvd-root var, .vvd-root code, .vvd-root kbd, .vvd-root samp {\n font: var(--vvd-typography-base-code);\n}\n.vvd-root .headline {\n font: var(--vvd-typography-headline);\n margin-block: 40px;\n}\n.vvd-root .subtitle {\n font: var(--vvd-typography-subtitle);\n margin-block: 40px;\n}\n.vvd-root h1,\n.vvd-root .heading1 {\n font: var(--vvd-typography-heading-1);\n margin-block: 32px;\n}\n.vvd-root h2,\n.vvd-root .heading2 {\n font: var(--vvd-typography-heading-2);\n margin-block: 32px;\n}\n.vvd-root h3,\n.vvd-root .heading3 {\n font: var(--vvd-typography-heading-3);\n margin-block: 24px;\n}\n.vvd-root h4,\n.vvd-root .heading4 {\n font: var(--vvd-typography-heading-4);\n margin-block: 24px;\n}\n.vvd-root .headline b, .vvd-root .headline strong,\n.vvd-root .subtitle b,\n.vvd-root .subtitle strong,\n.vvd-root h1 b,\n.vvd-root h1 strong,\n.vvd-root .heading1 b,\n.vvd-root .heading1 strong,\n.vvd-root h2 b,\n.vvd-root h2 strong,\n.vvd-root .heading2 b,\n.vvd-root .heading2 strong,\n.vvd-root h3 b,\n.vvd-root h3 strong,\n.vvd-root .heading3 b,\n.vvd-root .heading3 strong,\n.vvd-root h4 b,\n.vvd-root h4 strong,\n.vvd-root .heading4 b,\n.vvd-root .heading4 strong {\n font-weight: 500;\n}\n.vvd-root .headline.tight,\n.vvd-root .subtitle.tight,\n.vvd-root h1.tight,\n.vvd-root .heading1.tight,\n.vvd-root h2.tight,\n.vvd-root .heading2.tight,\n.vvd-root h3.tight,\n.vvd-root .heading3.tight,\n.vvd-root h4.tight,\n.vvd-root .heading4.tight {\n margin-block: 0;\n}\n.vvd-root small,\n.vvd-root figcaption {\n font: var(--vvd-typography-base-condensed);\n}\n.vvd-root sub,\n.vvd-root sup {\n position: relative;\n font: var(--vvd-typography-base-condensed);\n font-size: 75%;\n line-height: 0;\n vertical-align: baseline;\n}\n.vvd-root sub {\n bottom: -0.25em;\n}\n.vvd-root sup {\n top: -0.5em;\n}\n";
15207
15340
 
15208
15341
  const theme = {
15209
15342
  name: "core/theme",
@@ -15302,4 +15435,4 @@ const vividVue = {
15302
15435
  };
15303
15436
  const vivid3 = vividVue;
15304
15437
 
15305
- export { Icon, VAccordion, VAccordionItem, VActionGroup, VAlert, VAudioPlayer, VAvatar, VBadge, VBanner, VBreadcrumb, VBreadcrumbItem, VButton, VCalendar, VCalendarEvent, VCard, VCheckbox, VColorPicker, VCombobox, VDataGrid, VDataGridCell, VDataGridRow, VDatePicker, VDateRangePicker, VDateTimePicker, VDialPad, VDialog, VDivider, VEmptyState, VFab, VFilePicker, VHeader, VIcon, VLayout, VMenu, VMenuItem, VNav, VNavDisclosure, VNavItem, VNote, VNumberField, VOption, VPagination, VProgress, VProgressRing, VRadio, VRadioGroup, VRangeSlider, VRichTextEditor, VSearchableSelect, VSelect, VSelectableBox, VSideDrawer, VSimpleColorPicker, VSlider, VSplitButton, VSwitch, VTab, VTabPanel, VTabs, VTag, VTagGroup, VTextArea, VTextField, VTimePicker, VToggletip, VTooltip, VTreeItem, VTreeView, VVideoPlayer, optionalStyles, setCustomComponentPrefix, vivid3, vividVue };
15438
+ export { Icon, VAccordion, VAccordionItem, VActionGroup, VAlert, VAudioPlayer, VAvatar, VBadge, VBanner, VBreadcrumb, VBreadcrumbItem, VButton, VCalendar, VCalendarEvent, VCard, VCheckbox, VColorPicker, VCombobox, VContextualHelp, VDataGrid, VDataGridCell, VDataGridRow, VDatePicker, VDateRangePicker, VDateTimePicker, VDialPad, VDialog, VDivider, VEmptyState, VFab, VFilePicker, VHeader, VIcon, VLayout, VMenu, VMenuItem, VNav, VNavDisclosure, VNavItem, VNote, VNumberField, VOption, VPagination, VProgress, VProgressRing, VRadio, VRadioGroup, VRangeSlider, VRichTextEditor, VSearchableSelect, VSelect, VSelectableBox, VSideDrawer, VSimpleColorPicker, VSlider, VSplitButton, VSwitch, VTab, VTabPanel, VTabs, VTag, VTagGroup, VTextArea, VTextField, VTimePicker, VToggletip, VTooltip, VTreeItem, VTreeView, VVideoPlayer, optionalStyles, setCustomComponentPrefix, vivid3, vividVue };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@vonage/vivid-vue",
3
- "version": "5.6.0",
3
+ "version": "5.8.0",
4
4
  "description": "A Vue wrapper library for Vivid components.",
5
5
  "license": "ISC",
6
6
  "author": "Vonage",
@@ -20,7 +20,7 @@
20
20
  "web-types.json"
21
21
  ],
22
22
  "dependencies": {
23
- "@vonage/vivid": "^5.6.0"
23
+ "@vonage/vivid": "^5.8.0"
24
24
  },
25
25
  "devDependencies": {
26
26
  "@types/glob": "^7.2.0",
@@ -29,11 +29,11 @@
29
29
  "vitest": "^3.2.4",
30
30
  "vue": "^2.7.16",
31
31
  "vue3": "npm:vue@^3.5.24",
32
- "@repo/typescript-config": "1.0.0",
33
- "@repo/wrapper-gen": "1.0.0",
34
32
  "@repo/styles": "1.0.0",
33
+ "@repo/typescript-config": "1.0.0",
35
34
  "@repo/eslint-config": "1.0.0",
36
- "@repo/vitest-config": "1.0.0"
35
+ "@repo/vitest-config": "1.0.0",
36
+ "@repo/wrapper-gen": "1.0.0"
37
37
  },
38
38
  "peerDependencies": {
39
39
  "vue": "^2.7.0 || >=3.0.0"
package/web-types.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "framework": "vue",
3
3
  "name": "@vonage/vivid-vue",
4
- "version": "5.6.0",
4
+ "version": "5.8.0",
5
5
  "contributions": {
6
6
  "html": {
7
7
  "description-markup": "markdown",
@@ -1825,6 +1825,36 @@
1825
1825
  },
1826
1826
  "priority": "highest"
1827
1827
  },
1828
+ {
1829
+ "name": "VContextualHelp",
1830
+ "description": "",
1831
+ "attributes": [
1832
+ {
1833
+ "name": "placement",
1834
+ "description": "Placement of the toggletip",
1835
+ "value": {
1836
+ "kind": "expression",
1837
+ "type": "'top' | 'right' | 'bottom' | 'left' | 'top-start' | 'top-end' | 'right-start' | 'right-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end'"
1838
+ }
1839
+ }
1840
+ ],
1841
+ "events": [],
1842
+ "slots": [
1843
+ {
1844
+ "name": "default",
1845
+ "description": "Default slot."
1846
+ },
1847
+ {
1848
+ "name": "icon",
1849
+ "description": "Custom icon slot (optional)."
1850
+ }
1851
+ ],
1852
+ "source": {
1853
+ "module": "@vonage/vivid-vue",
1854
+ "symbol": "VContextualHelp"
1855
+ },
1856
+ "priority": "highest"
1857
+ },
1828
1858
  {
1829
1859
  "name": "VDataGrid",
1830
1860
  "description": "",
@@ -5706,9 +5736,13 @@
5706
5736
  ],
5707
5737
  "events": [],
5708
5738
  "slots": [
5739
+ {
5740
+ "name": "action-items",
5741
+ "description": "Slot for action items such as buttons or controls."
5742
+ },
5709
5743
  {
5710
5744
  "name": "default",
5711
- "description": "Default slot."
5745
+ "description": "Default slot for tab and tab-panel elements."
5712
5746
  }
5713
5747
  ],
5714
5748
  "source": {