@dialpad/dialtone 9.71.0 → 9.72.1

package/dist/vue2/components/emoji_picker/modules/emoji_tabset.vue.cjs

@@ -125,7 +125,7 @@ const _sfc_main = {
 };
 var _sfc_render = function render() {
   var _vm = this, _c = _vm._self._c;
-  return _c("div", { staticClass: "d-emoji-picker__tabset" }, [_c("dt-tab-group", { attrs: { "tab-list-class": "d-emoji-picker__tabset-list", "selected": _vm.selectedTab }, scopedSlots: _vm._u([{ key: "tabs", fn: function() {
+  return _c("div", { staticClass: "d-emoji-picker__tabset" }, [_c("dt-tab-group", { attrs: { "size": "sm", "tab-list-class": "d-emoji-picker__tabset-list", "selected": _vm.selectedTab }, scopedSlots: _vm._u([{ key: "tabs", fn: function() {
     return _vm._l(_vm.tabs, function(tab2, index) {
       return _c("dt-tab", { key: tab2.id, ref: `tabsetRef-${index}`, refInFor: true, attrs: { "id": tab2.id, "panel-id": tab2.panelId, "label": tab2.label, "aria-controls": "d-emoji-picker-list", "tabindex": index + 1 }, on: { "!click": function($event) {
         $event.stopPropagation();

package/dist/vue2/components/emoji_picker/modules/emoji_tabset.vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"emoji_tabset.vue.cjs","sources":["../../../../components/emoji_picker/modules/emoji_tabset.vue"],"sourcesContent":["<template>\n  <div class=\"d-emoji-picker__tabset\">\n    <dt-tab-group\n      tab-list-class=\"d-emoji-picker__tabset-list\"\n      :selected=\"selectedTab\"\n    >\n      <template #tabs>\n        <dt-tab\n          v-for=\"(tab, index) in tabs\"\n          :id=\"tab.id\"\n          :ref=\"`tabsetRef-${index}`\"\n          :key=\"tab.id\"\n          :panel-id=\"tab.panelId\"\n          :label=\"tab.label\"\n          aria-controls=\"d-emoji-picker-list\"\n          :tabindex=\"index + 1\"\n          @click.capture.stop=\"selectTabset(tab.id)\"\n          @keydown=\"handleKeyDown($event, tab.id)\"\n        >\n          <dt-icon\n            size=\"400\"\n            :name=\"tab.icon\"\n          />\n        </dt-tab>\n      </template>\n    </dt-tab-group>\n  </div>\n</template>\n\n<script>\nimport DtTabGroup from '@/components/tabs/tab_group.vue';\nimport DtTab from '@/components/tabs/tab.vue';\nimport DtIcon from '@/components/icon/icon.vue';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker';\n\nexport default {\n  name: 'EmojiTabset',\n\n  components: {\n    DtTabGroup,\n    DtTab,\n    DtIcon,\n  },\n\n  props: {\n    showRecentlyUsedTab: {\n      type: Boolean,\n      default: false,\n    },\n\n    scrollIntoTab: {\n      type: Number,\n      required: true,\n    },\n\n    isScrolling: {\n      type: Boolean,\n      default: false,\n    },\n\n    emojiFilter: {\n      type: String,\n      default: '',\n    },\n\n    tabSetLabels: {\n      type: Array,\n      required: true,\n    },\n  },\n\n  data () {\n    return {\n      selectedTab: '1',\n      tabsetRef: [],\n      TABS_DATA: [\n        { label: EMOJI_PICKER_CATEGORIES.MOST_RECENTLY_USED, icon: 'clock' },\n        { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: 'satisfied' },\n        { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: 'living-thing' },\n        { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: 'food' },\n        { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: 'object' },\n        { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: 'transportation' },\n        { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: 'lightbulb' },\n        { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: 'heart' },\n        { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: 'flag' },\n      ],\n    };\n  },\n\n  computed: {\n    tabs () {\n      const tabsData = this.showRecentlyUsedTab ? this.TABS_DATA : this.TABS_DATA.slice(1);\n      return tabsData.map((tab, index) => ({\n        ...tab,\n        label: this.tabSetLabels[index],\n        id: (index + 1).toString(),\n        panelId: (index + 1).toString(),\n      }));\n    },\n\n    isSearching () {\n      return this.emojiFilter.length > 0;\n    },\n  },\n\n  watch: {\n    scrollIntoTab: function (newVal) {\n      if (!this.isScrolling && !this.isSearching) {\n        this.selectedTab = (newVal + 1).toString();\n      }\n    },\n\n    isSearching: function (newVal) {\n      if (newVal) {\n        this.selectedTab = null;\n      }\n    },\n  },\n\n  mounted () {\n    this.$nextTick(() => {\n      this.setTabsetRef();\n    });\n  },\n\n  methods: {\n    selectTabset (id) {\n      if (!this.isScrolling) {\n        this.selectedTab = id;\n      }\n      this.$emit('selected-tabset', id);\n    },\n\n    setTabsetRef () {\n      this.tabs.forEach((skin, index) => {\n        const refKey = `tabsetRef-${index}`;\n        if (this.$refs[refKey]) {\n          this.$set(this.tabsetRef, index, this.$refs[refKey][0].$el);\n        }\n      });\n    },\n\n    focusTabset () {\n      if (this.tabsetRef[0]) {\n        this.tabsetRef[0].focus();\n      }\n    },\n\n    // eslint-disable-next-line complexity\n    handleKeyDown (event, tabId) {\n      if (event.key === 'Enter') {\n        this.selectTabset(tabId);\n        if (this.tabsetRef[tabId - 1]) {\n          this.tabsetRef[tabId - 1].blur();\n        }\n      }\n\n      if (event.key === 'Tab') {\n        event.preventDefault();\n        if (event.shiftKey) {\n          this.$emit('focus-skin-selector');\n        } else {\n          this.$emit('focus-search-input');\n        }\n      }\n\n      if (event.key === 'ArrowDown') {\n        this.$emit('focus-search-input');\n      }\n    },\n  },\n};\n</script>\n"],"names":["DtTabGroup","DtTab","DtIcon","EMOJI_PICKER_CATEGORIES","tab"],"mappings":"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"}
+{"version":3,"file":"emoji_tabset.vue.cjs","sources":["../../../../components/emoji_picker/modules/emoji_tabset.vue"],"sourcesContent":["<template>\n  <div class=\"d-emoji-picker__tabset\">\n    <dt-tab-group\n      size=\"sm\"\n      tab-list-class=\"d-emoji-picker__tabset-list\"\n      :selected=\"selectedTab\"\n    >\n      <template #tabs>\n        <dt-tab\n          v-for=\"(tab, index) in tabs\"\n          :id=\"tab.id\"\n          :ref=\"`tabsetRef-${index}`\"\n          :key=\"tab.id\"\n          :panel-id=\"tab.panelId\"\n          :label=\"tab.label\"\n          aria-controls=\"d-emoji-picker-list\"\n          :tabindex=\"index + 1\"\n          @click.capture.stop=\"selectTabset(tab.id)\"\n          @keydown=\"handleKeyDown($event, tab.id)\"\n        >\n          <dt-icon\n            size=\"400\"\n            :name=\"tab.icon\"\n          />\n        </dt-tab>\n      </template>\n    </dt-tab-group>\n  </div>\n</template>\n\n<script>\nimport DtTabGroup from '@/components/tabs/tab_group.vue';\nimport DtTab from '@/components/tabs/tab.vue';\nimport DtIcon from '@/components/icon/icon.vue';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker';\n\nexport default {\n  name: 'EmojiTabset',\n\n  components: {\n    DtTabGroup,\n    DtTab,\n    DtIcon,\n  },\n\n  props: {\n    showRecentlyUsedTab: {\n      type: Boolean,\n      default: false,\n    },\n\n    scrollIntoTab: {\n      type: Number,\n      required: true,\n    },\n\n    isScrolling: {\n      type: Boolean,\n      default: false,\n    },\n\n    emojiFilter: {\n      type: String,\n      default: '',\n    },\n\n    tabSetLabels: {\n      type: Array,\n      required: true,\n    },\n  },\n\n  data () {\n    return {\n      selectedTab: '1',\n      tabsetRef: [],\n      TABS_DATA: [\n        { label: EMOJI_PICKER_CATEGORIES.MOST_RECENTLY_USED, icon: 'clock' },\n        { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: 'satisfied' },\n        { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: 'living-thing' },\n        { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: 'food' },\n        { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: 'object' },\n        { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: 'transportation' },\n        { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: 'lightbulb' },\n        { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: 'heart' },\n        { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: 'flag' },\n      ],\n    };\n  },\n\n  computed: {\n    tabs () {\n      const tabsData = this.showRecentlyUsedTab ? this.TABS_DATA : this.TABS_DATA.slice(1);\n      return tabsData.map((tab, index) => ({\n        ...tab,\n        label: this.tabSetLabels[index],\n        id: (index + 1).toString(),\n        panelId: (index + 1).toString(),\n      }));\n    },\n\n    isSearching () {\n      return this.emojiFilter.length > 0;\n    },\n  },\n\n  watch: {\n    scrollIntoTab: function (newVal) {\n      if (!this.isScrolling && !this.isSearching) {\n        this.selectedTab = (newVal + 1).toString();\n      }\n    },\n\n    isSearching: function (newVal) {\n      if (newVal) {\n        this.selectedTab = null;\n      }\n    },\n  },\n\n  mounted () {\n    this.$nextTick(() => {\n      this.setTabsetRef();\n    });\n  },\n\n  methods: {\n    selectTabset (id) {\n      if (!this.isScrolling) {\n        this.selectedTab = id;\n      }\n      this.$emit('selected-tabset', id);\n    },\n\n    setTabsetRef () {\n      this.tabs.forEach((skin, index) => {\n        const refKey = `tabsetRef-${index}`;\n        if (this.$refs[refKey]) {\n          this.$set(this.tabsetRef, index, this.$refs[refKey][0].$el);\n        }\n      });\n    },\n\n    focusTabset () {\n      if (this.tabsetRef[0]) {\n        this.tabsetRef[0].focus();\n      }\n    },\n\n    // eslint-disable-next-line complexity\n    handleKeyDown (event, tabId) {\n      if (event.key === 'Enter') {\n        this.selectTabset(tabId);\n        if (this.tabsetRef[tabId - 1]) {\n          this.tabsetRef[tabId - 1].blur();\n        }\n      }\n\n      if (event.key === 'Tab') {\n        event.preventDefault();\n        if (event.shiftKey) {\n          this.$emit('focus-skin-selector');\n        } else {\n          this.$emit('focus-search-input');\n        }\n      }\n\n      if (event.key === 'ArrowDown') {\n        this.$emit('focus-search-input');\n      }\n    },\n  },\n};\n</script>\n"],"names":["DtTabGroup","DtTab","DtIcon","EMOJI_PICKER_CATEGORIES","tab"],"mappings":"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"}

package/dist/vue2/components/emoji_picker/modules/emoji_tabset.vue.js

@@ -124,7 +124,7 @@ const _sfc_main = {
 };
 var _sfc_render = function render() {
   var _vm = this, _c = _vm._self._c;
-  return _c("div", { staticClass: "d-emoji-picker__tabset" }, [_c("dt-tab-group", { attrs: { "tab-list-class": "d-emoji-picker__tabset-list", "selected": _vm.selectedTab }, scopedSlots: _vm._u([{ key: "tabs", fn: function() {
+  return _c("div", { staticClass: "d-emoji-picker__tabset" }, [_c("dt-tab-group", { attrs: { "size": "sm", "tab-list-class": "d-emoji-picker__tabset-list", "selected": _vm.selectedTab }, scopedSlots: _vm._u([{ key: "tabs", fn: function() {
     return _vm._l(_vm.tabs, function(tab, index) {
       return _c("dt-tab", { key: tab.id, ref: `tabsetRef-${index}`, refInFor: true, attrs: { "id": tab.id, "panel-id": tab.panelId, "label": tab.label, "aria-controls": "d-emoji-picker-list", "tabindex": index + 1 }, on: { "!click": function($event) {
         $event.stopPropagation();

package/dist/vue2/components/emoji_picker/modules/emoji_tabset.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"emoji_tabset.vue.js","sources":["../../../../components/emoji_picker/modules/emoji_tabset.vue"],"sourcesContent":["<template>\n  <div class=\"d-emoji-picker__tabset\">\n    <dt-tab-group\n      tab-list-class=\"d-emoji-picker__tabset-list\"\n      :selected=\"selectedTab\"\n    >\n      <template #tabs>\n        <dt-tab\n          v-for=\"(tab, index) in tabs\"\n          :id=\"tab.id\"\n          :ref=\"`tabsetRef-${index}`\"\n          :key=\"tab.id\"\n          :panel-id=\"tab.panelId\"\n          :label=\"tab.label\"\n          aria-controls=\"d-emoji-picker-list\"\n          :tabindex=\"index + 1\"\n          @click.capture.stop=\"selectTabset(tab.id)\"\n          @keydown=\"handleKeyDown($event, tab.id)\"\n        >\n          <dt-icon\n            size=\"400\"\n            :name=\"tab.icon\"\n          />\n        </dt-tab>\n      </template>\n    </dt-tab-group>\n  </div>\n</template>\n\n<script>\nimport DtTabGroup from '@/components/tabs/tab_group.vue';\nimport DtTab from '@/components/tabs/tab.vue';\nimport DtIcon from '@/components/icon/icon.vue';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker';\n\nexport default {\n  name: 'EmojiTabset',\n\n  components: {\n    DtTabGroup,\n    DtTab,\n    DtIcon,\n  },\n\n  props: {\n    showRecentlyUsedTab: {\n      type: Boolean,\n      default: false,\n    },\n\n    scrollIntoTab: {\n      type: Number,\n      required: true,\n    },\n\n    isScrolling: {\n      type: Boolean,\n      default: false,\n    },\n\n    emojiFilter: {\n      type: String,\n      default: '',\n    },\n\n    tabSetLabels: {\n      type: Array,\n      required: true,\n    },\n  },\n\n  data () {\n    return {\n      selectedTab: '1',\n      tabsetRef: [],\n      TABS_DATA: [\n        { label: EMOJI_PICKER_CATEGORIES.MOST_RECENTLY_USED, icon: 'clock' },\n        { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: 'satisfied' },\n        { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: 'living-thing' },\n        { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: 'food' },\n        { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: 'object' },\n        { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: 'transportation' },\n        { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: 'lightbulb' },\n        { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: 'heart' },\n        { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: 'flag' },\n      ],\n    };\n  },\n\n  computed: {\n    tabs () {\n      const tabsData = this.showRecentlyUsedTab ? this.TABS_DATA : this.TABS_DATA.slice(1);\n      return tabsData.map((tab, index) => ({\n        ...tab,\n        label: this.tabSetLabels[index],\n        id: (index + 1).toString(),\n        panelId: (index + 1).toString(),\n      }));\n    },\n\n    isSearching () {\n      return this.emojiFilter.length > 0;\n    },\n  },\n\n  watch: {\n    scrollIntoTab: function (newVal) {\n      if (!this.isScrolling && !this.isSearching) {\n        this.selectedTab = (newVal + 1).toString();\n      }\n    },\n\n    isSearching: function (newVal) {\n      if (newVal) {\n        this.selectedTab = null;\n      }\n    },\n  },\n\n  mounted () {\n    this.$nextTick(() => {\n      this.setTabsetRef();\n    });\n  },\n\n  methods: {\n    selectTabset (id) {\n      if (!this.isScrolling) {\n        this.selectedTab = id;\n      }\n      this.$emit('selected-tabset', id);\n    },\n\n    setTabsetRef () {\n      this.tabs.forEach((skin, index) => {\n        const refKey = `tabsetRef-${index}`;\n        if (this.$refs[refKey]) {\n          this.$set(this.tabsetRef, index, this.$refs[refKey][0].$el);\n        }\n      });\n    },\n\n    focusTabset () {\n      if (this.tabsetRef[0]) {\n        this.tabsetRef[0].focus();\n      }\n    },\n\n    // eslint-disable-next-line complexity\n    handleKeyDown (event, tabId) {\n      if (event.key === 'Enter') {\n        this.selectTabset(tabId);\n        if (this.tabsetRef[tabId - 1]) {\n          this.tabsetRef[tabId - 1].blur();\n        }\n      }\n\n      if (event.key === 'Tab') {\n        event.preventDefault();\n        if (event.shiftKey) {\n          this.$emit('focus-skin-selector');\n        } else {\n          this.$emit('focus-search-input');\n        }\n      }\n\n      if (event.key === 'ArrowDown') {\n        this.$emit('focus-search-input');\n      }\n    },\n  },\n};\n</script>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"emoji_tabset.vue.js","sources":["../../../../components/emoji_picker/modules/emoji_tabset.vue"],"sourcesContent":["<template>\n  <div class=\"d-emoji-picker__tabset\">\n    <dt-tab-group\n      size=\"sm\"\n      tab-list-class=\"d-emoji-picker__tabset-list\"\n      :selected=\"selectedTab\"\n    >\n      <template #tabs>\n        <dt-tab\n          v-for=\"(tab, index) in tabs\"\n          :id=\"tab.id\"\n          :ref=\"`tabsetRef-${index}`\"\n          :key=\"tab.id\"\n          :panel-id=\"tab.panelId\"\n          :label=\"tab.label\"\n          aria-controls=\"d-emoji-picker-list\"\n          :tabindex=\"index + 1\"\n          @click.capture.stop=\"selectTabset(tab.id)\"\n          @keydown=\"handleKeyDown($event, tab.id)\"\n        >\n          <dt-icon\n            size=\"400\"\n            :name=\"tab.icon\"\n          />\n        </dt-tab>\n      </template>\n    </dt-tab-group>\n  </div>\n</template>\n\n<script>\nimport DtTabGroup from '@/components/tabs/tab_group.vue';\nimport DtTab from '@/components/tabs/tab.vue';\nimport DtIcon from '@/components/icon/icon.vue';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker';\n\nexport default {\n  name: 'EmojiTabset',\n\n  components: {\n    DtTabGroup,\n    DtTab,\n    DtIcon,\n  },\n\n  props: {\n    showRecentlyUsedTab: {\n      type: Boolean,\n      default: false,\n    },\n\n    scrollIntoTab: {\n      type: Number,\n      required: true,\n    },\n\n    isScrolling: {\n      type: Boolean,\n      default: false,\n    },\n\n    emojiFilter: {\n      type: String,\n      default: '',\n    },\n\n    tabSetLabels: {\n      type: Array,\n      required: true,\n    },\n  },\n\n  data () {\n    return {\n      selectedTab: '1',\n      tabsetRef: [],\n      TABS_DATA: [\n        { label: EMOJI_PICKER_CATEGORIES.MOST_RECENTLY_USED, icon: 'clock' },\n        { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: 'satisfied' },\n        { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: 'living-thing' },\n        { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: 'food' },\n        { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: 'object' },\n        { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: 'transportation' },\n        { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: 'lightbulb' },\n        { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: 'heart' },\n        { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: 'flag' },\n      ],\n    };\n  },\n\n  computed: {\n    tabs () {\n      const tabsData = this.showRecentlyUsedTab ? this.TABS_DATA : this.TABS_DATA.slice(1);\n      return tabsData.map((tab, index) => ({\n        ...tab,\n        label: this.tabSetLabels[index],\n        id: (index + 1).toString(),\n        panelId: (index + 1).toString(),\n      }));\n    },\n\n    isSearching () {\n      return this.emojiFilter.length > 0;\n    },\n  },\n\n  watch: {\n    scrollIntoTab: function (newVal) {\n      if (!this.isScrolling && !this.isSearching) {\n        this.selectedTab = (newVal + 1).toString();\n      }\n    },\n\n    isSearching: function (newVal) {\n      if (newVal) {\n        this.selectedTab = null;\n      }\n    },\n  },\n\n  mounted () {\n    this.$nextTick(() => {\n      this.setTabsetRef();\n    });\n  },\n\n  methods: {\n    selectTabset (id) {\n      if (!this.isScrolling) {\n        this.selectedTab = id;\n      }\n      this.$emit('selected-tabset', id);\n    },\n\n    setTabsetRef () {\n      this.tabs.forEach((skin, index) => {\n        const refKey = `tabsetRef-${index}`;\n        if (this.$refs[refKey]) {\n          this.$set(this.tabsetRef, index, this.$refs[refKey][0].$el);\n        }\n      });\n    },\n\n    focusTabset () {\n      if (this.tabsetRef[0]) {\n        this.tabsetRef[0].focus();\n      }\n    },\n\n    // eslint-disable-next-line complexity\n    handleKeyDown (event, tabId) {\n      if (event.key === 'Enter') {\n        this.selectTabset(tabId);\n        if (this.tabsetRef[tabId - 1]) {\n          this.tabsetRef[tabId - 1].blur();\n        }\n      }\n\n      if (event.key === 'Tab') {\n        event.preventDefault();\n        if (event.shiftKey) {\n          this.$emit('focus-skin-selector');\n        } else {\n          this.$emit('focus-search-input');\n        }\n      }\n\n      if (event.key === 'ArrowDown') {\n        this.$emit('focus-search-input');\n      }\n    },\n  },\n};\n</script>\n"],"names":[],"mappings":"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"}

package/dist/vue3/components/emoji_picker/modules/emoji_search.vue.cjs

@@ -61,12 +61,15 @@ const _sfc_main = {
             fn: vue.withCtx(() => [
               vue.createVNode(vue.unref(button), {
                 importance: "clear",
+                size: "xs",
+                class: "d-mrn4",
+                circle: "",
                 kind: "muted",
                 onClick: clearSearch
               }, {
                 icon: vue.withCtx(() => [
                   vue.createVNode(vue.unref(icon), {
-                    name: "x-circle",
+                    name: "close",
                     size: "200"
                   })
                 ]),

package/dist/vue3/components/emoji_picker/modules/emoji_search.vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"emoji_search.vue.cjs","sources":["../../../../components/emoji_picker/modules/emoji_search.vue"],"sourcesContent":["<template>\n  <div class=\"d-emoji-picker__search d-emoji-picker__alignment\">\n    <dt-input\n      id=\"searchInput\"\n      ref=\"searchInput\"\n      :placeholder=\"searchPlaceholderLabel\"\n      :model-value=\"modelValue\"\n      @update:model-value=\"$emit('update:modelValue', $event)\"\n      @keydown.up=\"$emit('focus-tabset')\"\n      @keydown.down.prevent=\"$emit('focus-emoji-selector')\"\n      @keydown.enter=\"$emit('select-first-emoji')\"\n    >\n      <template #leftIcon>\n        <dt-icon\n          name=\"search\"\n          size=\"200\"\n        />\n      </template>\n      <template\n        v-if=\"modelValue.length > 0\"\n        #rightIcon\n      >\n        <dt-button\n          importance=\"clear\"\n          kind=\"muted\"\n          @click=\"clearSearch\"\n        >\n          <template #icon>\n            <dt-icon\n              name=\"x-circle\"\n              size=\"200\"\n            />\n          </template>\n        </dt-button>\n      </template>\n    </dt-input>\n  </div>\n</template>\n\n<script setup>\nimport { DtInput } from '@/components/input';\nimport { DtIcon } from '@/components/icon';\nimport { DtButton } from '@/components/button';\nimport { onMounted, ref } from 'vue';\n\ndefineProps({\n  searchPlaceholderLabel: {\n    type: String,\n    required: true,\n  },\n  modelValue: {\n    type: String,\n    default: '',\n  },\n});\n\nconst emits = defineEmits(['update:modelValue', 'focus-emoji-selector', 'focus-tabset', 'select-first-emoji']);\n\nconst searchInput = ref(null);\n\nfunction clearSearch () {\n  emits('update:modelValue', '');\n  focusSearchInput();\n}\n\nfunction focusSearchInput () {\n  searchInput.value.focus();\n}\nonMounted(() => {\n  focusSearchInput();\n});\n\ndefineExpose({\n  focusSearchInput,\n});\n</script>\n"],"names":["ref","onMounted"],"mappings":";;;;;;;;;;;;;;;;;;;;AAwDA,UAAM,QAAQ;AAEd,UAAM,cAAcA,IAAAA,IAAI,IAAI;AAE5B,aAAS,cAAe;AACtB,YAAM,qBAAqB,EAAE;AAC7B;IACF;AAEA,aAAS,mBAAoB;AAC3B,kBAAY,MAAM;IACpB;AACAC,QAAAA,UAAU,MAAM;AACd;IACF,CAAC;AAED,aAAa;AAAA,MACX;AAAA,IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"emoji_search.vue.cjs","sources":["../../../../components/emoji_picker/modules/emoji_search.vue"],"sourcesContent":["<template>\n  <div class=\"d-emoji-picker__search d-emoji-picker__alignment\">\n    <dt-input\n      id=\"searchInput\"\n      ref=\"searchInput\"\n      :placeholder=\"searchPlaceholderLabel\"\n      :model-value=\"modelValue\"\n      @update:model-value=\"$emit('update:modelValue', $event)\"\n      @keydown.up=\"$emit('focus-tabset')\"\n      @keydown.down.prevent=\"$emit('focus-emoji-selector')\"\n      @keydown.enter=\"$emit('select-first-emoji')\"\n    >\n      <template #leftIcon>\n        <dt-icon\n          name=\"search\"\n          size=\"200\"\n        />\n      </template>\n      <template\n        v-if=\"modelValue.length > 0\"\n        #rightIcon\n      >\n        <dt-button\n          importance=\"clear\"\n          size=\"xs\"\n          class=\"d-mrn4\"\n          circle\n          kind=\"muted\"\n          @click=\"clearSearch\"\n        >\n          <template #icon>\n            <dt-icon\n              name=\"close\"\n              size=\"200\"\n            />\n          </template>\n        </dt-button>\n      </template>\n    </dt-input>\n  </div>\n</template>\n\n<script setup>\nimport { DtInput } from '@/components/input';\nimport { DtIcon } from '@/components/icon';\nimport { DtButton } from '@/components/button';\nimport { onMounted, ref } from 'vue';\n\ndefineProps({\n  searchPlaceholderLabel: {\n    type: String,\n    required: true,\n  },\n  modelValue: {\n    type: String,\n    default: '',\n  },\n});\n\nconst emits = defineEmits(['update:modelValue', 'focus-emoji-selector', 'focus-tabset', 'select-first-emoji']);\n\nconst searchInput = ref(null);\n\nfunction clearSearch () {\n  emits('update:modelValue', '');\n  focusSearchInput();\n}\n\nfunction focusSearchInput () {\n  searchInput.value.focus();\n}\nonMounted(() => {\n  focusSearchInput();\n});\n\ndefineExpose({\n  focusSearchInput,\n});\n</script>\n"],"names":["ref","onMounted"],"mappings":";;;;;;;;;;;;;;;;;;;;AA2DA,UAAM,QAAQ;AAEd,UAAM,cAAcA,IAAAA,IAAI,IAAI;AAE5B,aAAS,cAAe;AACtB,YAAM,qBAAqB,EAAE;AAC7B;IACF;AAEA,aAAS,mBAAoB;AAC3B,kBAAY,MAAM;IACpB;AACAC,QAAAA,UAAU,MAAM;AACd;IACF,CAAC;AAED,aAAa;AAAA,MACX;AAAA,IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/vue3/components/emoji_picker/modules/emoji_search.vue.js

@@ -60,12 +60,15 @@ const _sfc_main = {
             fn: withCtx(() => [
               createVNode(unref(DtButton), {
                 importance: "clear",
+                size: "xs",
+                class: "d-mrn4",
+                circle: "",
                 kind: "muted",
                 onClick: clearSearch
               }, {
                 icon: withCtx(() => [
                   createVNode(unref(DtIcon), {
-                    name: "x-circle",
+                    name: "close",
                     size: "200"
                   })
                 ]),

package/dist/vue3/components/emoji_picker/modules/emoji_search.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"emoji_search.vue.js","sources":["../../../../components/emoji_picker/modules/emoji_search.vue"],"sourcesContent":["<template>\n  <div class=\"d-emoji-picker__search d-emoji-picker__alignment\">\n    <dt-input\n      id=\"searchInput\"\n      ref=\"searchInput\"\n      :placeholder=\"searchPlaceholderLabel\"\n      :model-value=\"modelValue\"\n      @update:model-value=\"$emit('update:modelValue', $event)\"\n      @keydown.up=\"$emit('focus-tabset')\"\n      @keydown.down.prevent=\"$emit('focus-emoji-selector')\"\n      @keydown.enter=\"$emit('select-first-emoji')\"\n    >\n      <template #leftIcon>\n        <dt-icon\n          name=\"search\"\n          size=\"200\"\n        />\n      </template>\n      <template\n        v-if=\"modelValue.length > 0\"\n        #rightIcon\n      >\n        <dt-button\n          importance=\"clear\"\n          kind=\"muted\"\n          @click=\"clearSearch\"\n        >\n          <template #icon>\n            <dt-icon\n              name=\"x-circle\"\n              size=\"200\"\n            />\n          </template>\n        </dt-button>\n      </template>\n    </dt-input>\n  </div>\n</template>\n\n<script setup>\nimport { DtInput } from '@/components/input';\nimport { DtIcon } from '@/components/icon';\nimport { DtButton } from '@/components/button';\nimport { onMounted, ref } from 'vue';\n\ndefineProps({\n  searchPlaceholderLabel: {\n    type: String,\n    required: true,\n  },\n  modelValue: {\n    type: String,\n    default: '',\n  },\n});\n\nconst emits = defineEmits(['update:modelValue', 'focus-emoji-selector', 'focus-tabset', 'select-first-emoji']);\n\nconst searchInput = ref(null);\n\nfunction clearSearch () {\n  emits('update:modelValue', '');\n  focusSearchInput();\n}\n\nfunction focusSearchInput () {\n  searchInput.value.focus();\n}\nonMounted(() => {\n  focusSearchInput();\n});\n\ndefineExpose({\n  focusSearchInput,\n});\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AAwDA,UAAM,QAAQ;AAEd,UAAM,cAAc,IAAI,IAAI;AAE5B,aAAS,cAAe;AACtB,YAAM,qBAAqB,EAAE;AAC7B;IACF;AAEA,aAAS,mBAAoB;AAC3B,kBAAY,MAAM;IACpB;AACA,cAAU,MAAM;AACd;IACF,CAAC;AAED,aAAa;AAAA,MACX;AAAA,IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"emoji_search.vue.js","sources":["../../../../components/emoji_picker/modules/emoji_search.vue"],"sourcesContent":["<template>\n  <div class=\"d-emoji-picker__search d-emoji-picker__alignment\">\n    <dt-input\n      id=\"searchInput\"\n      ref=\"searchInput\"\n      :placeholder=\"searchPlaceholderLabel\"\n      :model-value=\"modelValue\"\n      @update:model-value=\"$emit('update:modelValue', $event)\"\n      @keydown.up=\"$emit('focus-tabset')\"\n      @keydown.down.prevent=\"$emit('focus-emoji-selector')\"\n      @keydown.enter=\"$emit('select-first-emoji')\"\n    >\n      <template #leftIcon>\n        <dt-icon\n          name=\"search\"\n          size=\"200\"\n        />\n      </template>\n      <template\n        v-if=\"modelValue.length > 0\"\n        #rightIcon\n      >\n        <dt-button\n          importance=\"clear\"\n          size=\"xs\"\n          class=\"d-mrn4\"\n          circle\n          kind=\"muted\"\n          @click=\"clearSearch\"\n        >\n          <template #icon>\n            <dt-icon\n              name=\"close\"\n              size=\"200\"\n            />\n          </template>\n        </dt-button>\n      </template>\n    </dt-input>\n  </div>\n</template>\n\n<script setup>\nimport { DtInput } from '@/components/input';\nimport { DtIcon } from '@/components/icon';\nimport { DtButton } from '@/components/button';\nimport { onMounted, ref } from 'vue';\n\ndefineProps({\n  searchPlaceholderLabel: {\n    type: String,\n    required: true,\n  },\n  modelValue: {\n    type: String,\n    default: '',\n  },\n});\n\nconst emits = defineEmits(['update:modelValue', 'focus-emoji-selector', 'focus-tabset', 'select-first-emoji']);\n\nconst searchInput = ref(null);\n\nfunction clearSearch () {\n  emits('update:modelValue', '');\n  focusSearchInput();\n}\n\nfunction focusSearchInput () {\n  searchInput.value.focus();\n}\nonMounted(() => {\n  focusSearchInput();\n});\n\ndefineExpose({\n  focusSearchInput,\n});\n</script>\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;AA2DA,UAAM,QAAQ;AAEd,UAAM,cAAc,IAAI,IAAI;AAE5B,aAAS,cAAe;AACtB,YAAM,qBAAqB,EAAE;AAC7B;IACF;AAEA,aAAS,mBAAoB;AAC3B,kBAAY,MAAM;IACpB;AACA,cAAU,MAAM;AACd;IACF,CAAC;AAED,aAAa;AAAA,MACX;AAAA,IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/vue3/components/emoji_picker/modules/emoji_tabset.vue.cjs

@@ -127,6 +127,7 @@ const _sfc_main = {
     return (_ctx, _cache) => {
       return vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
         vue.createVNode(vue.unref(tab_group), {
+          size: "sm",
           "tab-list-class": "d-emoji-picker__tabset-list",
           selected: selectedTab.value
         }, {

package/dist/vue3/components/emoji_picker/modules/emoji_tabset.vue.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"emoji_tabset.vue.cjs","sources":["../../../../components/emoji_picker/modules/emoji_tabset.vue"],"sourcesContent":["<template>\n  <div class=\"d-emoji-picker__tabset\">\n    <dt-tab-group\n      tab-list-class=\"d-emoji-picker__tabset-list\"\n      :selected=\"selectedTab\"\n    >\n      <template #tabs>\n        <dt-tab\n          v-for=\"(tab, index) in tabs\"\n          :id=\"tab.id\"\n          :ref=\"el => { if (el) setTabsetRef(el) }\"\n          :key=\"tab.id\"\n          :panel-id=\"tab.panelId\"\n          :label=\"tab.label\"\n          aria-controls=\"d-emoji-picker-list\"\n          :tabindex=\"index + 1\"\n          @click.capture.stop=\"selectTabset(tab.id)\"\n          @keydown=\"handleKeyDown($event, tab.id)\"\n        >\n          <dt-icon\n            size=\"400\"\n            :name=\"tab.icon\"\n          />\n        </dt-tab>\n      </template>\n    </dt-tab-group>\n  </div>\n</template>\n\n<script setup>\nimport { computed, ref, toRefs, watch } from 'vue';\nimport { DtTab, DtTabGroup } from '@/components/tabs';\nimport { DtIcon } from '@/components/icon';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker';\n\nconst props = defineProps({\n  /**\n   * Whether to show the recently used tab or not\n   * @type {Boolean}\n   * @default false\n   */\n  showRecentlyUsedTab: {\n    type: Boolean,\n    default: false,\n  },\n\n  scrollIntoTab: {\n    type: Number,\n    required: true,\n  },\n\n  isScrolling: {\n    type: Boolean,\n    default: false,\n  },\n\n  emojiFilter: {\n    type: String,\n    default: '',\n  },\n\n  /**\n   * The labels for the aria-label\n   * @type {Array}\n   * @required\n   */\n  tabsetLabels: {\n    type: Array,\n    required: true,\n  },\n});\n\nconst emits = defineEmits([\n  /**\n   * Emitted when a tab is selected\n   * @event selected-tabset\n   * @param {String} tabId - The name of the tab that was selected\n   */\n  'selected-tabset',\n\n  'focus-search-input',\n  'focus-skin-selector',\n]);\n\nconst TABS_DATA = [\n  { label: EMOJI_PICKER_CATEGORIES.MOST_RECENTLY_USED, icon: 'clock' },\n  { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: 'satisfied' },\n  { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: 'living-thing' },\n  { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: 'food' },\n  { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: 'object' },\n  { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: 'transportation' },\n  { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: 'lightbulb' },\n  { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: 'heart' },\n  { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: 'flag' },\n];\n\nconst tabs = computed(() => {\n  const tabsData = props.showRecentlyUsedTab ? TABS_DATA : TABS_DATA.slice(1);\n\n  return tabsData.map((tab, index) => ({\n    ...tab,\n    label: props.tabsetLabels[index],\n    id: (index + 1).toString(),\n    panelId: (index + 1).toString(),\n  }));\n});\n\nconst isSearching = computed(() => props.emojiFilter.length > 0);\n\nconst selectedTab = ref('1');\n\nconst { isScrolling } = toRefs(props);\n\nconst tabsetRef = ref([]);\n\nwatch(() => props.scrollIntoTab,\n  () => {\n    if (!isScrolling.value && !isSearching.value) {\n      selectedTab.value = (props.scrollIntoTab + 1).toString();\n    }\n  });\n\nwatch(isSearching,\n  () => {\n    if (isSearching.value) {\n      selectedTab.value = null;\n    }\n  });\n\n/**\n * We are using .capture.stop modifiers on the click event\n * because we don't want to trigger the click event of the\n * dt-tab component\n */\nfunction selectTabset (id) {\n  if (!isScrolling.value) {\n    selectedTab.value = id;\n  }\n  emits('selected-tabset', id);\n}\n\nfunction setTabsetRef (ref) {\n  // We push the $el, because $el is the button inside the dt-tab component\n  // and we need the button to focus it\n  tabsetRef.value.push(ref.$el);\n}\n\nfunction focusTabset () {\n  tabsetRef.value[0].focus();\n}\n\nfunction handleKeyDown (event, tabId) {\n  if (event.key === 'Enter') {\n    selectTabset(tabId);\n    // We blur because seems like the tab component override the selected prop, and it removes the selected style\n    tabsetRef.value[tabId - 1].blur();\n  }\n\n  if (event.key === 'Tab') {\n    event.preventDefault();\n    if (event.shiftKey) {\n      emits('focus-skin-selector');\n    } else {\n      emits('focus-search-input');\n    }\n  }\n\n  if (event.key === 'ArrowDown') {\n    // Jump to search input\n    emits('focus-search-input');\n  }\n}\n\ndefineExpose({\n  focusTabset,\n});\n</script>\n"],"names":["EMOJI_PICKER_CATEGORIES","computed","tab","ref","toRefs","watch"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCA,UAAM,QAAQ;AAqCd,UAAM,QAAQ;AAYd,UAAM,YAAY;AAAA,MAChB,EAAE,OAAOA,uBAAuB,wBAAC,oBAAoB,MAAM,QAAS;AAAA,MACpE,EAAE,OAAOA,uBAAuB,wBAAC,oBAAoB,MAAM,YAAa;AAAA,MACxE,EAAE,OAAOA,uBAAuB,wBAAC,QAAQ,MAAM,eAAgB;AAAA,MAC/D,EAAE,OAAOA,uBAAuB,wBAAC,MAAM,MAAM,OAAQ;AAAA,MACrD,EAAE,OAAOA,uBAAuB,wBAAC,UAAU,MAAM,SAAU;AAAA,MAC3D,EAAE,OAAOA,uBAAuB,wBAAC,QAAQ,MAAM,iBAAkB;AAAA,MACjE,EAAE,OAAOA,uBAAuB,wBAAC,SAAS,MAAM,YAAa;AAAA,MAC7D,EAAE,OAAOA,uBAAuB,wBAAC,SAAS,MAAM,QAAS;AAAA,MACzD,EAAE,OAAOA,uBAAuB,wBAAC,OAAO,MAAM,OAAQ;AAAA,IACxD;AAEA,UAAM,OAAOC,IAAQ,SAAC,MAAM;AAC1B,YAAM,WAAW,MAAM,sBAAsB,YAAY,UAAU,MAAM,CAAC;AAE1E,aAAO,SAAS,IAAI,CAACC,MAAK,WAAW;AAAA,QACnC,GAAGA;AAAA,QACH,OAAO,MAAM,aAAa,KAAK;AAAA,QAC/B,KAAK,QAAQ,GAAG,SAAU;AAAA,QAC1B,UAAU,QAAQ,GAAG,SAAU;AAAA,MAChC,EAAC;AAAA,IACJ,CAAC;AAED,UAAM,cAAcD,IAAQ,SAAC,MAAM,MAAM,YAAY,SAAS,CAAC;AAE/D,UAAM,cAAcE,IAAAA,IAAI,GAAG;AAE3B,UAAM,EAAE,YAAa,IAAGC,WAAO,KAAK;AAEpC,UAAM,YAAYD,IAAAA,IAAI,CAAA,CAAE;AAExBE,QAAAA;AAAAA,MAAM,MAAM,MAAM;AAAA,MAChB,MAAM;AACJ,YAAI,CAAC,YAAY,SAAS,CAAC,YAAY,OAAO;AAC5C,sBAAY,SAAS,MAAM,gBAAgB,GAAG;QAC/C;AAAA,MACL;AAAA,IAAG;AAEHA,QAAAA;AAAAA,MAAM;AAAA,MACJ,MAAM;AACJ,YAAI,YAAY,OAAO;AACrB,sBAAY,QAAQ;AAAA,QACrB;AAAA,MACL;AAAA,IAAG;AAOH,aAAS,aAAc,IAAI;AACzB,UAAI,CAAC,YAAY,OAAO;AACtB,oBAAY,QAAQ;AAAA,MACrB;AACD,YAAM,mBAAmB,EAAE;AAAA,IAC7B;AAEA,aAAS,aAAc,KAAK;AAG1B,gBAAU,MAAM,KAAK,IAAI,GAAG;AAAA,IAC9B;AAEA,aAAS,cAAe;AACtB,gBAAU,MAAM,CAAC,EAAE,MAAK;AAAA,IAC1B;AAEA,aAAS,cAAe,OAAO,OAAO;AACpC,UAAI,MAAM,QAAQ,SAAS;AACzB,qBAAa,KAAK;AAElB,kBAAU,MAAM,QAAQ,CAAC,EAAE,KAAI;AAAA,MAChC;AAED,UAAI,MAAM,QAAQ,OAAO;AACvB,cAAM,eAAc;AACpB,YAAI,MAAM,UAAU;AAClB,gBAAM,qBAAqB;AAAA,QACjC,OAAW;AACL,gBAAM,oBAAoB;AAAA,QAC3B;AAAA,MACF;AAED,UAAI,MAAM,QAAQ,aAAa;AAE7B,cAAM,oBAAoB;AAAA,MAC3B;AAAA,IACH;AAEA,aAAa;AAAA,MACX;AAAA,IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"emoji_tabset.vue.cjs","sources":["../../../../components/emoji_picker/modules/emoji_tabset.vue"],"sourcesContent":["<template>\n  <div class=\"d-emoji-picker__tabset\">\n    <dt-tab-group\n      size=\"sm\"\n      tab-list-class=\"d-emoji-picker__tabset-list\"\n      :selected=\"selectedTab\"\n    >\n      <template #tabs>\n        <dt-tab\n          v-for=\"(tab, index) in tabs\"\n          :id=\"tab.id\"\n          :ref=\"el => { if (el) setTabsetRef(el) }\"\n          :key=\"tab.id\"\n          :panel-id=\"tab.panelId\"\n          :label=\"tab.label\"\n          aria-controls=\"d-emoji-picker-list\"\n          :tabindex=\"index + 1\"\n          @click.capture.stop=\"selectTabset(tab.id)\"\n          @keydown=\"handleKeyDown($event, tab.id)\"\n        >\n          <dt-icon\n            size=\"400\"\n            :name=\"tab.icon\"\n          />\n        </dt-tab>\n      </template>\n    </dt-tab-group>\n  </div>\n</template>\n\n<script setup>\nimport { computed, ref, toRefs, watch } from 'vue';\nimport { DtTab, DtTabGroup } from '@/components/tabs';\nimport { DtIcon } from '@/components/icon';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker';\n\nconst props = defineProps({\n  /**\n   * Whether to show the recently used tab or not\n   * @type {Boolean}\n   * @default false\n   */\n  showRecentlyUsedTab: {\n    type: Boolean,\n    default: false,\n  },\n\n  scrollIntoTab: {\n    type: Number,\n    required: true,\n  },\n\n  isScrolling: {\n    type: Boolean,\n    default: false,\n  },\n\n  emojiFilter: {\n    type: String,\n    default: '',\n  },\n\n  /**\n   * The labels for the aria-label\n   * @type {Array}\n   * @required\n   */\n  tabsetLabels: {\n    type: Array,\n    required: true,\n  },\n});\n\nconst emits = defineEmits([\n  /**\n   * Emitted when a tab is selected\n   * @event selected-tabset\n   * @param {String} tabId - The name of the tab that was selected\n   */\n  'selected-tabset',\n\n  'focus-search-input',\n  'focus-skin-selector',\n]);\n\nconst TABS_DATA = [\n  { label: EMOJI_PICKER_CATEGORIES.MOST_RECENTLY_USED, icon: 'clock' },\n  { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: 'satisfied' },\n  { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: 'living-thing' },\n  { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: 'food' },\n  { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: 'object' },\n  { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: 'transportation' },\n  { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: 'lightbulb' },\n  { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: 'heart' },\n  { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: 'flag' },\n];\n\nconst tabs = computed(() => {\n  const tabsData = props.showRecentlyUsedTab ? TABS_DATA : TABS_DATA.slice(1);\n\n  return tabsData.map((tab, index) => ({\n    ...tab,\n    label: props.tabsetLabels[index],\n    id: (index + 1).toString(),\n    panelId: (index + 1).toString(),\n  }));\n});\n\nconst isSearching = computed(() => props.emojiFilter.length > 0);\n\nconst selectedTab = ref('1');\n\nconst { isScrolling } = toRefs(props);\n\nconst tabsetRef = ref([]);\n\nwatch(() => props.scrollIntoTab,\n  () => {\n    if (!isScrolling.value && !isSearching.value) {\n      selectedTab.value = (props.scrollIntoTab + 1).toString();\n    }\n  });\n\nwatch(isSearching,\n  () => {\n    if (isSearching.value) {\n      selectedTab.value = null;\n    }\n  });\n\n/**\n * We are using .capture.stop modifiers on the click event\n * because we don't want to trigger the click event of the\n * dt-tab component\n */\nfunction selectTabset (id) {\n  if (!isScrolling.value) {\n    selectedTab.value = id;\n  }\n  emits('selected-tabset', id);\n}\n\nfunction setTabsetRef (ref) {\n  // We push the $el, because $el is the button inside the dt-tab component\n  // and we need the button to focus it\n  tabsetRef.value.push(ref.$el);\n}\n\nfunction focusTabset () {\n  tabsetRef.value[0].focus();\n}\n\nfunction handleKeyDown (event, tabId) {\n  if (event.key === 'Enter') {\n    selectTabset(tabId);\n    // We blur because seems like the tab component override the selected prop, and it removes the selected style\n    tabsetRef.value[tabId - 1].blur();\n  }\n\n  if (event.key === 'Tab') {\n    event.preventDefault();\n    if (event.shiftKey) {\n      emits('focus-skin-selector');\n    } else {\n      emits('focus-search-input');\n    }\n  }\n\n  if (event.key === 'ArrowDown') {\n    // Jump to search input\n    emits('focus-search-input');\n  }\n}\n\ndefineExpose({\n  focusTabset,\n});\n</script>\n"],"names":["EMOJI_PICKER_CATEGORIES","computed","tab","ref","toRefs","watch"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,UAAM,QAAQ;AAqCd,UAAM,QAAQ;AAYd,UAAM,YAAY;AAAA,MAChB,EAAE,OAAOA,uBAAuB,wBAAC,oBAAoB,MAAM,QAAS;AAAA,MACpE,EAAE,OAAOA,uBAAuB,wBAAC,oBAAoB,MAAM,YAAa;AAAA,MACxE,EAAE,OAAOA,uBAAuB,wBAAC,QAAQ,MAAM,eAAgB;AAAA,MAC/D,EAAE,OAAOA,uBAAuB,wBAAC,MAAM,MAAM,OAAQ;AAAA,MACrD,EAAE,OAAOA,uBAAuB,wBAAC,UAAU,MAAM,SAAU;AAAA,MAC3D,EAAE,OAAOA,uBAAuB,wBAAC,QAAQ,MAAM,iBAAkB;AAAA,MACjE,EAAE,OAAOA,uBAAuB,wBAAC,SAAS,MAAM,YAAa;AAAA,MAC7D,EAAE,OAAOA,uBAAuB,wBAAC,SAAS,MAAM,QAAS;AAAA,MACzD,EAAE,OAAOA,uBAAuB,wBAAC,OAAO,MAAM,OAAQ;AAAA,IACxD;AAEA,UAAM,OAAOC,IAAQ,SAAC,MAAM;AAC1B,YAAM,WAAW,MAAM,sBAAsB,YAAY,UAAU,MAAM,CAAC;AAE1E,aAAO,SAAS,IAAI,CAACC,MAAK,WAAW;AAAA,QACnC,GAAGA;AAAA,QACH,OAAO,MAAM,aAAa,KAAK;AAAA,QAC/B,KAAK,QAAQ,GAAG,SAAU;AAAA,QAC1B,UAAU,QAAQ,GAAG,SAAU;AAAA,MAChC,EAAC;AAAA,IACJ,CAAC;AAED,UAAM,cAAcD,IAAQ,SAAC,MAAM,MAAM,YAAY,SAAS,CAAC;AAE/D,UAAM,cAAcE,IAAAA,IAAI,GAAG;AAE3B,UAAM,EAAE,YAAa,IAAGC,WAAO,KAAK;AAEpC,UAAM,YAAYD,IAAAA,IAAI,CAAA,CAAE;AAExBE,QAAAA;AAAAA,MAAM,MAAM,MAAM;AAAA,MAChB,MAAM;AACJ,YAAI,CAAC,YAAY,SAAS,CAAC,YAAY,OAAO;AAC5C,sBAAY,SAAS,MAAM,gBAAgB,GAAG;QAC/C;AAAA,MACL;AAAA,IAAG;AAEHA,QAAAA;AAAAA,MAAM;AAAA,MACJ,MAAM;AACJ,YAAI,YAAY,OAAO;AACrB,sBAAY,QAAQ;AAAA,QACrB;AAAA,MACL;AAAA,IAAG;AAOH,aAAS,aAAc,IAAI;AACzB,UAAI,CAAC,YAAY,OAAO;AACtB,oBAAY,QAAQ;AAAA,MACrB;AACD,YAAM,mBAAmB,EAAE;AAAA,IAC7B;AAEA,aAAS,aAAc,KAAK;AAG1B,gBAAU,MAAM,KAAK,IAAI,GAAG;AAAA,IAC9B;AAEA,aAAS,cAAe;AACtB,gBAAU,MAAM,CAAC,EAAE,MAAK;AAAA,IAC1B;AAEA,aAAS,cAAe,OAAO,OAAO;AACpC,UAAI,MAAM,QAAQ,SAAS;AACzB,qBAAa,KAAK;AAElB,kBAAU,MAAM,QAAQ,CAAC,EAAE,KAAI;AAAA,MAChC;AAED,UAAI,MAAM,QAAQ,OAAO;AACvB,cAAM,eAAc;AACpB,YAAI,MAAM,UAAU;AAClB,gBAAM,qBAAqB;AAAA,QACjC,OAAW;AACL,gBAAM,oBAAoB;AAAA,QAC3B;AAAA,MACF;AAED,UAAI,MAAM,QAAQ,aAAa;AAE7B,cAAM,oBAAoB;AAAA,MAC3B;AAAA,IACH;AAEA,aAAa;AAAA,MACX;AAAA,IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/vue3/components/emoji_picker/modules/emoji_tabset.vue.js

@@ -126,6 +126,7 @@ const _sfc_main = {
     return (_ctx, _cache) => {
       return openBlock(), createElementBlock("div", _hoisted_1, [
         createVNode(unref(DtTabGroup), {
+          size: "sm",
           "tab-list-class": "d-emoji-picker__tabset-list",
           selected: selectedTab.value
         }, {

package/dist/vue3/components/emoji_picker/modules/emoji_tabset.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"emoji_tabset.vue.js","sources":["../../../../components/emoji_picker/modules/emoji_tabset.vue"],"sourcesContent":["<template>\n  <div class=\"d-emoji-picker__tabset\">\n    <dt-tab-group\n      tab-list-class=\"d-emoji-picker__tabset-list\"\n      :selected=\"selectedTab\"\n    >\n      <template #tabs>\n        <dt-tab\n          v-for=\"(tab, index) in tabs\"\n          :id=\"tab.id\"\n          :ref=\"el => { if (el) setTabsetRef(el) }\"\n          :key=\"tab.id\"\n          :panel-id=\"tab.panelId\"\n          :label=\"tab.label\"\n          aria-controls=\"d-emoji-picker-list\"\n          :tabindex=\"index + 1\"\n          @click.capture.stop=\"selectTabset(tab.id)\"\n          @keydown=\"handleKeyDown($event, tab.id)\"\n        >\n          <dt-icon\n            size=\"400\"\n            :name=\"tab.icon\"\n          />\n        </dt-tab>\n      </template>\n    </dt-tab-group>\n  </div>\n</template>\n\n<script setup>\nimport { computed, ref, toRefs, watch } from 'vue';\nimport { DtTab, DtTabGroup } from '@/components/tabs';\nimport { DtIcon } from '@/components/icon';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker';\n\nconst props = defineProps({\n  /**\n   * Whether to show the recently used tab or not\n   * @type {Boolean}\n   * @default false\n   */\n  showRecentlyUsedTab: {\n    type: Boolean,\n    default: false,\n  },\n\n  scrollIntoTab: {\n    type: Number,\n    required: true,\n  },\n\n  isScrolling: {\n    type: Boolean,\n    default: false,\n  },\n\n  emojiFilter: {\n    type: String,\n    default: '',\n  },\n\n  /**\n   * The labels for the aria-label\n   * @type {Array}\n   * @required\n   */\n  tabsetLabels: {\n    type: Array,\n    required: true,\n  },\n});\n\nconst emits = defineEmits([\n  /**\n   * Emitted when a tab is selected\n   * @event selected-tabset\n   * @param {String} tabId - The name of the tab that was selected\n   */\n  'selected-tabset',\n\n  'focus-search-input',\n  'focus-skin-selector',\n]);\n\nconst TABS_DATA = [\n  { label: EMOJI_PICKER_CATEGORIES.MOST_RECENTLY_USED, icon: 'clock' },\n  { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: 'satisfied' },\n  { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: 'living-thing' },\n  { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: 'food' },\n  { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: 'object' },\n  { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: 'transportation' },\n  { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: 'lightbulb' },\n  { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: 'heart' },\n  { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: 'flag' },\n];\n\nconst tabs = computed(() => {\n  const tabsData = props.showRecentlyUsedTab ? TABS_DATA : TABS_DATA.slice(1);\n\n  return tabsData.map((tab, index) => ({\n    ...tab,\n    label: props.tabsetLabels[index],\n    id: (index + 1).toString(),\n    panelId: (index + 1).toString(),\n  }));\n});\n\nconst isSearching = computed(() => props.emojiFilter.length > 0);\n\nconst selectedTab = ref('1');\n\nconst { isScrolling } = toRefs(props);\n\nconst tabsetRef = ref([]);\n\nwatch(() => props.scrollIntoTab,\n  () => {\n    if (!isScrolling.value && !isSearching.value) {\n      selectedTab.value = (props.scrollIntoTab + 1).toString();\n    }\n  });\n\nwatch(isSearching,\n  () => {\n    if (isSearching.value) {\n      selectedTab.value = null;\n    }\n  });\n\n/**\n * We are using .capture.stop modifiers on the click event\n * because we don't want to trigger the click event of the\n * dt-tab component\n */\nfunction selectTabset (id) {\n  if (!isScrolling.value) {\n    selectedTab.value = id;\n  }\n  emits('selected-tabset', id);\n}\n\nfunction setTabsetRef (ref) {\n  // We push the $el, because $el is the button inside the dt-tab component\n  // and we need the button to focus it\n  tabsetRef.value.push(ref.$el);\n}\n\nfunction focusTabset () {\n  tabsetRef.value[0].focus();\n}\n\nfunction handleKeyDown (event, tabId) {\n  if (event.key === 'Enter') {\n    selectTabset(tabId);\n    // We blur because seems like the tab component override the selected prop, and it removes the selected style\n    tabsetRef.value[tabId - 1].blur();\n  }\n\n  if (event.key === 'Tab') {\n    event.preventDefault();\n    if (event.shiftKey) {\n      emits('focus-skin-selector');\n    } else {\n      emits('focus-search-input');\n    }\n  }\n\n  if (event.key === 'ArrowDown') {\n    // Jump to search input\n    emits('focus-search-input');\n  }\n}\n\ndefineExpose({\n  focusTabset,\n});\n</script>\n"],"names":["ref"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCA,UAAM,QAAQ;AAqCd,UAAM,QAAQ;AAYd,UAAM,YAAY;AAAA,MAChB,EAAE,OAAO,wBAAwB,oBAAoB,MAAM,QAAS;AAAA,MACpE,EAAE,OAAO,wBAAwB,oBAAoB,MAAM,YAAa;AAAA,MACxE,EAAE,OAAO,wBAAwB,QAAQ,MAAM,eAAgB;AAAA,MAC/D,EAAE,OAAO,wBAAwB,MAAM,MAAM,OAAQ;AAAA,MACrD,EAAE,OAAO,wBAAwB,UAAU,MAAM,SAAU;AAAA,MAC3D,EAAE,OAAO,wBAAwB,QAAQ,MAAM,iBAAkB;AAAA,MACjE,EAAE,OAAO,wBAAwB,SAAS,MAAM,YAAa;AAAA,MAC7D,EAAE,OAAO,wBAAwB,SAAS,MAAM,QAAS;AAAA,MACzD,EAAE,OAAO,wBAAwB,OAAO,MAAM,OAAQ;AAAA,IACxD;AAEA,UAAM,OAAO,SAAS,MAAM;AAC1B,YAAM,WAAW,MAAM,sBAAsB,YAAY,UAAU,MAAM,CAAC;AAE1E,aAAO,SAAS,IAAI,CAAC,KAAK,WAAW;AAAA,QACnC,GAAG;AAAA,QACH,OAAO,MAAM,aAAa,KAAK;AAAA,QAC/B,KAAK,QAAQ,GAAG,SAAU;AAAA,QAC1B,UAAU,QAAQ,GAAG,SAAU;AAAA,MAChC,EAAC;AAAA,IACJ,CAAC;AAED,UAAM,cAAc,SAAS,MAAM,MAAM,YAAY,SAAS,CAAC;AAE/D,UAAM,cAAc,IAAI,GAAG;AAE3B,UAAM,EAAE,YAAa,IAAG,OAAO,KAAK;AAEpC,UAAM,YAAY,IAAI,CAAA,CAAE;AAExB;AAAA,MAAM,MAAM,MAAM;AAAA,MAChB,MAAM;AACJ,YAAI,CAAC,YAAY,SAAS,CAAC,YAAY,OAAO;AAC5C,sBAAY,SAAS,MAAM,gBAAgB,GAAG;QAC/C;AAAA,MACL;AAAA,IAAG;AAEH;AAAA,MAAM;AAAA,MACJ,MAAM;AACJ,YAAI,YAAY,OAAO;AACrB,sBAAY,QAAQ;AAAA,QACrB;AAAA,MACL;AAAA,IAAG;AAOH,aAAS,aAAc,IAAI;AACzB,UAAI,CAAC,YAAY,OAAO;AACtB,oBAAY,QAAQ;AAAA,MACrB;AACD,YAAM,mBAAmB,EAAE;AAAA,IAC7B;AAEA,aAAS,aAAcA,MAAK;AAG1B,gBAAU,MAAM,KAAKA,KAAI,GAAG;AAAA,IAC9B;AAEA,aAAS,cAAe;AACtB,gBAAU,MAAM,CAAC,EAAE,MAAK;AAAA,IAC1B;AAEA,aAAS,cAAe,OAAO,OAAO;AACpC,UAAI,MAAM,QAAQ,SAAS;AACzB,qBAAa,KAAK;AAElB,kBAAU,MAAM,QAAQ,CAAC,EAAE,KAAI;AAAA,MAChC;AAED,UAAI,MAAM,QAAQ,OAAO;AACvB,cAAM,eAAc;AACpB,YAAI,MAAM,UAAU;AAClB,gBAAM,qBAAqB;AAAA,QACjC,OAAW;AACL,gBAAM,oBAAoB;AAAA,QAC3B;AAAA,MACF;AAED,UAAI,MAAM,QAAQ,aAAa;AAE7B,cAAM,oBAAoB;AAAA,MAC3B;AAAA,IACH;AAEA,aAAa;AAAA,MACX;AAAA,IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"emoji_tabset.vue.js","sources":["../../../../components/emoji_picker/modules/emoji_tabset.vue"],"sourcesContent":["<template>\n  <div class=\"d-emoji-picker__tabset\">\n    <dt-tab-group\n      size=\"sm\"\n      tab-list-class=\"d-emoji-picker__tabset-list\"\n      :selected=\"selectedTab\"\n    >\n      <template #tabs>\n        <dt-tab\n          v-for=\"(tab, index) in tabs\"\n          :id=\"tab.id\"\n          :ref=\"el => { if (el) setTabsetRef(el) }\"\n          :key=\"tab.id\"\n          :panel-id=\"tab.panelId\"\n          :label=\"tab.label\"\n          aria-controls=\"d-emoji-picker-list\"\n          :tabindex=\"index + 1\"\n          @click.capture.stop=\"selectTabset(tab.id)\"\n          @keydown=\"handleKeyDown($event, tab.id)\"\n        >\n          <dt-icon\n            size=\"400\"\n            :name=\"tab.icon\"\n          />\n        </dt-tab>\n      </template>\n    </dt-tab-group>\n  </div>\n</template>\n\n<script setup>\nimport { computed, ref, toRefs, watch } from 'vue';\nimport { DtTab, DtTabGroup } from '@/components/tabs';\nimport { DtIcon } from '@/components/icon';\nimport { EMOJI_PICKER_CATEGORIES } from '@/components/emoji_picker';\n\nconst props = defineProps({\n  /**\n   * Whether to show the recently used tab or not\n   * @type {Boolean}\n   * @default false\n   */\n  showRecentlyUsedTab: {\n    type: Boolean,\n    default: false,\n  },\n\n  scrollIntoTab: {\n    type: Number,\n    required: true,\n  },\n\n  isScrolling: {\n    type: Boolean,\n    default: false,\n  },\n\n  emojiFilter: {\n    type: String,\n    default: '',\n  },\n\n  /**\n   * The labels for the aria-label\n   * @type {Array}\n   * @required\n   */\n  tabsetLabels: {\n    type: Array,\n    required: true,\n  },\n});\n\nconst emits = defineEmits([\n  /**\n   * Emitted when a tab is selected\n   * @event selected-tabset\n   * @param {String} tabId - The name of the tab that was selected\n   */\n  'selected-tabset',\n\n  'focus-search-input',\n  'focus-skin-selector',\n]);\n\nconst TABS_DATA = [\n  { label: EMOJI_PICKER_CATEGORIES.MOST_RECENTLY_USED, icon: 'clock' },\n  { label: EMOJI_PICKER_CATEGORIES.SMILEYS_AND_PEOPLE, icon: 'satisfied' },\n  { label: EMOJI_PICKER_CATEGORIES.NATURE, icon: 'living-thing' },\n  { label: EMOJI_PICKER_CATEGORIES.FOOD, icon: 'food' },\n  { label: EMOJI_PICKER_CATEGORIES.ACTIVITY, icon: 'object' },\n  { label: EMOJI_PICKER_CATEGORIES.TRAVEL, icon: 'transportation' },\n  { label: EMOJI_PICKER_CATEGORIES.OBJECTS, icon: 'lightbulb' },\n  { label: EMOJI_PICKER_CATEGORIES.SYMBOLS, icon: 'heart' },\n  { label: EMOJI_PICKER_CATEGORIES.FLAGS, icon: 'flag' },\n];\n\nconst tabs = computed(() => {\n  const tabsData = props.showRecentlyUsedTab ? TABS_DATA : TABS_DATA.slice(1);\n\n  return tabsData.map((tab, index) => ({\n    ...tab,\n    label: props.tabsetLabels[index],\n    id: (index + 1).toString(),\n    panelId: (index + 1).toString(),\n  }));\n});\n\nconst isSearching = computed(() => props.emojiFilter.length > 0);\n\nconst selectedTab = ref('1');\n\nconst { isScrolling } = toRefs(props);\n\nconst tabsetRef = ref([]);\n\nwatch(() => props.scrollIntoTab,\n  () => {\n    if (!isScrolling.value && !isSearching.value) {\n      selectedTab.value = (props.scrollIntoTab + 1).toString();\n    }\n  });\n\nwatch(isSearching,\n  () => {\n    if (isSearching.value) {\n      selectedTab.value = null;\n    }\n  });\n\n/**\n * We are using .capture.stop modifiers on the click event\n * because we don't want to trigger the click event of the\n * dt-tab component\n */\nfunction selectTabset (id) {\n  if (!isScrolling.value) {\n    selectedTab.value = id;\n  }\n  emits('selected-tabset', id);\n}\n\nfunction setTabsetRef (ref) {\n  // We push the $el, because $el is the button inside the dt-tab component\n  // and we need the button to focus it\n  tabsetRef.value.push(ref.$el);\n}\n\nfunction focusTabset () {\n  tabsetRef.value[0].focus();\n}\n\nfunction handleKeyDown (event, tabId) {\n  if (event.key === 'Enter') {\n    selectTabset(tabId);\n    // We blur because seems like the tab component override the selected prop, and it removes the selected style\n    tabsetRef.value[tabId - 1].blur();\n  }\n\n  if (event.key === 'Tab') {\n    event.preventDefault();\n    if (event.shiftKey) {\n      emits('focus-skin-selector');\n    } else {\n      emits('focus-search-input');\n    }\n  }\n\n  if (event.key === 'ArrowDown') {\n    // Jump to search input\n    emits('focus-search-input');\n  }\n}\n\ndefineExpose({\n  focusTabset,\n});\n</script>\n"],"names":["ref"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAoCA,UAAM,QAAQ;AAqCd,UAAM,QAAQ;AAYd,UAAM,YAAY;AAAA,MAChB,EAAE,OAAO,wBAAwB,oBAAoB,MAAM,QAAS;AAAA,MACpE,EAAE,OAAO,wBAAwB,oBAAoB,MAAM,YAAa;AAAA,MACxE,EAAE,OAAO,wBAAwB,QAAQ,MAAM,eAAgB;AAAA,MAC/D,EAAE,OAAO,wBAAwB,MAAM,MAAM,OAAQ;AAAA,MACrD,EAAE,OAAO,wBAAwB,UAAU,MAAM,SAAU;AAAA,MAC3D,EAAE,OAAO,wBAAwB,QAAQ,MAAM,iBAAkB;AAAA,MACjE,EAAE,OAAO,wBAAwB,SAAS,MAAM,YAAa;AAAA,MAC7D,EAAE,OAAO,wBAAwB,SAAS,MAAM,QAAS;AAAA,MACzD,EAAE,OAAO,wBAAwB,OAAO,MAAM,OAAQ;AAAA,IACxD;AAEA,UAAM,OAAO,SAAS,MAAM;AAC1B,YAAM,WAAW,MAAM,sBAAsB,YAAY,UAAU,MAAM,CAAC;AAE1E,aAAO,SAAS,IAAI,CAAC,KAAK,WAAW;AAAA,QACnC,GAAG;AAAA,QACH,OAAO,MAAM,aAAa,KAAK;AAAA,QAC/B,KAAK,QAAQ,GAAG,SAAU;AAAA,QAC1B,UAAU,QAAQ,GAAG,SAAU;AAAA,MAChC,EAAC;AAAA,IACJ,CAAC;AAED,UAAM,cAAc,SAAS,MAAM,MAAM,YAAY,SAAS,CAAC;AAE/D,UAAM,cAAc,IAAI,GAAG;AAE3B,UAAM,EAAE,YAAa,IAAG,OAAO,KAAK;AAEpC,UAAM,YAAY,IAAI,CAAA,CAAE;AAExB;AAAA,MAAM,MAAM,MAAM;AAAA,MAChB,MAAM;AACJ,YAAI,CAAC,YAAY,SAAS,CAAC,YAAY,OAAO;AAC5C,sBAAY,SAAS,MAAM,gBAAgB,GAAG;QAC/C;AAAA,MACL;AAAA,IAAG;AAEH;AAAA,MAAM;AAAA,MACJ,MAAM;AACJ,YAAI,YAAY,OAAO;AACrB,sBAAY,QAAQ;AAAA,QACrB;AAAA,MACL;AAAA,IAAG;AAOH,aAAS,aAAc,IAAI;AACzB,UAAI,CAAC,YAAY,OAAO;AACtB,oBAAY,QAAQ;AAAA,MACrB;AACD,YAAM,mBAAmB,EAAE;AAAA,IAC7B;AAEA,aAAS,aAAcA,MAAK;AAG1B,gBAAU,MAAM,KAAKA,KAAI,GAAG;AAAA,IAC9B;AAEA,aAAS,cAAe;AACtB,gBAAU,MAAM,CAAC,EAAE,MAAK;AAAA,IAC1B;AAEA,aAAS,cAAe,OAAO,OAAO;AACpC,UAAI,MAAM,QAAQ,SAAS;AACzB,qBAAa,KAAK;AAElB,kBAAU,MAAM,QAAQ,CAAC,EAAE,KAAI;AAAA,MAChC;AAED,UAAI,MAAM,QAAQ,OAAO;AACvB,cAAM,eAAc;AACpB,YAAI,MAAM,UAAU;AAClB,gBAAM,qBAAqB;AAAA,QACjC,OAAW;AACL,gBAAM,oBAAoB;AAAA,QAC3B;AAAA,MACF;AAED,UAAI,MAAM,QAAQ,aAAa;AAE7B,cAAM,oBAAoB;AAAA,MAC3B;AAAA,IACH;AAEA,aAAa;AAAA,MACX;AAAA,IACF,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@dialpad/dialtone",
-  "version": "9.71.0",
+  "version": "9.72.1",
   "description": "Dialpad's Dialtone design system monorepo",
   "files": [
     "dist"
@@ -73,9 +73,9 @@
     "regex-combined-emojis": "1.6.0",
     "stylelint": "15.11.0",
     "tippy.js": "6.3.7",
-    "@dialpad/dialtone-tokens": "1.35.0",
-    "@dialpad/dialtone-emojis": "1.0.8",
-    "@dialpad/dialtone-icons": "4.26.6"
+    "@dialpad/dialtone-icons": "4.26.7",
+    "@dialpad/dialtone-tokens": "1.36.0",
+    "@dialpad/dialtone-emojis": "1.0.8"
   },
   "devDependencies": {
     "@commitlint/cli": "^18.4.3",

package/dist/tokens/themes/chunks/tokens-base-dark-C_VClg5s.js

@@ -1,4 +0,0 @@
-const o = ':root{color-scheme:dark;--dt-font-size-100: 1.2rem;--dt-font-size-200: 1.5rem;--dt-font-size-300: 1.9rem;--dt-font-size-400: 2.7rem;--dt-font-size-500: 3.8rem;--dt-font-family-body: -apple-system, BlinkMacSystemFont, "SF Pro", "Segoe UI Adjusted", "Segoe UI", SFMono, "Helvetica Neue", Cantarell, Ubuntu, Roboto, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--dt-font-family-expressive: Archivo, -apple-system, BlinkMacSystemFont, "SF Pro", "Segoe UI Adjusted", "Segoe UI", SFMono, "Helvetica Neue", Cantarell, Ubuntu, Roboto, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--dt-font-family-mono: SFMono-Regular, "SF Mono", Consolas, "Liberation Mono", Menlo, Courier, monospace;--dt-font-line-height-100: 1;--dt-font-line-height-200: 1.2;--dt-font-line-height-300: 1.4;--dt-font-line-height-400: 1.6;--dt-font-line-height-500: 1.8;--dt-font-line-height-600: 2;--dt-font-weight-normal: 400;--dt-font-weight-medium: 500;--dt-font-weight-semi-bold: 600;--dt-font-weight-bold: 700;--dt-font-text-case-uppercase: uppercase;--dt-font-text-case-lowercase: lowercase;--dt-font-text-case-capitalize: capitalize;--dt-font-text-case-none: none;--dt-size-0: 0rem;--dt-size-50: .05rem;--dt-size-100: .1rem;--dt-size-200: .2rem;--dt-size-300: .4rem;--dt-size-350: .6rem;--dt-size-400: .8rem;--dt-size-450: 1.2rem;--dt-size-500: 1.6rem;--dt-size-525: 2rem;--dt-size-550: 2.4rem;--dt-size-600: 3.2rem;--dt-size-625: 4.2rem;--dt-size-650: 4.8rem;--dt-size-700: 6.4rem;--dt-size-720: 7.2rem;--dt-size-730: 8.4rem;--dt-size-750: 9.6rem;--dt-size-760: 10.2rem;--dt-size-775: 11.4rem;--dt-size-800: 12.8rem;--dt-size-825: 16.4rem;--dt-size-850: 19.2rem;--dt-size-875: 21.6rem;--dt-size-900: 25.6rem;--dt-size-905: 26.4rem;--dt-size-925: 33.2rem;--dt-size-950: 38.4rem;--dt-size-975: 46.4rem;--dt-size-1000: 51.2rem;--dt-size-1020: 62.8rem;--dt-size-1040: 76.4rem;--dt-size-1050: 76.8rem;--dt-size-1060: 82.8rem;--dt-size-1080: 91.2rem;--dt-size-1100: 102.4rem;--dt-size-1115: 114rem;--dt-size-1120: 126.8rem;--dt-size-1125: 128rem;--dt-size-1130: 134rem;--dt-size-1150: 153.6rem;--dt-size-1200: 204.8rem;--dt-size-border-0: 0rem;--dt-size-border-50: .05rem;--dt-size-border-100: .1rem;--dt-size-border-150: .15rem;--dt-size-border-200: .2rem;--dt-size-border-300: .4rem;--dt-size-border-400: .8rem;--dt-size-50-negative: -.05rem;--dt-size-100-negative: -.1rem;--dt-size-200-negative: -.2rem;--dt-size-300-negative: -.4rem;--dt-size-350-negative: -.6rem;--dt-size-400-negative: -.8rem;--dt-size-450-negative: -1.2rem;--dt-size-500-negative: -1.6rem;--dt-size-525-negative: -2rem;--dt-size-550-negative: -2.4rem;--dt-size-600-negative: -3.2rem;--dt-size-625-negative: -4.2rem;--dt-size-650-negative: -4.8rem;--dt-size-700-negative: -6.4rem;--dt-size-720-negative: -7.2rem;--dt-size-730-negative: -8.4rem;--dt-size-750-negative: -9.6rem;--dt-size-760-negative: -10.2rem;--dt-size-775-negative: -11.4rem;--dt-size-800-negative: -12.8rem;--dt-size-825-negative: -16.4rem;--dt-size-850-negative: -19.2rem;--dt-size-875-negative: -21.6rem;--dt-size-900-negative: -25.6rem;--dt-size-905-negative: -26.4rem;--dt-size-925-negative: -33.2rem;--dt-size-950-negative: -38.4rem;--dt-size-975-negative: -46.4rem;--dt-size-1000-negative: -51.2rem;--dt-size-1020-negative: -62.8rem;--dt-size-1040-negative: -76.4rem;--dt-size-1050-negative: -76.8rem;--dt-size-1060-negative: -82.8rem;--dt-size-1080-negative: -91.2rem;--dt-size-1100-negative: -102.4rem;--dt-size-1115-negative: -114rem;--dt-size-1120-negative: -126.8rem;--dt-size-1125-negative: -128rem;--dt-size-1130-negative: -134rem;--dt-size-1150-negative: -153.6rem;--dt-size-1200-negative: -204.8rem;--dt-size-0-percent: 0%;--dt-size-5-percent: 5%;--dt-size-10-percent: 10%;--dt-size-20-percent: 20%;--dt-size-25-percent: 25%;--dt-size-30-percent: 30%;--dt-size-33-percent: 33.333%;--dt-size-40-percent: 40%;--dt-size-50-percent: 50%;--dt-size-60-percent: 60%;--dt-size-66-percent: 66.7%;--dt-size-70-percent: 70%;--dt-size-75-percent: 75%;--dt-size-80-percent: 80%;--dt-size-90-percent: 90%;--dt-size-95-percent: 95%;--dt-size-100-percent: 100%;--dt-size-radius-0: 0rem;--dt-size-radius-100: .1rem;--dt-size-radius-200: .2rem;--dt-size-radius-300: .4rem;--dt-size-radius-400: .8rem;--dt-size-radius-500: 1.6rem;--dt-size-radius-600: 3.2rem;--dt-size-radius-pill: 10.2rem;--dt-size-radius-circle: 50%;--dt-space-0: 0rem;--dt-space-50: .05rem;--dt-space-100: .1rem;--dt-space-200: .2rem;--dt-space-300: .4rem;--dt-space-350: .6rem;--dt-space-400: .8rem;--dt-space-450: 1.2rem;--dt-space-500: 1.6rem;--dt-space-525: 2rem;--dt-space-550: 2.4rem;--dt-space-600: 3.2rem;--dt-space-625: 4.2rem;--dt-space-650: 4.8rem;--dt-space-700: 6.4rem;--dt-space-720: 7.2rem;--dt-space-730: 8.4rem;--dt-space-750: 9.6rem;--dt-space-760: 10.2rem;--dt-space-775: 11.4rem;--dt-space-800: 12.8rem;--dt-space-825: 16.4rem;--dt-space-850: 19.2rem;--dt-space-875: 21.6rem;--dt-space-900: 25.6rem;--dt-space-905: 26.4rem;--dt-space-925: 33.2rem;--dt-space-950: 38.4rem;--dt-space-975: 46.4rem;--dt-space-1000: 51.2rem;--dt-space-1020: 62.8rem;--dt-space-1040: 76.4rem;--dt-space-1050: 76.8rem;--dt-space-1060: 82.8rem;--dt-space-1080: 91.2rem;--dt-space-1100: 102.4rem;--dt-space-1115: 114rem;--dt-space-1120: 126.8rem;--dt-space-1125: 128rem;--dt-space-1130: 134rem;--dt-space-1150: 153.6rem;--dt-space-1200: 204.8rem;--dt-space-50-negative: -.05rem;--dt-space-100-negative: -.1rem;--dt-space-200-negative: -.2rem;--dt-space-300-negative: -.4rem;--dt-space-350-negative: -.6rem;--dt-space-400-negative: -.8rem;--dt-space-450-negative: -1.2rem;--dt-space-500-negative: -1.6rem;--dt-space-525-negative: -2rem;--dt-space-550-negative: -2.4rem;--dt-space-600-negative: -3.2rem;--dt-space-625-negative: -4.2rem;--dt-space-650-negative: -4.8rem;--dt-space-700-negative: -6.4rem;--dt-space-720-negative: -7.2rem;--dt-space-730-negative: -8.4rem;--dt-space-750-negative: -9.6rem;--dt-space-760-negative: -10.2rem;--dt-space-775-negative: -11.4rem;--dt-space-800-negative: -12.8rem;--dt-space-825-negative: -16.4rem;--dt-space-850-negative: -19.2rem;--dt-space-875-negative: -21.6rem;--dt-space-900-negative: -25.6rem;--dt-space-905-negative: -26.4rem;--dt-space-925-negative: -33.2rem;--dt-space-950-negative: -38.4rem;--dt-space-975-negative: -46.4rem;--dt-space-1000-negative: -51.2rem;--dt-space-1020-negative: -62.8rem;--dt-space-1040-negative: -76.4rem;--dt-space-1050-negative: -76.8rem;--dt-space-1060-negative: -82.8rem;--dt-space-1080-negative: -91.2rem;--dt-space-1100-negative: -102.4rem;--dt-space-1115-negative: -114rem;--dt-space-1120-negative: -126.8rem;--dt-space-1125-negative: -128rem;--dt-space-1130-negative: -134rem;--dt-space-1150-negative: -153.6rem;--dt-space-1200-negative: -204.8rem;--dt-space-0-percent: 0%;--dt-space-5-percent: 5%;--dt-space-10-percent: 10%;--dt-space-20-percent: 20%;--dt-space-25-percent: 25%;--dt-space-30-percent: 30%;--dt-space-33-percent: 33.333%;--dt-space-40-percent: 40%;--dt-space-50-percent: 50%;--dt-space-60-percent: 60%;--dt-space-66-percent: 66.7%;--dt-space-70-percent: 70%;--dt-space-75-percent: 75%;--dt-space-80-percent: 80%;--dt-space-90-percent: 90%;--dt-space-95-percent: 95%;--dt-space-100-percent: 100%;--dt-color-neutral-white-h: 0;--dt-color-neutral-white-s: 0%;--dt-color-neutral-white-l: 100%;--dt-color-neutral-white-hsl: var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l);--dt-color-neutral-white-hsla: hsla(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--alpha, 100%));--dt-color-neutral-white: #ffffff;--dt-color-neutral-black-h: 0;--dt-color-neutral-black-s: 0%;--dt-color-neutral-black-l: 0%;--dt-color-neutral-black-hsl: var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l);--dt-color-neutral-black-hsla: hsla(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--alpha, 100%));--dt-color-neutral-black: #000000;--dt-color-neutral-transparent-h: 0;--dt-color-neutral-transparent-s: 0%;--dt-color-neutral-transparent-l: 0%;--dt-color-neutral-transparent-hsl: var(--dt-color-neutral-transparent-h) var(--dt-color-neutral-transparent-s) var(--dt-color-neutral-transparent-l);--dt-color-neutral-transparent-hsla: hsla(var(--dt-color-neutral-transparent-h) var(--dt-color-neutral-transparent-s) var(--dt-color-neutral-transparent-l) / var(--alpha, 100%));--dt-color-neutral-transparent: transparent;--dt-color-black-100-h: 0;--dt-color-black-100-s: 0%;--dt-color-black-100-l: 0%;--dt-color-black-100-hsl: var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l);--dt-color-black-100-hsla: hsla(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--alpha, 100%));--dt-color-black-100: #000000;--dt-color-black-200-h: 0;--dt-color-black-200-s: 0%;--dt-color-black-200-l: 14.901960784313726%;--dt-color-black-200-hsl: var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l);--dt-color-black-200-hsla: hsla(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--alpha, 100%));--dt-color-black-200: #262626;--dt-color-black-300-h: 0;--dt-color-black-300-s: 0%;--dt-color-black-300-l: 22.745098039215687%;--dt-color-black-300-hsl: var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l);--dt-color-black-300-hsla: hsla(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--alpha, 100%));--dt-color-black-300: #3A3A3A;--dt-color-black-400-h: 0;--dt-color-black-400-s: 0%;--dt-color-black-400-l: 33.33333333333333%;--dt-color-black-400-hsl: var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l);--dt-color-black-400-hsla: hsla(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--alpha, 100%));--dt-color-black-400: #555555;--dt-color-black-500-h: 0;--dt-color-black-500-s: 0%;--dt-color-black-500-l: 50.19607843137255%;--dt-color-black-500-hsl: var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l);--dt-color-black-500-hsla: hsla(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--alpha, 100%));--dt-color-black-500: #808080;--dt-color-black-600-h: 0;--dt-color-black-600-s: 0%;--dt-color-black-600-l: 66.66666666666666%;--dt-color-black-600-hsl: var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l);--dt-color-black-600-hsla: hsla(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--alpha, 100%));--dt-color-black-600: #AAAAAA;--dt-color-black-700-h: 0;--dt-color-black-700-s: 0%;--dt-color-black-700-l: 76.07843137254902%;--dt-color-black-700-hsl: var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l);--dt-color-black-700-hsla: hsla(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--alpha, 100%));--dt-color-black-700: #C2C2C2;--dt-color-black-800-h: 0;--dt-color-black-800-s: 0%;--dt-color-black-800-l: 83.13725490196079%;--dt-color-black-800-hsl: var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l);--dt-color-black-800-hsla: hsla(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--alpha, 100%));--dt-color-black-800: #D4D4D4;--dt-color-black-900-h: 0;--dt-color-black-900-s: 0%;--dt-color-black-900-l: 90.19607843137256%;--dt-color-black-900-hsl: var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l);--dt-color-black-900-hsla: hsla(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--alpha, 100%));--dt-color-black-900: #E6E6E6;--dt-color-purple-100-h: 260;--dt-color-purple-100-s: 91.30434782608695%;--dt-color-purple-100-l: 9.019607843137255%;--dt-color-purple-100-hsl: var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l);--dt-color-purple-100-hsla: hsla(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--alpha, 100%));--dt-color-purple-100: #10022C;--dt-color-purple-200-h: 254.49999999999997;--dt-color-purple-200-s: 67.41573033707866%;--dt-color-purple-200-l: 34.90196078431373%;--dt-color-purple-200-hsl: var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l);--dt-color-purple-200-hsla: hsla(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--alpha, 100%));--dt-color-purple-200: #3A1D95;--dt-color-purple-300-h: 254.5664739884393;--dt-color-purple-300-s: 100%;--dt-color-purple-300-l: 66.07843137254902%;--dt-color-purple-300-hsl: var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l);--dt-color-purple-300-hsla: hsla(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--alpha, 100%));--dt-color-purple-300: #7C52FF;--dt-color-purple-400-h: 260.9302325581395;--dt-color-purple-400-s: 100%;--dt-color-purple-400-l: 74.70588235294117%;--dt-color-purple-400-hsl: var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l);--dt-color-purple-400-hsla: hsla(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--alpha, 100%));--dt-color-purple-400: #AB7EFF;--dt-color-purple-500-h: 260.35714285714283;--dt-color-purple-500-s: 100%;--dt-color-purple-500-l: 89.01960784313725%;--dt-color-purple-500-hsl: var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l);--dt-color-purple-500-hsla: hsla(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--alpha, 100%));--dt-color-purple-500: #DAC7FF;--dt-color-purple-600-h: 260.00000000000006;--dt-color-purple-600-s: 100%;--dt-color-purple-600-l: 97.05882352941177%;--dt-color-purple-600-hsl: var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l);--dt-color-purple-600-hsla: hsla(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--alpha, 100%));--dt-color-purple-600: #F5F0FF;--dt-color-blue-100-h: 212.77777777777777;--dt-color-blue-100-s: 98.18181818181819%;--dt-color-blue-100-l: 21.56862745098039%;--dt-color-blue-100-hsl: var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l);--dt-color-blue-100-hsla: hsla(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--alpha, 100%));--dt-color-blue-100: #01326D;--dt-color-blue-200-h: 212.22857142857146;--dt-color-blue-200-s: 79.18552036199095%;--dt-color-blue-200-l: 43.333333333333336%;--dt-color-blue-200-hsl: var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l);--dt-color-blue-200-hsla: hsla(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--alpha, 100%));--dt-color-blue-200: #1768C6;--dt-color-blue-300-h: 212.60115606936418;--dt-color-blue-300-s: 98.85714285714286%;--dt-color-blue-300-l: 65.68627450980392%;--dt-color-blue-300-hsl: var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l);--dt-color-blue-300-hsla: hsla(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--alpha, 100%));--dt-color-blue-300: #51A0FE;--dt-color-blue-400-h: 212.35294117647058;--dt-color-blue-400-s: 100%;--dt-color-blue-400-l: 80%;--dt-color-blue-400-hsl: var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l);--dt-color-blue-400-hsla: hsla(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--alpha, 100%));--dt-color-blue-400: #99C8FF;--dt-color-blue-500-h: 210;--dt-color-blue-500-s: 61.538461538461554%;--dt-color-blue-500-l: 94.90196078431372%;--dt-color-blue-500-hsl: var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l);--dt-color-blue-500-hsla: hsla(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--alpha, 100%));--dt-color-blue-500: #EAF2FA;--dt-color-magenta-100-h: 325.86206896551727;--dt-color-magenta-100-s: 52.72727272727272%;--dt-color-magenta-100-l: 21.568627450980394%;--dt-color-magenta-100-hsl: var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l);--dt-color-magenta-100-hsla: hsla(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--alpha, 100%));--dt-color-magenta-100: #541A3B;--dt-color-magenta-200-h: 325.7142857142857;--dt-color-magenta-200-s: 81.81818181818181%;--dt-color-magenta-200-l: 30.196078431372552%;--dt-color-magenta-200-hsl: var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l);--dt-color-magenta-200-hsla: hsla(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--alpha, 100%));--dt-color-magenta-200: #8C0E56;--dt-color-magenta-300-h: 325.7831325301205;--dt-color-magenta-300-s: 100%;--dt-color-magenta-300-l: 48.8235294117647%;--dt-color-magenta-300-hsl: var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l);--dt-color-magenta-300-hsla: hsla(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--alpha, 100%));--dt-color-magenta-300: #F9008E;--dt-color-magenta-400-h: 325.86206896551727;--dt-color-magenta-400-s: 90.62500000000001%;--dt-color-magenta-400-l: 74.90196078431373%;--dt-color-magenta-400-hsl: var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l);--dt-color-magenta-400-hsla: hsla(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--alpha, 100%));--dt-color-magenta-400: #F985C7;--dt-color-magenta-500-h: 325.16129032258067;--dt-color-magenta-500-s: 100%;--dt-color-magenta-500-l: 93.92156862745098%;--dt-color-magenta-500-hsl: var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l);--dt-color-magenta-500-hsla: hsla(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--alpha, 100%));--dt-color-magenta-500: #FFE0F2;--dt-color-gold-100-h: 35.70247933884298;--dt-color-gold-100-s: 88.32116788321169%;--dt-color-gold-100-l: 26.862745098039216%;--dt-color-gold-100-hsl: var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l);--dt-color-gold-100-hsla: hsla(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--alpha, 100%));--dt-color-gold-100: #815008;--dt-color-gold-200-h: 35.92814371257486;--dt-color-gold-200-s: 66.00790513833991%;--dt-color-gold-200-l: 49.6078431372549%;--dt-color-gold-200-hsl: var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l);--dt-color-gold-200-hsla: hsla(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--alpha, 100%));--dt-color-gold-200: #D28F2B;--dt-color-gold-300-h: 35.80645161290322;--dt-color-gold-300-s: 91.17647058823533%;--dt-color-gold-300-l: 60%;--dt-color-gold-300-hsl: var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l);--dt-color-gold-300-hsla: hsla(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--alpha, 100%));--dt-color-gold-300: #F6AB3C;--dt-color-gold-400-h: 42.99212598425196;--dt-color-gold-400-s: 100%;--dt-color-gold-400-l: 75.09803921568627%;--dt-color-gold-400-hsl: var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l);--dt-color-gold-400-hsla: hsla(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--alpha, 100%));--dt-color-gold-400: #FFDB80;--dt-color-gold-500-h: 47.058823529411775;--dt-color-gold-500-s: 100%;--dt-color-gold-500-l: 90%;--dt-color-gold-500-hsl: var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l);--dt-color-gold-500-hsla: hsla(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--alpha, 100%));--dt-color-gold-500: #FFF4CC;--dt-color-green-100-h: 136.15384615384616;--dt-color-green-100-s: 59.09090909090909%;--dt-color-green-100-l: 17.254901960784313%;--dt-color-green-100-hsl: var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l);--dt-color-green-100-hsla: hsla(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--alpha, 100%));--dt-color-green-100: #124620;--dt-color-green-200-h: 136.64233576642334;--dt-color-green-200-s: 72.4867724867725%;--dt-color-green-200-l: 37.05882352941176%;--dt-color-green-200-hsl: var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l);--dt-color-green-200-hsla: hsla(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--alpha, 100%));--dt-color-green-200: #1AA340;--dt-color-green-300-h: 136.85393258426967;--dt-color-green-300-s: 91.75257731958763%;--dt-color-green-300-l: 61.96078431372549%;--dt-color-green-300-hsl: var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l);--dt-color-green-300-hsla: hsla(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--alpha, 100%));--dt-color-green-300: #45F777;--dt-color-green-400-h: 111.52173913043478;--dt-color-green-400-s: 100%;--dt-color-green-400-l: 81.96078431372548%;--dt-color-green-400-hsl: var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l);--dt-color-green-400-hsla: hsla(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--alpha, 100%));--dt-color-green-400: #B0FFA3;--dt-color-green-500-h: 111.42857142857133;--dt-color-green-500-s: 53.84615384615389%;--dt-color-green-500-l: 94.90196078431372%;--dt-color-green-500-hsl: var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l);--dt-color-green-500-hsla: hsla(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--alpha, 100%));--dt-color-green-500: #EDF9EB;--dt-color-red-100-h: 0;--dt-color-red-100-s: 89.58333333333334%;--dt-color-red-100-l: 18.823529411764707%;--dt-color-red-100-hsl: var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l);--dt-color-red-100-hsla: hsla(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--alpha, 100%));--dt-color-red-100: #5B0505;--dt-color-red-200-h: 0;--dt-color-red-200-s: 88.659793814433%;--dt-color-red-200-l: 38.03921568627451%;--dt-color-red-200-hsl: var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l);--dt-color-red-200-hsla: hsla(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--alpha, 100%));--dt-color-red-200: #B70B0B;--dt-color-red-300-h: 0;--dt-color-red-300-s: 88.79999999999998%;--dt-color-red-300-l: 49.01960784313726%;--dt-color-red-300-hsl: var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l);--dt-color-red-300-hsla: hsla(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--alpha, 100%));--dt-color-red-300: #EC0E0E;--dt-color-red-400-h: 0;--dt-color-red-400-s: 100%;--dt-color-red-400-l: 76.07843137254902%;--dt-color-red-400-hsl: var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l);--dt-color-red-400-hsla: hsla(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--alpha, 100%));--dt-color-red-400: #FF8585;--dt-color-red-500-h: 357.6923076923077;--dt-color-red-500-s: 100%;--dt-color-red-500-l: 94.90196078431372%;--dt-color-red-500-hsl: var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l);--dt-color-red-500-hsla: hsla(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--alpha, 100%));--dt-color-red-500: #FFE5E6;--dt-color-tan-100-h: 0;--dt-color-tan-100-s: 0%;--dt-color-tan-100-l: 7.0588235294117645%;--dt-color-tan-100-hsl: var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l);--dt-color-tan-100-hsla: hsla(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--alpha, 100%));--dt-color-tan-100: #121212;--dt-color-tan-200-h: 20.000000000000046;--dt-color-tan-200-s: 2.4390243902439055%;--dt-color-tan-200-l: 24.11764705882353%;--dt-color-tan-200-hsl: var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l);--dt-color-tan-200-hsla: hsla(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--alpha, 100%));--dt-color-tan-200: #3F3D3C;--dt-color-tan-300-h: 24.999999999999982;--dt-color-tan-300-s: 4.761904761904762%;--dt-color-tan-300-l: 50.588235294117645%;--dt-color-tan-300-hsl: var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l);--dt-color-tan-300-hsla: hsla(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--alpha, 100%));--dt-color-tan-300: #87807B;--dt-color-tan-400-h: 23.99999999999993;--dt-color-tan-400-s: 9.259259259259254%;--dt-color-tan-400-l: 78.82352941176471%;--dt-color-tan-400-hsl: var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l);--dt-color-tan-400-hsla: hsla(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--alpha, 100%));--dt-color-tan-400: #CEC8C4;--dt-color-tan-500-h: 30;--dt-color-tan-500-s: 13.333333333333282%;--dt-color-tan-500-l: 94.11764705882352%;--dt-color-tan-500-hsl: var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l);--dt-color-tan-500-hsla: hsla(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--alpha, 100%));--dt-color-tan-500: #F2F0EE;--dt-color-gradient-magenta-purple-h: 0;--dt-color-gradient-magenta-purple-s: 0%;--dt-color-gradient-magenta-purple-l: 0%;--dt-color-gradient-magenta-purple-hsl: var(--dt-color-gradient-magenta-purple-h) var(--dt-color-gradient-magenta-purple-s) var(--dt-color-gradient-magenta-purple-l);--dt-color-gradient-magenta-purple-hsla: hsla(var(--dt-color-gradient-magenta-purple-h) var(--dt-color-gradient-magenta-purple-s) var(--dt-color-gradient-magenta-purple-l) / var(--alpha, 100%));--dt-color-gradient-magenta-purple: linear-gradient(135deg, #F9008E 10%, #7C52FF 90%);--dt-color-brand-purple-h: 254.5664739884393;--dt-color-brand-purple-s: 100%;--dt-color-brand-purple-l: 66.07843137254902%;--dt-color-brand-purple-hsl: var(--dt-color-brand-purple-h) var(--dt-color-brand-purple-s) var(--dt-color-brand-purple-l);--dt-color-brand-purple-hsla: hsla(var(--dt-color-brand-purple-h) var(--dt-color-brand-purple-s) var(--dt-color-brand-purple-l) / var(--alpha, 100%));--dt-color-brand-purple: #7C52FF;--dt-color-brand-magenta-h: 325.7831325301205;--dt-color-brand-magenta-s: 100%;--dt-color-brand-magenta-l: 48.8235294117647%;--dt-color-brand-magenta-hsl: var(--dt-color-brand-magenta-h) var(--dt-color-brand-magenta-s) var(--dt-color-brand-magenta-l);--dt-color-brand-magenta-hsla: hsla(var(--dt-color-brand-magenta-h) var(--dt-color-brand-magenta-s) var(--dt-color-brand-magenta-l) / var(--alpha, 100%));--dt-color-brand-magenta: #F9008E;--dt-color-brand-gold-h: 35.80645161290322;--dt-color-brand-gold-s: 91.17647058823533%;--dt-color-brand-gold-l: 60%;--dt-color-brand-gold-hsl: var(--dt-color-brand-gold-h) var(--dt-color-brand-gold-s) var(--dt-color-brand-gold-l);--dt-color-brand-gold-hsla: hsla(var(--dt-color-brand-gold-h) var(--dt-color-brand-gold-s) var(--dt-color-brand-gold-l) / var(--alpha, 100%));--dt-color-brand-gold: #F6AB3C;--dt-opacity-0: 0;--dt-opacity-100: .05;--dt-opacity-200: .1;--dt-opacity-300: .2;--dt-opacity-400: .25;--dt-opacity-500: .3;--dt-opacity-600: .4;--dt-opacity-700: .5;--dt-opacity-800: .6;--dt-opacity-900: .7;--dt-opacity-1000: .75;--dt-opacity-1100: .8;--dt-opacity-1200: .9;--dt-opacity-1300: 1;--dt-shadow-small-1-blur: .4rem;--dt-shadow-small-1-spread: 0rem;--dt-shadow-small-1-color-h: 0;--dt-shadow-small-1-color-s: 0%;--dt-shadow-small-1-color-l: 0%;--dt-shadow-small-1-color-hsl: var(--dt-shadow-small-1-color-h) var(--dt-shadow-small-1-color-s) var(--dt-shadow-small-1-color-l);--dt-shadow-small-1-color-hsla: hsla(var(--dt-shadow-small-1-color-h) var(--dt-shadow-small-1-color-s) var(--dt-shadow-small-1-color-l) / var(--alpha, 100%));--dt-shadow-small-1-color: rgba(0, 0, 0, .45);--dt-shadow-small-1-type: dropShadow;--dt-shadow-small-1-offset-x: 0rem;--dt-shadow-small-1-offset-y: .2rem;--dt-shadow-small-2-blur: 0rem;--dt-shadow-small-2-spread: 0rem;--dt-shadow-small-2-color-h: 0;--dt-shadow-small-2-color-s: 0%;--dt-shadow-small-2-color-l: 0%;--dt-shadow-small-2-color-hsl: var(--dt-shadow-small-2-color-h) var(--dt-shadow-small-2-color-s) var(--dt-shadow-small-2-color-l);--dt-shadow-small-2-color-hsla: hsla(var(--dt-shadow-small-2-color-h) var(--dt-shadow-small-2-color-s) var(--dt-shadow-small-2-color-l) / var(--alpha, 100%));--dt-shadow-small-2-color: #000000;--dt-shadow-small-2-type: dropShadow;--dt-shadow-small-2-offset-x: .05rem;--dt-shadow-small-2-offset-y: .05rem;--dt-shadow-small-3-blur: 0rem;--dt-shadow-small-3-spread: 0rem;--dt-shadow-small-3-color-h: 0;--dt-shadow-small-3-color-s: 0%;--dt-shadow-small-3-color-l: 0%;--dt-shadow-small-3-color-hsl: var(--dt-shadow-small-3-color-h) var(--dt-shadow-small-3-color-s) var(--dt-shadow-small-3-color-l);--dt-shadow-small-3-color-hsla: hsla(var(--dt-shadow-small-3-color-h) var(--dt-shadow-small-3-color-s) var(--dt-shadow-small-3-color-l) / var(--alpha, 100%));--dt-shadow-small-3-color: #000000;--dt-shadow-small-3-type: dropShadow;--dt-shadow-small-3-offset-x: -.05rem;--dt-shadow-small-3-offset-y: -.05rem;--dt-shadow-small-4-blur: 0rem;--dt-shadow-small-4-spread: 0rem;--dt-shadow-small-4-color-h: 0;--dt-shadow-small-4-color-s: 0%;--dt-shadow-small-4-color-l: 0%;--dt-shadow-small-4-color-hsl: var(--dt-shadow-small-4-color-h) var(--dt-shadow-small-4-color-s) var(--dt-shadow-small-4-color-l);--dt-shadow-small-4-color-hsla: hsla(var(--dt-shadow-small-4-color-h) var(--dt-shadow-small-4-color-s) var(--dt-shadow-small-4-color-l) / var(--alpha, 100%));--dt-shadow-small-4-color: #000000;--dt-shadow-small-4-type: dropShadow;--dt-shadow-small-4-offset-x: -.05rem;--dt-shadow-small-4-offset-y: .05rem;--dt-shadow-small-5-blur: 0rem;--dt-shadow-small-5-spread: 0rem;--dt-shadow-small-5-color-h: 0;--dt-shadow-small-5-color-s: 0%;--dt-shadow-small-5-color-l: 0%;--dt-shadow-small-5-color-hsl: var(--dt-shadow-small-5-color-h) var(--dt-shadow-small-5-color-s) var(--dt-shadow-small-5-color-l);--dt-shadow-small-5-color-hsla: hsla(var(--dt-shadow-small-5-color-h) var(--dt-shadow-small-5-color-s) var(--dt-shadow-small-5-color-l) / var(--alpha, 100%));--dt-shadow-small-5-color: #000000;--dt-shadow-small-5-type: dropShadow;--dt-shadow-small-5-offset-x: .05rem;--dt-shadow-small-5-offset-y: -.05rem;--dt-shadow-medium-1-blur: .8rem;--dt-shadow-medium-1-spread: 0rem;--dt-shadow-medium-1-color-h: 0;--dt-shadow-medium-1-color-s: 0%;--dt-shadow-medium-1-color-l: 0%;--dt-shadow-medium-1-color-hsl: var(--dt-shadow-medium-1-color-h) var(--dt-shadow-medium-1-color-s) var(--dt-shadow-medium-1-color-l);--dt-shadow-medium-1-color-hsla: hsla(var(--dt-shadow-medium-1-color-h) var(--dt-shadow-medium-1-color-s) var(--dt-shadow-medium-1-color-l) / var(--alpha, 100%));--dt-shadow-medium-1-color: rgba(0, 0, 0, .55);--dt-shadow-medium-1-type: dropShadow;--dt-shadow-medium-1-offset-x: 0rem;--dt-shadow-medium-1-offset-y: .2rem;--dt-shadow-medium-2-blur: 0rem;--dt-shadow-medium-2-spread: 0rem;--dt-shadow-medium-2-color-h: 0;--dt-shadow-medium-2-color-s: 0%;--dt-shadow-medium-2-color-l: 0%;--dt-shadow-medium-2-color-hsl: var(--dt-shadow-medium-2-color-h) var(--dt-shadow-medium-2-color-s) var(--dt-shadow-medium-2-color-l);--dt-shadow-medium-2-color-hsla: hsla(var(--dt-shadow-medium-2-color-h) var(--dt-shadow-medium-2-color-s) var(--dt-shadow-medium-2-color-l) / var(--alpha, 100%));--dt-shadow-medium-2-color: #000000;--dt-shadow-medium-2-type: dropShadow;--dt-shadow-medium-2-offset-x: .05rem;--dt-shadow-medium-2-offset-y: .05rem;--dt-shadow-medium-3-blur: 0rem;--dt-shadow-medium-3-spread: 0rem;--dt-shadow-medium-3-color-h: 0;--dt-shadow-medium-3-color-s: 0%;--dt-shadow-medium-3-color-l: 0%;--dt-shadow-medium-3-color-hsl: var(--dt-shadow-medium-3-color-h) var(--dt-shadow-medium-3-color-s) var(--dt-shadow-medium-3-color-l);--dt-shadow-medium-3-color-hsla: hsla(var(--dt-shadow-medium-3-color-h) var(--dt-shadow-medium-3-color-s) var(--dt-shadow-medium-3-color-l) / var(--alpha, 100%));--dt-shadow-medium-3-color: #000000;--dt-shadow-medium-3-type: dropShadow;--dt-shadow-medium-3-offset-x: -.05rem;--dt-shadow-medium-3-offset-y: -.05rem;--dt-shadow-medium-4-blur: 0rem;--dt-shadow-medium-4-spread: 0rem;--dt-shadow-medium-4-color-h: 0;--dt-shadow-medium-4-color-s: 0%;--dt-shadow-medium-4-color-l: 0%;--dt-shadow-medium-4-color-hsl: var(--dt-shadow-medium-4-color-h) var(--dt-shadow-medium-4-color-s) var(--dt-shadow-medium-4-color-l);--dt-shadow-medium-4-color-hsla: hsla(var(--dt-shadow-medium-4-color-h) var(--dt-shadow-medium-4-color-s) var(--dt-shadow-medium-4-color-l) / var(--alpha, 100%));--dt-shadow-medium-4-color: #000000;--dt-shadow-medium-4-type: dropShadow;--dt-shadow-medium-4-offset-x: -.05rem;--dt-shadow-medium-4-offset-y: .05rem;--dt-shadow-medium-5-blur: 0rem;--dt-shadow-medium-5-spread: 0rem;--dt-shadow-medium-5-color-h: 0;--dt-shadow-medium-5-color-s: 0%;--dt-shadow-medium-5-color-l: 0%;--dt-shadow-medium-5-color-hsl: var(--dt-shadow-medium-5-color-h) var(--dt-shadow-medium-5-color-s) var(--dt-shadow-medium-5-color-l);--dt-shadow-medium-5-color-hsla: hsla(var(--dt-shadow-medium-5-color-h) var(--dt-shadow-medium-5-color-s) var(--dt-shadow-medium-5-color-l) / var(--alpha, 100%));--dt-shadow-medium-5-color: #000000;--dt-shadow-medium-5-type: dropShadow;--dt-shadow-medium-5-offset-x: .05rem;--dt-shadow-medium-5-offset-y: -.05rem;--dt-shadow-large-1-blur: 1.6rem;--dt-shadow-large-1-spread: 0rem;--dt-shadow-large-1-color-h: 0;--dt-shadow-large-1-color-s: 0%;--dt-shadow-large-1-color-l: 0%;--dt-shadow-large-1-color-hsl: var(--dt-shadow-large-1-color-h) var(--dt-shadow-large-1-color-s) var(--dt-shadow-large-1-color-l);--dt-shadow-large-1-color-hsla: hsla(var(--dt-shadow-large-1-color-h) var(--dt-shadow-large-1-color-s) var(--dt-shadow-large-1-color-l) / var(--alpha, 100%));--dt-shadow-large-1-color: rgba(0, 0, 0, .55);--dt-shadow-large-1-type: dropShadow;--dt-shadow-large-1-offset-x: 0rem;--dt-shadow-large-1-offset-y: .2rem;--dt-shadow-large-2-blur: 0rem;--dt-shadow-large-2-spread: 0rem;--dt-shadow-large-2-color-h: 0;--dt-shadow-large-2-color-s: 0%;--dt-shadow-large-2-color-l: 0%;--dt-shadow-large-2-color-hsl: var(--dt-shadow-large-2-color-h) var(--dt-shadow-large-2-color-s) var(--dt-shadow-large-2-color-l);--dt-shadow-large-2-color-hsla: hsla(var(--dt-shadow-large-2-color-h) var(--dt-shadow-large-2-color-s) var(--dt-shadow-large-2-color-l) / var(--alpha, 100%));--dt-shadow-large-2-color: #000000;--dt-shadow-large-2-type: dropShadow;--dt-shadow-large-2-offset-x: -.05rem;--dt-shadow-large-2-offset-y: .05rem;--dt-shadow-large-3-blur: 0rem;--dt-shadow-large-3-spread: 0rem;--dt-shadow-large-3-color-h: 0;--dt-shadow-large-3-color-s: 0%;--dt-shadow-large-3-color-l: 0%;--dt-shadow-large-3-color-hsl: var(--dt-shadow-large-3-color-h) var(--dt-shadow-large-3-color-s) var(--dt-shadow-large-3-color-l);--dt-shadow-large-3-color-hsla: hsla(var(--dt-shadow-large-3-color-h) var(--dt-shadow-large-3-color-s) var(--dt-shadow-large-3-color-l) / var(--alpha, 100%));--dt-shadow-large-3-color: #000000;--dt-shadow-large-3-type: dropShadow;--dt-shadow-large-3-offset-x: -.05rem;--dt-shadow-large-3-offset-y: -.05rem;--dt-shadow-large-4-blur: 0rem;--dt-shadow-large-4-spread: 0rem;--dt-shadow-large-4-color-h: 0;--dt-shadow-large-4-color-s: 0%;--dt-shadow-large-4-color-l: 0%;--dt-shadow-large-4-color-hsl: var(--dt-shadow-large-4-color-h) var(--dt-shadow-large-4-color-s) var(--dt-shadow-large-4-color-l);--dt-shadow-large-4-color-hsla: hsla(var(--dt-shadow-large-4-color-h) var(--dt-shadow-large-4-color-s) var(--dt-shadow-large-4-color-l) / var(--alpha, 100%));--dt-shadow-large-4-color: #000000;--dt-shadow-large-4-type: dropShadow;--dt-shadow-large-4-offset-x: -.05rem;--dt-shadow-large-4-offset-y: .05rem;--dt-shadow-large-5-blur: 0rem;--dt-shadow-large-5-spread: 0rem;--dt-shadow-large-5-color-h: 0;--dt-shadow-large-5-color-s: 0%;--dt-shadow-large-5-color-l: 0%;--dt-shadow-large-5-color-hsl: var(--dt-shadow-large-5-color-h) var(--dt-shadow-large-5-color-s) var(--dt-shadow-large-5-color-l);--dt-shadow-large-5-color-hsla: hsla(var(--dt-shadow-large-5-color-h) var(--dt-shadow-large-5-color-s) var(--dt-shadow-large-5-color-l) / var(--alpha, 100%));--dt-shadow-large-5-color: #000000;--dt-shadow-large-5-type: dropShadow;--dt-shadow-large-5-offset-x: .05rem;--dt-shadow-large-5-offset-y: -.05rem;--dt-shadow-extra-large-1-blur: 3.2rem;--dt-shadow-extra-large-1-spread: 0rem;--dt-shadow-extra-large-1-color-h: 0;--dt-shadow-extra-large-1-color-s: 0%;--dt-shadow-extra-large-1-color-l: 0%;--dt-shadow-extra-large-1-color-hsl: var(--dt-shadow-extra-large-1-color-h) var(--dt-shadow-extra-large-1-color-s) var(--dt-shadow-extra-large-1-color-l);--dt-shadow-extra-large-1-color-hsla: hsla(var(--dt-shadow-extra-large-1-color-h) var(--dt-shadow-extra-large-1-color-s) var(--dt-shadow-extra-large-1-color-l) / var(--alpha, 100%));--dt-shadow-extra-large-1-color: rgba(0, 0, 0, .55);--dt-shadow-extra-large-1-type: dropShadow;--dt-shadow-extra-large-1-offset-x: 0rem;--dt-shadow-extra-large-1-offset-y: .2rem;--dt-shadow-extra-large-2-blur: 0rem;--dt-shadow-extra-large-2-spread: 0rem;--dt-shadow-extra-large-2-color-h: 0;--dt-shadow-extra-large-2-color-s: 0%;--dt-shadow-extra-large-2-color-l: 0%;--dt-shadow-extra-large-2-color-hsl: var(--dt-shadow-extra-large-2-color-h) var(--dt-shadow-extra-large-2-color-s) var(--dt-shadow-extra-large-2-color-l);--dt-shadow-extra-large-2-color-hsla: hsla(var(--dt-shadow-extra-large-2-color-h) var(--dt-shadow-extra-large-2-color-s) var(--dt-shadow-extra-large-2-color-l) / var(--alpha, 100%));--dt-shadow-extra-large-2-color: #000000;--dt-shadow-extra-large-2-type: dropShadow;--dt-shadow-extra-large-2-offset-x: .05rem;--dt-shadow-extra-large-2-offset-y: .05rem;--dt-shadow-extra-large-3-blur: 0rem;--dt-shadow-extra-large-3-spread: 0rem;--dt-shadow-extra-large-3-color-h: 0;--dt-shadow-extra-large-3-color-s: 0%;--dt-shadow-extra-large-3-color-l: 0%;--dt-shadow-extra-large-3-color-hsl: var(--dt-shadow-extra-large-3-color-h) var(--dt-shadow-extra-large-3-color-s) var(--dt-shadow-extra-large-3-color-l);--dt-shadow-extra-large-3-color-hsla: hsla(var(--dt-shadow-extra-large-3-color-h) var(--dt-shadow-extra-large-3-color-s) var(--dt-shadow-extra-large-3-color-l) / var(--alpha, 100%));--dt-shadow-extra-large-3-color: #000000;--dt-shadow-extra-large-3-type: dropShadow;--dt-shadow-extra-large-3-offset-x: -.05rem;--dt-shadow-extra-large-3-offset-y: -.05rem;--dt-shadow-extra-large-4-blur: 0rem;--dt-shadow-extra-large-4-spread: 0rem;--dt-shadow-extra-large-4-color-h: 0;--dt-shadow-extra-large-4-color-s: 0%;--dt-shadow-extra-large-4-color-l: 0%;--dt-shadow-extra-large-4-color-hsl: var(--dt-shadow-extra-large-4-color-h) var(--dt-shadow-extra-large-4-color-s) var(--dt-shadow-extra-large-4-color-l);--dt-shadow-extra-large-4-color-hsla: hsla(var(--dt-shadow-extra-large-4-color-h) var(--dt-shadow-extra-large-4-color-s) var(--dt-shadow-extra-large-4-color-l) / var(--alpha, 100%));--dt-shadow-extra-large-4-color: #000000;--dt-shadow-extra-large-4-type: dropShadow;--dt-shadow-extra-large-4-offset-x: -.05rem;--dt-shadow-extra-large-4-offset-y: .05rem;--dt-shadow-extra-large-5-blur: 0rem;--dt-shadow-extra-large-5-spread: 0rem;--dt-shadow-extra-large-5-color-h: 0;--dt-shadow-extra-large-5-color-s: 0%;--dt-shadow-extra-large-5-color-l: 0%;--dt-shadow-extra-large-5-color-hsl: var(--dt-shadow-extra-large-5-color-h) var(--dt-shadow-extra-large-5-color-s) var(--dt-shadow-extra-large-5-color-l);--dt-shadow-extra-large-5-color-hsla: hsla(var(--dt-shadow-extra-large-5-color-h) var(--dt-shadow-extra-large-5-color-s) var(--dt-shadow-extra-large-5-color-l) / var(--alpha, 100%));--dt-shadow-extra-large-5-color: #000000;--dt-shadow-extra-large-5-type: dropShadow;--dt-shadow-extra-large-5-offset-x: .05rem;--dt-shadow-extra-large-5-offset-y: -.05rem;--dt-shadow-card-1-blur: .2rem;--dt-shadow-card-1-spread: 0rem;--dt-shadow-card-1-color-h: 0;--dt-shadow-card-1-color-s: 0%;--dt-shadow-card-1-color-l: 0%;--dt-shadow-card-1-color-hsl: var(--dt-shadow-card-1-color-h) var(--dt-shadow-card-1-color-s) var(--dt-shadow-card-1-color-l);--dt-shadow-card-1-color-hsla: hsla(var(--dt-shadow-card-1-color-h) var(--dt-shadow-card-1-color-s) var(--dt-shadow-card-1-color-l) / var(--alpha, 100%));--dt-shadow-card-1-color: rgba(0, 0, 0, .35);--dt-shadow-card-1-type: dropShadow;--dt-shadow-card-1-offset-x: 0rem;--dt-shadow-card-1-offset-y: .1rem;--dt-shadow-card-2-blur: .4rem;--dt-shadow-card-2-spread: 0rem;--dt-shadow-card-2-color-h: 0;--dt-shadow-card-2-color-s: 0%;--dt-shadow-card-2-color-l: 0%;--dt-shadow-card-2-color-hsl: var(--dt-shadow-card-2-color-h) var(--dt-shadow-card-2-color-s) var(--dt-shadow-card-2-color-l);--dt-shadow-card-2-color-hsla: hsla(var(--dt-shadow-card-2-color-h) var(--dt-shadow-card-2-color-s) var(--dt-shadow-card-2-color-l) / var(--alpha, 100%));--dt-shadow-card-2-color: rgba(0, 0, 0, .45);--dt-shadow-card-2-type: dropShadow;--dt-shadow-card-2-offset-x: 0rem;--dt-shadow-card-2-offset-y: .2rem;--dt-shadow-card-3-blur: 1.6rem;--dt-shadow-card-3-spread: 0rem;--dt-shadow-card-3-color-h: 0;--dt-shadow-card-3-color-s: 0%;--dt-shadow-card-3-color-l: 0%;--dt-shadow-card-3-color-hsl: var(--dt-shadow-card-3-color-h) var(--dt-shadow-card-3-color-s) var(--dt-shadow-card-3-color-l);--dt-shadow-card-3-color-hsla: hsla(var(--dt-shadow-card-3-color-h) var(--dt-shadow-card-3-color-s) var(--dt-shadow-card-3-color-l) / var(--alpha, 100%));--dt-shadow-card-3-color: rgba(0, 0, 0, .58);--dt-shadow-card-3-type: dropShadow;--dt-shadow-card-3-offset-x: 0rem;--dt-shadow-card-3-offset-y: .2rem;--dt-shadow-card-4-blur: 0rem;--dt-shadow-card-4-spread: 0rem;--dt-shadow-card-4-color-h: 0;--dt-shadow-card-4-color-s: 0%;--dt-shadow-card-4-color-l: 0%;--dt-shadow-card-4-color-hsl: var(--dt-shadow-card-4-color-h) var(--dt-shadow-card-4-color-s) var(--dt-shadow-card-4-color-l);--dt-shadow-card-4-color-hsla: hsla(var(--dt-shadow-card-4-color-h) var(--dt-shadow-card-4-color-s) var(--dt-shadow-card-4-color-l) / var(--alpha, 100%));--dt-shadow-card-4-color: #000000;--dt-shadow-card-4-type: dropShadow;--dt-shadow-card-4-offset-x: .05rem;--dt-shadow-card-4-offset-y: .05rem;--dt-shadow-card-5-blur: 0rem;--dt-shadow-card-5-spread: 0rem;--dt-shadow-card-5-color-h: 0;--dt-shadow-card-5-color-s: 0%;--dt-shadow-card-5-color-l: 0%;--dt-shadow-card-5-color-hsl: var(--dt-shadow-card-5-color-h) var(--dt-shadow-card-5-color-s) var(--dt-shadow-card-5-color-l);--dt-shadow-card-5-color-hsla: hsla(var(--dt-shadow-card-5-color-h) var(--dt-shadow-card-5-color-s) var(--dt-shadow-card-5-color-l) / var(--alpha, 100%));--dt-shadow-card-5-color: #000000;--dt-shadow-card-5-type: dropShadow;--dt-shadow-card-5-offset-x: -.05rem;--dt-shadow-card-5-offset-y: -.05rem;--dt-shadow-card-6-blur: 0rem;--dt-shadow-card-6-spread: 0rem;--dt-shadow-card-6-color-h: 0;--dt-shadow-card-6-color-s: 0%;--dt-shadow-card-6-color-l: 0%;--dt-shadow-card-6-color-hsl: var(--dt-shadow-card-6-color-h) var(--dt-shadow-card-6-color-s) var(--dt-shadow-card-6-color-l);--dt-shadow-card-6-color-hsla: hsla(var(--dt-shadow-card-6-color-h) var(--dt-shadow-card-6-color-s) var(--dt-shadow-card-6-color-l) / var(--alpha, 100%));--dt-shadow-card-6-color: #000000;--dt-shadow-card-6-type: dropShadow;--dt-shadow-card-6-offset-x: -.05rem;--dt-shadow-card-6-offset-y: .05rem;--dt-shadow-card-7-blur: 0rem;--dt-shadow-card-7-spread: 0rem;--dt-shadow-card-7-color-h: 0;--dt-shadow-card-7-color-s: 0%;--dt-shadow-card-7-color-l: 0%;--dt-shadow-card-7-color-hsl: var(--dt-shadow-card-7-color-h) var(--dt-shadow-card-7-color-s) var(--dt-shadow-card-7-color-l);--dt-shadow-card-7-color-hsla: hsla(var(--dt-shadow-card-7-color-h) var(--dt-shadow-card-7-color-s) var(--dt-shadow-card-7-color-l) / var(--alpha, 100%));--dt-shadow-card-7-color: #000000;--dt-shadow-card-7-type: dropShadow;--dt-shadow-card-7-offset-x: .05rem;--dt-shadow-card-7-offset-y: -.05rem;--dt-shadow-focus-1-blur: 0rem;--dt-shadow-focus-1-spread: .1rem;--dt-shadow-focus-1-color-h: 0;--dt-shadow-focus-1-color-s: 0%;--dt-shadow-focus-1-color-l: 0%;--dt-shadow-focus-1-color-hsl: var(--dt-shadow-focus-1-color-h) var(--dt-shadow-focus-1-color-s) var(--dt-shadow-focus-1-color-l);--dt-shadow-focus-1-color-hsla: hsla(var(--dt-shadow-focus-1-color-h) var(--dt-shadow-focus-1-color-s) var(--dt-shadow-focus-1-color-l) / var(--alpha, 100%));--dt-shadow-focus-1-color: #000000;--dt-shadow-focus-1-type: dropShadow;--dt-shadow-focus-1-offset-x: 0rem;--dt-shadow-focus-1-offset-y: 0rem;--dt-shadow-focus-2-blur: 0rem;--dt-shadow-focus-2-spread: .3rem;--dt-shadow-focus-2-color-h: 212.60115606936418;--dt-shadow-focus-2-color-s: 98.85714285714286%;--dt-shadow-focus-2-color-l: 65.68627450980392%;--dt-shadow-focus-2-color-hsl: var(--dt-shadow-focus-2-color-h) var(--dt-shadow-focus-2-color-s) var(--dt-shadow-focus-2-color-l);--dt-shadow-focus-2-color-hsla: hsla(var(--dt-shadow-focus-2-color-h) var(--dt-shadow-focus-2-color-s) var(--dt-shadow-focus-2-color-l) / var(--alpha, 100%));--dt-shadow-focus-2-color: #51A0FE;--dt-shadow-focus-2-type: dropShadow;--dt-shadow-focus-2-offset-x: 0rem;--dt-shadow-focus-2-offset-y: 0rem;--dt-shadow-focus-inset-blur: 0rem;--dt-shadow-focus-inset-spread: .2rem;--dt-shadow-focus-inset-color-h: 212.60115606936418;--dt-shadow-focus-inset-color-s: 98.85714285714286%;--dt-shadow-focus-inset-color-l: 65.68627450980392%;--dt-shadow-focus-inset-color-hsl: var(--dt-shadow-focus-inset-color-h) var(--dt-shadow-focus-inset-color-s) var(--dt-shadow-focus-inset-color-l);--dt-shadow-focus-inset-color-hsla: hsla(var(--dt-shadow-focus-inset-color-h) var(--dt-shadow-focus-inset-color-s) var(--dt-shadow-focus-inset-color-l) / var(--alpha, 100%));--dt-shadow-focus-inset-color: #51A0FE;--dt-shadow-focus-inset-type: innerShadow;--dt-shadow-focus-inset-offset-x: 0rem;--dt-shadow-focus-inset-offset-y: 0rem;--dt-shadow-focus-inset: var(--dt-shadow-focus-inset-offset-x) var(--dt-shadow-focus-inset-offset-y) var(--dt-shadow-focus-inset-blur) var(--dt-shadow-focus-inset-spread) var(--dt-shadow-focus-inset-color) inset;--dt-shadow-focus: var(--dt-shadow-focus-1-offset-x) var(--dt-shadow-focus-1-offset-y) var(--dt-shadow-focus-1-blur) var(--dt-shadow-focus-1-spread) var(--dt-shadow-focus-1-color), var(--dt-shadow-focus-2-offset-x) var(--dt-shadow-focus-2-offset-y) var(--dt-shadow-focus-2-blur) var(--dt-shadow-focus-2-spread) var(--dt-shadow-focus-2-color);--dt-shadow-card: var(--dt-shadow-card-1-offset-x) var(--dt-shadow-card-1-offset-y) var(--dt-shadow-card-1-blur) var(--dt-shadow-card-1-spread) var(--dt-shadow-card-1-color), var(--dt-shadow-card-2-offset-x) var(--dt-shadow-card-2-offset-y) var(--dt-shadow-card-2-blur) var(--dt-shadow-card-2-spread) var(--dt-shadow-card-2-color), var(--dt-shadow-card-3-offset-x) var(--dt-shadow-card-3-offset-y) var(--dt-shadow-card-3-blur) var(--dt-shadow-card-3-spread) var(--dt-shadow-card-3-color), var(--dt-shadow-card-4-offset-x) var(--dt-shadow-card-4-offset-y) var(--dt-shadow-card-4-blur) var(--dt-shadow-card-4-spread) var(--dt-shadow-card-4-color), var(--dt-shadow-card-5-offset-x) var(--dt-shadow-card-5-offset-y) var(--dt-shadow-card-5-blur) var(--dt-shadow-card-5-spread) var(--dt-shadow-card-5-color), var(--dt-shadow-card-6-offset-x) var(--dt-shadow-card-6-offset-y) var(--dt-shadow-card-6-blur) var(--dt-shadow-card-6-spread) var(--dt-shadow-card-6-color), var(--dt-shadow-card-7-offset-x) var(--dt-shadow-card-7-offset-y) var(--dt-shadow-card-7-blur) var(--dt-shadow-card-7-spread) var(--dt-shadow-card-7-color);--dt-shadow-extra-large: var(--dt-shadow-extra-large-1-offset-x) var(--dt-shadow-extra-large-1-offset-y) var(--dt-shadow-extra-large-1-blur) var(--dt-shadow-extra-large-1-spread) var(--dt-shadow-extra-large-1-color), var(--dt-shadow-extra-large-2-offset-x) var(--dt-shadow-extra-large-2-offset-y) var(--dt-shadow-extra-large-2-blur) var(--dt-shadow-extra-large-2-spread) var(--dt-shadow-extra-large-2-color), var(--dt-shadow-extra-large-3-offset-x) var(--dt-shadow-extra-large-3-offset-y) var(--dt-shadow-extra-large-3-blur) var(--dt-shadow-extra-large-3-spread) var(--dt-shadow-extra-large-3-color), var(--dt-shadow-extra-large-4-offset-x) var(--dt-shadow-extra-large-4-offset-y) var(--dt-shadow-extra-large-4-blur) var(--dt-shadow-extra-large-4-spread) var(--dt-shadow-extra-large-4-color), var(--dt-shadow-extra-large-5-offset-x) var(--dt-shadow-extra-large-5-offset-y) var(--dt-shadow-extra-large-5-blur) var(--dt-shadow-extra-large-5-spread) var(--dt-shadow-extra-large-5-color);--dt-shadow-large: var(--dt-shadow-large-1-offset-x) var(--dt-shadow-large-1-offset-y) var(--dt-shadow-large-1-blur) var(--dt-shadow-large-1-spread) var(--dt-shadow-large-1-color), var(--dt-shadow-large-2-offset-x) var(--dt-shadow-large-2-offset-y) var(--dt-shadow-large-2-blur) var(--dt-shadow-large-2-spread) var(--dt-shadow-large-2-color), var(--dt-shadow-large-3-offset-x) var(--dt-shadow-large-3-offset-y) var(--dt-shadow-large-3-blur) var(--dt-shadow-large-3-spread) var(--dt-shadow-large-3-color), var(--dt-shadow-large-4-offset-x) var(--dt-shadow-large-4-offset-y) var(--dt-shadow-large-4-blur) var(--dt-shadow-large-4-spread) var(--dt-shadow-large-4-color), var(--dt-shadow-large-5-offset-x) var(--dt-shadow-large-5-offset-y) var(--dt-shadow-large-5-blur) var(--dt-shadow-large-5-spread) var(--dt-shadow-large-5-color);--dt-shadow-medium: var(--dt-shadow-medium-1-offset-x) var(--dt-shadow-medium-1-offset-y) var(--dt-shadow-medium-1-blur) var(--dt-shadow-medium-1-spread) var(--dt-shadow-medium-1-color), var(--dt-shadow-medium-2-offset-x) var(--dt-shadow-medium-2-offset-y) var(--dt-shadow-medium-2-blur) var(--dt-shadow-medium-2-spread) var(--dt-shadow-medium-2-color), var(--dt-shadow-medium-3-offset-x) var(--dt-shadow-medium-3-offset-y) var(--dt-shadow-medium-3-blur) var(--dt-shadow-medium-3-spread) var(--dt-shadow-medium-3-color), var(--dt-shadow-medium-4-offset-x) var(--dt-shadow-medium-4-offset-y) var(--dt-shadow-medium-4-blur) var(--dt-shadow-medium-4-spread) var(--dt-shadow-medium-4-color), var(--dt-shadow-medium-5-offset-x) var(--dt-shadow-medium-5-offset-y) var(--dt-shadow-medium-5-blur) var(--dt-shadow-medium-5-spread) var(--dt-shadow-medium-5-color);--dt-shadow-small: var(--dt-shadow-small-1-offset-x) var(--dt-shadow-small-1-offset-y) var(--dt-shadow-small-1-blur) var(--dt-shadow-small-1-spread) var(--dt-shadow-small-1-color), var(--dt-shadow-small-2-offset-x) var(--dt-shadow-small-2-offset-y) var(--dt-shadow-small-2-blur) var(--dt-shadow-small-2-spread) var(--dt-shadow-small-2-color), var(--dt-shadow-small-3-offset-x) var(--dt-shadow-small-3-offset-y) var(--dt-shadow-small-3-blur) var(--dt-shadow-small-3-spread) var(--dt-shadow-small-3-color), var(--dt-shadow-small-4-offset-x) var(--dt-shadow-small-4-offset-y) var(--dt-shadow-small-4-blur) var(--dt-shadow-small-4-spread) var(--dt-shadow-small-4-color), var(--dt-shadow-small-5-offset-x) var(--dt-shadow-small-5-offset-y) var(--dt-shadow-small-5-blur) var(--dt-shadow-small-5-spread) var(--dt-shadow-small-5-color);--dt-font-size-100-mobile: 1.2rem;--dt-font-size-200-mobile: 1.6rem;--dt-font-size-300-mobile: 2rem;--dt-font-size-400-mobile: 2.9rem;--dt-font-size-500-mobile: 4.1rem;--dt-font-size-100-tc8: 1.7rem;--dt-font-size-200-tc8: 2.1rem;--dt-font-size-300-tc8: 2.7rem;--dt-font-size-400-tc8: 3.8rem;--dt-font-size-500-tc8: 5.4rem;--dt-font-size-100-tv: 2.5rem;--dt-font-size-200-tv: 3.2rem;--dt-font-size-300-tv: 4.1rem;--dt-font-size-400-tv: 5.8rem;--dt-font-size-500-tv: 8.2rem;--zi-hide: -1;--zi-base: 0;--zi-base1: 1;--zi-selected: 25;--zi-active: 50;--zi-navigation: 100;--zi-navigation-fixed: 150;--zi-dropdown: 200;--zi-popover: 300;--zi-tooltip: 400;--zi-drawer: 500;--zi-modal: 600;--zi-modal-element: 650;--zi-notification: 700}';
-export {
-  o as B
-};

package/dist/tokens/themes/chunks/tokens-base-dark-CsflOADh.js

@@ -1 +0,0 @@
-"use strict";const o=':root{color-scheme:dark;--dt-font-size-100: 1.2rem;--dt-font-size-200: 1.5rem;--dt-font-size-300: 1.9rem;--dt-font-size-400: 2.7rem;--dt-font-size-500: 3.8rem;--dt-font-family-body: -apple-system, BlinkMacSystemFont, "SF Pro", "Segoe UI Adjusted", "Segoe UI", SFMono, "Helvetica Neue", Cantarell, Ubuntu, Roboto, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--dt-font-family-expressive: Archivo, -apple-system, BlinkMacSystemFont, "SF Pro", "Segoe UI Adjusted", "Segoe UI", SFMono, "Helvetica Neue", Cantarell, Ubuntu, Roboto, Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--dt-font-family-mono: SFMono-Regular, "SF Mono", Consolas, "Liberation Mono", Menlo, Courier, monospace;--dt-font-line-height-100: 1;--dt-font-line-height-200: 1.2;--dt-font-line-height-300: 1.4;--dt-font-line-height-400: 1.6;--dt-font-line-height-500: 1.8;--dt-font-line-height-600: 2;--dt-font-weight-normal: 400;--dt-font-weight-medium: 500;--dt-font-weight-semi-bold: 600;--dt-font-weight-bold: 700;--dt-font-text-case-uppercase: uppercase;--dt-font-text-case-lowercase: lowercase;--dt-font-text-case-capitalize: capitalize;--dt-font-text-case-none: none;--dt-size-0: 0rem;--dt-size-50: .05rem;--dt-size-100: .1rem;--dt-size-200: .2rem;--dt-size-300: .4rem;--dt-size-350: .6rem;--dt-size-400: .8rem;--dt-size-450: 1.2rem;--dt-size-500: 1.6rem;--dt-size-525: 2rem;--dt-size-550: 2.4rem;--dt-size-600: 3.2rem;--dt-size-625: 4.2rem;--dt-size-650: 4.8rem;--dt-size-700: 6.4rem;--dt-size-720: 7.2rem;--dt-size-730: 8.4rem;--dt-size-750: 9.6rem;--dt-size-760: 10.2rem;--dt-size-775: 11.4rem;--dt-size-800: 12.8rem;--dt-size-825: 16.4rem;--dt-size-850: 19.2rem;--dt-size-875: 21.6rem;--dt-size-900: 25.6rem;--dt-size-905: 26.4rem;--dt-size-925: 33.2rem;--dt-size-950: 38.4rem;--dt-size-975: 46.4rem;--dt-size-1000: 51.2rem;--dt-size-1020: 62.8rem;--dt-size-1040: 76.4rem;--dt-size-1050: 76.8rem;--dt-size-1060: 82.8rem;--dt-size-1080: 91.2rem;--dt-size-1100: 102.4rem;--dt-size-1115: 114rem;--dt-size-1120: 126.8rem;--dt-size-1125: 128rem;--dt-size-1130: 134rem;--dt-size-1150: 153.6rem;--dt-size-1200: 204.8rem;--dt-size-border-0: 0rem;--dt-size-border-50: .05rem;--dt-size-border-100: .1rem;--dt-size-border-150: .15rem;--dt-size-border-200: .2rem;--dt-size-border-300: .4rem;--dt-size-border-400: .8rem;--dt-size-50-negative: -.05rem;--dt-size-100-negative: -.1rem;--dt-size-200-negative: -.2rem;--dt-size-300-negative: -.4rem;--dt-size-350-negative: -.6rem;--dt-size-400-negative: -.8rem;--dt-size-450-negative: -1.2rem;--dt-size-500-negative: -1.6rem;--dt-size-525-negative: -2rem;--dt-size-550-negative: -2.4rem;--dt-size-600-negative: -3.2rem;--dt-size-625-negative: -4.2rem;--dt-size-650-negative: -4.8rem;--dt-size-700-negative: -6.4rem;--dt-size-720-negative: -7.2rem;--dt-size-730-negative: -8.4rem;--dt-size-750-negative: -9.6rem;--dt-size-760-negative: -10.2rem;--dt-size-775-negative: -11.4rem;--dt-size-800-negative: -12.8rem;--dt-size-825-negative: -16.4rem;--dt-size-850-negative: -19.2rem;--dt-size-875-negative: -21.6rem;--dt-size-900-negative: -25.6rem;--dt-size-905-negative: -26.4rem;--dt-size-925-negative: -33.2rem;--dt-size-950-negative: -38.4rem;--dt-size-975-negative: -46.4rem;--dt-size-1000-negative: -51.2rem;--dt-size-1020-negative: -62.8rem;--dt-size-1040-negative: -76.4rem;--dt-size-1050-negative: -76.8rem;--dt-size-1060-negative: -82.8rem;--dt-size-1080-negative: -91.2rem;--dt-size-1100-negative: -102.4rem;--dt-size-1115-negative: -114rem;--dt-size-1120-negative: -126.8rem;--dt-size-1125-negative: -128rem;--dt-size-1130-negative: -134rem;--dt-size-1150-negative: -153.6rem;--dt-size-1200-negative: -204.8rem;--dt-size-0-percent: 0%;--dt-size-5-percent: 5%;--dt-size-10-percent: 10%;--dt-size-20-percent: 20%;--dt-size-25-percent: 25%;--dt-size-30-percent: 30%;--dt-size-33-percent: 33.333%;--dt-size-40-percent: 40%;--dt-size-50-percent: 50%;--dt-size-60-percent: 60%;--dt-size-66-percent: 66.7%;--dt-size-70-percent: 70%;--dt-size-75-percent: 75%;--dt-size-80-percent: 80%;--dt-size-90-percent: 90%;--dt-size-95-percent: 95%;--dt-size-100-percent: 100%;--dt-size-radius-0: 0rem;--dt-size-radius-100: .1rem;--dt-size-radius-200: .2rem;--dt-size-radius-300: .4rem;--dt-size-radius-400: .8rem;--dt-size-radius-500: 1.6rem;--dt-size-radius-600: 3.2rem;--dt-size-radius-pill: 10.2rem;--dt-size-radius-circle: 50%;--dt-space-0: 0rem;--dt-space-50: .05rem;--dt-space-100: .1rem;--dt-space-200: .2rem;--dt-space-300: .4rem;--dt-space-350: .6rem;--dt-space-400: .8rem;--dt-space-450: 1.2rem;--dt-space-500: 1.6rem;--dt-space-525: 2rem;--dt-space-550: 2.4rem;--dt-space-600: 3.2rem;--dt-space-625: 4.2rem;--dt-space-650: 4.8rem;--dt-space-700: 6.4rem;--dt-space-720: 7.2rem;--dt-space-730: 8.4rem;--dt-space-750: 9.6rem;--dt-space-760: 10.2rem;--dt-space-775: 11.4rem;--dt-space-800: 12.8rem;--dt-space-825: 16.4rem;--dt-space-850: 19.2rem;--dt-space-875: 21.6rem;--dt-space-900: 25.6rem;--dt-space-905: 26.4rem;--dt-space-925: 33.2rem;--dt-space-950: 38.4rem;--dt-space-975: 46.4rem;--dt-space-1000: 51.2rem;--dt-space-1020: 62.8rem;--dt-space-1040: 76.4rem;--dt-space-1050: 76.8rem;--dt-space-1060: 82.8rem;--dt-space-1080: 91.2rem;--dt-space-1100: 102.4rem;--dt-space-1115: 114rem;--dt-space-1120: 126.8rem;--dt-space-1125: 128rem;--dt-space-1130: 134rem;--dt-space-1150: 153.6rem;--dt-space-1200: 204.8rem;--dt-space-50-negative: -.05rem;--dt-space-100-negative: -.1rem;--dt-space-200-negative: -.2rem;--dt-space-300-negative: -.4rem;--dt-space-350-negative: -.6rem;--dt-space-400-negative: -.8rem;--dt-space-450-negative: -1.2rem;--dt-space-500-negative: -1.6rem;--dt-space-525-negative: -2rem;--dt-space-550-negative: -2.4rem;--dt-space-600-negative: -3.2rem;--dt-space-625-negative: -4.2rem;--dt-space-650-negative: -4.8rem;--dt-space-700-negative: -6.4rem;--dt-space-720-negative: -7.2rem;--dt-space-730-negative: -8.4rem;--dt-space-750-negative: -9.6rem;--dt-space-760-negative: -10.2rem;--dt-space-775-negative: -11.4rem;--dt-space-800-negative: -12.8rem;--dt-space-825-negative: -16.4rem;--dt-space-850-negative: -19.2rem;--dt-space-875-negative: -21.6rem;--dt-space-900-negative: -25.6rem;--dt-space-905-negative: -26.4rem;--dt-space-925-negative: -33.2rem;--dt-space-950-negative: -38.4rem;--dt-space-975-negative: -46.4rem;--dt-space-1000-negative: -51.2rem;--dt-space-1020-negative: -62.8rem;--dt-space-1040-negative: -76.4rem;--dt-space-1050-negative: -76.8rem;--dt-space-1060-negative: -82.8rem;--dt-space-1080-negative: -91.2rem;--dt-space-1100-negative: -102.4rem;--dt-space-1115-negative: -114rem;--dt-space-1120-negative: -126.8rem;--dt-space-1125-negative: -128rem;--dt-space-1130-negative: -134rem;--dt-space-1150-negative: -153.6rem;--dt-space-1200-negative: -204.8rem;--dt-space-0-percent: 0%;--dt-space-5-percent: 5%;--dt-space-10-percent: 10%;--dt-space-20-percent: 20%;--dt-space-25-percent: 25%;--dt-space-30-percent: 30%;--dt-space-33-percent: 33.333%;--dt-space-40-percent: 40%;--dt-space-50-percent: 50%;--dt-space-60-percent: 60%;--dt-space-66-percent: 66.7%;--dt-space-70-percent: 70%;--dt-space-75-percent: 75%;--dt-space-80-percent: 80%;--dt-space-90-percent: 90%;--dt-space-95-percent: 95%;--dt-space-100-percent: 100%;--dt-color-neutral-white-h: 0;--dt-color-neutral-white-s: 0%;--dt-color-neutral-white-l: 100%;--dt-color-neutral-white-hsl: var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l);--dt-color-neutral-white-hsla: hsla(var(--dt-color-neutral-white-h) var(--dt-color-neutral-white-s) var(--dt-color-neutral-white-l) / var(--alpha, 100%));--dt-color-neutral-white: #ffffff;--dt-color-neutral-black-h: 0;--dt-color-neutral-black-s: 0%;--dt-color-neutral-black-l: 0%;--dt-color-neutral-black-hsl: var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l);--dt-color-neutral-black-hsla: hsla(var(--dt-color-neutral-black-h) var(--dt-color-neutral-black-s) var(--dt-color-neutral-black-l) / var(--alpha, 100%));--dt-color-neutral-black: #000000;--dt-color-neutral-transparent-h: 0;--dt-color-neutral-transparent-s: 0%;--dt-color-neutral-transparent-l: 0%;--dt-color-neutral-transparent-hsl: var(--dt-color-neutral-transparent-h) var(--dt-color-neutral-transparent-s) var(--dt-color-neutral-transparent-l);--dt-color-neutral-transparent-hsla: hsla(var(--dt-color-neutral-transparent-h) var(--dt-color-neutral-transparent-s) var(--dt-color-neutral-transparent-l) / var(--alpha, 100%));--dt-color-neutral-transparent: transparent;--dt-color-black-100-h: 0;--dt-color-black-100-s: 0%;--dt-color-black-100-l: 0%;--dt-color-black-100-hsl: var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l);--dt-color-black-100-hsla: hsla(var(--dt-color-black-100-h) var(--dt-color-black-100-s) var(--dt-color-black-100-l) / var(--alpha, 100%));--dt-color-black-100: #000000;--dt-color-black-200-h: 0;--dt-color-black-200-s: 0%;--dt-color-black-200-l: 14.901960784313726%;--dt-color-black-200-hsl: var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l);--dt-color-black-200-hsla: hsla(var(--dt-color-black-200-h) var(--dt-color-black-200-s) var(--dt-color-black-200-l) / var(--alpha, 100%));--dt-color-black-200: #262626;--dt-color-black-300-h: 0;--dt-color-black-300-s: 0%;--dt-color-black-300-l: 22.745098039215687%;--dt-color-black-300-hsl: var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l);--dt-color-black-300-hsla: hsla(var(--dt-color-black-300-h) var(--dt-color-black-300-s) var(--dt-color-black-300-l) / var(--alpha, 100%));--dt-color-black-300: #3A3A3A;--dt-color-black-400-h: 0;--dt-color-black-400-s: 0%;--dt-color-black-400-l: 33.33333333333333%;--dt-color-black-400-hsl: var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l);--dt-color-black-400-hsla: hsla(var(--dt-color-black-400-h) var(--dt-color-black-400-s) var(--dt-color-black-400-l) / var(--alpha, 100%));--dt-color-black-400: #555555;--dt-color-black-500-h: 0;--dt-color-black-500-s: 0%;--dt-color-black-500-l: 50.19607843137255%;--dt-color-black-500-hsl: var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l);--dt-color-black-500-hsla: hsla(var(--dt-color-black-500-h) var(--dt-color-black-500-s) var(--dt-color-black-500-l) / var(--alpha, 100%));--dt-color-black-500: #808080;--dt-color-black-600-h: 0;--dt-color-black-600-s: 0%;--dt-color-black-600-l: 66.66666666666666%;--dt-color-black-600-hsl: var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l);--dt-color-black-600-hsla: hsla(var(--dt-color-black-600-h) var(--dt-color-black-600-s) var(--dt-color-black-600-l) / var(--alpha, 100%));--dt-color-black-600: #AAAAAA;--dt-color-black-700-h: 0;--dt-color-black-700-s: 0%;--dt-color-black-700-l: 76.07843137254902%;--dt-color-black-700-hsl: var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l);--dt-color-black-700-hsla: hsla(var(--dt-color-black-700-h) var(--dt-color-black-700-s) var(--dt-color-black-700-l) / var(--alpha, 100%));--dt-color-black-700: #C2C2C2;--dt-color-black-800-h: 0;--dt-color-black-800-s: 0%;--dt-color-black-800-l: 83.13725490196079%;--dt-color-black-800-hsl: var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l);--dt-color-black-800-hsla: hsla(var(--dt-color-black-800-h) var(--dt-color-black-800-s) var(--dt-color-black-800-l) / var(--alpha, 100%));--dt-color-black-800: #D4D4D4;--dt-color-black-900-h: 0;--dt-color-black-900-s: 0%;--dt-color-black-900-l: 90.19607843137256%;--dt-color-black-900-hsl: var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l);--dt-color-black-900-hsla: hsla(var(--dt-color-black-900-h) var(--dt-color-black-900-s) var(--dt-color-black-900-l) / var(--alpha, 100%));--dt-color-black-900: #E6E6E6;--dt-color-purple-100-h: 260;--dt-color-purple-100-s: 91.30434782608695%;--dt-color-purple-100-l: 9.019607843137255%;--dt-color-purple-100-hsl: var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l);--dt-color-purple-100-hsla: hsla(var(--dt-color-purple-100-h) var(--dt-color-purple-100-s) var(--dt-color-purple-100-l) / var(--alpha, 100%));--dt-color-purple-100: #10022C;--dt-color-purple-200-h: 254.49999999999997;--dt-color-purple-200-s: 67.41573033707866%;--dt-color-purple-200-l: 34.90196078431373%;--dt-color-purple-200-hsl: var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l);--dt-color-purple-200-hsla: hsla(var(--dt-color-purple-200-h) var(--dt-color-purple-200-s) var(--dt-color-purple-200-l) / var(--alpha, 100%));--dt-color-purple-200: #3A1D95;--dt-color-purple-300-h: 254.5664739884393;--dt-color-purple-300-s: 100%;--dt-color-purple-300-l: 66.07843137254902%;--dt-color-purple-300-hsl: var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l);--dt-color-purple-300-hsla: hsla(var(--dt-color-purple-300-h) var(--dt-color-purple-300-s) var(--dt-color-purple-300-l) / var(--alpha, 100%));--dt-color-purple-300: #7C52FF;--dt-color-purple-400-h: 260.9302325581395;--dt-color-purple-400-s: 100%;--dt-color-purple-400-l: 74.70588235294117%;--dt-color-purple-400-hsl: var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l);--dt-color-purple-400-hsla: hsla(var(--dt-color-purple-400-h) var(--dt-color-purple-400-s) var(--dt-color-purple-400-l) / var(--alpha, 100%));--dt-color-purple-400: #AB7EFF;--dt-color-purple-500-h: 260.35714285714283;--dt-color-purple-500-s: 100%;--dt-color-purple-500-l: 89.01960784313725%;--dt-color-purple-500-hsl: var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l);--dt-color-purple-500-hsla: hsla(var(--dt-color-purple-500-h) var(--dt-color-purple-500-s) var(--dt-color-purple-500-l) / var(--alpha, 100%));--dt-color-purple-500: #DAC7FF;--dt-color-purple-600-h: 260.00000000000006;--dt-color-purple-600-s: 100%;--dt-color-purple-600-l: 97.05882352941177%;--dt-color-purple-600-hsl: var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l);--dt-color-purple-600-hsla: hsla(var(--dt-color-purple-600-h) var(--dt-color-purple-600-s) var(--dt-color-purple-600-l) / var(--alpha, 100%));--dt-color-purple-600: #F5F0FF;--dt-color-blue-100-h: 212.77777777777777;--dt-color-blue-100-s: 98.18181818181819%;--dt-color-blue-100-l: 21.56862745098039%;--dt-color-blue-100-hsl: var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l);--dt-color-blue-100-hsla: hsla(var(--dt-color-blue-100-h) var(--dt-color-blue-100-s) var(--dt-color-blue-100-l) / var(--alpha, 100%));--dt-color-blue-100: #01326D;--dt-color-blue-200-h: 212.22857142857146;--dt-color-blue-200-s: 79.18552036199095%;--dt-color-blue-200-l: 43.333333333333336%;--dt-color-blue-200-hsl: var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l);--dt-color-blue-200-hsla: hsla(var(--dt-color-blue-200-h) var(--dt-color-blue-200-s) var(--dt-color-blue-200-l) / var(--alpha, 100%));--dt-color-blue-200: #1768C6;--dt-color-blue-300-h: 212.60115606936418;--dt-color-blue-300-s: 98.85714285714286%;--dt-color-blue-300-l: 65.68627450980392%;--dt-color-blue-300-hsl: var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l);--dt-color-blue-300-hsla: hsla(var(--dt-color-blue-300-h) var(--dt-color-blue-300-s) var(--dt-color-blue-300-l) / var(--alpha, 100%));--dt-color-blue-300: #51A0FE;--dt-color-blue-400-h: 212.35294117647058;--dt-color-blue-400-s: 100%;--dt-color-blue-400-l: 80%;--dt-color-blue-400-hsl: var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l);--dt-color-blue-400-hsla: hsla(var(--dt-color-blue-400-h) var(--dt-color-blue-400-s) var(--dt-color-blue-400-l) / var(--alpha, 100%));--dt-color-blue-400: #99C8FF;--dt-color-blue-500-h: 210;--dt-color-blue-500-s: 61.538461538461554%;--dt-color-blue-500-l: 94.90196078431372%;--dt-color-blue-500-hsl: var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l);--dt-color-blue-500-hsla: hsla(var(--dt-color-blue-500-h) var(--dt-color-blue-500-s) var(--dt-color-blue-500-l) / var(--alpha, 100%));--dt-color-blue-500: #EAF2FA;--dt-color-magenta-100-h: 325.86206896551727;--dt-color-magenta-100-s: 52.72727272727272%;--dt-color-magenta-100-l: 21.568627450980394%;--dt-color-magenta-100-hsl: var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l);--dt-color-magenta-100-hsla: hsla(var(--dt-color-magenta-100-h) var(--dt-color-magenta-100-s) var(--dt-color-magenta-100-l) / var(--alpha, 100%));--dt-color-magenta-100: #541A3B;--dt-color-magenta-200-h: 325.7142857142857;--dt-color-magenta-200-s: 81.81818181818181%;--dt-color-magenta-200-l: 30.196078431372552%;--dt-color-magenta-200-hsl: var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l);--dt-color-magenta-200-hsla: hsla(var(--dt-color-magenta-200-h) var(--dt-color-magenta-200-s) var(--dt-color-magenta-200-l) / var(--alpha, 100%));--dt-color-magenta-200: #8C0E56;--dt-color-magenta-300-h: 325.7831325301205;--dt-color-magenta-300-s: 100%;--dt-color-magenta-300-l: 48.8235294117647%;--dt-color-magenta-300-hsl: var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l);--dt-color-magenta-300-hsla: hsla(var(--dt-color-magenta-300-h) var(--dt-color-magenta-300-s) var(--dt-color-magenta-300-l) / var(--alpha, 100%));--dt-color-magenta-300: #F9008E;--dt-color-magenta-400-h: 325.86206896551727;--dt-color-magenta-400-s: 90.62500000000001%;--dt-color-magenta-400-l: 74.90196078431373%;--dt-color-magenta-400-hsl: var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l);--dt-color-magenta-400-hsla: hsla(var(--dt-color-magenta-400-h) var(--dt-color-magenta-400-s) var(--dt-color-magenta-400-l) / var(--alpha, 100%));--dt-color-magenta-400: #F985C7;--dt-color-magenta-500-h: 325.16129032258067;--dt-color-magenta-500-s: 100%;--dt-color-magenta-500-l: 93.92156862745098%;--dt-color-magenta-500-hsl: var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l);--dt-color-magenta-500-hsla: hsla(var(--dt-color-magenta-500-h) var(--dt-color-magenta-500-s) var(--dt-color-magenta-500-l) / var(--alpha, 100%));--dt-color-magenta-500: #FFE0F2;--dt-color-gold-100-h: 35.70247933884298;--dt-color-gold-100-s: 88.32116788321169%;--dt-color-gold-100-l: 26.862745098039216%;--dt-color-gold-100-hsl: var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l);--dt-color-gold-100-hsla: hsla(var(--dt-color-gold-100-h) var(--dt-color-gold-100-s) var(--dt-color-gold-100-l) / var(--alpha, 100%));--dt-color-gold-100: #815008;--dt-color-gold-200-h: 35.92814371257486;--dt-color-gold-200-s: 66.00790513833991%;--dt-color-gold-200-l: 49.6078431372549%;--dt-color-gold-200-hsl: var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l);--dt-color-gold-200-hsla: hsla(var(--dt-color-gold-200-h) var(--dt-color-gold-200-s) var(--dt-color-gold-200-l) / var(--alpha, 100%));--dt-color-gold-200: #D28F2B;--dt-color-gold-300-h: 35.80645161290322;--dt-color-gold-300-s: 91.17647058823533%;--dt-color-gold-300-l: 60%;--dt-color-gold-300-hsl: var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l);--dt-color-gold-300-hsla: hsla(var(--dt-color-gold-300-h) var(--dt-color-gold-300-s) var(--dt-color-gold-300-l) / var(--alpha, 100%));--dt-color-gold-300: #F6AB3C;--dt-color-gold-400-h: 42.99212598425196;--dt-color-gold-400-s: 100%;--dt-color-gold-400-l: 75.09803921568627%;--dt-color-gold-400-hsl: var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l);--dt-color-gold-400-hsla: hsla(var(--dt-color-gold-400-h) var(--dt-color-gold-400-s) var(--dt-color-gold-400-l) / var(--alpha, 100%));--dt-color-gold-400: #FFDB80;--dt-color-gold-500-h: 47.058823529411775;--dt-color-gold-500-s: 100%;--dt-color-gold-500-l: 90%;--dt-color-gold-500-hsl: var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l);--dt-color-gold-500-hsla: hsla(var(--dt-color-gold-500-h) var(--dt-color-gold-500-s) var(--dt-color-gold-500-l) / var(--alpha, 100%));--dt-color-gold-500: #FFF4CC;--dt-color-green-100-h: 136.15384615384616;--dt-color-green-100-s: 59.09090909090909%;--dt-color-green-100-l: 17.254901960784313%;--dt-color-green-100-hsl: var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l);--dt-color-green-100-hsla: hsla(var(--dt-color-green-100-h) var(--dt-color-green-100-s) var(--dt-color-green-100-l) / var(--alpha, 100%));--dt-color-green-100: #124620;--dt-color-green-200-h: 136.64233576642334;--dt-color-green-200-s: 72.4867724867725%;--dt-color-green-200-l: 37.05882352941176%;--dt-color-green-200-hsl: var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l);--dt-color-green-200-hsla: hsla(var(--dt-color-green-200-h) var(--dt-color-green-200-s) var(--dt-color-green-200-l) / var(--alpha, 100%));--dt-color-green-200: #1AA340;--dt-color-green-300-h: 136.85393258426967;--dt-color-green-300-s: 91.75257731958763%;--dt-color-green-300-l: 61.96078431372549%;--dt-color-green-300-hsl: var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l);--dt-color-green-300-hsla: hsla(var(--dt-color-green-300-h) var(--dt-color-green-300-s) var(--dt-color-green-300-l) / var(--alpha, 100%));--dt-color-green-300: #45F777;--dt-color-green-400-h: 111.52173913043478;--dt-color-green-400-s: 100%;--dt-color-green-400-l: 81.96078431372548%;--dt-color-green-400-hsl: var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l);--dt-color-green-400-hsla: hsla(var(--dt-color-green-400-h) var(--dt-color-green-400-s) var(--dt-color-green-400-l) / var(--alpha, 100%));--dt-color-green-400: #B0FFA3;--dt-color-green-500-h: 111.42857142857133;--dt-color-green-500-s: 53.84615384615389%;--dt-color-green-500-l: 94.90196078431372%;--dt-color-green-500-hsl: var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l);--dt-color-green-500-hsla: hsla(var(--dt-color-green-500-h) var(--dt-color-green-500-s) var(--dt-color-green-500-l) / var(--alpha, 100%));--dt-color-green-500: #EDF9EB;--dt-color-red-100-h: 0;--dt-color-red-100-s: 89.58333333333334%;--dt-color-red-100-l: 18.823529411764707%;--dt-color-red-100-hsl: var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l);--dt-color-red-100-hsla: hsla(var(--dt-color-red-100-h) var(--dt-color-red-100-s) var(--dt-color-red-100-l) / var(--alpha, 100%));--dt-color-red-100: #5B0505;--dt-color-red-200-h: 0;--dt-color-red-200-s: 88.659793814433%;--dt-color-red-200-l: 38.03921568627451%;--dt-color-red-200-hsl: var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l);--dt-color-red-200-hsla: hsla(var(--dt-color-red-200-h) var(--dt-color-red-200-s) var(--dt-color-red-200-l) / var(--alpha, 100%));--dt-color-red-200: #B70B0B;--dt-color-red-300-h: 0;--dt-color-red-300-s: 88.79999999999998%;--dt-color-red-300-l: 49.01960784313726%;--dt-color-red-300-hsl: var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l);--dt-color-red-300-hsla: hsla(var(--dt-color-red-300-h) var(--dt-color-red-300-s) var(--dt-color-red-300-l) / var(--alpha, 100%));--dt-color-red-300: #EC0E0E;--dt-color-red-400-h: 0;--dt-color-red-400-s: 100%;--dt-color-red-400-l: 76.07843137254902%;--dt-color-red-400-hsl: var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l);--dt-color-red-400-hsla: hsla(var(--dt-color-red-400-h) var(--dt-color-red-400-s) var(--dt-color-red-400-l) / var(--alpha, 100%));--dt-color-red-400: #FF8585;--dt-color-red-500-h: 357.6923076923077;--dt-color-red-500-s: 100%;--dt-color-red-500-l: 94.90196078431372%;--dt-color-red-500-hsl: var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l);--dt-color-red-500-hsla: hsla(var(--dt-color-red-500-h) var(--dt-color-red-500-s) var(--dt-color-red-500-l) / var(--alpha, 100%));--dt-color-red-500: #FFE5E6;--dt-color-tan-100-h: 0;--dt-color-tan-100-s: 0%;--dt-color-tan-100-l: 7.0588235294117645%;--dt-color-tan-100-hsl: var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l);--dt-color-tan-100-hsla: hsla(var(--dt-color-tan-100-h) var(--dt-color-tan-100-s) var(--dt-color-tan-100-l) / var(--alpha, 100%));--dt-color-tan-100: #121212;--dt-color-tan-200-h: 20.000000000000046;--dt-color-tan-200-s: 2.4390243902439055%;--dt-color-tan-200-l: 24.11764705882353%;--dt-color-tan-200-hsl: var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l);--dt-color-tan-200-hsla: hsla(var(--dt-color-tan-200-h) var(--dt-color-tan-200-s) var(--dt-color-tan-200-l) / var(--alpha, 100%));--dt-color-tan-200: #3F3D3C;--dt-color-tan-300-h: 24.999999999999982;--dt-color-tan-300-s: 4.761904761904762%;--dt-color-tan-300-l: 50.588235294117645%;--dt-color-tan-300-hsl: var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l);--dt-color-tan-300-hsla: hsla(var(--dt-color-tan-300-h) var(--dt-color-tan-300-s) var(--dt-color-tan-300-l) / var(--alpha, 100%));--dt-color-tan-300: #87807B;--dt-color-tan-400-h: 23.99999999999993;--dt-color-tan-400-s: 9.259259259259254%;--dt-color-tan-400-l: 78.82352941176471%;--dt-color-tan-400-hsl: var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l);--dt-color-tan-400-hsla: hsla(var(--dt-color-tan-400-h) var(--dt-color-tan-400-s) var(--dt-color-tan-400-l) / var(--alpha, 100%));--dt-color-tan-400: #CEC8C4;--dt-color-tan-500-h: 30;--dt-color-tan-500-s: 13.333333333333282%;--dt-color-tan-500-l: 94.11764705882352%;--dt-color-tan-500-hsl: var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l);--dt-color-tan-500-hsla: hsla(var(--dt-color-tan-500-h) var(--dt-color-tan-500-s) var(--dt-color-tan-500-l) / var(--alpha, 100%));--dt-color-tan-500: #F2F0EE;--dt-color-gradient-magenta-purple-h: 0;--dt-color-gradient-magenta-purple-s: 0%;--dt-color-gradient-magenta-purple-l: 0%;--dt-color-gradient-magenta-purple-hsl: var(--dt-color-gradient-magenta-purple-h) var(--dt-color-gradient-magenta-purple-s) var(--dt-color-gradient-magenta-purple-l);--dt-color-gradient-magenta-purple-hsla: hsla(var(--dt-color-gradient-magenta-purple-h) var(--dt-color-gradient-magenta-purple-s) var(--dt-color-gradient-magenta-purple-l) / var(--alpha, 100%));--dt-color-gradient-magenta-purple: linear-gradient(135deg, #F9008E 10%, #7C52FF 90%);--dt-color-brand-purple-h: 254.5664739884393;--dt-color-brand-purple-s: 100%;--dt-color-brand-purple-l: 66.07843137254902%;--dt-color-brand-purple-hsl: var(--dt-color-brand-purple-h) var(--dt-color-brand-purple-s) var(--dt-color-brand-purple-l);--dt-color-brand-purple-hsla: hsla(var(--dt-color-brand-purple-h) var(--dt-color-brand-purple-s) var(--dt-color-brand-purple-l) / var(--alpha, 100%));--dt-color-brand-purple: #7C52FF;--dt-color-brand-magenta-h: 325.7831325301205;--dt-color-brand-magenta-s: 100%;--dt-color-brand-magenta-l: 48.8235294117647%;--dt-color-brand-magenta-hsl: var(--dt-color-brand-magenta-h) var(--dt-color-brand-magenta-s) var(--dt-color-brand-magenta-l);--dt-color-brand-magenta-hsla: hsla(var(--dt-color-brand-magenta-h) var(--dt-color-brand-magenta-s) var(--dt-color-brand-magenta-l) / var(--alpha, 100%));--dt-color-brand-magenta: #F9008E;--dt-color-brand-gold-h: 35.80645161290322;--dt-color-brand-gold-s: 91.17647058823533%;--dt-color-brand-gold-l: 60%;--dt-color-brand-gold-hsl: var(--dt-color-brand-gold-h) var(--dt-color-brand-gold-s) var(--dt-color-brand-gold-l);--dt-color-brand-gold-hsla: hsla(var(--dt-color-brand-gold-h) var(--dt-color-brand-gold-s) var(--dt-color-brand-gold-l) / var(--alpha, 100%));--dt-color-brand-gold: #F6AB3C;--dt-opacity-0: 0;--dt-opacity-100: .05;--dt-opacity-200: .1;--dt-opacity-300: .2;--dt-opacity-400: .25;--dt-opacity-500: .3;--dt-opacity-600: .4;--dt-opacity-700: .5;--dt-opacity-800: .6;--dt-opacity-900: .7;--dt-opacity-1000: .75;--dt-opacity-1100: .8;--dt-opacity-1200: .9;--dt-opacity-1300: 1;--dt-shadow-small-1-blur: .4rem;--dt-shadow-small-1-spread: 0rem;--dt-shadow-small-1-color-h: 0;--dt-shadow-small-1-color-s: 0%;--dt-shadow-small-1-color-l: 0%;--dt-shadow-small-1-color-hsl: var(--dt-shadow-small-1-color-h) var(--dt-shadow-small-1-color-s) var(--dt-shadow-small-1-color-l);--dt-shadow-small-1-color-hsla: hsla(var(--dt-shadow-small-1-color-h) var(--dt-shadow-small-1-color-s) var(--dt-shadow-small-1-color-l) / var(--alpha, 100%));--dt-shadow-small-1-color: rgba(0, 0, 0, .45);--dt-shadow-small-1-type: dropShadow;--dt-shadow-small-1-offset-x: 0rem;--dt-shadow-small-1-offset-y: .2rem;--dt-shadow-small-2-blur: 0rem;--dt-shadow-small-2-spread: 0rem;--dt-shadow-small-2-color-h: 0;--dt-shadow-small-2-color-s: 0%;--dt-shadow-small-2-color-l: 0%;--dt-shadow-small-2-color-hsl: var(--dt-shadow-small-2-color-h) var(--dt-shadow-small-2-color-s) var(--dt-shadow-small-2-color-l);--dt-shadow-small-2-color-hsla: hsla(var(--dt-shadow-small-2-color-h) var(--dt-shadow-small-2-color-s) var(--dt-shadow-small-2-color-l) / var(--alpha, 100%));--dt-shadow-small-2-color: #000000;--dt-shadow-small-2-type: dropShadow;--dt-shadow-small-2-offset-x: .05rem;--dt-shadow-small-2-offset-y: .05rem;--dt-shadow-small-3-blur: 0rem;--dt-shadow-small-3-spread: 0rem;--dt-shadow-small-3-color-h: 0;--dt-shadow-small-3-color-s: 0%;--dt-shadow-small-3-color-l: 0%;--dt-shadow-small-3-color-hsl: var(--dt-shadow-small-3-color-h) var(--dt-shadow-small-3-color-s) var(--dt-shadow-small-3-color-l);--dt-shadow-small-3-color-hsla: hsla(var(--dt-shadow-small-3-color-h) var(--dt-shadow-small-3-color-s) var(--dt-shadow-small-3-color-l) / var(--alpha, 100%));--dt-shadow-small-3-color: #000000;--dt-shadow-small-3-type: dropShadow;--dt-shadow-small-3-offset-x: -.05rem;--dt-shadow-small-3-offset-y: -.05rem;--dt-shadow-small-4-blur: 0rem;--dt-shadow-small-4-spread: 0rem;--dt-shadow-small-4-color-h: 0;--dt-shadow-small-4-color-s: 0%;--dt-shadow-small-4-color-l: 0%;--dt-shadow-small-4-color-hsl: var(--dt-shadow-small-4-color-h) var(--dt-shadow-small-4-color-s) var(--dt-shadow-small-4-color-l);--dt-shadow-small-4-color-hsla: hsla(var(--dt-shadow-small-4-color-h) var(--dt-shadow-small-4-color-s) var(--dt-shadow-small-4-color-l) / var(--alpha, 100%));--dt-shadow-small-4-color: #000000;--dt-shadow-small-4-type: dropShadow;--dt-shadow-small-4-offset-x: -.05rem;--dt-shadow-small-4-offset-y: .05rem;--dt-shadow-small-5-blur: 0rem;--dt-shadow-small-5-spread: 0rem;--dt-shadow-small-5-color-h: 0;--dt-shadow-small-5-color-s: 0%;--dt-shadow-small-5-color-l: 0%;--dt-shadow-small-5-color-hsl: var(--dt-shadow-small-5-color-h) var(--dt-shadow-small-5-color-s) var(--dt-shadow-small-5-color-l);--dt-shadow-small-5-color-hsla: hsla(var(--dt-shadow-small-5-color-h) var(--dt-shadow-small-5-color-s) var(--dt-shadow-small-5-color-l) / var(--alpha, 100%));--dt-shadow-small-5-color: #000000;--dt-shadow-small-5-type: dropShadow;--dt-shadow-small-5-offset-x: .05rem;--dt-shadow-small-5-offset-y: -.05rem;--dt-shadow-medium-1-blur: .8rem;--dt-shadow-medium-1-spread: 0rem;--dt-shadow-medium-1-color-h: 0;--dt-shadow-medium-1-color-s: 0%;--dt-shadow-medium-1-color-l: 0%;--dt-shadow-medium-1-color-hsl: var(--dt-shadow-medium-1-color-h) var(--dt-shadow-medium-1-color-s) var(--dt-shadow-medium-1-color-l);--dt-shadow-medium-1-color-hsla: hsla(var(--dt-shadow-medium-1-color-h) var(--dt-shadow-medium-1-color-s) var(--dt-shadow-medium-1-color-l) / var(--alpha, 100%));--dt-shadow-medium-1-color: rgba(0, 0, 0, .55);--dt-shadow-medium-1-type: dropShadow;--dt-shadow-medium-1-offset-x: 0rem;--dt-shadow-medium-1-offset-y: .2rem;--dt-shadow-medium-2-blur: 0rem;--dt-shadow-medium-2-spread: 0rem;--dt-shadow-medium-2-color-h: 0;--dt-shadow-medium-2-color-s: 0%;--dt-shadow-medium-2-color-l: 0%;--dt-shadow-medium-2-color-hsl: var(--dt-shadow-medium-2-color-h) var(--dt-shadow-medium-2-color-s) var(--dt-shadow-medium-2-color-l);--dt-shadow-medium-2-color-hsla: hsla(var(--dt-shadow-medium-2-color-h) var(--dt-shadow-medium-2-color-s) var(--dt-shadow-medium-2-color-l) / var(--alpha, 100%));--dt-shadow-medium-2-color: #000000;--dt-shadow-medium-2-type: dropShadow;--dt-shadow-medium-2-offset-x: .05rem;--dt-shadow-medium-2-offset-y: .05rem;--dt-shadow-medium-3-blur: 0rem;--dt-shadow-medium-3-spread: 0rem;--dt-shadow-medium-3-color-h: 0;--dt-shadow-medium-3-color-s: 0%;--dt-shadow-medium-3-color-l: 0%;--dt-shadow-medium-3-color-hsl: var(--dt-shadow-medium-3-color-h) var(--dt-shadow-medium-3-color-s) var(--dt-shadow-medium-3-color-l);--dt-shadow-medium-3-color-hsla: hsla(var(--dt-shadow-medium-3-color-h) var(--dt-shadow-medium-3-color-s) var(--dt-shadow-medium-3-color-l) / var(--alpha, 100%));--dt-shadow-medium-3-color: #000000;--dt-shadow-medium-3-type: dropShadow;--dt-shadow-medium-3-offset-x: -.05rem;--dt-shadow-medium-3-offset-y: -.05rem;--dt-shadow-medium-4-blur: 0rem;--dt-shadow-medium-4-spread: 0rem;--dt-shadow-medium-4-color-h: 0;--dt-shadow-medium-4-color-s: 0%;--dt-shadow-medium-4-color-l: 0%;--dt-shadow-medium-4-color-hsl: var(--dt-shadow-medium-4-color-h) var(--dt-shadow-medium-4-color-s) var(--dt-shadow-medium-4-color-l);--dt-shadow-medium-4-color-hsla: hsla(var(--dt-shadow-medium-4-color-h) var(--dt-shadow-medium-4-color-s) var(--dt-shadow-medium-4-color-l) / var(--alpha, 100%));--dt-shadow-medium-4-color: #000000;--dt-shadow-medium-4-type: dropShadow;--dt-shadow-medium-4-offset-x: -.05rem;--dt-shadow-medium-4-offset-y: .05rem;--dt-shadow-medium-5-blur: 0rem;--dt-shadow-medium-5-spread: 0rem;--dt-shadow-medium-5-color-h: 0;--dt-shadow-medium-5-color-s: 0%;--dt-shadow-medium-5-color-l: 0%;--dt-shadow-medium-5-color-hsl: var(--dt-shadow-medium-5-color-h) var(--dt-shadow-medium-5-color-s) var(--dt-shadow-medium-5-color-l);--dt-shadow-medium-5-color-hsla: hsla(var(--dt-shadow-medium-5-color-h) var(--dt-shadow-medium-5-color-s) var(--dt-shadow-medium-5-color-l) / var(--alpha, 100%));--dt-shadow-medium-5-color: #000000;--dt-shadow-medium-5-type: dropShadow;--dt-shadow-medium-5-offset-x: .05rem;--dt-shadow-medium-5-offset-y: -.05rem;--dt-shadow-large-1-blur: 1.6rem;--dt-shadow-large-1-spread: 0rem;--dt-shadow-large-1-color-h: 0;--dt-shadow-large-1-color-s: 0%;--dt-shadow-large-1-color-l: 0%;--dt-shadow-large-1-color-hsl: var(--dt-shadow-large-1-color-h) var(--dt-shadow-large-1-color-s) var(--dt-shadow-large-1-color-l);--dt-shadow-large-1-color-hsla: hsla(var(--dt-shadow-large-1-color-h) var(--dt-shadow-large-1-color-s) var(--dt-shadow-large-1-color-l) / var(--alpha, 100%));--dt-shadow-large-1-color: rgba(0, 0, 0, .55);--dt-shadow-large-1-type: dropShadow;--dt-shadow-large-1-offset-x: 0rem;--dt-shadow-large-1-offset-y: .2rem;--dt-shadow-large-2-blur: 0rem;--dt-shadow-large-2-spread: 0rem;--dt-shadow-large-2-color-h: 0;--dt-shadow-large-2-color-s: 0%;--dt-shadow-large-2-color-l: 0%;--dt-shadow-large-2-color-hsl: var(--dt-shadow-large-2-color-h) var(--dt-shadow-large-2-color-s) var(--dt-shadow-large-2-color-l);--dt-shadow-large-2-color-hsla: hsla(var(--dt-shadow-large-2-color-h) var(--dt-shadow-large-2-color-s) var(--dt-shadow-large-2-color-l) / var(--alpha, 100%));--dt-shadow-large-2-color: #000000;--dt-shadow-large-2-type: dropShadow;--dt-shadow-large-2-offset-x: -.05rem;--dt-shadow-large-2-offset-y: .05rem;--dt-shadow-large-3-blur: 0rem;--dt-shadow-large-3-spread: 0rem;--dt-shadow-large-3-color-h: 0;--dt-shadow-large-3-color-s: 0%;--dt-shadow-large-3-color-l: 0%;--dt-shadow-large-3-color-hsl: var(--dt-shadow-large-3-color-h) var(--dt-shadow-large-3-color-s) var(--dt-shadow-large-3-color-l);--dt-shadow-large-3-color-hsla: hsla(var(--dt-shadow-large-3-color-h) var(--dt-shadow-large-3-color-s) var(--dt-shadow-large-3-color-l) / var(--alpha, 100%));--dt-shadow-large-3-color: #000000;--dt-shadow-large-3-type: dropShadow;--dt-shadow-large-3-offset-x: -.05rem;--dt-shadow-large-3-offset-y: -.05rem;--dt-shadow-large-4-blur: 0rem;--dt-shadow-large-4-spread: 0rem;--dt-shadow-large-4-color-h: 0;--dt-shadow-large-4-color-s: 0%;--dt-shadow-large-4-color-l: 0%;--dt-shadow-large-4-color-hsl: var(--dt-shadow-large-4-color-h) var(--dt-shadow-large-4-color-s) var(--dt-shadow-large-4-color-l);--dt-shadow-large-4-color-hsla: hsla(var(--dt-shadow-large-4-color-h) var(--dt-shadow-large-4-color-s) var(--dt-shadow-large-4-color-l) / var(--alpha, 100%));--dt-shadow-large-4-color: #000000;--dt-shadow-large-4-type: dropShadow;--dt-shadow-large-4-offset-x: -.05rem;--dt-shadow-large-4-offset-y: .05rem;--dt-shadow-large-5-blur: 0rem;--dt-shadow-large-5-spread: 0rem;--dt-shadow-large-5-color-h: 0;--dt-shadow-large-5-color-s: 0%;--dt-shadow-large-5-color-l: 0%;--dt-shadow-large-5-color-hsl: var(--dt-shadow-large-5-color-h) var(--dt-shadow-large-5-color-s) var(--dt-shadow-large-5-color-l);--dt-shadow-large-5-color-hsla: hsla(var(--dt-shadow-large-5-color-h) var(--dt-shadow-large-5-color-s) var(--dt-shadow-large-5-color-l) / var(--alpha, 100%));--dt-shadow-large-5-color: #000000;--dt-shadow-large-5-type: dropShadow;--dt-shadow-large-5-offset-x: .05rem;--dt-shadow-large-5-offset-y: -.05rem;--dt-shadow-extra-large-1-blur: 3.2rem;--dt-shadow-extra-large-1-spread: 0rem;--dt-shadow-extra-large-1-color-h: 0;--dt-shadow-extra-large-1-color-s: 0%;--dt-shadow-extra-large-1-color-l: 0%;--dt-shadow-extra-large-1-color-hsl: var(--dt-shadow-extra-large-1-color-h) var(--dt-shadow-extra-large-1-color-s) var(--dt-shadow-extra-large-1-color-l);--dt-shadow-extra-large-1-color-hsla: hsla(var(--dt-shadow-extra-large-1-color-h) var(--dt-shadow-extra-large-1-color-s) var(--dt-shadow-extra-large-1-color-l) / var(--alpha, 100%));--dt-shadow-extra-large-1-color: rgba(0, 0, 0, .55);--dt-shadow-extra-large-1-type: dropShadow;--dt-shadow-extra-large-1-offset-x: 0rem;--dt-shadow-extra-large-1-offset-y: .2rem;--dt-shadow-extra-large-2-blur: 0rem;--dt-shadow-extra-large-2-spread: 0rem;--dt-shadow-extra-large-2-color-h: 0;--dt-shadow-extra-large-2-color-s: 0%;--dt-shadow-extra-large-2-color-l: 0%;--dt-shadow-extra-large-2-color-hsl: var(--dt-shadow-extra-large-2-color-h) var(--dt-shadow-extra-large-2-color-s) var(--dt-shadow-extra-large-2-color-l);--dt-shadow-extra-large-2-color-hsla: hsla(var(--dt-shadow-extra-large-2-color-h) var(--dt-shadow-extra-large-2-color-s) var(--dt-shadow-extra-large-2-color-l) / var(--alpha, 100%));--dt-shadow-extra-large-2-color: #000000;--dt-shadow-extra-large-2-type: dropShadow;--dt-shadow-extra-large-2-offset-x: .05rem;--dt-shadow-extra-large-2-offset-y: .05rem;--dt-shadow-extra-large-3-blur: 0rem;--dt-shadow-extra-large-3-spread: 0rem;--dt-shadow-extra-large-3-color-h: 0;--dt-shadow-extra-large-3-color-s: 0%;--dt-shadow-extra-large-3-color-l: 0%;--dt-shadow-extra-large-3-color-hsl: var(--dt-shadow-extra-large-3-color-h) var(--dt-shadow-extra-large-3-color-s) var(--dt-shadow-extra-large-3-color-l);--dt-shadow-extra-large-3-color-hsla: hsla(var(--dt-shadow-extra-large-3-color-h) var(--dt-shadow-extra-large-3-color-s) var(--dt-shadow-extra-large-3-color-l) / var(--alpha, 100%));--dt-shadow-extra-large-3-color: #000000;--dt-shadow-extra-large-3-type: dropShadow;--dt-shadow-extra-large-3-offset-x: -.05rem;--dt-shadow-extra-large-3-offset-y: -.05rem;--dt-shadow-extra-large-4-blur: 0rem;--dt-shadow-extra-large-4-spread: 0rem;--dt-shadow-extra-large-4-color-h: 0;--dt-shadow-extra-large-4-color-s: 0%;--dt-shadow-extra-large-4-color-l: 0%;--dt-shadow-extra-large-4-color-hsl: var(--dt-shadow-extra-large-4-color-h) var(--dt-shadow-extra-large-4-color-s) var(--dt-shadow-extra-large-4-color-l);--dt-shadow-extra-large-4-color-hsla: hsla(var(--dt-shadow-extra-large-4-color-h) var(--dt-shadow-extra-large-4-color-s) var(--dt-shadow-extra-large-4-color-l) / var(--alpha, 100%));--dt-shadow-extra-large-4-color: #000000;--dt-shadow-extra-large-4-type: dropShadow;--dt-shadow-extra-large-4-offset-x: -.05rem;--dt-shadow-extra-large-4-offset-y: .05rem;--dt-shadow-extra-large-5-blur: 0rem;--dt-shadow-extra-large-5-spread: 0rem;--dt-shadow-extra-large-5-color-h: 0;--dt-shadow-extra-large-5-color-s: 0%;--dt-shadow-extra-large-5-color-l: 0%;--dt-shadow-extra-large-5-color-hsl: var(--dt-shadow-extra-large-5-color-h) var(--dt-shadow-extra-large-5-color-s) var(--dt-shadow-extra-large-5-color-l);--dt-shadow-extra-large-5-color-hsla: hsla(var(--dt-shadow-extra-large-5-color-h) var(--dt-shadow-extra-large-5-color-s) var(--dt-shadow-extra-large-5-color-l) / var(--alpha, 100%));--dt-shadow-extra-large-5-color: #000000;--dt-shadow-extra-large-5-type: dropShadow;--dt-shadow-extra-large-5-offset-x: .05rem;--dt-shadow-extra-large-5-offset-y: -.05rem;--dt-shadow-card-1-blur: .2rem;--dt-shadow-card-1-spread: 0rem;--dt-shadow-card-1-color-h: 0;--dt-shadow-card-1-color-s: 0%;--dt-shadow-card-1-color-l: 0%;--dt-shadow-card-1-color-hsl: var(--dt-shadow-card-1-color-h) var(--dt-shadow-card-1-color-s) var(--dt-shadow-card-1-color-l);--dt-shadow-card-1-color-hsla: hsla(var(--dt-shadow-card-1-color-h) var(--dt-shadow-card-1-color-s) var(--dt-shadow-card-1-color-l) / var(--alpha, 100%));--dt-shadow-card-1-color: rgba(0, 0, 0, .35);--dt-shadow-card-1-type: dropShadow;--dt-shadow-card-1-offset-x: 0rem;--dt-shadow-card-1-offset-y: .1rem;--dt-shadow-card-2-blur: .4rem;--dt-shadow-card-2-spread: 0rem;--dt-shadow-card-2-color-h: 0;--dt-shadow-card-2-color-s: 0%;--dt-shadow-card-2-color-l: 0%;--dt-shadow-card-2-color-hsl: var(--dt-shadow-card-2-color-h) var(--dt-shadow-card-2-color-s) var(--dt-shadow-card-2-color-l);--dt-shadow-card-2-color-hsla: hsla(var(--dt-shadow-card-2-color-h) var(--dt-shadow-card-2-color-s) var(--dt-shadow-card-2-color-l) / var(--alpha, 100%));--dt-shadow-card-2-color: rgba(0, 0, 0, .45);--dt-shadow-card-2-type: dropShadow;--dt-shadow-card-2-offset-x: 0rem;--dt-shadow-card-2-offset-y: .2rem;--dt-shadow-card-3-blur: 1.6rem;--dt-shadow-card-3-spread: 0rem;--dt-shadow-card-3-color-h: 0;--dt-shadow-card-3-color-s: 0%;--dt-shadow-card-3-color-l: 0%;--dt-shadow-card-3-color-hsl: var(--dt-shadow-card-3-color-h) var(--dt-shadow-card-3-color-s) var(--dt-shadow-card-3-color-l);--dt-shadow-card-3-color-hsla: hsla(var(--dt-shadow-card-3-color-h) var(--dt-shadow-card-3-color-s) var(--dt-shadow-card-3-color-l) / var(--alpha, 100%));--dt-shadow-card-3-color: rgba(0, 0, 0, .58);--dt-shadow-card-3-type: dropShadow;--dt-shadow-card-3-offset-x: 0rem;--dt-shadow-card-3-offset-y: .2rem;--dt-shadow-card-4-blur: 0rem;--dt-shadow-card-4-spread: 0rem;--dt-shadow-card-4-color-h: 0;--dt-shadow-card-4-color-s: 0%;--dt-shadow-card-4-color-l: 0%;--dt-shadow-card-4-color-hsl: var(--dt-shadow-card-4-color-h) var(--dt-shadow-card-4-color-s) var(--dt-shadow-card-4-color-l);--dt-shadow-card-4-color-hsla: hsla(var(--dt-shadow-card-4-color-h) var(--dt-shadow-card-4-color-s) var(--dt-shadow-card-4-color-l) / var(--alpha, 100%));--dt-shadow-card-4-color: #000000;--dt-shadow-card-4-type: dropShadow;--dt-shadow-card-4-offset-x: .05rem;--dt-shadow-card-4-offset-y: .05rem;--dt-shadow-card-5-blur: 0rem;--dt-shadow-card-5-spread: 0rem;--dt-shadow-card-5-color-h: 0;--dt-shadow-card-5-color-s: 0%;--dt-shadow-card-5-color-l: 0%;--dt-shadow-card-5-color-hsl: var(--dt-shadow-card-5-color-h) var(--dt-shadow-card-5-color-s) var(--dt-shadow-card-5-color-l);--dt-shadow-card-5-color-hsla: hsla(var(--dt-shadow-card-5-color-h) var(--dt-shadow-card-5-color-s) var(--dt-shadow-card-5-color-l) / var(--alpha, 100%));--dt-shadow-card-5-color: #000000;--dt-shadow-card-5-type: dropShadow;--dt-shadow-card-5-offset-x: -.05rem;--dt-shadow-card-5-offset-y: -.05rem;--dt-shadow-card-6-blur: 0rem;--dt-shadow-card-6-spread: 0rem;--dt-shadow-card-6-color-h: 0;--dt-shadow-card-6-color-s: 0%;--dt-shadow-card-6-color-l: 0%;--dt-shadow-card-6-color-hsl: var(--dt-shadow-card-6-color-h) var(--dt-shadow-card-6-color-s) var(--dt-shadow-card-6-color-l);--dt-shadow-card-6-color-hsla: hsla(var(--dt-shadow-card-6-color-h) var(--dt-shadow-card-6-color-s) var(--dt-shadow-card-6-color-l) / var(--alpha, 100%));--dt-shadow-card-6-color: #000000;--dt-shadow-card-6-type: dropShadow;--dt-shadow-card-6-offset-x: -.05rem;--dt-shadow-card-6-offset-y: .05rem;--dt-shadow-card-7-blur: 0rem;--dt-shadow-card-7-spread: 0rem;--dt-shadow-card-7-color-h: 0;--dt-shadow-card-7-color-s: 0%;--dt-shadow-card-7-color-l: 0%;--dt-shadow-card-7-color-hsl: var(--dt-shadow-card-7-color-h) var(--dt-shadow-card-7-color-s) var(--dt-shadow-card-7-color-l);--dt-shadow-card-7-color-hsla: hsla(var(--dt-shadow-card-7-color-h) var(--dt-shadow-card-7-color-s) var(--dt-shadow-card-7-color-l) / var(--alpha, 100%));--dt-shadow-card-7-color: #000000;--dt-shadow-card-7-type: dropShadow;--dt-shadow-card-7-offset-x: .05rem;--dt-shadow-card-7-offset-y: -.05rem;--dt-shadow-focus-1-blur: 0rem;--dt-shadow-focus-1-spread: .1rem;--dt-shadow-focus-1-color-h: 0;--dt-shadow-focus-1-color-s: 0%;--dt-shadow-focus-1-color-l: 0%;--dt-shadow-focus-1-color-hsl: var(--dt-shadow-focus-1-color-h) var(--dt-shadow-focus-1-color-s) var(--dt-shadow-focus-1-color-l);--dt-shadow-focus-1-color-hsla: hsla(var(--dt-shadow-focus-1-color-h) var(--dt-shadow-focus-1-color-s) var(--dt-shadow-focus-1-color-l) / var(--alpha, 100%));--dt-shadow-focus-1-color: #000000;--dt-shadow-focus-1-type: dropShadow;--dt-shadow-focus-1-offset-x: 0rem;--dt-shadow-focus-1-offset-y: 0rem;--dt-shadow-focus-2-blur: 0rem;--dt-shadow-focus-2-spread: .3rem;--dt-shadow-focus-2-color-h: 212.60115606936418;--dt-shadow-focus-2-color-s: 98.85714285714286%;--dt-shadow-focus-2-color-l: 65.68627450980392%;--dt-shadow-focus-2-color-hsl: var(--dt-shadow-focus-2-color-h) var(--dt-shadow-focus-2-color-s) var(--dt-shadow-focus-2-color-l);--dt-shadow-focus-2-color-hsla: hsla(var(--dt-shadow-focus-2-color-h) var(--dt-shadow-focus-2-color-s) var(--dt-shadow-focus-2-color-l) / var(--alpha, 100%));--dt-shadow-focus-2-color: #51A0FE;--dt-shadow-focus-2-type: dropShadow;--dt-shadow-focus-2-offset-x: 0rem;--dt-shadow-focus-2-offset-y: 0rem;--dt-shadow-focus-inset-blur: 0rem;--dt-shadow-focus-inset-spread: .2rem;--dt-shadow-focus-inset-color-h: 212.60115606936418;--dt-shadow-focus-inset-color-s: 98.85714285714286%;--dt-shadow-focus-inset-color-l: 65.68627450980392%;--dt-shadow-focus-inset-color-hsl: var(--dt-shadow-focus-inset-color-h) var(--dt-shadow-focus-inset-color-s) var(--dt-shadow-focus-inset-color-l);--dt-shadow-focus-inset-color-hsla: hsla(var(--dt-shadow-focus-inset-color-h) var(--dt-shadow-focus-inset-color-s) var(--dt-shadow-focus-inset-color-l) / var(--alpha, 100%));--dt-shadow-focus-inset-color: #51A0FE;--dt-shadow-focus-inset-type: innerShadow;--dt-shadow-focus-inset-offset-x: 0rem;--dt-shadow-focus-inset-offset-y: 0rem;--dt-shadow-focus-inset: var(--dt-shadow-focus-inset-offset-x) var(--dt-shadow-focus-inset-offset-y) var(--dt-shadow-focus-inset-blur) var(--dt-shadow-focus-inset-spread) var(--dt-shadow-focus-inset-color) inset;--dt-shadow-focus: var(--dt-shadow-focus-1-offset-x) var(--dt-shadow-focus-1-offset-y) var(--dt-shadow-focus-1-blur) var(--dt-shadow-focus-1-spread) var(--dt-shadow-focus-1-color), var(--dt-shadow-focus-2-offset-x) var(--dt-shadow-focus-2-offset-y) var(--dt-shadow-focus-2-blur) var(--dt-shadow-focus-2-spread) var(--dt-shadow-focus-2-color);--dt-shadow-card: var(--dt-shadow-card-1-offset-x) var(--dt-shadow-card-1-offset-y) var(--dt-shadow-card-1-blur) var(--dt-shadow-card-1-spread) var(--dt-shadow-card-1-color), var(--dt-shadow-card-2-offset-x) var(--dt-shadow-card-2-offset-y) var(--dt-shadow-card-2-blur) var(--dt-shadow-card-2-spread) var(--dt-shadow-card-2-color), var(--dt-shadow-card-3-offset-x) var(--dt-shadow-card-3-offset-y) var(--dt-shadow-card-3-blur) var(--dt-shadow-card-3-spread) var(--dt-shadow-card-3-color), var(--dt-shadow-card-4-offset-x) var(--dt-shadow-card-4-offset-y) var(--dt-shadow-card-4-blur) var(--dt-shadow-card-4-spread) var(--dt-shadow-card-4-color), var(--dt-shadow-card-5-offset-x) var(--dt-shadow-card-5-offset-y) var(--dt-shadow-card-5-blur) var(--dt-shadow-card-5-spread) var(--dt-shadow-card-5-color), var(--dt-shadow-card-6-offset-x) var(--dt-shadow-card-6-offset-y) var(--dt-shadow-card-6-blur) var(--dt-shadow-card-6-spread) var(--dt-shadow-card-6-color), var(--dt-shadow-card-7-offset-x) var(--dt-shadow-card-7-offset-y) var(--dt-shadow-card-7-blur) var(--dt-shadow-card-7-spread) var(--dt-shadow-card-7-color);--dt-shadow-extra-large: var(--dt-shadow-extra-large-1-offset-x) var(--dt-shadow-extra-large-1-offset-y) var(--dt-shadow-extra-large-1-blur) var(--dt-shadow-extra-large-1-spread) var(--dt-shadow-extra-large-1-color), var(--dt-shadow-extra-large-2-offset-x) var(--dt-shadow-extra-large-2-offset-y) var(--dt-shadow-extra-large-2-blur) var(--dt-shadow-extra-large-2-spread) var(--dt-shadow-extra-large-2-color), var(--dt-shadow-extra-large-3-offset-x) var(--dt-shadow-extra-large-3-offset-y) var(--dt-shadow-extra-large-3-blur) var(--dt-shadow-extra-large-3-spread) var(--dt-shadow-extra-large-3-color), var(--dt-shadow-extra-large-4-offset-x) var(--dt-shadow-extra-large-4-offset-y) var(--dt-shadow-extra-large-4-blur) var(--dt-shadow-extra-large-4-spread) var(--dt-shadow-extra-large-4-color), var(--dt-shadow-extra-large-5-offset-x) var(--dt-shadow-extra-large-5-offset-y) var(--dt-shadow-extra-large-5-blur) var(--dt-shadow-extra-large-5-spread) var(--dt-shadow-extra-large-5-color);--dt-shadow-large: var(--dt-shadow-large-1-offset-x) var(--dt-shadow-large-1-offset-y) var(--dt-shadow-large-1-blur) var(--dt-shadow-large-1-spread) var(--dt-shadow-large-1-color), var(--dt-shadow-large-2-offset-x) var(--dt-shadow-large-2-offset-y) var(--dt-shadow-large-2-blur) var(--dt-shadow-large-2-spread) var(--dt-shadow-large-2-color), var(--dt-shadow-large-3-offset-x) var(--dt-shadow-large-3-offset-y) var(--dt-shadow-large-3-blur) var(--dt-shadow-large-3-spread) var(--dt-shadow-large-3-color), var(--dt-shadow-large-4-offset-x) var(--dt-shadow-large-4-offset-y) var(--dt-shadow-large-4-blur) var(--dt-shadow-large-4-spread) var(--dt-shadow-large-4-color), var(--dt-shadow-large-5-offset-x) var(--dt-shadow-large-5-offset-y) var(--dt-shadow-large-5-blur) var(--dt-shadow-large-5-spread) var(--dt-shadow-large-5-color);--dt-shadow-medium: var(--dt-shadow-medium-1-offset-x) var(--dt-shadow-medium-1-offset-y) var(--dt-shadow-medium-1-blur) var(--dt-shadow-medium-1-spread) var(--dt-shadow-medium-1-color), var(--dt-shadow-medium-2-offset-x) var(--dt-shadow-medium-2-offset-y) var(--dt-shadow-medium-2-blur) var(--dt-shadow-medium-2-spread) var(--dt-shadow-medium-2-color), var(--dt-shadow-medium-3-offset-x) var(--dt-shadow-medium-3-offset-y) var(--dt-shadow-medium-3-blur) var(--dt-shadow-medium-3-spread) var(--dt-shadow-medium-3-color), var(--dt-shadow-medium-4-offset-x) var(--dt-shadow-medium-4-offset-y) var(--dt-shadow-medium-4-blur) var(--dt-shadow-medium-4-spread) var(--dt-shadow-medium-4-color), var(--dt-shadow-medium-5-offset-x) var(--dt-shadow-medium-5-offset-y) var(--dt-shadow-medium-5-blur) var(--dt-shadow-medium-5-spread) var(--dt-shadow-medium-5-color);--dt-shadow-small: var(--dt-shadow-small-1-offset-x) var(--dt-shadow-small-1-offset-y) var(--dt-shadow-small-1-blur) var(--dt-shadow-small-1-spread) var(--dt-shadow-small-1-color), var(--dt-shadow-small-2-offset-x) var(--dt-shadow-small-2-offset-y) var(--dt-shadow-small-2-blur) var(--dt-shadow-small-2-spread) var(--dt-shadow-small-2-color), var(--dt-shadow-small-3-offset-x) var(--dt-shadow-small-3-offset-y) var(--dt-shadow-small-3-blur) var(--dt-shadow-small-3-spread) var(--dt-shadow-small-3-color), var(--dt-shadow-small-4-offset-x) var(--dt-shadow-small-4-offset-y) var(--dt-shadow-small-4-blur) var(--dt-shadow-small-4-spread) var(--dt-shadow-small-4-color), var(--dt-shadow-small-5-offset-x) var(--dt-shadow-small-5-offset-y) var(--dt-shadow-small-5-blur) var(--dt-shadow-small-5-spread) var(--dt-shadow-small-5-color);--dt-font-size-100-mobile: 1.2rem;--dt-font-size-200-mobile: 1.6rem;--dt-font-size-300-mobile: 2rem;--dt-font-size-400-mobile: 2.9rem;--dt-font-size-500-mobile: 4.1rem;--dt-font-size-100-tc8: 1.7rem;--dt-font-size-200-tc8: 2.1rem;--dt-font-size-300-tc8: 2.7rem;--dt-font-size-400-tc8: 3.8rem;--dt-font-size-500-tc8: 5.4rem;--dt-font-size-100-tv: 2.5rem;--dt-font-size-200-tv: 3.2rem;--dt-font-size-300-tv: 4.1rem;--dt-font-size-400-tv: 5.8rem;--dt-font-size-500-tv: 8.2rem;--zi-hide: -1;--zi-base: 0;--zi-base1: 1;--zi-selected: 25;--zi-active: 50;--zi-navigation: 100;--zi-navigation-fixed: 150;--zi-dropdown: 200;--zi-popover: 300;--zi-tooltip: 400;--zi-drawer: 500;--zi-modal: 600;--zi-modal-element: 650;--zi-notification: 700}';exports.Base=o;