@lumiastream/ui 0.8.9 → 0.8.11

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. package/dist/ChatMessageItem.js +1 -1
  2. package/dist/ChatboxPanel.js +1 -1
  3. package/dist/EventList.js +1 -1
  4. package/dist/EventListItem.js +1 -1
  5. package/dist/GoalsList.js +1 -1
  6. package/dist/LSButton.js +1 -1
  7. package/dist/LSCheckbox.js +1 -1
  8. package/dist/LSColorPicker.js +1 -1
  9. package/dist/LSDatePicker.js +1 -1
  10. package/dist/LSFontPicker.js +1 -1
  11. package/dist/LSInput.js +1 -1
  12. package/dist/LSMultiSelect.js +1 -1
  13. package/dist/LSRadio.js +1 -1
  14. package/dist/LSSelect.js +1 -1
  15. package/dist/LSSlider.js +1 -1
  16. package/dist/LSSliderInput.js +27 -5
  17. package/dist/LSSwitch.js +1 -1
  18. package/dist/LSTextField.js +1 -1
  19. package/dist/LSVariableInputField.js +1 -1
  20. package/dist/ModActivityLog.js +1 -1
  21. package/dist/ModQueueItem.js +1 -1
  22. package/dist/ModQueueList.js +1 -1
  23. package/dist/ModalChrome.js +1 -1
  24. package/dist/PlatformIcon.js +1 -1
  25. package/dist/ShortcutDockGrid.js +1 -1
  26. package/dist/SongRequestList.js +1 -1
  27. package/dist/StreamStatusPanel.js +1 -1
  28. package/dist/ViewersList.js +1 -1
  29. package/dist/WidgetChrome.js +1 -1
  30. package/dist/components.js +54 -32
  31. package/dist/index.js +66 -44
  32. package/dist/se-import.js +65 -43
  33. package/package.json +1 -1
package/dist/components.js CHANGED
@@ -21,7 +21,7 @@ function styleInject(css, { insertAt } = {}) {
21
21
  }
22
22
 
23
23
  // src/lumia-ui.css
24
- styleInject(".ls-color-picker,\n.ls-color-picker *,\n.mui-multi-select,\n.mui-multi-select *,\n.ls-multi-select-value,\n.ls-multi-select-value *,\n.ls-variable-picker,\n.ls-variable-picker *,\n.ls-variable-token,\n.ls-variable-token *,\n.ls-font-picker,\n.ls-font-picker *,\n.mui-ls-input,\n.mui-ls-input * {\n box-sizing: border-box;\n}\n.ls-color-picker button,\n.mui-multi-select button {\n font: inherit;\n letter-spacing: inherit;\n color: inherit;\n margin: 0;\n}\n.ls-color-picker__preview {\n appearance: none;\n -webkit-appearance: none;\n background-color: transparent;\n background-image: none;\n cursor: pointer;\n text-transform: uppercase;\n user-select: none;\n}\n.mui-ls-button.Mui-disabled {\n color: var(--neutralLight2, var(--white2, #cac9d5));\n opacity: 0.45;\n background-color: var(--separator, #0a0821);\n cursor: not-allowed;\n}\n.mui-ls-button {\n border-radius: var(--radius, 1rem);\n padding: 0.375rem 1.5rem;\n text-transform: uppercase;\n}\n.mui-ls-button.MuiButton-sizeSmall {\n padding: 0.25rem 1rem;\n}\n.mui-ls-button.MuiButton-sizeLarge {\n padding: 0.625rem 2rem;\n}\n.mui-ls-button--extended {\n padding-inline: 3rem;\n}\n.mui-ls-button.MuiButton-containedPrimary,\n.mui-ls-button.Mui-disabled.MuiButton-containedPrimary {\n background: var(--primary, #ff4076);\n color: var(--alwayswhite, #fff) !important;\n}\n.mui-ls-button.MuiButton-containedSecondary {\n background-color: var(--secondary, #535395);\n color: var(--alwayswhite, #fff) !important;\n}\n.mui-ls-button.Mui-disabled.MuiButton-containedSecondary {\n background-color: var(--secondary, #535395);\n color: var(--neutralLight2, var(--white2, #cac9d5));\n opacity: 0.4;\n}\n.mui-ls-button.MuiButton-outlinedPrimary {\n color: var(--primary, #ff4076);\n border-color: var(--primary, #ff4076);\n}\n.mui-ls-button.MuiButton-outlinedPrimary:hover {\n border-color: var(--primary, #ff4076);\n background-color: color-mix(in srgb, var(--primary, #ff4076) 12%, transparent);\n}\n.mui-ls-button.MuiButton-outlinedSecondary {\n color: var(--neutralLight1, var(--white, #fff));\n border-color: var(--secondary, #535395);\n}\n.mui-ls-button.MuiButton-outlinedSecondary.Mui-disabled {\n color: var(--neutralLight2, var(--white2, #cac9d5));\n border-color: var(--neutralDark4, var(--cardborder, #393853));\n background-color: var(--transwhite, rgba(255, 255, 255, 0.05));\n opacity: 0.5;\n}\n.mui-ls-button.MuiButton-outlinedSecondary:hover {\n border-color: var(--secondary, #535395);\n background-color: var(--transwhite, rgba(255, 255, 255, 0.05));\n}\n.mui-ls-button.MuiButton-containedError {\n color: var(--alwayswhite, #fff) !important;\n}\n.mui-ls-button.MuiButton-outlinedError {\n color: var(--error, #fd5454);\n border-color: var(--error, #fd5454);\n}\n.mui-ls-button.MuiButton-outlinedError:hover {\n border-color: var(--error, #fd5454);\n background-color: color-mix(in srgb, var(--error, #fd5454) 12%, transparent);\n}\n.mui-ls-button--neutral.mui-ls-button--contained {\n background-color: var(--neutralDark4, var(--cardborder, #393853));\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.mui-ls-button--neutral.mui-ls-button--contained:hover {\n background-color: color-mix(in srgb, var(--neutralDark4, var(--cardborder, #393853)) 82%, var(--neutralLight1, #fff));\n}\n.mui-ls-button--neutral.mui-ls-button--outlined {\n color: var(--neutralLight1, var(--white, #fff));\n border-color: var(--neutralDark4, var(--cardborder, #393853));\n background-color: transparent;\n}\n.mui-ls-button--neutral.mui-ls-button--outlined:hover {\n border-color: var(--neutralLight3, var(--grey, #9392a1));\n background-color: var(--transwhite, rgba(255, 255, 255, 0.05));\n}\n.mui-ls-button--neutral.mui-ls-button--text {\n color: var(--neutralLight1, var(--white, #fff));\n}\n.mui-ls-button--neutral.mui-ls-button--text:hover {\n background-color: var(--transwhite, rgba(255, 255, 255, 0.05));\n}\n.mui-ls-button svg {\n max-height: 24px;\n max-width: 24px;\n}\n.mui-ls-input,\n.mui-ls-select-form-control,\n.ls-font-picker,\n.ls-color-picker__input {\n width: 100%;\n}\n.MuiFormControl-root.mui-ls-input,\n.MuiFormControl-root.mui-ls-select-form-control,\n.MuiFormControl-root.mui-ls-slider-input-root {\n margin-top: 0.875rem;\n padding-top: 0;\n}\n.MuiFormControl-root.mui-ls-select-form-control {\n min-width: 100px;\n margin-bottom: 0.3rem;\n}\n.mui-ls-slider-input-root .MuiFormControl-root.mui-ls-input,\n.mui-ls-slider-input-style .MuiFormControl-root.mui-ls-input,\n.MuiFormControl-root.mui-ls-slider-input-value.mui-ls-input {\n margin-top: 0;\n padding-top: 0;\n}\n.mui-ls-input,\n.mui-ls-select-form-control,\n.mui-multi-select,\n.ls-font-picker,\n.mui-ls-slider-input-root {\n --ls-control-height: 55px;\n}\n.mui-ls-input .MuiTextField-root {\n width: 100%;\n margin: 0;\n}\n.mui-ls-input .MuiOutlinedInput-root,\n.mui-ls-input .MuiInputBase-root,\n.mui-ls-input .MuiOutlinedInput-notchedOutline,\n.mui-ls-select.MuiOutlinedInput-root,\n.mui-ls-select .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-control.MuiOutlinedInput-root,\n.mui-ls-slider-input-control .MuiOutlinedInput-notchedOutline,\n.mui-multi-select .mui-ls-select.MuiOutlinedInput-root,\n.mui-multi-select .mui-ls-select .MuiOutlinedInput-notchedOutline,\n.ls-font-picker .MuiOutlinedInput-root,\n.ls-font-picker .MuiInputBase-root,\n.ls-font-picker .MuiOutlinedInput-notchedOutline,\n.ls-color-picker__input .MuiOutlinedInput-root,\n.ls-color-picker__input .MuiInputBase-root,\n.ls-color-picker__input .MuiOutlinedInput-notchedOutline {\n border-radius: var(--radius) !important;\n}\n.mui-ls-input .MuiOutlinedInput-notchedOutline,\n.mui-ls-select .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-control .MuiOutlinedInput-notchedOutline {\n border: 2px solid var(--cardborder, var(--neutralDark4, #393853));\n}\n.mui-ls-input .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline,\n.mui-ls-select:hover .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-control.MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline {\n border-color: var(--primary, #ff4076) !important;\n}\n.mui-ls-input .MuiInputBase-root,\n.mui-ls-select.MuiInputBase-root,\n.mui-multi-select .mui-ls-select.MuiInputBase-root,\n.ls-font-picker .MuiInputBase-root {\n background-color: var(--background, var(--neutralDark1, #18162f));\n color: var(--white, var(--neutralLight1, #fff));\n min-height: var(--ls-control-height);\n}\n.mui-ls-slider-input-control.MuiInputBase-root {\n background-color: transparent;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.mui-ls-input.small .MuiInputBase-root {\n min-height: 25px;\n}\n.mui-ls-input.medium .MuiInputBase-root {\n min-height: 35px;\n}\n.mui-ls-input.noMinHeight .MuiInputBase-root {\n min-height: unset;\n}\n.mui-ls-date-picker input[type=datetime-local]::-webkit-calendar-picker-indicator {\n cursor: pointer;\n opacity: 0.9;\n filter: invert(1);\n}\n.mui-ls-select .MuiSelect-select,\n.mui-multi-select .MuiSelect-select {\n display: flex;\n min-height: calc(var(--ls-control-height) - 2px);\n align-items: center;\n box-sizing: border-box;\n background-color: var(--background, var(--neutralDark1, #18162f));\n color: var(--white, var(--neutralLight1, #fff));\n border-radius: var(--radius);\n}\n.mui-multi-select .MuiSelect-select {\n min-width: 0;\n}\n.MuiSvgIcon-root svg {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.mui-ls-input .MuiSvgIcon-root svg path {\n fill: currentcolor;\n stroke: currentcolor;\n}\n.mui-ls-input .MuiInputLabel-root,\n.mui-ls-select-form-control .MuiInputLabel-root,\n.mui-ls-slider-input-root .MuiInputLabel-root {\n display: inline-flex;\n align-items: center;\n gap: 0.35rem;\n transform: translate(14px, -10px) scale(0.875);\n font-size: 1rem;\n line-height: 1.4375em;\n color: var(--white, var(--neutralLight1, #fff)) !important;\n}\n.mui-ls-input .MuiOutlinedInput-notchedOutline legend,\n.mui-ls-select-form-control .MuiOutlinedInput-notchedOutline legend,\n.mui-ls-slider-input-control .MuiOutlinedInput-notchedOutline legend {\n font-size: 0.875rem;\n}\n.mui-ls-input legend,\n.mui-ls-select-form-control legend,\n.mui-ls-slider-input-root legend {\n max-width: unset !important;\n}\n.mui-ls-input .MuiInputLabel-root svg,\n.mui-ls-select-form-control .MuiInputLabel-root svg,\n.mui-ls-slider-input-root .MuiInputLabel-root svg {\n display: block;\n flex: 0 0 auto;\n}\n.mui-ls-select .MuiSvgIcon-root {\n color: var(--white, var(--neutralLight1, #fff));\n}\n.mui-autocomplete-select button {\n box-shadow: none;\n}\n.mui-autocomplete-select .MuiSvgIcon-root {\n color: var(--white, var(--neutralLight1, #fff));\n}\n.mui-ls-input input::placeholder,\n.mui-ls-input textarea::placeholder {\n color: var(--neutralLight3, var(--grey, #9392a1));\n opacity: 0.55;\n font-style: italic;\n}\n.mui-ls-input .MuiInputBase-input,\n.mui-ls-input .MuiInputAdornment-root,\n.mui-ls-input .MuiSvgIcon-root,\n.mui-ls-input .MuiFormHelperText-root {\n color: var(--neutralLight1, var(--white, #fff));\n opacity: 1;\n}\n.mui-ls-input .Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-input .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-select.Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-select-form-control .Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-select-form-control .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-control.Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-root .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {\n border-color: var(--primary, #ff4076) !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-paper,\n.ls-variable-autocomplete-paper {\n border: 1px solid var(--neutralDark4, var(--cardborder, #393853)) !important;\n border-radius: var(--radius, 1rem) !important;\n background: var(--neutralDark2, var(--cardbackground, #211f45)) !important;\n color: var(--neutralLight1, var(--white, #fff)) !important;\n box-shadow: 0 16px 32px rgba(0, 0, 0, 0.32) !important;\n overflow: hidden !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-listbox,\n.ls-variable-autocomplete-listbox {\n padding: 0.25rem 0 !important;\n background: var(--neutralDark2, var(--cardbackground, #211f45)) !important;\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-groupLabel,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-groupLabel {\n position: sticky;\n top: 0;\n z-index: 1;\n min-height: 32px;\n padding: 0.45rem 1rem 0.25rem !important;\n background: var(--neutralDark1, var(--background, #18162f)) !important;\n color: var(--neutralLight3, var(--grey, #9392a1)) !important;\n font-size: 0.75rem !important;\n font-weight: 700 !important;\n letter-spacing: 0 !important;\n line-height: 1.2 !important;\n text-transform: uppercase;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-groupUl,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-groupUl {\n padding: 0 !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-option,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option {\n display: flex !important;\n min-height: 44px !important;\n align-items: center !important;\n padding: 0.625rem 1rem !important;\n color: var(--neutralLight1, var(--white, #fff)) !important;\n font-size: 1rem !important;\n line-height: 1.35 !important;\n cursor: pointer !important;\n transition: background-color 120ms ease, color 120ms ease !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-option > *,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option > * {\n min-width: 0;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-option:hover,\n.ls-variable-autocomplete-popper .MuiAutocomplete-option.Mui-focused,\n.ls-variable-autocomplete-popper .MuiAutocomplete-option[data-focus=true],\n.ls-variable-autocomplete-popper .MuiAutocomplete-option[aria-selected=true],\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option:hover,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option.Mui-focused,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option[data-focus=true],\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option[aria-selected=true] {\n background: var(--cardHover, var(--transwhite, rgba(255, 255, 255, 0.05))) !important;\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.ls-variable-option {\n gap: 0.75rem;\n}\n.ls-variable-option__thumb {\n width: 40px;\n height: 40px;\n flex: 0 0 40px;\n border-radius: var(--radius, 1rem);\n object-fit: cover;\n}\n.ls-variable-option__thumb--placeholder {\n background: var(--neutralDark4, var(--cardborder, #393853));\n}\n.ls-variable-option__body {\n min-width: 0;\n}\n.ls-variable-option__label {\n color: var(--neutralLight1, var(--white, #fff));\n font-weight: 500;\n line-height: 1.25;\n}\n.ls-variable-option__helper {\n margin-top: 0.125rem;\n color: var(--neutralLight3, var(--grey, #9392a1));\n font-size: 0.875rem;\n line-height: 1.25;\n}\n.ls-variable-autocomplete-popup-indicator,\n.ls-variable-autocomplete-popup-indicator.MuiIconButton-root,\n.ls-variable-autocomplete-popup-indicator svg {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.ls-variable-autocomplete-popup-indicator svg path {\n fill: currentcolor !important;\n stroke: currentcolor !important;\n}\n.ls-color-picker .MuiInputLabel-root .MuiSvgIcon-root,\n.ls-color-picker .MuiInputLabel-root svg,\n.ls-color-picker .MuiInputLabel-root svg path,\n.ls-color-picker__gradient button,\n.ls-color-picker__gradient button svg,\n.ls-color-picker__gradient button svg path,\n.ls-color-picker__gradient button svg line,\n.ls-color-picker__gradient button svg polyline,\n.ls-color-picker__gradient button svg polygon,\n.ls-color-picker__gradient button svg circle,\n.ls-color-picker__gradient button svg rect {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n fill: currentcolor !important;\n stroke: currentcolor !important;\n}\n.ls-color-picker__gradient button[aria-pressed=true] svg,\n.ls-color-picker__gradient button[aria-selected=true] svg,\n.ls-color-picker__gradient button[data-active=true] svg,\n.ls-color-picker__gradient button[aria-pressed=true] svg *,\n.ls-color-picker__gradient button[aria-selected=true] svg *,\n.ls-color-picker__gradient button[data-active=true] svg * {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n fill: currentcolor !important;\n stroke: currentcolor !important;\n}\n.ls-color-picker__picker--inline {\n max-height: none !important;\n}\n.ls-color-picker__gradient {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.ls-variable-input-adornment,\n.ls-variable-input-adornment.MuiInputAdornment-root {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n height: 24px;\n width: 24px;\n min-width: 24px;\n margin-left: 0.35rem;\n border-radius: var(--radius, 1rem);\n background: var(--primary, #ff4076) !important;\n color: var(--alwayswhite, var(--white, #fff)) !important;\n font-weight: 800;\n line-height: 1;\n letter-spacing: 0;\n cursor: pointer;\n user-select: none;\n}\n.ls-variable-input-adornment svg,\n.ls-variable-input-adornment path {\n color: currentcolor !important;\n fill: currentcolor !important;\n stroke: currentcolor !important;\n}\n.ls-variable-input-adornment:hover,\n.ls-variable-input-adornment.MuiInputAdornment-root:hover {\n filter: brightness(1.08);\n}\n.ls-variable-input-adornment:active,\n.ls-variable-input-adornment.MuiInputAdornment-root:active {\n filter: brightness(0.96);\n}\n.mui-ls-slider-input-root {\n width: 100%;\n}\n.mui-ls-slider-input-control.MuiOutlinedInput-root {\n height: var(--ls-control-height);\n min-height: var(--ls-control-height);\n padding: 0 1rem;\n}\n.mui-ls-slider-input-control > .mui-ls-slider-input-content {\n box-sizing: border-box;\n display: flex;\n flex: 1 1 auto;\n width: 100%;\n height: 100%;\n min-width: 0;\n align-items: center;\n padding: 0 !important;\n}\n.mui-ls-slider-input-control > .mui-ls-slider-input-content:focus {\n outline: none;\n}\n.mui-ls-slider-input-row {\n display: flex;\n min-width: 0;\n min-height: calc(var(--ls-control-height) - 14px);\n align-items: center;\n gap: 1rem;\n}\n.mui-ls-slider-input-row--slider {\n flex-wrap: nowrap;\n}\n.mui-ls-slider-input-row--input {\n justify-content: stretch;\n}\n.mui-ls-slider-input-row .MuiSlider-root {\n height: 3px;\n padding: 8px 0;\n}\n.mui-ls-slider-input-row .MuiSlider-track,\n.mui-ls-slider-input-row .MuiSlider-rail {\n height: 3px;\n border: 0;\n}\n.mui-ls-slider-input-row .MuiSlider-thumb {\n width: 18px;\n height: 18px;\n}\n.mui-ls-slider-input-style input::-webkit-outer-spin-button,\n.mui-ls-slider-input-style input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n.mui-ls-slider-input-style input {\n max-width: 100px;\n padding: 0.25rem 0.5rem;\n}\n.mui-ls-slider-input-style.noMargin .MuiTextField-root {\n margin-top: 0;\n margin-bottom: 0;\n}\n.mui-ls-slider-input-content .mui-ls-slider-input-style {\n position: relative;\n z-index: 1;\n display: grid;\n flex: 1 1 auto;\n width: 100%;\n grid-template-columns: minmax(0, 1fr) auto auto;\n align-items: center;\n gap: 0.5rem;\n height: 100%;\n min-width: 0;\n transform: none !important;\n}\n.mui-ls-slider-input-info {\n position: relative;\n z-index: 2;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--neutralLight2, var(--white2, #cac9d5));\n line-height: 1;\n}\n.mui-ls-slider-input-info svg {\n display: block;\n width: 14px;\n height: 14px;\n}\n.mui-ls-slider-input-content .mui-ls-slider-input-style--input-only {\n grid-template-columns: minmax(0, 1fr) auto;\n}\n.mui-ls-slider-input-track {\n display: flex;\n width: 100%;\n min-width: 0;\n height: 2rem;\n align-items: center;\n justify-content: center;\n gap: 1rem;\n padding-left: 1rem;\n padding-right: 1rem;\n border-radius: 9999px;\n}\n.mui-ls-slider-input-track--popout {\n padding-right: 0;\n}\n.mui-ls-slider-input-track--start-icon {\n gap: 0.5rem;\n padding-left: 0;\n}\n.mui-ls-slider-input-track--end-icon {\n gap: 0.5rem;\n padding-right: 0;\n}\n.mui-ls-slider-input-style .MuiSlider-root {\n width: 100%;\n min-width: 0;\n height: 3px;\n padding: 8px 0;\n}\n.mui-ls-slider-input-style .MuiSlider-track,\n.mui-ls-slider-input-style .MuiSlider-rail {\n height: 3px;\n border: 0;\n}\n.mui-ls-slider-input-style .MuiSlider-thumb {\n width: 18px;\n height: 18px;\n}\n.mui-ls-slider-input-style .MuiSlider-valueLabel {\n z-index: 3;\n}\n.mui-ls-slider-input-style .ls-slider-input-icon {\n display: inline-flex;\n width: 20px;\n min-width: 20px;\n height: 20px;\n min-height: 20px;\n align-items: center;\n justify-content: center;\n}\n.mui-ls-slider-input-style .ls-slider-input-icon svg {\n width: 20px;\n min-width: 20px;\n height: 20px;\n min-height: 20px;\n}\n.mui-ls-slider-input-style .ls-custom-range-input,\n.ls-custom-range-input {\n -webkit-appearance: none;\n appearance: none;\n width: 100%;\n height: 6px;\n border-radius: 15px;\n background: var(--cardborder, var(--neutralDark4, #393853));\n cursor: pointer;\n outline: none;\n}\n.mui-ls-slider-input-style .ls-custom-range-input::-webkit-slider-thumb,\n.ls-custom-range-input::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 24px;\n height: 24px;\n border: none;\n border-radius: 50%;\n background-color: var(--white, #fff);\n transition: 0.2s ease-in-out;\n}\n.mui-ls-slider-input-style .ls-custom-range-input::-moz-range-thumb,\n.ls-custom-range-input::-moz-range-thumb {\n width: 24px;\n height: 24px;\n border: none;\n border-radius: 50%;\n background-color: var(--white, #fff);\n transition: 0.2s ease-in-out;\n}\n.mui-ls-slider-input-style .ls-custom-range-input::-webkit-slider-thumb:hover,\n.ls-custom-range-input::-webkit-slider-thumb:hover {\n box-shadow: 0 0 0 10px var(--primaryShadow, rgba(255, 64, 118, 0.18));\n}\n.mui-ls-slider-input-style .ls-custom-range-input:active::-webkit-slider-thumb,\n.mui-ls-slider-input-style .ls-custom-range-input:focus::-webkit-slider-thumb,\n.ls-custom-range-input:active::-webkit-slider-thumb,\n.ls-custom-range-input:focus::-webkit-slider-thumb {\n box-shadow: 0 0 0 13px var(--primaryShadow, rgba(255, 64, 118, 0.18));\n}\n.mui-ls-slider-input-style .ls-custom-range-input::-moz-range-thumb:hover,\n.ls-custom-range-input::-moz-range-thumb:hover {\n box-shadow: 0 0 0 10px var(--primaryShadow, rgba(255, 64, 118, 0.18));\n}\n.mui-ls-slider-input-style .ls-custom-range-input:active::-moz-range-thumb,\n.mui-ls-slider-input-style .ls-custom-range-input:focus::-moz-range-thumb,\n.ls-custom-range-input:active::-moz-range-thumb,\n.ls-custom-range-input:focus::-moz-range-thumb {\n box-shadow: 0 0 0 13px var(--primaryShadow, rgba(255, 64, 118, 0.18));\n}\n.mui-ls-slider-input-style .ls-slider-value-input {\n width: 96px !important;\n height: 36px !important;\n min-height: 36px !important;\n}\n.mui-ls-slider-input-style .ls-slider-value-input .MuiInputBase-root {\n height: 36px !important;\n max-width: 96px !important;\n min-height: 36px !important;\n border-radius: 15px !important;\n}\n.mui-ls-slider-input-style .ls-slider-value-input .MuiOutlinedInput-notchedOutline {\n border-radius: 15px !important;\n}\n.mui-ls-slider-input-style .ls-slider-value-input input {\n max-width: none;\n padding: 0.35rem 0.75rem;\n text-align: left;\n}\n.mui-ls-slider-input-adornment {\n justify-self: center;\n color: var(--white, var(--neutralLight1, #fff));\n white-space: nowrap;\n}\n.mui-ls-slider-input-style .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline {\n border-color: var(--primary, #ff4076) !important;\n}\n.mui-ls-slider-input-value.mui-ls-input {\n margin: 0;\n}\n.mui-ls-slider-input-value.mui-ls-input .MuiFormControl-root,\n.mui-ls-slider-input-value.mui-ls-input .MuiTextField-root {\n margin: 0;\n}\n.mui-ls-slider-input-value.mui-ls-input .MuiInputBase-root {\n min-height: 36px;\n}\n.mui-ls-slider-input-value.mui-ls-input .MuiOutlinedInput-notchedOutline {\n border-color: var(--neutralDark4, var(--cardborder, #393853));\n}\n.mui-ls-slider-input-helper {\n display: block;\n margin-top: 0.25rem;\n color: var(--neutralLight3, var(--grey, #9392a1));\n font-size: 0.75rem;\n line-height: 1.25;\n}\n.ls-multi-select-value {\n display: flex;\n width: 100%;\n min-width: 0;\n flex-wrap: nowrap;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n overflow: hidden;\n white-space: nowrap;\n}\n.ls-multi-select-value__label {\n min-width: 0;\n flex: 1 1 0%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.ls-multi-select-value__count {\n flex-shrink: 0;\n white-space: nowrap;\n}\n.ls-color-picker__preview {\n position: relative;\n display: inline-block;\n width: 1.5rem;\n height: 1.5rem;\n flex-shrink: 0;\n padding: 0;\n border: 1px solid color-mix(in srgb, #fff 25%, transparent);\n border-radius: var(--radius, 1rem);\n background-size: cover;\n background-position: center;\n background-repeat: no-repeat;\n box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25);\n color: transparent;\n line-height: 0;\n}\n.ls-color-picker__preview:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.ls-color-picker__preview:focus {\n outline: none;\n}\n.ls-color-picker__preview:focus-visible {\n box-shadow:\n 0 0 0 2px var(--primary, #ff4076),\n 0 0 0 4px var(--neutralDark1, #1b1a28),\n 0 0 0 1px rgba(0, 0, 0, 0.25);\n}\n.ls-color-picker__gradient circle,\n.ls-color-picker__gradient polyline {\n stroke: #fff !important;\n}\n.ls-variable-picker {\n --variable-custom-color: var(--customVariables, #69ffd2);\n --variable-function-color: var(--functionVariables, var(--semanticPurple, #b489ff));\n --variable-normal-color: var(--normalVariables, var(--semanticBlue, #65b8ff));\n display: flex;\n width: 92vw;\n max-width: 1100px;\n min-height: 50vh;\n max-height: 55vh;\n flex-direction: column;\n overflow: hidden;\n padding: 1rem;\n}\n.ls-variable-picker__field {\n margin: 0 0 0.75rem;\n border: 1px solid color-mix(in srgb, var(--primary, #ff4076) 42%, var(--neutralDark4, #393853));\n border-radius: var(--radius, 1rem);\n padding: 0.5rem;\n}\n.ls-variable-picker__legend {\n padding-inline: 0.375rem;\n color: var(--primary, #ff4076);\n font-size: 0.75rem;\n font-weight: 700;\n}\n.ls-variable-picker__intro {\n margin-bottom: 1rem;\n color: var(--neutralLight2, #cac9d5);\n}\n.ls-variable-picker__header,\n.ls-variable-picker__row {\n display: grid;\n grid-template-columns: minmax(300px, 1.5fr) 1fr 1fr;\n gap: 2rem;\n}\n.ls-variable-picker__header {\n margin-bottom: 0.25rem;\n padding-inline: 0.25rem;\n padding-right: 1.7rem;\n color: var(--neutralLight3, #9392a1);\n}\n.ls-variable-picker__list {\n height: 100%;\n overflow: auto;\n padding-right: 1rem;\n}\n.ls-variable-picker__row {\n cursor: pointer;\n align-items: start;\n border-bottom: 1px solid color-mix(in srgb, var(--neutralDark4, #393853) 70%, transparent);\n padding: 1rem 0.25rem;\n}\n.ls-variable-picker__row--no-border {\n border-bottom: 0;\n}\n.ls-variable-picker__token-cell {\n display: flex;\n min-width: 0;\n align-items: center;\n gap: 0.375rem;\n}\n.ls-variable-picker__expand-toggle,\n.ls-variable-picker__expand-spacer {\n width: 24px;\n height: 24px;\n flex: 0 0 24px;\n}\n.ls-variable-picker__expand-toggle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border: 1px solid color-mix(in srgb, var(--neutralDark4, #393853) 75%, transparent);\n border-radius: var(--radius, 1rem);\n padding: 0;\n background: var(--neutralDark3, var(--containerbackground, #1f1f3a));\n color: var(--neutralLight2, #cac9d5);\n transition:\n background-color 140ms ease,\n border-color 140ms ease,\n color 140ms ease,\n transform 140ms ease;\n}\n.ls-variable-picker__expand-toggle:hover {\n border-color: var(--primary, #ff4076);\n background: color-mix(in srgb, var(--primary, #ff4076) 16%, var(--neutralDark3, #1f1f3a));\n color: var(--neutralLight1, #fff);\n}\n.ls-variable-picker__expand-toggle svg {\n transform: rotate(-90deg);\n transition: transform 140ms ease;\n}\n.ls-variable-picker__expand-toggle--expanded svg {\n transform: rotate(0deg);\n}\n.ls-variable-picker__row:active {\n opacity: 0.8;\n}\n.ls-variable-picker__description {\n max-width: 600px;\n overflow-wrap: break-word;\n line-height: 1.25;\n word-break: break-all;\n}\n.ls-variable-picker__row.ls-variable-picker__example-description {\n display: block;\n cursor: default;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n color: var(--neutralLight2, #cac9d5);\n overflow-wrap: break-word;\n line-height: 1.35;\n}\n.ls-variable-picker__row.ls-variable-picker__example-description:active {\n opacity: 1;\n}\n.ls-variable-picker__value {\n min-width: 0;\n}\n.ls-variable-picker__value-input {\n width: 100%;\n min-width: 0;\n cursor: text;\n overflow: hidden;\n border: 0;\n background: transparent;\n color: var(--neutralLight1, var(--white, #fff));\n caret-color: transparent;\n font: inherit;\n font-size: 1rem;\n line-height: 1.25;\n outline: 0;\n padding: 0;\n text-overflow: ellipsis;\n}\n.ls-variable-picker__value-input:focus {\n outline: 0;\n}\n.ls-variable-picker__value-input::selection {\n background: color-mix(in srgb, var(--primary, #ff4076) 45%, transparent);\n color: var(--alwayswhite, var(--white, #fff));\n}\n.ls-variable-token {\n display: flex;\n min-width: 0;\n align-items: center;\n}\n.ls-variable-token--suggested {\n color: var(--suggestedVariables, #ffb469);\n}\n.ls-variable-token--custom {\n color: var(--customVariables, #69ffd2);\n}\n.ls-variable-token--function {\n color: var(--functionVariables, var(--semanticPurple, #b489ff));\n}\n.ls-variable-token--system {\n color: var(--normalVariables, var(--semanticBlue, #65b8ff));\n}\n.ls-variable-highlight__layer {\n position: absolute;\n margin: 0;\n border: 0;\n box-sizing: border-box;\n overflow: hidden;\n pointer-events: none;\n background: transparent;\n color: inherit;\n white-space: pre-wrap;\n overflow-wrap: break-word;\n z-index: 0;\n}\n.ls-variable-highlight__token {\n border-radius: 4px;\n}\n.ls-variable-highlight__token--custom {\n color: var(--customVariables, #69ffd2);\n background: color-mix(in srgb, var(--customVariables, #69ffd2) 16%, transparent);\n}\n.ls-variable-highlight__token--suggested {\n color: var(--suggestedVariables, #ffb469);\n background: color-mix(in srgb, var(--suggestedVariables, #ffb469) 16%, transparent);\n}\n.ls-variable-highlight__token--function {\n color: var(--functionVariables, var(--semanticPurple, #b489ff));\n background: color-mix(in srgb, var(--functionVariables, var(--semanticPurple, #b489ff)) 16%, transparent);\n}\n.ls-variable-highlight__token--system {\n color: var(--normalVariables, var(--semanticBlue, #65b8ff));\n background: color-mix(in srgb, var(--normalVariables, var(--semanticBlue, #65b8ff)) 16%, transparent);\n}\n.ls-variable-highlight__tooltip {\n position: fixed;\n z-index: 2000;\n transform: translate(-50%, -100%);\n margin-top: -8px;\n max-width: 320px;\n padding: 6px 10px;\n border-radius: 8px;\n background: var(--neutralDark1, #171628);\n border: 1px solid var(--neutralDark4, #393853);\n color: var(--neutralLight2, #cac9d5);\n font-size: 0.75rem;\n line-height: 1.3;\n overflow-wrap: anywhere;\n pointer-events: none;\n white-space: pre-line;\n box-shadow: 0 4px 14px rgb(0 0 0 / 40%);\n}\n.ls-variable-token__name {\n min-width: 0;\n word-break: break-all;\n}\n.ls-variable-token__badge {\n display: inline-flex;\n margin-left: 0.5rem;\n flex-shrink: 0;\n align-items: center;\n border: 1px solid currentcolor;\n border-radius: var(--radius, 1rem);\n padding-inline: 0.25rem;\n padding-block: 0;\n font-size: 10px;\n font-weight: 600;\n line-height: 1;\n text-transform: uppercase;\n}\n.ls-chat-message {\n position: relative;\n font-size: 0.95em;\n line-height: 1.4;\n color: var(--white, var(--neutralLight1, #fff));\n overflow-wrap: break-word;\n word-break: break-word;\n}\n.ls-chat-message img {\n display: inline-block;\n}\n.ls-chat-message__reply {\n display: block;\n margin-bottom: 0.15em;\n font-size: 0.82em;\n color: var(--white2, var(--neutralLight3, #9392a1));\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.ls-chat-message__avatar-prefix {\n vertical-align: middle;\n}\n.ls-chat-message__avatar {\n width: 1.3em;\n height: 1.3em;\n border-radius: 9999px;\n vertical-align: middle;\n margin-right: 0.35em;\n}\n.ls-chat-message__site {\n display: inline-block;\n vertical-align: middle;\n margin-right: 0.35em;\n}\n.ls-chat-message__site img,\n.ls-chat-message__site svg {\n width: 1.2em;\n height: 1.2em;\n vertical-align: middle;\n}\n.ls-chat-message__time {\n margin-right: 0.35em;\n font-weight: 700;\n vertical-align: middle;\n}\n.ls-chat-message__badges {\n vertical-align: middle;\n}\n.ls-chat-message__badges img {\n height: 1.05em;\n vertical-align: middle;\n margin-right: 0.25em;\n}\n.ls-chat-message__username {\n font-weight: 700;\n vertical-align: middle;\n}\n.ls-chat-message__username--clickable {\n cursor: pointer;\n background: none;\n border: 0;\n padding: 0;\n font: inherit;\n}\n.ls-chat-message__username--clickable:hover {\n text-decoration: underline;\n}\n.ls-viewerslist__username--clickable,\n.ls-eventlist-item__username--clickable {\n cursor: pointer;\n}\n.ls-viewerslist__username--clickable:hover,\n.ls-eventlist-item__username--clickable:hover {\n text-decoration: underline;\n}\n.ls-chat-message__text {\n vertical-align: middle;\n}\n.ls-chat-message__text img {\n vertical-align: middle;\n}\n.ls-chat-message__actions {\n position: absolute;\n top: 0;\n right: 0;\n}\n.ls-chat-message__modbar {\n display: flex;\n overflow: hidden;\n border-radius: 0.75rem;\n background-color: var(--separator, #0a0821);\n transition-duration: 300ms;\n}\n.ls-chat-message__modbtn {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0.5rem;\n cursor: pointer;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition-duration: 300ms;\n}\n.ls-chat-message__modbtn:hover {\n background-color: var(--cardborder, var(--neutralDark4, #393853));\n}\n.ls-chat-message__modbtn--danger:hover {\n color: var(--error, #fd5454);\n}\n.ls-chat-message__menu-icon {\n display: flex;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-eventlist-item {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n align-items: center;\n gap: 1em;\n border: 1px solid var(--cardborder, var(--neutralDark4, #393853));\n border-left: 4px solid var(--primary, #ff4076);\n border-radius: 1em;\n background-color: var(--cardbackground, var(--neutralDark2, #211d3e));\n color: var(--white, var(--neutralLight1, #fff));\n padding: 1em;\n line-height: 1.35;\n}\n.ls-eventlist-item__main {\n display: flex;\n flex-direction: column;\n gap: 0.2em;\n min-width: 0;\n}\n.ls-eventlist-item__identity {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n column-gap: 0.75em;\n row-gap: 0.35em;\n min-width: 0;\n}\n.ls-eventlist-item__avatar,\n.ls-eventlist-item__icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: 1.5em;\n min-width: 1.5em;\n height: 1.5em;\n overflow: hidden;\n}\n.ls-eventlist-item__avatar {\n border-radius: 1em;\n background-color: var(--background, transparent);\n}\n.ls-eventlist-item__avatar img,\n.ls-eventlist-item__icon img,\n.ls-eventlist-item__icon svg {\n width: 100%;\n height: 100%;\n object-fit: contain;\n}\n.ls-eventlist-item__username {\n min-width: 0;\n font-weight: 700;\n font-size: 0.875em;\n word-break: break-all;\n}\n.ls-eventlist-item__amount {\n flex-shrink: 0;\n padding: 0.05em 0.5em;\n border-radius: 1em;\n background-color: color-mix(in srgb, currentColor 16%, transparent);\n font-weight: 700;\n font-size: 0.75em;\n white-space: nowrap;\n}\n.ls-eventlist-item__body {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n column-gap: 0.75em;\n row-gap: 0.35em;\n min-width: 0;\n}\n.ls-eventlist-item__message {\n min-width: 0;\n word-break: break-all;\n}\n.ls-eventlist-item__usermessage {\n min-width: 0;\n font-style: italic;\n color: var(--white2, var(--neutralLight2, #cac9d5));\n word-break: break-all;\n}\n.ls-eventlist-item__time {\n flex-shrink: 0;\n color: var(--grey, var(--neutralLight3, #9392a1));\n font-size: 0.875em;\n white-space: nowrap;\n}\n.ls-eventlist-item__actions {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n align-self: center;\n gap: 0.5em;\n flex-shrink: 0;\n}\n.ls-modqueue-item {\n display: flex;\n align-items: stretch;\n gap: 0.5rem;\n border-radius: 1rem;\n background-color: color-mix(in srgb, var(--secondary, #535395) 20%, transparent);\n padding: 0.5rem;\n}\n.ls-modqueue-item__preview {\n display: flex;\n height: 4rem;\n width: 4rem;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n border-radius: 1rem;\n background-color: var(--separator, #0a0821);\n color: var(--primary, #ff4076);\n font-size: 1.75rem;\n line-height: 1;\n}\n.ls-modqueue-item__preview > * {\n display: flex;\n max-height: 100%;\n max-width: 100%;\n align-items: center;\n justify-content: center;\n line-height: 1;\n}\n.ls-modqueue-item__preview img,\n.ls-modqueue-item__preview svg {\n max-height: 100%;\n max-width: 100%;\n object-fit: contain;\n}\n.ls-modqueue-item__body {\n display: flex;\n min-width: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.25rem;\n justify-content: flex-start;\n padding-top: 0.25rem;\n}\n.ls-modqueue-item__head {\n display: flex;\n align-items: center;\n gap: 0.375rem;\n flex-wrap: wrap;\n}\n.ls-modqueue-item__avatar {\n height: 1.5rem;\n width: 1.5rem;\n border-radius: 9999px;\n border: 1px solid var(--separator, #322c52);\n}\n.ls-modqueue-item__username {\n font-weight: 700;\n color: var(--white, var(--neutralLight1, #fff));\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 12rem;\n}\n.ls-modqueue-item__command {\n display: inline-flex;\n align-items: center;\n border-radius: 1rem;\n background-color: var(--separator, #0a0821);\n padding: 0.05rem 0.5rem;\n font-size: 0.8125rem;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-modqueue-item__message {\n font-size: 0.875rem;\n font-style: italic;\n color: var(--white2, var(--neutralLight2, #cac9d5));\n word-break: break-all;\n}\n.ls-modqueue-item__actions {\n display: flex;\n flex-shrink: 0;\n align-items: flex-start;\n gap: 0.5rem;\n padding-top: 0.25rem;\n}\n.ls-modqueue-item .ls-modqueue-item__iconbtn {\n padding: 0;\n border-radius: 0.5rem;\n transition: opacity 300ms ease;\n}\n.ls-modqueue-item .ls-modqueue-item__iconbtn:hover {\n background-color: transparent;\n opacity: 0.7;\n}\n.ls-modqueue-item__action-icon {\n height: 1.5rem;\n width: 1.5rem;\n flex-shrink: 0;\n}\n.ls-modlog {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.5rem;\n overflow: hidden;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-modlog__toolbar {\n display: flex;\n justify-content: flex-end;\n}\n.ls-modlog__clear {\n display: inline-flex;\n align-items: center;\n gap: 0.375rem;\n border: 0;\n border-radius: 0.75rem;\n background: transparent;\n padding: 0.25rem 0.625rem;\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n cursor: pointer;\n transition: background-color 150ms ease, color 150ms ease;\n}\n.ls-modlog__clear:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 8%, transparent);\n color: var(--white, #fff);\n}\n.ls-modlog__empty {\n display: flex;\n height: 100%;\n flex: 1;\n align-items: center;\n justify-content: center;\n border-radius: 1rem;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-modlog__list {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.375rem;\n overflow: auto;\n}\n.ls-modlog__row {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n border-radius: 0.625rem;\n border-left: 3px solid var(--ls-modlog-accent, var(--primary, #ff4076));\n padding: 0.5rem 0.625rem;\n font-size: 0.8125rem;\n background-color: var(--separator, var(--neutralDark2, #1b1834));\n background-image: linear-gradient(var(--ls-modlog-bar, transparent), var(--ls-modlog-bar, transparent));\n}\n.ls-modlog__head {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n.ls-modlog__avatar {\n height: 1.25rem;\n width: 1.25rem;\n border-radius: 9999px;\n}\n.ls-modlog__title {\n display: inline-flex;\n align-items: center;\n border-radius: 0.375rem;\n padding: 0.05rem 0.4rem;\n font-size: 0.625rem;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.04em;\n color: var(--ls-modlog-accent, var(--primary, #ff4076));\n background-color: color-mix(in srgb, var(--ls-modlog-accent, #ff4076) 18%, transparent);\n}\n.ls-modlog__time {\n margin-left: auto;\n flex-shrink: 0;\n color: var(--grey, var(--neutralLight3, #9392a1));\n font-size: 0.6875rem;\n font-variant-numeric: tabular-nums;\n}\n.ls-modlog__message {\n word-break: break-word;\n overflow-wrap: anywhere;\n line-height: 1.35;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-songreq {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.75rem;\n overflow: hidden;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-songreq--empty {\n align-items: center;\n justify-content: center;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__addbar {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.5rem;\n}\n.ls-songreq__addbar .ls-songreq__addinput {\n flex: 1;\n}\n.ls-songreq__empty {\n display: flex;\n flex: 1;\n align-items: center;\n justify-content: center;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__now {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.75rem;\n background-color: var(--separator, var(--neutralDark2, #1b1834));\n}\n.ls-songreq__art {\n height: 3.5rem;\n width: 3.5rem;\n flex-shrink: 0;\n border-radius: 0.75rem;\n object-fit: cover;\n}\n.ls-songreq__nowbody {\n display: flex;\n min-width: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.1rem;\n}\n.ls-songreq__title {\n overflow: hidden;\n font-size: 0.875rem;\n font-weight: 700;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--white, #fff);\n}\n.ls-songreq__artist {\n overflow: hidden;\n font-size: 0.75rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__requester {\n overflow: hidden;\n font-size: 0.6875rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__progress {\n margin-top: 0.375rem;\n height: 0.375rem;\n width: 100%;\n overflow: hidden;\n border-radius: 9999px;\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n}\n.ls-songreq__progressbar {\n height: 100%;\n border-radius: 9999px;\n background-color: var(--success, #1db954);\n transition: width 1000ms linear;\n}\n.ls-songreq__controls {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.375rem;\n}\n.ls-songreq__btn {\n display: inline-flex;\n height: 2rem;\n width: 2rem;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n border-radius: 0.625rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background: transparent;\n font-size: 0.875rem;\n line-height: 1;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition: background-color 120ms ease, color 120ms ease;\n}\n.ls-songreq__btn:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n color: var(--white, #fff);\n}\n.ls-songreq__queue {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n}\n.ls-songreq__queuehead {\n margin-bottom: 0.25rem;\n padding: 0 0.25rem;\n font-size: 0.6875rem;\n font-weight: 700;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__queuelist {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.25rem;\n overflow: auto;\n}\n.ls-songreq__queueempty {\n padding: 0.5rem 0.25rem;\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__item {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n border-radius: 0.75rem;\n padding: 0.375rem 0.5rem;\n transition: background-color 120ms ease;\n}\n.ls-songreq__item:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 4%, transparent);\n}\n.ls-songreq__itemart {\n height: 2.25rem;\n width: 2.25rem;\n flex-shrink: 0;\n border-radius: 0.5rem;\n object-fit: cover;\n}\n.ls-songreq__itembody {\n min-width: 0;\n flex: 1;\n}\n.ls-songreq__itemtitle {\n overflow: hidden;\n font-size: 0.875rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--white, #fff);\n}\n.ls-songreq__itemmeta {\n overflow: hidden;\n font-size: 0.75rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__remove {\n flex-shrink: 0;\n cursor: pointer;\n border: 0;\n background: transparent;\n font-size: 0.875rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition: color 120ms ease;\n}\n.ls-songreq__remove:hover {\n color: var(--error, #fd5454);\n}\n.ls-modqueue {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.5rem;\n overflow: hidden;\n}\n.ls-modqueue__search-icon {\n height: 1rem;\n width: 1rem;\n flex-shrink: 0;\n margin-right: 0.5rem;\n color: var(--white2, var(--neutralLight2, #cac9d5));\n}\n.ls-modqueue__empty {\n display: flex;\n height: 100%;\n flex: 1;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-modqueue__empty-icon {\n font-size: 1.875rem;\n}\n.ls-modqueue__bulk {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: flex-end;\n gap: 0.5rem;\n}\n.ls-modqueue .ls-modqueue__bulk-btn {\n display: inline-flex;\n align-items: center;\n gap: 0.25rem;\n cursor: pointer;\n border-radius: 0.5rem;\n border: 1px solid currentcolor;\n background: transparent;\n padding: 0.25rem 0.5rem;\n font-size: 0.75rem;\n font-weight: 600;\n transition: opacity 120ms ease;\n}\n.ls-modqueue .ls-modqueue__bulk-btn:hover {\n opacity: 0.7;\n}\n.ls-modqueue .ls-modqueue__bulk-btn--deny {\n color: var(--error, #fd5454);\n}\n.ls-modqueue .ls-modqueue__bulk-btn--approve {\n color: var(--success, #7ed187);\n}\n.ls-modqueue__bulk-icon {\n height: 1rem;\n width: 1rem;\n flex-shrink: 0;\n}\n.ls-modqueue__list {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.5rem;\n overflow: auto;\n}\n.ls-modqueue__readonly {\n font-size: 0.625rem;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-modqueue__search-slot {\n flex-shrink: 0;\n}\n.ls-chatbox {\n display: flex;\n height: 100%;\n flex-direction: column;\n overflow: hidden;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-chatbox__viewport {\n position: relative;\n flex: 1;\n min-height: 0;\n overflow: hidden;\n}\n.ls-chatbox__list {\n display: flex;\n height: 100%;\n flex-direction: column;\n overflow-y: auto;\n padding: 0.75rem;\n}\n.ls-chatbox__jump {\n position: absolute;\n bottom: 0.75rem;\n right: 0.75rem;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n cursor: pointer;\n border-radius: 9999px;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background-color: color-mix(in srgb, var(--white, #fff) 5%, transparent);\n padding: 0.5rem 0.75rem;\n font-size: 0.75rem;\n color: color-mix(in srgb, var(--white, #fff) 80%, transparent);\n box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n backdrop-filter: blur(4px);\n transition: background-color 150ms ease, color 150ms ease;\n}\n.ls-chatbox__jump:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n color: var(--white, #fff);\n}\n.ls-chatbox__jump-arrow {\n height: 0.875rem;\n width: 0.875rem;\n}\n.ls-chatbox__jump-arrow--up {\n transform: rotate(180deg);\n}\n.ls-chatbox__jump-badge {\n margin-left: 0.25rem;\n border-radius: 9999px;\n background-color: var(--primary, #ff4076);\n padding: 0.125rem 0.5rem;\n font-size: 0.625rem;\n font-weight: 600;\n color: var(--alwayswhite, #fff);\n}\n.ls-chatbox__sendbar {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.5rem;\n padding: 0 0.75rem 0.75rem;\n}\n.ls-chatbox__sendbar .ls-chatbox__input {\n flex: 2 1 0%;\n min-width: 100px;\n width: 100%;\n}\n.ls-chatbox__sendbar .ls-chatbox__platform {\n flex: 1 1 0%;\n min-width: 7.5rem;\n height: 55px;\n}\n.ls-chatbox__sendbar .ls-chatbox__chatas {\n flex: 0 1 auto;\n min-width: 5.5rem;\n height: 55px;\n}\n.ls-chatbox__sendbar .ls-chatbox__send {\n height: 55px;\n flex-shrink: 0;\n}\n.ls-panel {\n --ls-panel-padding: 0.75rem;\n display: flex;\n flex-direction: column;\n border-radius: 1rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background-color: var(--ls-panel-bg, #1b1834);\n box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.55);\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-panel__clickaway {\n position: fixed;\n inset: 0;\n z-index: 20;\n}\n.ls-panel__header {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n padding: var(--ls-panel-padding) var(--ls-panel-padding) 0.5rem;\n}\n.ls-panel__title {\n min-width: 0;\n font-size: 1rem;\n font-weight: 700;\n color: var(--white, #fff);\n}\n.ls-panel__title--label {\n font-size: 0.75rem;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-panel__header-actions {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-panel__close {\n display: flex;\n height: 1.5rem;\n width: 1.5rem;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n border: 0;\n border-radius: 0.5rem;\n background: transparent;\n font-size: 0.875rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition: background-color 150ms ease, color 150ms ease;\n}\n.ls-panel__close:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n color: var(--white, #fff);\n}\n.ls-panel__body {\n min-height: 0;\n flex: 1;\n overflow: auto;\n padding: 0 var(--ls-panel-padding) var(--ls-panel-padding);\n}\n.ls-panel--no-header .ls-panel__body {\n padding-top: var(--ls-panel-padding);\n}\n.ls-panel__footer {\n flex-shrink: 0;\n padding: 0.5rem var(--ls-panel-padding) var(--ls-panel-padding);\n}\n.ls-modal {\n position: fixed;\n inset: 0;\n z-index: 2000;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1rem;\n}\n.ls-modal--absolute {\n position: absolute;\n}\n.ls-modal__backdrop {\n position: absolute;\n inset: 0;\n background-color: color-mix(in srgb, var(--ls-modal-backdrop, var(--separator, #0a0821)) 75%, transparent);\n backdrop-filter: blur(4px);\n}\n.ls-modal__card {\n position: relative;\n width: 100%;\n max-width: var(--ls-modal-max-width, min(560px, 92vw));\n max-height: 85vh;\n}\n.ls-modal__card--fit {\n width: auto;\n}\n.ls-modal__card--center .ls-panel__body {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n.ls-dialog {\n margin-top: 0.5rem;\n display: flex;\n height: 100%;\n width: 100%;\n align-items: center;\n justify-content: center;\n}\n.ls-dialog__card {\n position: relative;\n z-index: 10;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n overflow: hidden;\n border-radius: 1rem;\n outline: none;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-dialog__card--pad {\n padding: 1rem;\n}\n.ls-dialog__card--full {\n border-radius: 0;\n}\n.ls-dialog__top {\n display: flex;\n width: 100%;\n align-items: flex-start;\n justify-content: space-between;\n}\n.ls-dialog__top--full {\n margin-top: 2rem;\n}\n.ls-dialog__top-side {\n flex: 1;\n}\n.ls-dialog__title {\n font-size: 1.25rem;\n color: var(--white, #fff);\n}\n.ls-dialog__close {\n display: flex;\n flex: 1;\n justify-content: flex-end;\n user-select: none;\n font-weight: 700;\n color: var(--white, #fff);\n}\n.ls-dialog__close-btn {\n display: flex;\n cursor: pointer;\n align-items: center;\n gap: 0.5rem;\n}\n.ls-dialog__close-label {\n cursor: pointer;\n font-size: 1rem;\n font-weight: 700;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-dialog__body {\n display: flex;\n width: 100%;\n flex: 1;\n min-height: 0;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n overflow: auto;\n}\n.ls-dialog__bottom {\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n gap: 1rem;\n padding-bottom: 1rem;\n}\n.ls-eventlist {\n display: flex;\n height: 100%;\n min-height: 0;\n flex-direction: column;\n overflow: hidden;\n color: var(--white, var(--neutralLight1, #fff));\n line-height: 1.35;\n}\n.ls-eventlist__list {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.5em;\n overflow-y: auto;\n}\n.ls-eventlist__row {\n flex-shrink: 0;\n animation: ls-eventlist-enter 250ms ease;\n}\n.ls-eventlist__empty {\n display: flex;\n height: 100%;\n flex: 1;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.75em;\n border-radius: 1em;\n padding: 1em;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-eventlist__empty-icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: 1.875em;\n}\n.ls-eventlist__empty-icon img,\n.ls-eventlist__empty-icon svg {\n width: 1.6em;\n height: 1.6em;\n}\n@keyframes ls-eventlist-enter {\n from {\n opacity: 0;\n transform: translateX(-1.5em);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n.ls-streamstatus {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.75rem;\n overflow: auto;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-streamstatus--empty {\n align-items: center;\n justify-content: center;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__status {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.75rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.625rem 0.75rem;\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-streamstatus__indicator {\n position: relative;\n display: inline-flex;\n height: 0.75rem;\n width: 0.75rem;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n}\n.ls-streamstatus__indicator-ping {\n position: absolute;\n height: 100%;\n width: 100%;\n border-radius: 9999px;\n background-color: color-mix(in srgb, var(--success, #7ed187) 60%, transparent);\n animation: ls-streamstatus-ping 1.2s cubic-bezier(0, 0, 0.2, 1) infinite;\n}\n@keyframes ls-streamstatus-ping {\n 75%, 100% {\n transform: scale(2);\n opacity: 0;\n }\n}\n.ls-streamstatus__indicator-dot {\n position: relative;\n height: 0.75rem;\n width: 0.75rem;\n border-radius: 9999px;\n background-color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__indicator-dot--online {\n background-color: var(--success, #7ed187);\n}\n.ls-streamstatus__status-body {\n display: flex;\n min-width: 0;\n flex-direction: column;\n}\n.ls-streamstatus__status-label {\n overflow: hidden;\n font-size: 0.875rem;\n font-weight: 700;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--white, #fff);\n}\n.ls-streamstatus__status-sublabel {\n overflow: hidden;\n font-size: 0.75rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__overview {\n display: flex;\n flex-shrink: 0;\n align-items: stretch;\n gap: 0.5rem;\n}\n.ls-streamstatus__total {\n display: flex;\n flex-shrink: 0;\n flex-direction: column;\n justify-content: center;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.5rem 0.75rem;\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-streamstatus__total-value {\n font-size: 1.875rem;\n font-weight: 700;\n line-height: 1;\n color: var(--primary, #ff4076);\n}\n.ls-streamstatus__total-label {\n margin-top: 0.25rem;\n font-size: 0.6875rem;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__platforms {\n display: flex;\n min-width: 0;\n flex: 1;\n flex-direction: column;\n justify-content: center;\n gap: 0.25rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.5rem 0.75rem;\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-streamstatus__platforms-empty {\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__platform {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n}\n.ls-streamstatus__platform-info {\n display: inline-flex;\n min-width: 0;\n align-items: center;\n gap: 0.375rem;\n font-size: 0.75rem;\n color: color-mix(in srgb, var(--white, #fff) 80%, transparent);\n}\n.ls-streamstatus__platform-icon {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n}\n.ls-streamstatus__platform-icon img,\n.ls-streamstatus__platform-icon svg {\n height: 0.875rem;\n width: 0.875rem;\n}\n.ls-streamstatus__platform-dot {\n height: 0.5rem;\n width: 0.5rem;\n flex-shrink: 0;\n border-radius: 9999px;\n background-color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__platform-label {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.ls-streamstatus__platform-value {\n flex-shrink: 0;\n font-size: 0.75rem;\n font-weight: 600;\n font-variant-numeric: tabular-nums;\n color: var(--white, #fff);\n}\n.ls-streamstatus__stats {\n display: grid;\n flex-shrink: 0;\n grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));\n gap: 0.5rem;\n}\n.ls-streamstatus__stat {\n display: flex;\n min-width: 0;\n flex-direction: column;\n gap: 0.125rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.5rem 0.75rem;\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-streamstatus__stat-head {\n display: flex;\n align-items: center;\n gap: 0.375rem;\n}\n.ls-streamstatus__stat-icon {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n}\n.ls-streamstatus__stat-icon img,\n.ls-streamstatus__stat-icon svg {\n height: 1rem;\n width: 1rem;\n}\n.ls-streamstatus__stat-actions {\n display: inline-flex;\n margin-left: auto;\n flex-shrink: 0;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-streamstatus__stat-value {\n overflow: hidden;\n font-size: 1.125rem;\n font-weight: 700;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--white, #fff);\n}\n.ls-streamstatus__stat-trendrow {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-streamstatus__stat-trendrow svg {\n width: 10px;\n flex-shrink: 0;\n}\n.ls-streamstatus__stat-label {\n min-width: 0;\n overflow: hidden;\n font-size: 0.6875rem;\n letter-spacing: 0.05em;\n text-overflow: ellipsis;\n text-transform: uppercase;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__stat-sub {\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.5rem;\n overflow: hidden;\n}\n.ls-viewerslist__head {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n}\n.ls-viewerslist__count {\n flex-shrink: 0;\n font-size: 0.875rem;\n font-weight: 700;\n color: var(--white, #fff);\n}\n.ls-viewerslist__search {\n min-width: 0;\n flex: 1;\n border-radius: 0.75rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background-color: color-mix(in srgb, var(--black, #000) 20%, transparent);\n padding: 0.375rem 0.75rem;\n font-size: 0.8125rem;\n color: var(--white, #fff);\n outline: none;\n}\n.ls-viewerslist__search:focus {\n border-color: var(--primary, #ff4076);\n}\n.ls-viewerslist__search::placeholder {\n color: color-mix(in srgb, var(--grey, var(--neutralLight3, #9392a1)) 60%, transparent);\n}\n.ls-viewerslist__search-slot {\n min-width: 0;\n flex: 1;\n}\n.ls-viewerslist__hint {\n flex-shrink: 0;\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist__empty {\n display: flex;\n height: 100%;\n flex: 1;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist__empty-icon {\n font-size: 1.875rem;\n}\n.ls-viewerslist__list {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.125rem;\n overflow: auto;\n}\n.ls-viewerslist__group {\n margin-top: 0.375rem;\n flex-shrink: 0;\n padding: 0 0.25rem;\n font-size: 0.6875rem;\n font-weight: 700;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist__group:first-child {\n margin-top: 0;\n}\n.ls-viewerslist__viewer {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.5rem;\n border-radius: 0.5rem;\n padding: 0.25rem 0.375rem;\n transition: background-color 120ms ease;\n}\n.ls-viewerslist__viewer:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 4%, transparent);\n}\n.ls-viewerslist__avatar {\n height: 1.5rem;\n width: 1.5rem;\n flex-shrink: 0;\n border-radius: 9999px;\n object-fit: cover;\n}\n.ls-viewerslist__platform {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist__platform img,\n.ls-viewerslist__platform svg {\n height: 0.875rem;\n width: 0.875rem;\n}\n.ls-viewerslist__username {\n min-width: 0;\n flex: 1;\n overflow: hidden;\n font-size: 0.875rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: color-mix(in srgb, var(--white, #fff) 90%, transparent);\n}\n.ls-viewerslist__badges {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-viewerslist__actions {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-shortcutdock,\n.ls-shortcutdock * {\n box-sizing: border-box;\n}\n.ls-shortcutdock {\n display: grid;\n width: 100%;\n align-content: start;\n gap: 0.5rem;\n overflow: auto;\n}\n.ls-shortcutdock--disabled {\n opacity: 0.55;\n}\n.ls-shortcutdock__empty {\n grid-column: 1 / -1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1rem;\n text-align: center;\n font-size: 0.875rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-shortcutdock__cell {\n position: relative;\n min-width: 0;\n}\n.ls-shortcutdock__btn {\n display: flex;\n height: 100%;\n width: 100%;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.25rem;\n cursor: pointer;\n border-radius: 0.75rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 12%, transparent);\n background-color: transparent;\n padding: 0.25rem;\n font: inherit;\n color: var(--white, #fff);\n box-shadow: inset 0 -2px 0 var(--ls-shortcutdock-accent-soft, transparent) !important;\n transition:\n background-color 150ms ease,\n border-color 150ms ease,\n opacity 150ms ease;\n}\n.ls-shortcutdock__btn:hover {\n border-color: color-mix(in srgb, var(--white, #fff) 20%, transparent);\n background-color: color-mix(in srgb, var(--white, #fff) 7%, transparent);\n}\n.ls-shortcutdock__btn--selected,\n.ls-shortcutdock__btn--selected:hover {\n border-color: var(--primary, #ff4076);\n}\n.ls-shortcutdock__btn:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.ls-shortcutdock--readonly .ls-shortcutdock__btn {\n cursor: default;\n}\n.ls-shortcutdock--readonly .ls-shortcutdock__btn:hover {\n border-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-shortcutdock__icon {\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.15rem;\n line-height: 1;\n}\n.ls-shortcutdock__btn--lg .ls-shortcutdock__icon {\n font-size: 1.5rem;\n}\n.ls-shortcutdock__btn-image {\n width: 1.5rem;\n height: 1.5rem;\n flex-shrink: 0;\n border-radius: 0.375rem;\n object-fit: cover;\n}\n.ls-shortcutdock__btn--lg .ls-shortcutdock__btn-image {\n width: 2rem;\n height: 2rem;\n}\n.ls-shortcutdock__btn--icon-only .ls-shortcutdock__btn-image {\n width: 60%;\n height: 60%;\n border-radius: 0.5rem;\n}\n.ls-shortcutdock__label {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n overflow: hidden;\n padding-inline: 0.125rem;\n text-align: center;\n font-size: 0.625rem;\n font-weight: 600;\n line-height: 1.2;\n color: color-mix(in srgb, var(--white, #fff) 90%, transparent);\n}\n.ls-shortcutdock__btn--icon-only {\n font-size: clamp(1rem, 1.4vw, 1.5rem);\n font-weight: 700;\n}\n.ls-shortcutdock__btn--icon-only .ls-shortcutdock__icon {\n width: 100%;\n height: 100%;\n font-size: inherit;\n}\n.ls-shortcutdock__btn--icon-only .ls-shortcutdock__icon svg {\n width: 60%;\n height: 60%;\n}\n.ls-shortcutdock__remove {\n position: absolute;\n top: -0.375rem;\n right: -0.375rem;\n z-index: 1;\n display: flex;\n height: 1.25rem;\n width: 1.25rem;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n border-radius: 9999px;\n background-color: var(--error, #fd5454);\n padding: 0;\n font: inherit;\n font-size: 0.75rem;\n line-height: 1;\n color: var(--white, #fff);\n box-shadow: 0 1px 3px color-mix(in srgb, var(--black, #000) 30%, transparent);\n transition: opacity 120ms ease;\n}\n.ls-shortcutdock__remove:hover {\n opacity: 0.8;\n}\n.ls-shortcutdock__add {\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border-radius: 0.75rem;\n border: 1px dashed color-mix(in srgb, var(--white, #fff) 20%, transparent);\n background: transparent;\n padding: 0.25rem;\n font: inherit;\n font-size: 1.5rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition: border-color 150ms ease, color 150ms ease;\n}\n.ls-shortcutdock__add:hover {\n border-color: color-mix(in srgb, var(--white, #fff) 40%, transparent);\n color: var(--white, #fff);\n}\n.ls-goals,\n.ls-goals * {\n box-sizing: border-box;\n}\n.ls-goals {\n display: flex;\n width: 100%;\n flex-direction: column;\n gap: 1rem;\n}\n.ls-goals__empty {\n font-size: 0.875rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-goals__head {\n display: flex;\n align-items: baseline;\n gap: 0.375rem;\n font-size: 0.875rem;\n}\n.ls-goals__icon {\n display: flex;\n align-self: center;\n align-items: center;\n line-height: 1;\n}\n.ls-goals__label {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n font-weight: 600;\n color: var(--white, #fff);\n}\n.ls-goals__value {\n flex-shrink: 0;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-goals__target {\n opacity: 0.6;\n}\n.ls-goals__bar {\n margin-top: 0.375rem;\n height: 0.625rem;\n width: 100%;\n overflow: hidden;\n border-radius: 9999px;\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n}\n.ls-goals__fill {\n height: 100%;\n border-radius: 9999px;\n background-image:\n linear-gradient(\n 90deg,\n color-mix(in srgb, var(--ls-goals-accent, var(--primary, #ff4076)) 80%, transparent),\n var(--ls-goals-accent, var(--primary, #ff4076)));\n transition: width 700ms ease-out;\n}\n.ls-goals__percent {\n flex-shrink: 0;\n min-width: 2.75rem;\n text-align: right;\n font-weight: 700;\n font-variant-numeric: tabular-nums;\n color: var(--ls-goals-accent, var(--primary, #ff4076));\n}\n.ls-platform-icon {\n display: inline-block;\n height: 1.15em;\n width: auto;\n max-width: 1.5em;\n vertical-align: middle;\n object-fit: contain;\n}\n.ls-chatbox__platform-option {\n display: inline-flex;\n align-items: center;\n gap: 0.5rem;\n min-width: 0;\n}\n.ls-shortcutdock__btn--colored {\n border-color: color-mix(in srgb, var(--ls-shortcutdock-accent, var(--white, #fff)) 70%, transparent);\n box-shadow: inset 0 -2px 0 var(--ls-shortcutdock-accent-soft, transparent);\n}\n.ls-shortcutdock__btn--colored:hover {\n border-color: var(--ls-shortcutdock-accent, var(--white, #fff));\n background-color: color-mix(in srgb, var(--ls-shortcutdock-accent, var(--white, #fff)) 12%, transparent);\n}\n.ls-widget {\n position: relative;\n display: flex;\n height: 100%;\n flex-direction: column;\n overflow: hidden;\n border-radius: var(--radius, 1rem);\n border: 1px solid color-mix(in srgb, var(--cardborder, #393853) 50%, transparent);\n background-image: var(--gradientBg, linear-gradient(180deg, #1b1834 0%, #151230 100%));\n background-color: var(--background, #151230);\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-widget__header {\n position: relative;\n display: flex;\n min-height: 2.75rem;\n width: 100%;\n flex-shrink: 0;\n align-items: center;\n gap: 0.5rem;\n border-bottom: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n padding-inline: 0.5rem;\n}\n.ls-widget__side {\n display: flex;\n z-index: 10;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-widget__side--right {\n margin-left: auto;\n}\n.ls-widget__title {\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n pointer-events: none;\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n font-size: 0.875rem;\n font-weight: 600;\n letter-spacing: 0.025em;\n white-space: nowrap;\n}\n.ls-widget__btn {\n display: flex;\n height: 2rem;\n width: 2rem;\n flex-shrink: 0;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n border: 0;\n border-radius: 0.375rem;\n background-color: color-mix(in srgb, var(--white, #fff) 5%, transparent);\n color: color-mix(in srgb, var(--white, #fff) 70%, transparent);\n font: inherit;\n transition: background-color 150ms ease, color 150ms ease;\n}\n.ls-widget__btn:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n color: var(--white, #fff);\n}\n.ls-widget__btn--active {\n background-color: color-mix(in srgb, var(--primary, #ff4076) 20%, transparent);\n color: var(--primary, #ff4076);\n}\n.ls-widget__btn--active:hover {\n background-color: color-mix(in srgb, var(--primary, #ff4076) 30%, transparent);\n color: var(--primary, #ff4076);\n}\n.ls-widget__btn svg {\n height: 1rem;\n width: 1rem;\n}\n.ls-widget__body {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n overflow: auto;\n}\n");
24
+ styleInject(".ls-color-picker,\n.ls-color-picker *,\n.mui-multi-select,\n.mui-multi-select *,\n.ls-multi-select-value,\n.ls-multi-select-value *,\n.ls-variable-picker,\n.ls-variable-picker *,\n.ls-variable-token,\n.ls-variable-token *,\n.ls-font-picker,\n.ls-font-picker *,\n.mui-ls-input,\n.mui-ls-input * {\n box-sizing: border-box;\n}\n.mui-ls-input .MuiInputBase-input,\n.mui-ls-input input,\n.mui-ls-input textarea {\n box-sizing: content-box;\n}\n.ls-color-picker button,\n.mui-multi-select button {\n font: inherit;\n letter-spacing: inherit;\n color: inherit;\n margin: 0;\n}\n.ls-color-picker__preview {\n appearance: none;\n -webkit-appearance: none;\n background-color: transparent;\n background-image: none;\n cursor: pointer;\n text-transform: uppercase;\n user-select: none;\n}\n.mui-ls-button.Mui-disabled {\n color: var(--neutralLight2, var(--white2, #cac9d5));\n opacity: 0.45;\n background-color: var(--separator, #0a0821);\n cursor: not-allowed;\n}\n.mui-ls-button {\n border-radius: var(--radius, 1rem);\n padding: 0.375rem 1.5rem;\n text-transform: uppercase;\n}\n.mui-ls-button.MuiButton-sizeSmall {\n padding: 0.25rem 1rem;\n}\n.mui-ls-button.MuiButton-sizeLarge {\n padding: 0.625rem 2rem;\n}\n.mui-ls-button--extended {\n padding-inline: 3rem;\n}\n.mui-ls-button.MuiButton-containedPrimary,\n.mui-ls-button.Mui-disabled.MuiButton-containedPrimary {\n background: var(--primary, #ff4076);\n color: var(--alwayswhite, #fff) !important;\n}\n.mui-ls-button.MuiButton-containedSecondary {\n background-color: var(--secondary, #535395);\n color: var(--alwayswhite, #fff) !important;\n}\n.mui-ls-button.Mui-disabled.MuiButton-containedSecondary {\n background-color: var(--secondary, #535395);\n color: var(--neutralLight2, var(--white2, #cac9d5));\n opacity: 0.4;\n}\n.mui-ls-button.MuiButton-outlinedPrimary {\n color: var(--primary, #ff4076);\n border-color: var(--primary, #ff4076);\n}\n.mui-ls-button.MuiButton-outlinedPrimary:hover {\n border-color: var(--primary, #ff4076);\n background-color: color-mix(in srgb, var(--primary, #ff4076) 12%, transparent);\n}\n.mui-ls-button.MuiButton-outlinedSecondary {\n color: var(--neutralLight1, var(--white, #fff));\n border-color: var(--secondary, #535395);\n}\n.mui-ls-button.MuiButton-outlinedSecondary.Mui-disabled {\n color: var(--neutralLight2, var(--white2, #cac9d5));\n border-color: var(--neutralDark4, var(--cardborder, #393853));\n background-color: var(--transwhite, rgba(255, 255, 255, 0.05));\n opacity: 0.5;\n}\n.mui-ls-button.MuiButton-outlinedSecondary:hover {\n border-color: var(--secondary, #535395);\n background-color: var(--transwhite, rgba(255, 255, 255, 0.05));\n}\n.mui-ls-button.MuiButton-containedError {\n color: var(--alwayswhite, #fff) !important;\n}\n.mui-ls-button.MuiButton-outlinedError {\n color: var(--error, #fd5454);\n border-color: var(--error, #fd5454);\n}\n.mui-ls-button.MuiButton-outlinedError:hover {\n border-color: var(--error, #fd5454);\n background-color: color-mix(in srgb, var(--error, #fd5454) 12%, transparent);\n}\n.mui-ls-button--neutral.mui-ls-button--contained {\n background-color: var(--neutralDark4, var(--cardborder, #393853));\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.mui-ls-button--neutral.mui-ls-button--contained:hover {\n background-color: color-mix(in srgb, var(--neutralDark4, var(--cardborder, #393853)) 82%, var(--neutralLight1, #fff));\n}\n.mui-ls-button--neutral.mui-ls-button--outlined {\n color: var(--neutralLight1, var(--white, #fff));\n border-color: var(--neutralDark4, var(--cardborder, #393853));\n background-color: transparent;\n}\n.mui-ls-button--neutral.mui-ls-button--outlined:hover {\n border-color: var(--neutralLight3, var(--grey, #9392a1));\n background-color: var(--transwhite, rgba(255, 255, 255, 0.05));\n}\n.mui-ls-button--neutral.mui-ls-button--text {\n color: var(--neutralLight1, var(--white, #fff));\n}\n.mui-ls-button--neutral.mui-ls-button--text:hover {\n background-color: var(--transwhite, rgba(255, 255, 255, 0.05));\n}\n.mui-ls-button svg {\n max-height: 24px;\n max-width: 24px;\n}\n.mui-ls-input,\n.mui-ls-select-form-control,\n.ls-font-picker,\n.ls-color-picker__input {\n width: 100%;\n}\n.MuiFormControl-root.mui-ls-input,\n.MuiFormControl-root.mui-ls-select-form-control,\n.MuiFormControl-root.mui-ls-slider-input-root {\n margin-top: 0.875rem;\n padding-top: 0;\n}\n.MuiFormControl-root.mui-ls-select-form-control {\n min-width: 100px;\n margin-bottom: 0.3rem;\n}\n.mui-ls-slider-input-root .MuiFormControl-root.mui-ls-input,\n.mui-ls-slider-input-style .MuiFormControl-root.mui-ls-input,\n.MuiFormControl-root.mui-ls-slider-input-value.mui-ls-input {\n margin-top: 0;\n padding-top: 0;\n}\n.mui-ls-input,\n.mui-ls-select-form-control,\n.mui-multi-select,\n.ls-font-picker,\n.mui-ls-slider-input-root {\n --ls-control-height: 55px;\n}\n.mui-ls-input .MuiTextField-root {\n width: 100%;\n margin: 0;\n}\n.mui-ls-input .MuiOutlinedInput-root,\n.mui-ls-input .MuiInputBase-root,\n.mui-ls-input .MuiOutlinedInput-notchedOutline,\n.mui-ls-select.MuiOutlinedInput-root,\n.mui-ls-select .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-control.MuiOutlinedInput-root,\n.mui-ls-slider-input-control .MuiOutlinedInput-notchedOutline,\n.mui-multi-select .mui-ls-select.MuiOutlinedInput-root,\n.mui-multi-select .mui-ls-select .MuiOutlinedInput-notchedOutline,\n.ls-font-picker .MuiOutlinedInput-root,\n.ls-font-picker .MuiInputBase-root,\n.ls-font-picker .MuiOutlinedInput-notchedOutline,\n.ls-color-picker__input .MuiOutlinedInput-root,\n.ls-color-picker__input .MuiInputBase-root,\n.ls-color-picker__input .MuiOutlinedInput-notchedOutline {\n border-radius: var(--radius) !important;\n}\n.mui-ls-input .MuiOutlinedInput-notchedOutline,\n.mui-ls-select .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-control .MuiOutlinedInput-notchedOutline {\n border: 2px solid var(--cardborder, var(--neutralDark4, #393853));\n}\n.mui-ls-input .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline,\n.mui-ls-select:hover .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-control.MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline {\n border-color: var(--primary, #ff4076) !important;\n}\n.mui-ls-input .MuiInputBase-root,\n.mui-ls-select.MuiInputBase-root,\n.mui-multi-select .mui-ls-select.MuiInputBase-root,\n.ls-font-picker .MuiInputBase-root {\n background-color: var(--background, var(--neutralDark1, #18162f));\n color: var(--white, var(--neutralLight1, #fff));\n min-height: var(--ls-control-height);\n}\n.mui-ls-slider-input-control.MuiInputBase-root {\n background-color: transparent;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.mui-ls-input.small .MuiInputBase-root {\n min-height: 25px;\n}\n.mui-ls-input.medium .MuiInputBase-root {\n min-height: 35px;\n}\n.mui-ls-input.noMinHeight .MuiInputBase-root {\n min-height: unset;\n}\n.mui-ls-date-picker input[type=datetime-local]::-webkit-calendar-picker-indicator {\n cursor: pointer;\n opacity: 0.9;\n filter: invert(1);\n}\n.mui-ls-select .MuiSelect-select,\n.mui-multi-select .MuiSelect-select {\n display: flex;\n min-height: calc(var(--ls-control-height) - 2px);\n align-items: center;\n box-sizing: border-box;\n background-color: var(--background, var(--neutralDark1, #18162f));\n color: var(--white, var(--neutralLight1, #fff));\n border-radius: var(--radius);\n}\n.mui-multi-select .MuiSelect-select {\n min-width: 0;\n}\n.MuiSvgIcon-root svg {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.mui-ls-input .MuiSvgIcon-root svg path {\n fill: currentcolor;\n stroke: currentcolor;\n}\n.mui-ls-input .MuiInputLabel-root,\n.mui-ls-select-form-control .MuiInputLabel-root,\n.mui-ls-slider-input-root .MuiInputLabel-root {\n display: inline-flex;\n align-items: center;\n gap: 0.35rem;\n transform: translate(14px, -10px) scale(0.875);\n font-size: 1rem;\n line-height: 1.4375em;\n color: var(--white, var(--neutralLight1, #fff)) !important;\n}\n.mui-ls-input .MuiOutlinedInput-notchedOutline legend,\n.mui-ls-select-form-control .MuiOutlinedInput-notchedOutline legend,\n.mui-ls-slider-input-control .MuiOutlinedInput-notchedOutline legend {\n font-size: 0.875rem;\n}\n.mui-ls-input legend,\n.mui-ls-select-form-control legend,\n.mui-ls-slider-input-root legend {\n max-width: unset !important;\n}\n.mui-ls-input .MuiInputLabel-root svg,\n.mui-ls-select-form-control .MuiInputLabel-root svg,\n.mui-ls-slider-input-root .MuiInputLabel-root svg {\n display: block;\n flex: 0 0 auto;\n}\n.mui-ls-select .MuiSvgIcon-root {\n color: var(--white, var(--neutralLight1, #fff));\n}\n.mui-autocomplete-select button {\n box-shadow: none;\n}\n.mui-autocomplete-select .MuiSvgIcon-root {\n color: var(--white, var(--neutralLight1, #fff));\n}\n.mui-ls-input input::placeholder,\n.mui-ls-input textarea::placeholder {\n color: var(--neutralLight3, var(--grey, #9392a1));\n opacity: 0.55;\n font-style: italic;\n}\n.mui-ls-input .MuiInputBase-input,\n.mui-ls-input .MuiInputAdornment-root,\n.mui-ls-input .MuiSvgIcon-root,\n.mui-ls-input .MuiFormHelperText-root {\n color: var(--neutralLight1, var(--white, #fff));\n opacity: 1;\n}\n.mui-ls-input .Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-input .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-select.Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-select-form-control .Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-select-form-control .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-control.Mui-focused .MuiOutlinedInput-notchedOutline,\n.mui-ls-slider-input-root .MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline {\n border-color: var(--primary, #ff4076) !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-paper,\n.ls-variable-autocomplete-paper {\n border: 1px solid var(--neutralDark4, var(--cardborder, #393853)) !important;\n border-radius: var(--radius, 1rem) !important;\n background: var(--neutralDark2, var(--cardbackground, #211f45)) !important;\n color: var(--neutralLight1, var(--white, #fff)) !important;\n box-shadow: 0 16px 32px rgba(0, 0, 0, 0.32) !important;\n overflow: hidden !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-listbox,\n.ls-variable-autocomplete-listbox {\n padding: 0.25rem 0 !important;\n background: var(--neutralDark2, var(--cardbackground, #211f45)) !important;\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-groupLabel,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-groupLabel {\n position: sticky;\n top: 0;\n z-index: 1;\n min-height: 32px;\n padding: 0.45rem 1rem 0.25rem !important;\n background: var(--neutralDark1, var(--background, #18162f)) !important;\n color: var(--neutralLight3, var(--grey, #9392a1)) !important;\n font-size: 0.75rem !important;\n font-weight: 700 !important;\n letter-spacing: 0 !important;\n line-height: 1.2 !important;\n text-transform: uppercase;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-groupUl,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-groupUl {\n padding: 0 !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-option,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option {\n display: flex !important;\n min-height: 44px !important;\n align-items: center !important;\n padding: 0.625rem 1rem !important;\n color: var(--neutralLight1, var(--white, #fff)) !important;\n font-size: 1rem !important;\n line-height: 1.35 !important;\n cursor: pointer !important;\n transition: background-color 120ms ease, color 120ms ease !important;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-option > *,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option > * {\n min-width: 0;\n}\n.ls-variable-autocomplete-popper .MuiAutocomplete-option:hover,\n.ls-variable-autocomplete-popper .MuiAutocomplete-option.Mui-focused,\n.ls-variable-autocomplete-popper .MuiAutocomplete-option[data-focus=true],\n.ls-variable-autocomplete-popper .MuiAutocomplete-option[aria-selected=true],\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option:hover,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option.Mui-focused,\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option[data-focus=true],\n.ls-variable-autocomplete-listbox .MuiAutocomplete-option[aria-selected=true] {\n background: var(--cardHover, var(--transwhite, rgba(255, 255, 255, 0.05))) !important;\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.ls-variable-option {\n gap: 0.75rem;\n}\n.ls-variable-option__thumb {\n width: 40px;\n height: 40px;\n flex: 0 0 40px;\n border-radius: var(--radius, 1rem);\n object-fit: cover;\n}\n.ls-variable-option__thumb--placeholder {\n background: var(--neutralDark4, var(--cardborder, #393853));\n}\n.ls-variable-option__body {\n min-width: 0;\n}\n.ls-variable-option__label {\n color: var(--neutralLight1, var(--white, #fff));\n font-weight: 500;\n line-height: 1.25;\n}\n.ls-variable-option__helper {\n margin-top: 0.125rem;\n color: var(--neutralLight3, var(--grey, #9392a1));\n font-size: 0.875rem;\n line-height: 1.25;\n}\n.ls-variable-autocomplete-popup-indicator,\n.ls-variable-autocomplete-popup-indicator.MuiIconButton-root,\n.ls-variable-autocomplete-popup-indicator svg {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.ls-variable-autocomplete-popup-indicator svg path {\n fill: currentcolor !important;\n stroke: currentcolor !important;\n}\n.ls-color-picker .MuiInputLabel-root .MuiSvgIcon-root,\n.ls-color-picker .MuiInputLabel-root svg,\n.ls-color-picker .MuiInputLabel-root svg path,\n.ls-color-picker__gradient button,\n.ls-color-picker__gradient button svg,\n.ls-color-picker__gradient button svg path,\n.ls-color-picker__gradient button svg line,\n.ls-color-picker__gradient button svg polyline,\n.ls-color-picker__gradient button svg polygon,\n.ls-color-picker__gradient button svg circle,\n.ls-color-picker__gradient button svg rect {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n fill: currentcolor !important;\n stroke: currentcolor !important;\n}\n.ls-color-picker__gradient button[aria-pressed=true] svg,\n.ls-color-picker__gradient button[aria-selected=true] svg,\n.ls-color-picker__gradient button[data-active=true] svg,\n.ls-color-picker__gradient button[aria-pressed=true] svg *,\n.ls-color-picker__gradient button[aria-selected=true] svg *,\n.ls-color-picker__gradient button[data-active=true] svg * {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n fill: currentcolor !important;\n stroke: currentcolor !important;\n}\n.ls-color-picker__picker--inline {\n max-height: none !important;\n}\n.ls-color-picker__gradient {\n color: var(--neutralLight1, var(--white, #fff)) !important;\n}\n.ls-variable-input-adornment,\n.ls-variable-input-adornment.MuiInputAdornment-root {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n height: 24px;\n width: 24px;\n min-width: 24px;\n margin-left: 0.35rem;\n border-radius: var(--radius, 1rem);\n background: var(--primary, #ff4076) !important;\n color: var(--alwayswhite, var(--white, #fff)) !important;\n font-weight: 800;\n line-height: 1;\n letter-spacing: 0;\n cursor: pointer;\n user-select: none;\n}\n.ls-variable-input-adornment svg,\n.ls-variable-input-adornment path {\n color: currentcolor !important;\n fill: currentcolor !important;\n stroke: currentcolor !important;\n}\n.ls-variable-input-adornment:hover,\n.ls-variable-input-adornment.MuiInputAdornment-root:hover {\n filter: brightness(1.08);\n}\n.ls-variable-input-adornment:active,\n.ls-variable-input-adornment.MuiInputAdornment-root:active {\n filter: brightness(0.96);\n}\n.mui-ls-slider-input-root {\n width: 100%;\n}\n.mui-ls-slider-input-control.MuiOutlinedInput-root {\n height: var(--ls-control-height);\n min-height: var(--ls-control-height);\n padding: 0 1rem;\n}\n.mui-ls-slider-input-control > .mui-ls-slider-input-content {\n box-sizing: border-box;\n display: flex;\n flex: 1 1 auto;\n width: 100%;\n height: 100%;\n min-width: 0;\n align-items: center;\n padding: 0 !important;\n}\n.mui-ls-slider-input-control > .mui-ls-slider-input-content:focus {\n outline: none;\n}\n.mui-ls-slider-input-row {\n display: flex;\n min-width: 0;\n min-height: calc(var(--ls-control-height) - 14px);\n align-items: center;\n gap: 1rem;\n}\n.mui-ls-slider-input-row--slider {\n flex-wrap: nowrap;\n}\n.mui-ls-slider-input-row--input {\n justify-content: stretch;\n}\n.mui-ls-slider-input-row .MuiSlider-root {\n height: 3px;\n padding: 8px 0;\n}\n.mui-ls-slider-input-row .MuiSlider-track,\n.mui-ls-slider-input-row .MuiSlider-rail {\n height: 3px;\n border: 0;\n}\n.mui-ls-slider-input-row .MuiSlider-thumb {\n width: 18px;\n height: 18px;\n}\n.mui-ls-slider-input-style input::-webkit-outer-spin-button,\n.mui-ls-slider-input-style input::-webkit-inner-spin-button {\n -webkit-appearance: none;\n margin: 0;\n}\n.mui-ls-slider-input-style input {\n max-width: 100px;\n padding: 0.25rem 0.5rem;\n}\n.mui-ls-slider-input-style.noMargin .MuiTextField-root {\n margin-top: 0;\n margin-bottom: 0;\n}\n.mui-ls-slider-input-content .mui-ls-slider-input-style {\n position: relative;\n z-index: 1;\n display: grid;\n flex: 1 1 auto;\n width: 100%;\n grid-template-columns: minmax(0, 1fr) auto auto;\n align-items: center;\n gap: 0.5rem;\n height: 100%;\n min-width: 0;\n transform: none !important;\n}\n.mui-ls-slider-input-info {\n position: relative;\n z-index: 2;\n display: inline-flex;\n align-items: center;\n justify-content: center;\n color: var(--neutralLight2, var(--white2, #cac9d5));\n line-height: 1;\n}\n.mui-ls-slider-input-info svg {\n display: block;\n width: 14px;\n height: 14px;\n}\n.mui-ls-slider-input-content .mui-ls-slider-input-style--input-only {\n grid-template-columns: minmax(0, 1fr) auto;\n}\n.mui-ls-slider-input-track {\n display: flex;\n width: 100%;\n min-width: 0;\n height: 2rem;\n align-items: center;\n justify-content: center;\n gap: 1rem;\n padding-left: 1rem;\n padding-right: 1rem;\n border-radius: 9999px;\n}\n.mui-ls-slider-input-track--popout {\n padding-right: 0;\n}\n.mui-ls-slider-input-track--start-icon {\n gap: 0.5rem;\n padding-left: 0;\n}\n.mui-ls-slider-input-track--end-icon {\n gap: 0.5rem;\n padding-right: 0;\n}\n.mui-ls-slider-input-style .MuiSlider-root {\n width: 100%;\n min-width: 0;\n height: 3px;\n padding: 8px 0;\n}\n.mui-ls-slider-input-style .MuiSlider-track,\n.mui-ls-slider-input-style .MuiSlider-rail {\n height: 3px;\n border: 0;\n}\n.mui-ls-slider-input-style .MuiSlider-thumb {\n width: 18px;\n height: 18px;\n}\n.mui-ls-slider-input-style .MuiSlider-valueLabel {\n z-index: 3;\n}\n.mui-ls-slider-input-style .ls-slider-input-icon {\n display: inline-flex;\n width: 20px;\n min-width: 20px;\n height: 20px;\n min-height: 20px;\n align-items: center;\n justify-content: center;\n}\n.mui-ls-slider-input-style .ls-slider-input-icon svg {\n width: 20px;\n min-width: 20px;\n height: 20px;\n min-height: 20px;\n}\n.mui-ls-slider-input-style .ls-custom-range-input,\n.ls-custom-range-input {\n -webkit-appearance: none;\n appearance: none;\n width: 100%;\n height: 6px;\n border-radius: 15px;\n background: var(--cardborder, var(--neutralDark4, #393853));\n cursor: pointer;\n outline: none;\n}\n.mui-ls-slider-input-style .ls-custom-range-input::-webkit-slider-thumb,\n.ls-custom-range-input::-webkit-slider-thumb {\n -webkit-appearance: none;\n appearance: none;\n width: 24px;\n height: 24px;\n border: none;\n border-radius: 50%;\n background-color: var(--white, #fff);\n transition: 0.2s ease-in-out;\n}\n.mui-ls-slider-input-style .ls-custom-range-input::-moz-range-thumb,\n.ls-custom-range-input::-moz-range-thumb {\n width: 24px;\n height: 24px;\n border: none;\n border-radius: 50%;\n background-color: var(--white, #fff);\n transition: 0.2s ease-in-out;\n}\n.mui-ls-slider-input-style .ls-custom-range-input::-webkit-slider-thumb:hover,\n.ls-custom-range-input::-webkit-slider-thumb:hover {\n box-shadow: 0 0 0 10px var(--primaryShadow, rgba(255, 64, 118, 0.18));\n}\n.mui-ls-slider-input-style .ls-custom-range-input:active::-webkit-slider-thumb,\n.mui-ls-slider-input-style .ls-custom-range-input:focus::-webkit-slider-thumb,\n.ls-custom-range-input:active::-webkit-slider-thumb,\n.ls-custom-range-input:focus::-webkit-slider-thumb {\n box-shadow: 0 0 0 13px var(--primaryShadow, rgba(255, 64, 118, 0.18));\n}\n.mui-ls-slider-input-style .ls-custom-range-input::-moz-range-thumb:hover,\n.ls-custom-range-input::-moz-range-thumb:hover {\n box-shadow: 0 0 0 10px var(--primaryShadow, rgba(255, 64, 118, 0.18));\n}\n.mui-ls-slider-input-style .ls-custom-range-input:active::-moz-range-thumb,\n.mui-ls-slider-input-style .ls-custom-range-input:focus::-moz-range-thumb,\n.ls-custom-range-input:active::-moz-range-thumb,\n.ls-custom-range-input:focus::-moz-range-thumb {\n box-shadow: 0 0 0 13px var(--primaryShadow, rgba(255, 64, 118, 0.18));\n}\n.mui-ls-slider-input-style .ls-slider-value-input {\n width: 96px !important;\n height: 36px !important;\n min-height: 36px !important;\n}\n.mui-ls-slider-input-style .ls-slider-value-input .MuiInputBase-root {\n height: 36px !important;\n max-width: 96px !important;\n min-height: 36px !important;\n border-radius: 15px !important;\n}\n.mui-ls-slider-input-style .ls-slider-value-input .MuiOutlinedInput-notchedOutline {\n border-radius: 15px !important;\n}\n.mui-ls-slider-input-style .ls-slider-value-input input {\n max-width: none;\n padding: 0.35rem 0.75rem;\n text-align: left;\n}\n.mui-ls-slider-input-adornment {\n justify-self: center;\n color: var(--white, var(--neutralLight1, #fff));\n white-space: nowrap;\n}\n.mui-ls-slider-input-style .MuiOutlinedInput-root:hover .MuiOutlinedInput-notchedOutline {\n border-color: var(--primary, #ff4076) !important;\n}\n.mui-ls-slider-input-value.mui-ls-input {\n margin: 0;\n}\n.mui-ls-slider-input-value.mui-ls-input .MuiFormControl-root,\n.mui-ls-slider-input-value.mui-ls-input .MuiTextField-root {\n margin: 0;\n}\n.mui-ls-slider-input-value.mui-ls-input .MuiInputBase-root {\n min-height: 36px;\n}\n.mui-ls-slider-input-value.mui-ls-input .MuiOutlinedInput-notchedOutline {\n border-color: var(--neutralDark4, var(--cardborder, #393853));\n}\n.mui-ls-slider-input-helper {\n display: block;\n margin-top: 0.25rem;\n color: var(--neutralLight3, var(--grey, #9392a1));\n font-size: 0.75rem;\n line-height: 1.25;\n}\n.ls-multi-select-value {\n display: flex;\n width: 100%;\n min-width: 0;\n flex-wrap: nowrap;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n overflow: hidden;\n white-space: nowrap;\n}\n.ls-multi-select-value__label {\n min-width: 0;\n flex: 1 1 0%;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.ls-multi-select-value__count {\n flex-shrink: 0;\n white-space: nowrap;\n}\n.ls-color-picker__preview {\n position: relative;\n display: inline-block;\n width: 1.5rem;\n height: 1.5rem;\n flex-shrink: 0;\n padding: 0;\n border: 1px solid color-mix(in srgb, #fff 25%, transparent);\n border-radius: var(--radius, 1rem);\n background-size: cover;\n background-position: center;\n background-repeat: no-repeat;\n box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25);\n color: transparent;\n line-height: 0;\n}\n.ls-color-picker__preview:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.ls-color-picker__preview:focus {\n outline: none;\n}\n.ls-color-picker__preview:focus-visible {\n box-shadow:\n 0 0 0 2px var(--primary, #ff4076),\n 0 0 0 4px var(--neutralDark1, #1b1a28),\n 0 0 0 1px rgba(0, 0, 0, 0.25);\n}\n.ls-color-picker__gradient circle,\n.ls-color-picker__gradient polyline {\n stroke: #fff !important;\n}\n.ls-variable-picker {\n --variable-custom-color: var(--customVariables, #69ffd2);\n --variable-function-color: var(--functionVariables, var(--semanticPurple, #b489ff));\n --variable-normal-color: var(--normalVariables, var(--semanticBlue, #65b8ff));\n display: flex;\n width: 92vw;\n max-width: 1100px;\n min-height: 50vh;\n max-height: 55vh;\n flex-direction: column;\n overflow: hidden;\n padding: 1rem;\n}\n.ls-variable-picker__field {\n margin: 0 0 0.75rem;\n border: 1px solid color-mix(in srgb, var(--primary, #ff4076) 42%, var(--neutralDark4, #393853));\n border-radius: var(--radius, 1rem);\n padding: 0.5rem;\n}\n.ls-variable-picker__legend {\n padding-inline: 0.375rem;\n color: var(--primary, #ff4076);\n font-size: 0.75rem;\n font-weight: 700;\n}\n.ls-variable-picker__intro {\n margin-bottom: 1rem;\n color: var(--neutralLight2, #cac9d5);\n}\n.ls-variable-picker__header,\n.ls-variable-picker__row {\n display: grid;\n grid-template-columns: minmax(300px, 1.5fr) 1fr 1fr;\n gap: 2rem;\n}\n.ls-variable-picker__header {\n margin-bottom: 0.25rem;\n padding-inline: 0.25rem;\n padding-right: 1.7rem;\n color: var(--neutralLight3, #9392a1);\n}\n.ls-variable-picker__list {\n height: 100%;\n overflow: auto;\n padding-right: 1rem;\n}\n.ls-variable-picker__row {\n cursor: pointer;\n align-items: start;\n border-bottom: 1px solid color-mix(in srgb, var(--neutralDark4, #393853) 70%, transparent);\n padding: 1rem 0.25rem;\n}\n.ls-variable-picker__row--no-border {\n border-bottom: 0;\n}\n.ls-variable-picker__token-cell {\n display: flex;\n min-width: 0;\n align-items: center;\n gap: 0.375rem;\n}\n.ls-variable-picker__expand-toggle,\n.ls-variable-picker__expand-spacer {\n width: 24px;\n height: 24px;\n flex: 0 0 24px;\n}\n.ls-variable-picker__expand-toggle {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n border: 1px solid color-mix(in srgb, var(--neutralDark4, #393853) 75%, transparent);\n border-radius: var(--radius, 1rem);\n padding: 0;\n background: var(--neutralDark3, var(--containerbackground, #1f1f3a));\n color: var(--neutralLight2, #cac9d5);\n transition:\n background-color 140ms ease,\n border-color 140ms ease,\n color 140ms ease,\n transform 140ms ease;\n}\n.ls-variable-picker__expand-toggle:hover {\n border-color: var(--primary, #ff4076);\n background: color-mix(in srgb, var(--primary, #ff4076) 16%, var(--neutralDark3, #1f1f3a));\n color: var(--neutralLight1, #fff);\n}\n.ls-variable-picker__expand-toggle svg {\n transform: rotate(-90deg);\n transition: transform 140ms ease;\n}\n.ls-variable-picker__expand-toggle--expanded svg {\n transform: rotate(0deg);\n}\n.ls-variable-picker__row:active {\n opacity: 0.8;\n}\n.ls-variable-picker__description {\n max-width: 600px;\n overflow-wrap: break-word;\n line-height: 1.25;\n word-break: break-all;\n}\n.ls-variable-picker__row.ls-variable-picker__example-description {\n display: block;\n cursor: default;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n color: var(--neutralLight2, #cac9d5);\n overflow-wrap: break-word;\n line-height: 1.35;\n}\n.ls-variable-picker__row.ls-variable-picker__example-description:active {\n opacity: 1;\n}\n.ls-variable-picker__value {\n min-width: 0;\n}\n.ls-variable-picker__value-input {\n width: 100%;\n min-width: 0;\n cursor: text;\n overflow: hidden;\n border: 0;\n background: transparent;\n color: var(--neutralLight1, var(--white, #fff));\n caret-color: transparent;\n font: inherit;\n font-size: 1rem;\n line-height: 1.25;\n outline: 0;\n padding: 0;\n text-overflow: ellipsis;\n}\n.ls-variable-picker__value-input:focus {\n outline: 0;\n}\n.ls-variable-picker__value-input::selection {\n background: color-mix(in srgb, var(--primary, #ff4076) 45%, transparent);\n color: var(--alwayswhite, var(--white, #fff));\n}\n.ls-variable-token {\n display: flex;\n min-width: 0;\n align-items: center;\n}\n.ls-variable-token--suggested {\n color: var(--suggestedVariables, #ffb469);\n}\n.ls-variable-token--custom {\n color: var(--customVariables, #69ffd2);\n}\n.ls-variable-token--function {\n color: var(--functionVariables, var(--semanticPurple, #b489ff));\n}\n.ls-variable-token--system {\n color: var(--normalVariables, var(--semanticBlue, #65b8ff));\n}\n.ls-variable-highlight__layer {\n position: absolute;\n margin: 0;\n border: 0;\n box-sizing: border-box;\n overflow: hidden;\n pointer-events: none;\n background: transparent;\n color: inherit;\n white-space: pre-wrap;\n overflow-wrap: break-word;\n z-index: 0;\n}\n.ls-variable-highlight__token {\n border-radius: 4px;\n}\n.ls-variable-highlight__token--custom {\n color: var(--customVariables, #69ffd2);\n background: color-mix(in srgb, var(--customVariables, #69ffd2) 16%, transparent);\n}\n.ls-variable-highlight__token--suggested {\n color: var(--suggestedVariables, #ffb469);\n background: color-mix(in srgb, var(--suggestedVariables, #ffb469) 16%, transparent);\n}\n.ls-variable-highlight__token--function {\n color: var(--functionVariables, var(--semanticPurple, #b489ff));\n background: color-mix(in srgb, var(--functionVariables, var(--semanticPurple, #b489ff)) 16%, transparent);\n}\n.ls-variable-highlight__token--system {\n color: var(--normalVariables, var(--semanticBlue, #65b8ff));\n background: color-mix(in srgb, var(--normalVariables, var(--semanticBlue, #65b8ff)) 16%, transparent);\n}\n.ls-variable-highlight__tooltip {\n position: fixed;\n z-index: 2000;\n transform: translate(-50%, -100%);\n margin-top: -8px;\n max-width: 320px;\n padding: 6px 10px;\n border-radius: 8px;\n background: var(--neutralDark1, #171628);\n border: 1px solid var(--neutralDark4, #393853);\n color: var(--neutralLight2, #cac9d5);\n font-size: 0.75rem;\n line-height: 1.3;\n overflow-wrap: anywhere;\n pointer-events: none;\n white-space: pre-line;\n box-shadow: 0 4px 14px rgb(0 0 0 / 40%);\n}\n.ls-variable-token__name {\n min-width: 0;\n word-break: break-all;\n}\n.ls-variable-token__badge {\n display: inline-flex;\n margin-left: 0.5rem;\n flex-shrink: 0;\n align-items: center;\n border: 1px solid currentcolor;\n border-radius: var(--radius, 1rem);\n padding-inline: 0.25rem;\n padding-block: 0;\n font-size: 10px;\n font-weight: 600;\n line-height: 1;\n text-transform: uppercase;\n}\n.ls-chat-message {\n position: relative;\n font-size: 0.95em;\n line-height: 1.4;\n color: var(--white, var(--neutralLight1, #fff));\n overflow-wrap: break-word;\n word-break: break-word;\n}\n.ls-chat-message img {\n display: inline-block;\n}\n.ls-chat-message__reply {\n display: block;\n margin-bottom: 0.15em;\n font-size: 0.82em;\n color: var(--white2, var(--neutralLight3, #9392a1));\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.ls-chat-message__avatar-prefix {\n vertical-align: middle;\n}\n.ls-chat-message__avatar {\n width: 1.3em;\n height: 1.3em;\n border-radius: 9999px;\n vertical-align: middle;\n margin-right: 0.35em;\n}\n.ls-chat-message__site {\n display: inline-block;\n vertical-align: middle;\n margin-right: 0.35em;\n}\n.ls-chat-message__site img,\n.ls-chat-message__site svg {\n width: 1.2em;\n height: 1.2em;\n vertical-align: middle;\n}\n.ls-chat-message__time {\n margin-right: 0.35em;\n font-weight: 700;\n vertical-align: middle;\n}\n.ls-chat-message__badges {\n vertical-align: middle;\n}\n.ls-chat-message__badges img {\n height: 1.05em;\n vertical-align: middle;\n margin-right: 0.25em;\n}\n.ls-chat-message__username {\n font-weight: 700;\n vertical-align: middle;\n}\n.ls-chat-message__username--clickable {\n cursor: pointer;\n background: none;\n border: 0;\n padding: 0;\n font: inherit;\n}\n.ls-chat-message__username--clickable:hover {\n text-decoration: underline;\n}\n.ls-viewerslist__username--clickable,\n.ls-eventlist-item__username--clickable {\n cursor: pointer;\n}\n.ls-viewerslist__username--clickable:hover,\n.ls-eventlist-item__username--clickable:hover {\n text-decoration: underline;\n}\n.ls-chat-message__text {\n vertical-align: middle;\n}\n.ls-chat-message__text img {\n vertical-align: middle;\n}\n.ls-chat-message__actions {\n position: absolute;\n top: 0;\n right: 0;\n}\n.ls-chat-message__modbar {\n display: flex;\n overflow: hidden;\n border-radius: 0.75rem;\n background-color: var(--separator, #0a0821);\n transition-duration: 300ms;\n}\n.ls-chat-message__modbtn {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0.5rem;\n cursor: pointer;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition-duration: 300ms;\n}\n.ls-chat-message__modbtn:hover {\n background-color: var(--cardborder, var(--neutralDark4, #393853));\n}\n.ls-chat-message__modbtn--danger:hover {\n color: var(--error, #fd5454);\n}\n.ls-chat-message__menu-icon {\n display: flex;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-eventlist-item {\n display: grid;\n grid-template-columns: minmax(0, 1fr) auto;\n align-items: center;\n gap: 1em;\n border: 1px solid var(--cardborder, var(--neutralDark4, #393853));\n border-left: 4px solid var(--primary, #ff4076);\n border-radius: 1em;\n background-color: var(--cardbackground, var(--neutralDark2, #211d3e));\n color: var(--white, var(--neutralLight1, #fff));\n padding: 1em;\n line-height: 1.35;\n}\n.ls-eventlist-item__main {\n display: flex;\n flex-direction: column;\n gap: 0.2em;\n min-width: 0;\n}\n.ls-eventlist-item__identity {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n column-gap: 0.75em;\n row-gap: 0.35em;\n min-width: 0;\n}\n.ls-eventlist-item__avatar,\n.ls-eventlist-item__icon {\n display: flex;\n align-items: center;\n justify-content: center;\n flex-shrink: 0;\n width: 1.5em;\n min-width: 1.5em;\n height: 1.5em;\n overflow: hidden;\n}\n.ls-eventlist-item__avatar {\n border-radius: 1em;\n background-color: var(--background, transparent);\n}\n.ls-eventlist-item__avatar img,\n.ls-eventlist-item__icon img,\n.ls-eventlist-item__icon svg {\n width: 100%;\n height: 100%;\n object-fit: contain;\n}\n.ls-eventlist-item__username {\n min-width: 0;\n font-weight: 700;\n font-size: 0.875em;\n word-break: break-all;\n}\n.ls-eventlist-item__amount {\n flex-shrink: 0;\n padding: 0.05em 0.5em;\n border-radius: 1em;\n background-color: color-mix(in srgb, currentColor 16%, transparent);\n font-weight: 700;\n font-size: 0.75em;\n white-space: nowrap;\n}\n.ls-eventlist-item__body {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n column-gap: 0.75em;\n row-gap: 0.35em;\n min-width: 0;\n}\n.ls-eventlist-item__message {\n min-width: 0;\n word-break: break-all;\n}\n.ls-eventlist-item__usermessage {\n min-width: 0;\n font-style: italic;\n color: var(--white2, var(--neutralLight2, #cac9d5));\n word-break: break-all;\n}\n.ls-eventlist-item__time {\n flex-shrink: 0;\n color: var(--grey, var(--neutralLight3, #9392a1));\n font-size: 0.875em;\n white-space: nowrap;\n}\n.ls-eventlist-item__actions {\n display: flex;\n align-items: center;\n justify-content: flex-end;\n align-self: center;\n gap: 0.5em;\n flex-shrink: 0;\n}\n.ls-modqueue-item {\n display: flex;\n align-items: stretch;\n gap: 0.5rem;\n border-radius: 1rem;\n background-color: color-mix(in srgb, var(--secondary, #535395) 20%, transparent);\n padding: 0.5rem;\n}\n.ls-modqueue-item__preview {\n display: flex;\n height: 4rem;\n width: 4rem;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n overflow: hidden;\n border-radius: 1rem;\n background-color: var(--separator, #0a0821);\n color: var(--primary, #ff4076);\n font-size: 1.75rem;\n line-height: 1;\n}\n.ls-modqueue-item__preview > * {\n display: flex;\n max-height: 100%;\n max-width: 100%;\n align-items: center;\n justify-content: center;\n line-height: 1;\n}\n.ls-modqueue-item__preview img,\n.ls-modqueue-item__preview svg {\n max-height: 100%;\n max-width: 100%;\n object-fit: contain;\n}\n.ls-modqueue-item__body {\n display: flex;\n min-width: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.25rem;\n justify-content: flex-start;\n padding-top: 0.25rem;\n}\n.ls-modqueue-item__head {\n display: flex;\n align-items: center;\n gap: 0.375rem;\n flex-wrap: wrap;\n}\n.ls-modqueue-item__avatar {\n height: 1.5rem;\n width: 1.5rem;\n border-radius: 9999px;\n border: 1px solid var(--separator, #322c52);\n}\n.ls-modqueue-item__username {\n font-weight: 700;\n color: var(--white, var(--neutralLight1, #fff));\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n max-width: 12rem;\n}\n.ls-modqueue-item__command {\n display: inline-flex;\n align-items: center;\n border-radius: 1rem;\n background-color: var(--separator, #0a0821);\n padding: 0.05rem 0.5rem;\n font-size: 0.8125rem;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-modqueue-item__message {\n font-size: 0.875rem;\n font-style: italic;\n color: var(--white2, var(--neutralLight2, #cac9d5));\n word-break: break-all;\n}\n.ls-modqueue-item__actions {\n display: flex;\n flex-shrink: 0;\n align-items: flex-start;\n gap: 0.5rem;\n padding-top: 0.25rem;\n}\n.ls-modqueue-item .ls-modqueue-item__iconbtn {\n padding: 0;\n border-radius: 0.5rem;\n transition: opacity 300ms ease;\n}\n.ls-modqueue-item .ls-modqueue-item__iconbtn:hover {\n background-color: transparent;\n opacity: 0.7;\n}\n.ls-modqueue-item__action-icon {\n height: 1.5rem;\n width: 1.5rem;\n flex-shrink: 0;\n}\n.ls-modlog {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.5rem;\n overflow: hidden;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-modlog__toolbar {\n display: flex;\n justify-content: flex-end;\n}\n.ls-modlog__clear {\n display: inline-flex;\n align-items: center;\n gap: 0.375rem;\n border: 0;\n border-radius: 0.75rem;\n background: transparent;\n padding: 0.25rem 0.625rem;\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n cursor: pointer;\n transition: background-color 150ms ease, color 150ms ease;\n}\n.ls-modlog__clear:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 8%, transparent);\n color: var(--white, #fff);\n}\n.ls-modlog__empty {\n display: flex;\n height: 100%;\n flex: 1;\n align-items: center;\n justify-content: center;\n border-radius: 1rem;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-modlog__list {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.375rem;\n overflow: auto;\n}\n.ls-modlog__row {\n display: flex;\n flex-direction: column;\n gap: 0.25rem;\n border-radius: 0.625rem;\n border-left: 3px solid var(--ls-modlog-accent, var(--primary, #ff4076));\n padding: 0.5rem 0.625rem;\n font-size: 0.8125rem;\n background-color: var(--separator, var(--neutralDark2, #1b1834));\n background-image: linear-gradient(var(--ls-modlog-bar, transparent), var(--ls-modlog-bar, transparent));\n}\n.ls-modlog__head {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n}\n.ls-modlog__avatar {\n height: 1.25rem;\n width: 1.25rem;\n border-radius: 9999px;\n}\n.ls-modlog__title {\n display: inline-flex;\n align-items: center;\n border-radius: 0.375rem;\n padding: 0.05rem 0.4rem;\n font-size: 0.625rem;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: 0.04em;\n color: var(--ls-modlog-accent, var(--primary, #ff4076));\n background-color: color-mix(in srgb, var(--ls-modlog-accent, #ff4076) 18%, transparent);\n}\n.ls-modlog__time {\n margin-left: auto;\n flex-shrink: 0;\n color: var(--grey, var(--neutralLight3, #9392a1));\n font-size: 0.6875rem;\n font-variant-numeric: tabular-nums;\n}\n.ls-modlog__message {\n word-break: break-word;\n overflow-wrap: anywhere;\n line-height: 1.35;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-songreq {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.75rem;\n overflow: hidden;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-songreq--empty {\n align-items: center;\n justify-content: center;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__addbar {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.5rem;\n}\n.ls-songreq__addbar .ls-songreq__addinput {\n flex: 1;\n}\n.ls-songreq__empty {\n display: flex;\n flex: 1;\n align-items: center;\n justify-content: center;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__now {\n display: flex;\n align-items: center;\n gap: 0.75rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.75rem;\n background-color: var(--separator, var(--neutralDark2, #1b1834));\n}\n.ls-songreq__art {\n height: 3.5rem;\n width: 3.5rem;\n flex-shrink: 0;\n border-radius: 0.75rem;\n object-fit: cover;\n}\n.ls-songreq__nowbody {\n display: flex;\n min-width: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.1rem;\n}\n.ls-songreq__title {\n overflow: hidden;\n font-size: 0.875rem;\n font-weight: 700;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--white, #fff);\n}\n.ls-songreq__artist {\n overflow: hidden;\n font-size: 0.75rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__requester {\n overflow: hidden;\n font-size: 0.6875rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__progress {\n margin-top: 0.375rem;\n height: 0.375rem;\n width: 100%;\n overflow: hidden;\n border-radius: 9999px;\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n}\n.ls-songreq__progressbar {\n height: 100%;\n border-radius: 9999px;\n background-color: var(--success, #1db954);\n transition: width 1000ms linear;\n}\n.ls-songreq__controls {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.375rem;\n}\n.ls-songreq__btn {\n display: inline-flex;\n height: 2rem;\n width: 2rem;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n border-radius: 0.625rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background: transparent;\n font-size: 0.875rem;\n line-height: 1;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition: background-color 120ms ease, color 120ms ease;\n}\n.ls-songreq__btn:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n color: var(--white, #fff);\n}\n.ls-songreq__queue {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n}\n.ls-songreq__queuehead {\n margin-bottom: 0.25rem;\n padding: 0 0.25rem;\n font-size: 0.6875rem;\n font-weight: 700;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__queuelist {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.25rem;\n overflow: auto;\n}\n.ls-songreq__queueempty {\n padding: 0.5rem 0.25rem;\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__item {\n display: flex;\n align-items: center;\n gap: 0.5rem;\n border-radius: 0.75rem;\n padding: 0.375rem 0.5rem;\n transition: background-color 120ms ease;\n}\n.ls-songreq__item:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 4%, transparent);\n}\n.ls-songreq__itemart {\n height: 2.25rem;\n width: 2.25rem;\n flex-shrink: 0;\n border-radius: 0.5rem;\n object-fit: cover;\n}\n.ls-songreq__itembody {\n min-width: 0;\n flex: 1;\n}\n.ls-songreq__itemtitle {\n overflow: hidden;\n font-size: 0.875rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--white, #fff);\n}\n.ls-songreq__itemmeta {\n overflow: hidden;\n font-size: 0.75rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-songreq__remove {\n flex-shrink: 0;\n cursor: pointer;\n border: 0;\n background: transparent;\n font-size: 0.875rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition: color 120ms ease;\n}\n.ls-songreq__remove:hover {\n color: var(--error, #fd5454);\n}\n.ls-modqueue {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.5rem;\n overflow: hidden;\n}\n.ls-modqueue__search-icon {\n height: 1rem;\n width: 1rem;\n flex-shrink: 0;\n margin-right: 0.5rem;\n color: var(--white2, var(--neutralLight2, #cac9d5));\n}\n.ls-modqueue__empty {\n display: flex;\n height: 100%;\n flex: 1;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-modqueue__empty-icon {\n font-size: 1.875rem;\n}\n.ls-modqueue__bulk {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: flex-end;\n gap: 0.5rem;\n}\n.ls-modqueue .ls-modqueue__bulk-btn {\n display: inline-flex;\n align-items: center;\n gap: 0.25rem;\n cursor: pointer;\n border-radius: 0.5rem;\n border: 1px solid currentcolor;\n background: transparent;\n padding: 0.25rem 0.5rem;\n font-size: 0.75rem;\n font-weight: 600;\n transition: opacity 120ms ease;\n}\n.ls-modqueue .ls-modqueue__bulk-btn:hover {\n opacity: 0.7;\n}\n.ls-modqueue .ls-modqueue__bulk-btn--deny {\n color: var(--error, #fd5454);\n}\n.ls-modqueue .ls-modqueue__bulk-btn--approve {\n color: var(--success, #7ed187);\n}\n.ls-modqueue__bulk-icon {\n height: 1rem;\n width: 1rem;\n flex-shrink: 0;\n}\n.ls-modqueue__list {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.5rem;\n overflow: auto;\n}\n.ls-modqueue__readonly {\n font-size: 0.625rem;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-modqueue__search-slot {\n flex-shrink: 0;\n}\n.ls-chatbox {\n display: flex;\n height: 100%;\n flex-direction: column;\n overflow: hidden;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-chatbox__viewport {\n position: relative;\n flex: 1;\n min-height: 0;\n overflow: hidden;\n}\n.ls-chatbox__list {\n display: flex;\n height: 100%;\n flex-direction: column;\n overflow-y: auto;\n padding: 0.75rem;\n}\n.ls-chatbox__jump {\n position: absolute;\n bottom: 0.75rem;\n right: 0.75rem;\n display: flex;\n align-items: center;\n gap: 0.5rem;\n cursor: pointer;\n border-radius: 9999px;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background-color: color-mix(in srgb, var(--white, #fff) 5%, transparent);\n padding: 0.5rem 0.75rem;\n font-size: 0.75rem;\n color: color-mix(in srgb, var(--white, #fff) 80%, transparent);\n box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n backdrop-filter: blur(4px);\n transition: background-color 150ms ease, color 150ms ease;\n}\n.ls-chatbox__jump:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n color: var(--white, #fff);\n}\n.ls-chatbox__jump-arrow {\n height: 0.875rem;\n width: 0.875rem;\n}\n.ls-chatbox__jump-arrow--up {\n transform: rotate(180deg);\n}\n.ls-chatbox__jump-badge {\n margin-left: 0.25rem;\n border-radius: 9999px;\n background-color: var(--primary, #ff4076);\n padding: 0.125rem 0.5rem;\n font-size: 0.625rem;\n font-weight: 600;\n color: var(--alwayswhite, #fff);\n}\n.ls-chatbox__sendbar {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.5rem;\n padding: 0 0.75rem 0.75rem;\n}\n.ls-chatbox__sendbar .ls-chatbox__input {\n flex: 2 1 0%;\n min-width: 100px;\n width: 100%;\n}\n.ls-chatbox__sendbar .ls-chatbox__platform {\n flex: 1 1 0%;\n min-width: 7.5rem;\n height: 55px;\n}\n.ls-chatbox__sendbar .ls-chatbox__chatas {\n flex: 0 1 auto;\n min-width: 5.5rem;\n height: 55px;\n}\n.ls-chatbox__sendbar .ls-chatbox__send {\n height: 55px;\n flex-shrink: 0;\n}\n.ls-panel {\n --ls-panel-padding: 0.75rem;\n display: flex;\n flex-direction: column;\n border-radius: 1rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background-color: var(--ls-panel-bg, #1b1834);\n box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.55);\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-panel__clickaway {\n position: fixed;\n inset: 0;\n z-index: 20;\n}\n.ls-panel__header {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n padding: var(--ls-panel-padding) var(--ls-panel-padding) 0.5rem;\n}\n.ls-panel__title {\n min-width: 0;\n font-size: 1rem;\n font-weight: 700;\n color: var(--white, #fff);\n}\n.ls-panel__title--label {\n font-size: 0.75rem;\n text-transform: uppercase;\n letter-spacing: 0.05em;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-panel__header-actions {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-panel__close {\n display: flex;\n height: 1.5rem;\n width: 1.5rem;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n border: 0;\n border-radius: 0.5rem;\n background: transparent;\n font-size: 0.875rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition: background-color 150ms ease, color 150ms ease;\n}\n.ls-panel__close:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n color: var(--white, #fff);\n}\n.ls-panel__body {\n min-height: 0;\n flex: 1;\n overflow: auto;\n padding: 0 var(--ls-panel-padding) var(--ls-panel-padding);\n}\n.ls-panel--no-header .ls-panel__body {\n padding-top: var(--ls-panel-padding);\n}\n.ls-panel__footer {\n flex-shrink: 0;\n padding: 0.5rem var(--ls-panel-padding) var(--ls-panel-padding);\n}\n.ls-modal {\n position: fixed;\n inset: 0;\n z-index: 2000;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1rem;\n}\n.ls-modal--absolute {\n position: absolute;\n}\n.ls-modal__backdrop {\n position: absolute;\n inset: 0;\n background-color: color-mix(in srgb, var(--ls-modal-backdrop, var(--separator, #0a0821)) 75%, transparent);\n backdrop-filter: blur(4px);\n}\n.ls-modal__card {\n position: relative;\n width: 100%;\n max-width: var(--ls-modal-max-width, min(560px, 92vw));\n max-height: 85vh;\n}\n.ls-modal__card--fit {\n width: auto;\n}\n.ls-modal__card--center .ls-panel__body {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n}\n.ls-dialog {\n margin-top: 0.5rem;\n display: flex;\n height: 100%;\n width: 100%;\n align-items: center;\n justify-content: center;\n}\n.ls-dialog__card {\n position: relative;\n z-index: 10;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n overflow: hidden;\n border-radius: 1rem;\n outline: none;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-dialog__card--pad {\n padding: 1rem;\n}\n.ls-dialog__card--full {\n border-radius: 0;\n}\n.ls-dialog__top {\n display: flex;\n width: 100%;\n align-items: flex-start;\n justify-content: space-between;\n}\n.ls-dialog__top--full {\n margin-top: 2rem;\n}\n.ls-dialog__top-side {\n flex: 1;\n}\n.ls-dialog__title {\n font-size: 1.25rem;\n color: var(--white, #fff);\n}\n.ls-dialog__close {\n display: flex;\n flex: 1;\n justify-content: flex-end;\n user-select: none;\n font-weight: 700;\n color: var(--white, #fff);\n}\n.ls-dialog__close-btn {\n display: flex;\n cursor: pointer;\n align-items: center;\n gap: 0.5rem;\n}\n.ls-dialog__close-label {\n cursor: pointer;\n font-size: 1rem;\n font-weight: 700;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-dialog__body {\n display: flex;\n width: 100%;\n flex: 1;\n min-height: 0;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n overflow: auto;\n}\n.ls-dialog__bottom {\n display: flex;\n width: 100%;\n align-items: center;\n justify-content: center;\n gap: 1rem;\n padding-bottom: 1rem;\n}\n.ls-eventlist {\n display: flex;\n height: 100%;\n min-height: 0;\n flex-direction: column;\n overflow: hidden;\n color: var(--white, var(--neutralLight1, #fff));\n line-height: 1.35;\n}\n.ls-eventlist__list {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.5em;\n overflow-y: auto;\n}\n.ls-eventlist__row {\n flex-shrink: 0;\n animation: ls-eventlist-enter 250ms ease;\n}\n.ls-eventlist__empty {\n display: flex;\n height: 100%;\n flex: 1;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.75em;\n border-radius: 1em;\n padding: 1em;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-eventlist__empty-icon {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n font-size: 1.875em;\n}\n.ls-eventlist__empty-icon img,\n.ls-eventlist__empty-icon svg {\n width: 1.6em;\n height: 1.6em;\n}\n@keyframes ls-eventlist-enter {\n from {\n opacity: 0;\n transform: translateX(-1.5em);\n }\n to {\n opacity: 1;\n transform: translateX(0);\n }\n}\n.ls-streamstatus {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.75rem;\n overflow: auto;\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-streamstatus--empty {\n align-items: center;\n justify-content: center;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__status {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.75rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.625rem 0.75rem;\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-streamstatus__indicator {\n position: relative;\n display: inline-flex;\n height: 0.75rem;\n width: 0.75rem;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n}\n.ls-streamstatus__indicator-ping {\n position: absolute;\n height: 100%;\n width: 100%;\n border-radius: 9999px;\n background-color: color-mix(in srgb, var(--success, #7ed187) 60%, transparent);\n animation: ls-streamstatus-ping 1.2s cubic-bezier(0, 0, 0.2, 1) infinite;\n}\n@keyframes ls-streamstatus-ping {\n 75%, 100% {\n transform: scale(2);\n opacity: 0;\n }\n}\n.ls-streamstatus__indicator-dot {\n position: relative;\n height: 0.75rem;\n width: 0.75rem;\n border-radius: 9999px;\n background-color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__indicator-dot--online {\n background-color: var(--success, #7ed187);\n}\n.ls-streamstatus__status-body {\n display: flex;\n min-width: 0;\n flex-direction: column;\n}\n.ls-streamstatus__status-label {\n overflow: hidden;\n font-size: 0.875rem;\n font-weight: 700;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--white, #fff);\n}\n.ls-streamstatus__status-sublabel {\n overflow: hidden;\n font-size: 0.75rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__overview {\n display: flex;\n flex-shrink: 0;\n align-items: stretch;\n gap: 0.5rem;\n}\n.ls-streamstatus__total {\n display: flex;\n flex-shrink: 0;\n flex-direction: column;\n justify-content: center;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.5rem 0.75rem;\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-streamstatus__total-value {\n font-size: 1.875rem;\n font-weight: 700;\n line-height: 1;\n color: var(--primary, #ff4076);\n}\n.ls-streamstatus__total-label {\n margin-top: 0.25rem;\n font-size: 0.6875rem;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__platforms {\n display: flex;\n min-width: 0;\n flex: 1;\n flex-direction: column;\n justify-content: center;\n gap: 0.25rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.5rem 0.75rem;\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-streamstatus__platforms-empty {\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__platform {\n display: flex;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n}\n.ls-streamstatus__platform-info {\n display: inline-flex;\n min-width: 0;\n align-items: center;\n gap: 0.375rem;\n font-size: 0.75rem;\n color: color-mix(in srgb, var(--white, #fff) 80%, transparent);\n}\n.ls-streamstatus__platform-icon {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n}\n.ls-streamstatus__platform-icon img,\n.ls-streamstatus__platform-icon svg {\n height: 0.875rem;\n width: 0.875rem;\n}\n.ls-streamstatus__platform-dot {\n height: 0.5rem;\n width: 0.5rem;\n flex-shrink: 0;\n border-radius: 9999px;\n background-color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__platform-label {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n.ls-streamstatus__platform-value {\n flex-shrink: 0;\n font-size: 0.75rem;\n font-weight: 600;\n font-variant-numeric: tabular-nums;\n color: var(--white, #fff);\n}\n.ls-streamstatus__stats {\n display: grid;\n flex-shrink: 0;\n grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr));\n gap: 0.5rem;\n}\n.ls-streamstatus__stat {\n display: flex;\n min-width: 0;\n flex-direction: column;\n gap: 0.125rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 5%, transparent);\n border-radius: 1rem;\n padding: 0.5rem 0.75rem;\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-streamstatus__stat-head {\n display: flex;\n align-items: center;\n gap: 0.375rem;\n}\n.ls-streamstatus__stat-icon {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n}\n.ls-streamstatus__stat-icon img,\n.ls-streamstatus__stat-icon svg {\n height: 1rem;\n width: 1rem;\n}\n.ls-streamstatus__stat-actions {\n display: inline-flex;\n margin-left: auto;\n flex-shrink: 0;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-streamstatus__stat-value {\n overflow: hidden;\n font-size: 1.125rem;\n font-weight: 700;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: var(--white, #fff);\n}\n.ls-streamstatus__stat-trendrow {\n display: flex;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-streamstatus__stat-trendrow svg {\n width: 10px;\n flex-shrink: 0;\n}\n.ls-streamstatus__stat-label {\n min-width: 0;\n overflow: hidden;\n font-size: 0.6875rem;\n letter-spacing: 0.05em;\n text-overflow: ellipsis;\n text-transform: uppercase;\n white-space: nowrap;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-streamstatus__stat-sub {\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist {\n display: flex;\n height: 100%;\n flex-direction: column;\n gap: 0.5rem;\n overflow: hidden;\n}\n.ls-viewerslist__head {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: space-between;\n gap: 0.5rem;\n}\n.ls-viewerslist__count {\n flex-shrink: 0;\n font-size: 0.875rem;\n font-weight: 700;\n color: var(--white, #fff);\n}\n.ls-viewerslist__search {\n min-width: 0;\n flex: 1;\n border-radius: 0.75rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background-color: color-mix(in srgb, var(--black, #000) 20%, transparent);\n padding: 0.375rem 0.75rem;\n font-size: 0.8125rem;\n color: var(--white, #fff);\n outline: none;\n}\n.ls-viewerslist__search:focus {\n border-color: var(--primary, #ff4076);\n}\n.ls-viewerslist__search::placeholder {\n color: color-mix(in srgb, var(--grey, var(--neutralLight3, #9392a1)) 60%, transparent);\n}\n.ls-viewerslist__search-slot {\n min-width: 0;\n flex: 1;\n}\n.ls-viewerslist__hint {\n flex-shrink: 0;\n font-size: 0.75rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist__empty {\n display: flex;\n height: 100%;\n flex: 1;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.5rem;\n text-align: center;\n color: var(--white2, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist__empty-icon {\n font-size: 1.875rem;\n}\n.ls-viewerslist__list {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n gap: 0.125rem;\n overflow: auto;\n}\n.ls-viewerslist__group {\n margin-top: 0.375rem;\n flex-shrink: 0;\n padding: 0 0.25rem;\n font-size: 0.6875rem;\n font-weight: 700;\n letter-spacing: 0.05em;\n text-transform: uppercase;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist__group:first-child {\n margin-top: 0;\n}\n.ls-viewerslist__viewer {\n display: flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.5rem;\n border-radius: 0.5rem;\n padding: 0.25rem 0.375rem;\n transition: background-color 120ms ease;\n}\n.ls-viewerslist__viewer:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 4%, transparent);\n}\n.ls-viewerslist__avatar {\n height: 1.5rem;\n width: 1.5rem;\n flex-shrink: 0;\n border-radius: 9999px;\n object-fit: cover;\n}\n.ls-viewerslist__platform {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n justify-content: center;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-viewerslist__platform img,\n.ls-viewerslist__platform svg {\n height: 0.875rem;\n width: 0.875rem;\n}\n.ls-viewerslist__username {\n min-width: 0;\n flex: 1;\n overflow: hidden;\n font-size: 0.875rem;\n text-overflow: ellipsis;\n white-space: nowrap;\n color: color-mix(in srgb, var(--white, #fff) 90%, transparent);\n}\n.ls-viewerslist__badges {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-viewerslist__actions {\n display: inline-flex;\n flex-shrink: 0;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-shortcutdock,\n.ls-shortcutdock * {\n box-sizing: border-box;\n}\n.ls-shortcutdock {\n display: grid;\n width: 100%;\n align-content: start;\n gap: 0.5rem;\n overflow: auto;\n}\n.ls-shortcutdock--disabled {\n opacity: 0.55;\n}\n.ls-shortcutdock__empty {\n grid-column: 1 / -1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 1rem;\n text-align: center;\n font-size: 0.875rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-shortcutdock__cell {\n position: relative;\n min-width: 0;\n}\n.ls-shortcutdock__btn {\n display: flex;\n height: 100%;\n width: 100%;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n gap: 0.25rem;\n cursor: pointer;\n border-radius: 0.75rem;\n border: 1px solid color-mix(in srgb, var(--white, #fff) 12%, transparent);\n background-color: transparent;\n padding: 0.25rem;\n font: inherit;\n color: var(--white, #fff);\n box-shadow: inset 0 -2px 0 var(--ls-shortcutdock-accent-soft, transparent) !important;\n transition:\n background-color 150ms ease,\n border-color 150ms ease,\n opacity 150ms ease;\n}\n.ls-shortcutdock__btn:hover {\n border-color: color-mix(in srgb, var(--white, #fff) 20%, transparent);\n background-color: color-mix(in srgb, var(--white, #fff) 7%, transparent);\n}\n.ls-shortcutdock__btn--selected,\n.ls-shortcutdock__btn--selected:hover {\n border-color: var(--primary, #ff4076);\n}\n.ls-shortcutdock__btn:disabled {\n cursor: not-allowed;\n opacity: 0.5;\n}\n.ls-shortcutdock--readonly .ls-shortcutdock__btn {\n cursor: default;\n}\n.ls-shortcutdock--readonly .ls-shortcutdock__btn:hover {\n border-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n background-color: color-mix(in srgb, var(--white, #fff) 3%, transparent);\n}\n.ls-shortcutdock__icon {\n display: flex;\n align-items: center;\n justify-content: center;\n font-size: 1.15rem;\n line-height: 1;\n}\n.ls-shortcutdock__btn--lg .ls-shortcutdock__icon {\n font-size: 1.5rem;\n}\n.ls-shortcutdock__btn-image {\n width: 1.5rem;\n height: 1.5rem;\n flex-shrink: 0;\n border-radius: 0.375rem;\n object-fit: cover;\n}\n.ls-shortcutdock__btn--lg .ls-shortcutdock__btn-image {\n width: 2rem;\n height: 2rem;\n}\n.ls-shortcutdock__btn--icon-only .ls-shortcutdock__btn-image {\n width: 60%;\n height: 60%;\n border-radius: 0.5rem;\n}\n.ls-shortcutdock__label {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 2;\n overflow: hidden;\n padding-inline: 0.125rem;\n text-align: center;\n font-size: 0.625rem;\n font-weight: 600;\n line-height: 1.2;\n color: color-mix(in srgb, var(--white, #fff) 90%, transparent);\n}\n.ls-shortcutdock__btn--icon-only {\n font-size: clamp(1rem, 1.4vw, 1.5rem);\n font-weight: 700;\n}\n.ls-shortcutdock__btn--icon-only .ls-shortcutdock__icon {\n width: 100%;\n height: 100%;\n font-size: inherit;\n}\n.ls-shortcutdock__btn--icon-only .ls-shortcutdock__icon svg {\n width: 60%;\n height: 60%;\n}\n.ls-shortcutdock__remove {\n position: absolute;\n top: -0.375rem;\n right: -0.375rem;\n z-index: 1;\n display: flex;\n height: 1.25rem;\n width: 1.25rem;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border: none;\n border-radius: 9999px;\n background-color: var(--error, #fd5454);\n padding: 0;\n font: inherit;\n font-size: 0.75rem;\n line-height: 1;\n color: var(--white, #fff);\n box-shadow: 0 1px 3px color-mix(in srgb, var(--black, #000) 30%, transparent);\n transition: opacity 120ms ease;\n}\n.ls-shortcutdock__remove:hover {\n opacity: 0.8;\n}\n.ls-shortcutdock__add {\n display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n border-radius: 0.75rem;\n border: 1px dashed color-mix(in srgb, var(--white, #fff) 20%, transparent);\n background: transparent;\n padding: 0.25rem;\n font: inherit;\n font-size: 1.5rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n transition: border-color 150ms ease, color 150ms ease;\n}\n.ls-shortcutdock__add:hover {\n border-color: color-mix(in srgb, var(--white, #fff) 40%, transparent);\n color: var(--white, #fff);\n}\n.ls-goals,\n.ls-goals * {\n box-sizing: border-box;\n}\n.ls-goals {\n display: flex;\n width: 100%;\n flex-direction: column;\n gap: 1rem;\n}\n.ls-goals__empty {\n font-size: 0.875rem;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-goals__head {\n display: flex;\n align-items: baseline;\n gap: 0.375rem;\n font-size: 0.875rem;\n}\n.ls-goals__icon {\n display: flex;\n align-self: center;\n align-items: center;\n line-height: 1;\n}\n.ls-goals__label {\n flex: 1;\n min-width: 0;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n font-weight: 600;\n color: var(--white, #fff);\n}\n.ls-goals__value {\n flex-shrink: 0;\n color: var(--grey, var(--neutralLight3, #9392a1));\n}\n.ls-goals__target {\n opacity: 0.6;\n}\n.ls-goals__bar {\n margin-top: 0.375rem;\n height: 0.625rem;\n width: 100%;\n overflow: hidden;\n border-radius: 9999px;\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n}\n.ls-goals__fill {\n height: 100%;\n border-radius: 9999px;\n background-image:\n linear-gradient(\n 90deg,\n color-mix(in srgb, var(--ls-goals-accent, var(--primary, #ff4076)) 80%, transparent),\n var(--ls-goals-accent, var(--primary, #ff4076)));\n transition: width 700ms ease-out;\n}\n.ls-goals__percent {\n flex-shrink: 0;\n min-width: 2.75rem;\n text-align: right;\n font-weight: 700;\n font-variant-numeric: tabular-nums;\n color: var(--ls-goals-accent, var(--primary, #ff4076));\n}\n.ls-platform-icon {\n display: inline-block;\n height: 1.15em;\n width: auto;\n max-width: 1.5em;\n vertical-align: middle;\n object-fit: contain;\n}\n.ls-chatbox__platform-option {\n display: inline-flex;\n align-items: center;\n gap: 0.5rem;\n min-width: 0;\n}\n.ls-shortcutdock__btn--colored {\n border-color: color-mix(in srgb, var(--ls-shortcutdock-accent, var(--white, #fff)) 70%, transparent);\n box-shadow: inset 0 -2px 0 var(--ls-shortcutdock-accent-soft, transparent);\n}\n.ls-shortcutdock__btn--colored:hover {\n border-color: var(--ls-shortcutdock-accent, var(--white, #fff));\n background-color: color-mix(in srgb, var(--ls-shortcutdock-accent, var(--white, #fff)) 12%, transparent);\n}\n.ls-widget {\n position: relative;\n display: flex;\n height: 100%;\n flex-direction: column;\n overflow: hidden;\n border-radius: var(--radius, 1rem);\n border: 1px solid color-mix(in srgb, var(--cardborder, #393853) 50%, transparent);\n background-image: var(--gradientBg, linear-gradient(180deg, #1b1834 0%, #151230 100%));\n background-color: var(--background, #151230);\n color: var(--white, var(--neutralLight1, #fff));\n}\n.ls-widget__header {\n position: relative;\n display: flex;\n min-height: 2.75rem;\n width: 100%;\n flex-shrink: 0;\n align-items: center;\n gap: 0.5rem;\n border-bottom: 1px solid color-mix(in srgb, var(--white, #fff) 10%, transparent);\n padding-inline: 0.5rem;\n}\n.ls-widget__side {\n display: flex;\n z-index: 10;\n align-items: center;\n gap: 0.25rem;\n}\n.ls-widget__side--right {\n margin-left: auto;\n}\n.ls-widget__title {\n position: absolute;\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n pointer-events: none;\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n font-size: 0.875rem;\n font-weight: 600;\n letter-spacing: 0.025em;\n white-space: nowrap;\n}\n.ls-widget__btn {\n display: flex;\n height: 2rem;\n width: 2rem;\n flex-shrink: 0;\n cursor: pointer;\n align-items: center;\n justify-content: center;\n border: 0;\n border-radius: 0.375rem;\n background-color: color-mix(in srgb, var(--white, #fff) 5%, transparent);\n color: color-mix(in srgb, var(--white, #fff) 70%, transparent);\n font: inherit;\n transition: background-color 150ms ease, color 150ms ease;\n}\n.ls-widget__btn:hover {\n background-color: color-mix(in srgb, var(--white, #fff) 10%, transparent);\n color: var(--white, #fff);\n}\n.ls-widget__btn--active {\n background-color: color-mix(in srgb, var(--primary, #ff4076) 20%, transparent);\n color: var(--primary, #ff4076);\n}\n.ls-widget__btn--active:hover {\n background-color: color-mix(in srgb, var(--primary, #ff4076) 30%, transparent);\n color: var(--primary, #ff4076);\n}\n.ls-widget__btn svg {\n height: 1rem;\n width: 1rem;\n}\n.ls-widget__body {\n display: flex;\n min-height: 0;\n flex: 1;\n flex-direction: column;\n overflow: auto;\n}\n");
25
25
 
26
26
  // src/components/LSButton/LSButton.tsx
27
27
  import Button from "@mui/material/Button";
@@ -224,7 +224,7 @@ import InputLabel from "@mui/material/InputLabel";
224
224
  import OutlinedInput from "@mui/material/OutlinedInput";
225
225
  import Tooltip from "@mui/material/Tooltip";
226
226
  import { forwardRef as forwardRef2, useCallback, useEffect, useMemo, useState } from "react";
227
- import { jsx as jsx4, jsxs } from "react/jsx-runtime";
227
+ import { Fragment, jsx as jsx4, jsxs } from "react/jsx-runtime";
228
228
  var normalizeSliderValue = (rawValue) => {
229
229
  if (typeof rawValue === "number") {
230
230
  return Number.isFinite(rawValue) ? rawValue : 0;
@@ -247,6 +247,16 @@ var getDecimalPlaces = (stepValue) => {
247
247
  const decimalIndex = stepString.indexOf(".");
248
248
  return decimalIndex === -1 ? 0 : stepString.length - decimalIndex - 1;
249
249
  };
250
+ var formatUnitAdornment = (adornment) => {
251
+ if (typeof adornment !== "string") {
252
+ return adornment;
253
+ }
254
+ const trimmedAdornment = adornment.trim();
255
+ if (!trimmedAdornment) {
256
+ return "";
257
+ }
258
+ return `${trimmedAdornment.charAt(0).toUpperCase()}${trimmedAdornment.slice(1)}`;
259
+ };
250
260
  var InfoIcon = () => /* @__PURE__ */ jsx4("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsx4(
251
261
  "path",
252
262
  {
@@ -299,7 +309,8 @@ var LSSliderInput = forwardRef2(
299
309
  ...rest
300
310
  }, ref) => {
301
311
  const isValueFloat = Boolean(isFloat || isFloatMiliseconds || isMiliseconds);
302
- const rangeUnit = typeof (endAdornment ?? inputAfterText) === "string" && String(endAdornment ?? inputAfterText).trim().length ? ` ${endAdornment ?? inputAfterText}` : "";
312
+ const adornment = formatUnitAdornment(endAdornment ?? inputAfterText);
313
+ const rangeUnit = typeof adornment === "string" && adornment.trim().length ? ` ${adornment}` : "";
303
314
  const actualSliderMin = sliderMin ?? min;
304
315
  const actualSliderMax = sliderMax ?? max;
305
316
  const actualToDisplay = useCallback(
@@ -329,6 +340,17 @@ var LSSliderInput = forwardRef2(
329
340
  const displayMinimum = useMemo(() => actualToDisplay(min), [actualToDisplay, min]);
330
341
  const inputStep = allowAnyDecimal ? "any" : displayStep;
331
342
  const sliderColor = color === "secondary" ? "secondary" : "primary";
343
+ const defaultValueLabelFormat = useCallback(
344
+ (sliderValue) => {
345
+ const formattedValue = isFloatMiliseconds ? actualToDisplay(sliderValue) : sliderValue;
346
+ return adornment ? /* @__PURE__ */ jsxs(Fragment, { children: [
347
+ formattedValue,
348
+ " ",
349
+ adornment
350
+ ] }) : formattedValue;
351
+ },
352
+ [actualToDisplay, adornment, isFloatMiliseconds]
353
+ );
332
354
  useEffect(() => {
333
355
  if (value !== void 0) {
334
356
  const normalizedValue = normalizeSliderValue(value);
@@ -462,7 +484,7 @@ var LSSliderInput = forwardRef2(
462
484
  min: actualSliderMin,
463
485
  max: actualSliderMax,
464
486
  valueLabelDisplay,
465
- valueLabelFormat: (sliderValue) => valueLabelFormat?.(sliderValue) ?? `${sliderValue}${endAdornment ?? inputAfterText ?? ""}`,
487
+ valueLabelFormat: valueLabelFormat ?? defaultValueLabelFormat,
466
488
  onChange: handleSliderChanging,
467
489
  onChangeCommitted: handleSliderChanged,
468
490
  sx: resolvedSliderSx
@@ -494,7 +516,7 @@ var LSSliderInput = forwardRef2(
494
516
  }
495
517
  }
496
518
  ),
497
- !hideInput && (endAdornment ?? inputAfterText) && /* @__PURE__ */ jsx4("div", { className: "mui-ls-slider-input-adornment", children: endAdornment ?? inputAfterText })
519
+ !hideInput && adornment && /* @__PURE__ */ jsx4("div", { className: "mui-ls-slider-input-adornment", children: adornment })
498
520
  ] });
499
521
  return /* @__PURE__ */ jsxs(FormControl2, { variant: "outlined", className: "mui-ls-slider-input-root", fullWidth: true, error: Boolean(rangeError), children: [
500
522
  label && /* @__PURE__ */ jsxs(InputLabel, { shrink: true, id: labelId, htmlFor: sliderInputId, children: [
@@ -668,7 +690,7 @@ import FormControlLabel from "@mui/material/FormControlLabel";
668
690
  import { forwardRef as forwardRef5 } from "react";
669
691
  import { useController, useFormContext } from "react-hook-form";
670
692
  import classNames3 from "classnames";
671
- import { Fragment, jsx as jsx7 } from "react/jsx-runtime";
693
+ import { Fragment as Fragment2, jsx as jsx7 } from "react/jsx-runtime";
672
694
  var LSCheckbox = forwardRef5(({ className = "", checked, inputRef, slotProps, ...props }, ref) => {
673
695
  const CheckboxComponent = Checkbox;
674
696
  return /* @__PURE__ */ jsx7(
@@ -700,7 +722,7 @@ function LSCheckboxField({
700
722
  }) {
701
723
  const formContext = useFormContext();
702
724
  const resolvedControl = control ?? formContext?.control;
703
- if (!resolvedControl) return /* @__PURE__ */ jsx7(Fragment, {});
725
+ if (!resolvedControl) return /* @__PURE__ */ jsx7(Fragment2, {});
704
726
  return /* @__PURE__ */ jsx7(
705
727
  LSCheckboxFieldInner,
706
728
  {
@@ -1257,7 +1279,7 @@ import Search from "@mui/icons-material/Search";
1257
1279
  import KeyboardArrowDown2 from "@mui/icons-material/KeyboardArrowDown";
1258
1280
  import Tooltip3 from "@mui/material/Tooltip";
1259
1281
  import {
1260
- Fragment as Fragment4,
1282
+ Fragment as Fragment5,
1261
1283
  createContext,
1262
1284
  forwardRef as forwardRef8,
1263
1285
  useCallback as useCallback2,
@@ -1270,7 +1292,7 @@ import {
1270
1292
 
1271
1293
  // src/components/LSVariableInputField/VariableHighlightOverlay.tsx
1272
1294
  import {
1273
- Fragment as Fragment2,
1295
+ Fragment as Fragment3,
1274
1296
  useEffect as useEffect4,
1275
1297
  useLayoutEffect,
1276
1298
  useMemo as useMemo3,
@@ -1278,7 +1300,7 @@ import {
1278
1300
  useState as useState4
1279
1301
  } from "react";
1280
1302
  import { createPortal } from "react-dom";
1281
- import { Fragment as Fragment3, jsx as jsx14, jsxs as jsxs5 } from "react/jsx-runtime";
1303
+ import { Fragment as Fragment4, jsx as jsx14, jsxs as jsxs5 } from "react/jsx-runtime";
1282
1304
  var TOKEN_START = "{{";
1283
1305
  var TOKEN_END = "}}";
1284
1306
  var COPIED_STYLE_PROPS = [
@@ -1367,7 +1389,7 @@ var renderSegment = (segment, key) => segment.token ? /* @__PURE__ */ jsx14(
1367
1389
  {
1368
1390
  "data-desc": segment.desc || void 0,
1369
1391
  className: `ls-variable-highlight__token ${tokenClass(segment.type ?? "custom")}`,
1370
- children: segment.children ? /* @__PURE__ */ jsxs5(Fragment3, { children: [
1392
+ children: segment.children ? /* @__PURE__ */ jsxs5(Fragment4, { children: [
1371
1393
  TOKEN_START,
1372
1394
  segment.children.map(
1373
1395
  (child, index) => renderSegment(child, `${key}-${index}`)
@@ -1376,7 +1398,7 @@ var renderSegment = (segment, key) => segment.token ? /* @__PURE__ */ jsx14(
1376
1398
  ] }) : segment.text
1377
1399
  },
1378
1400
  key
1379
- ) : /* @__PURE__ */ jsx14(Fragment2, { children: segment.text }, key);
1401
+ ) : /* @__PURE__ */ jsx14(Fragment3, { children: segment.text }, key);
1380
1402
  var VariableHighlightOverlay = ({
1381
1403
  inputEl,
1382
1404
  value,
@@ -1498,7 +1520,7 @@ var VariableHighlightOverlay = ({
1498
1520
  if (!inputEl?.parentElement || !hasTokens) {
1499
1521
  return null;
1500
1522
  }
1501
- return /* @__PURE__ */ jsxs5(Fragment3, { children: [
1523
+ return /* @__PURE__ */ jsxs5(Fragment4, { children: [
1502
1524
  createPortal(
1503
1525
  /* @__PURE__ */ jsx14("div", { ref: layerRef, "aria-hidden": true, className: "ls-variable-highlight__layer", children: segments.map((segment, index) => renderSegment(segment, String(index))) }),
1504
1526
  inputEl.parentElement
@@ -1518,7 +1540,7 @@ var VariableHighlightOverlay = ({
1518
1540
  };
1519
1541
 
1520
1542
  // src/components/LSVariableInputField/LSVariableInputField.tsx
1521
- import { Fragment as Fragment5, jsx as jsx15, jsxs as jsxs6 } from "react/jsx-runtime";
1543
+ import { Fragment as Fragment6, jsx as jsx15, jsxs as jsxs6 } from "react/jsx-runtime";
1522
1544
  import { createElement } from "react";
1523
1545
  var LSVariableInputContext = createContext({});
1524
1546
  var LSVariableInputProvider = ({
@@ -2370,7 +2392,7 @@ value: "${valueDisplay}"`;
2370
2392
  const fullToken = `${rootToken}.${node.relativePath}`;
2371
2393
  const expanded = node.isExpandable && isPathExpanded(fullToken);
2372
2394
  const { displayValue, fullValue } = getVariableValuePreview(node.value);
2373
- return /* @__PURE__ */ jsxs6(Fragment4, { children: [
2395
+ return /* @__PURE__ */ jsxs6(Fragment5, { children: [
2374
2396
  /* @__PURE__ */ jsxs6(
2375
2397
  "div",
2376
2398
  {
@@ -2405,7 +2427,7 @@ value: "${valueDisplay}"`;
2405
2427
  expanded && renderValueChildRows(rootToken, node.children)
2406
2428
  ] }, fullToken);
2407
2429
  });
2408
- const renderExampleChildRows = (variable, examples) => /* @__PURE__ */ jsxs6(Fragment5, { children: [
2430
+ const renderExampleChildRows = (variable, examples) => /* @__PURE__ */ jsxs6(Fragment6, { children: [
2409
2431
  /* @__PURE__ */ jsx15("div", { className: "ls-variable-picker__row ls-variable-picker__row--child ls-variable-picker__example-description", children: getSystemVariableDescription(variable) }),
2410
2432
  examples.map((example) => /* @__PURE__ */ jsxs6(
2411
2433
  "div",
@@ -2535,7 +2557,7 @@ value: "${valueDisplay}"`;
2535
2557
  const expanded = expandable && isPathExpanded(definition.name);
2536
2558
  const isLast = idx === filteredAllowedVariables.length - 1;
2537
2559
  const rowCls = `ls-variable-picker__row${isLast && !expanded ? " ls-variable-picker__row--no-border" : ""}`;
2538
- return /* @__PURE__ */ jsxs6(Fragment4, { children: [
2560
+ return /* @__PURE__ */ jsxs6(Fragment5, { children: [
2539
2561
  /* @__PURE__ */ jsxs6(
2540
2562
  "div",
2541
2563
  {
@@ -2576,7 +2598,7 @@ value: "${valueDisplay}"`;
2576
2598
  const tree = systemVariableValueTrees.get(variable.name);
2577
2599
  const expandable = examples.length > 0 || !!tree && tree.length > 0;
2578
2600
  const expanded = expandable && isPathExpanded(rootToken);
2579
- return /* @__PURE__ */ jsxs6(Fragment4, { children: [
2601
+ return /* @__PURE__ */ jsxs6(Fragment5, { children: [
2580
2602
  /* @__PURE__ */ jsxs6(
2581
2603
  "div",
2582
2604
  {
@@ -2626,7 +2648,7 @@ value: "${valueDisplay}"`;
2626
2648
  ref: mergedInputRef
2627
2649
  }
2628
2650
  );
2629
- return /* @__PURE__ */ jsxs6(Fragment5, { children: [
2651
+ return /* @__PURE__ */ jsxs6(Fragment6, { children: [
2630
2652
  /* @__PURE__ */ jsx15(
2631
2653
  Popover,
2632
2654
  {
@@ -2819,7 +2841,7 @@ var VariableInputTextField = forwardRef8(
2819
2841
  ...inputPropsSlotInput,
2820
2842
  ...paramsSlotInput,
2821
2843
  startAdornment,
2822
- endAdornment: /* @__PURE__ */ jsxs6(Fragment5, { children: [
2844
+ endAdornment: /* @__PURE__ */ jsxs6(Fragment6, { children: [
2823
2845
  endAdornment ?? null,
2824
2846
  showVariableIcon ? /* @__PURE__ */ jsx15(Tooltip3, { title: t("chatbot.allowed-variables", "Allowed Variables"), children: /* @__PURE__ */ jsx15(
2825
2847
  InputAdornment2,
@@ -3584,7 +3606,7 @@ import classNames10 from "classnames";
3584
3606
 
3585
3607
  // src/components/ModalChrome/PanelChrome.tsx
3586
3608
  import classNames9 from "classnames";
3587
- import { Fragment as Fragment6, jsx as jsx21, jsxs as jsxs11 } from "react/jsx-runtime";
3609
+ import { Fragment as Fragment7, jsx as jsx21, jsxs as jsxs11 } from "react/jsx-runtime";
3588
3610
  function PanelChrome({
3589
3611
  title,
3590
3612
  titleVariant = "heading",
@@ -3613,7 +3635,7 @@ function PanelChrome({
3613
3635
  footer ? /* @__PURE__ */ jsx21("div", { className: "ls-panel__footer", children: footer }) : null
3614
3636
  ] });
3615
3637
  if (onClickAway) {
3616
- return /* @__PURE__ */ jsxs11(Fragment6, { children: [
3638
+ return /* @__PURE__ */ jsxs11(Fragment7, { children: [
3617
3639
  /* @__PURE__ */ jsx21("div", { className: "ls-panel__clickaway", onClick: onClickAway }),
3618
3640
  panel
3619
3641
  ] });
@@ -3895,7 +3917,7 @@ EventList.displayName = "EventList";
3895
3917
  // src/components/StreamStatusPanel/StreamStatusPanel.tsx
3896
3918
  import Tooltip5 from "@mui/material/Tooltip";
3897
3919
  import classNames14 from "classnames";
3898
- import { Fragment as Fragment7, jsx as jsx27, jsxs as jsxs16 } from "react/jsx-runtime";
3920
+ import { Fragment as Fragment8, jsx as jsx27, jsxs as jsxs16 } from "react/jsx-runtime";
3899
3921
  var LS_INFO_TOOLTIP_SX = {
3900
3922
  backgroundColor: "#1b1834",
3901
3923
  border: "1px solid #393853",
@@ -3939,7 +3961,7 @@ function StreamStatusPanel({
3939
3961
  }
3940
3962
  return /* @__PURE__ */ jsxs16("div", { className: classNames14("ls-streamstatus", className), id, children: [
3941
3963
  hasStatus ? infoTooltip(
3942
- /* @__PURE__ */ jsx27("div", { className: "ls-streamstatus__status", style: statusTooltip != null ? { cursor: "help" } : void 0, children: statusSlot ?? /* @__PURE__ */ jsxs16(Fragment7, { children: [
3964
+ /* @__PURE__ */ jsx27("div", { className: "ls-streamstatus__status", style: statusTooltip != null ? { cursor: "help" } : void 0, children: statusSlot ?? /* @__PURE__ */ jsxs16(Fragment8, { children: [
3943
3965
  /* @__PURE__ */ jsxs16("span", { className: "ls-streamstatus__indicator", children: [
3944
3966
  online ? /* @__PURE__ */ jsx27("span", { className: "ls-streamstatus__indicator-ping" }) : null,
3945
3967
  /* @__PURE__ */ jsx27("span", { className: classNames14("ls-streamstatus__indicator-dot", { "ls-streamstatus__indicator-dot--online": online }) })
@@ -4087,7 +4109,7 @@ ViewersList.displayName = "ViewersList";
4087
4109
 
4088
4110
  // src/components/ShortcutDockGrid/ShortcutDockGrid.tsx
4089
4111
  import classNames16 from "classnames";
4090
- import { Fragment as Fragment9, jsx as jsx29, jsxs as jsxs18 } from "react/jsx-runtime";
4112
+ import { Fragment as Fragment10, jsx as jsx29, jsxs as jsxs18 } from "react/jsx-runtime";
4091
4113
  var softAccent = (color) => /^#[0-9a-fA-F]{6}$/.test(color) ? `${color}66` : color;
4092
4114
  function ShortcutDockGrid({
4093
4115
  buttons,
@@ -4151,7 +4173,7 @@ function ShortcutDockGrid({
4151
4173
  onTrigger?.(button.id);
4152
4174
  }
4153
4175
  },
4154
- children: button.content ?? /* @__PURE__ */ jsxs18(Fragment9, { children: [
4176
+ children: button.content ?? /* @__PURE__ */ jsxs18(Fragment10, { children: [
4155
4177
  button.image ? /* @__PURE__ */ jsx29("img", { className: "ls-shortcutdock__btn-image", src: button.image, alt: "" }) : button.icon != null ? /* @__PURE__ */ jsx29("span", { className: "ls-shortcutdock__icon", children: button.icon }) : null,
4156
4178
  button.label != null ? /* @__PURE__ */ jsx29("span", { className: "ls-shortcutdock__label", children: button.label }) : null
4157
4179
  ] })
@@ -4182,7 +4204,7 @@ ShortcutDockGrid.displayName = "ShortcutDockGrid";
4182
4204
  // src/components/GoalsList/GoalsList.tsx
4183
4205
  import Tooltip6 from "@mui/material/Tooltip";
4184
4206
  import classNames17 from "classnames";
4185
- import { Fragment as Fragment10, jsx as jsx30, jsxs as jsxs19 } from "react/jsx-runtime";
4207
+ import { Fragment as Fragment11, jsx as jsx30, jsxs as jsxs19 } from "react/jsx-runtime";
4186
4208
  var GOAL_TOOLTIP_SX = {
4187
4209
  backgroundColor: "#1b1834",
4188
4210
  border: "1px solid #393853",
@@ -4216,7 +4238,7 @@ function GoalsList({ goals, formatValue, showPercent = true, emptyText = "No goa
4216
4238
  /* @__PURE__ */ jsxs19("div", { className: "ls-goals__head", children: [
4217
4239
  goal.icon != null ? /* @__PURE__ */ jsx30("span", { className: "ls-goals__icon", children: goal.icon }) : null,
4218
4240
  /* @__PURE__ */ jsx30("span", { className: "ls-goals__label", children: goal.label }),
4219
- /* @__PURE__ */ jsx30("span", { className: "ls-goals__value", children: goal.valueText ?? /* @__PURE__ */ jsxs19(Fragment10, { children: [
4241
+ /* @__PURE__ */ jsx30("span", { className: "ls-goals__value", children: goal.valueText ?? /* @__PURE__ */ jsxs19(Fragment11, { children: [
4220
4242
  fmt(goal.current ?? 0, goal),
4221
4243
  " ",
4222
4244
  /* @__PURE__ */ jsxs19("span", { className: "ls-goals__target", children: [
@@ -4268,7 +4290,7 @@ function TickBoxIcon({ className }) {
4268
4290
  }
4269
4291
 
4270
4292
  // src/components/ModQueueItem/ModQueueItem.tsx
4271
- import { Fragment as Fragment11, jsx as jsx32, jsxs as jsxs21 } from "react/jsx-runtime";
4293
+ import { Fragment as Fragment12, jsx as jsx32, jsxs as jsxs21 } from "react/jsx-runtime";
4272
4294
  function ModQueueItem({
4273
4295
  username,
4274
4296
  avatar,
@@ -4302,7 +4324,7 @@ function ModQueueItem({
4302
4324
  "\u201D"
4303
4325
  ] }) : null
4304
4326
  ] }),
4305
- /* @__PURE__ */ jsx32("div", { className: "ls-modqueue-item__actions", children: actions ?? /* @__PURE__ */ jsxs21(Fragment11, { children: [
4327
+ /* @__PURE__ */ jsx32("div", { className: "ls-modqueue-item__actions", children: actions ?? /* @__PURE__ */ jsxs21(Fragment12, { children: [
4306
4328
  /* @__PURE__ */ jsx32(IconButton, { className: "ls-modqueue-item__iconbtn", disableRipple: true, onClick: onDeny, "aria-label": "Deny", children: /* @__PURE__ */ jsx32(CrossBoxIcon, { className: "ls-modqueue-item__action-icon" }) }),
4307
4329
  /* @__PURE__ */ jsx32(IconButton, { className: "ls-modqueue-item__iconbtn", disableRipple: true, onClick: onApprove, "aria-label": "Approve", children: /* @__PURE__ */ jsx32(TickBoxIcon, { className: "ls-modqueue-item__action-icon" }) })
4308
4330
  ] }) })
@@ -4357,7 +4379,7 @@ function EmptyModQueueIcon({ className }) {
4357
4379
  }
4358
4380
 
4359
4381
  // src/components/ModQueueList/ModQueueList.tsx
4360
- import { Fragment as Fragment12, jsx as jsx34, jsxs as jsxs23 } from "react/jsx-runtime";
4382
+ import { Fragment as Fragment13, jsx as jsx34, jsxs as jsxs23 } from "react/jsx-runtime";
4361
4383
  var matches = (item, q) => {
4362
4384
  if (!q) {
4363
4385
  return true;
@@ -4409,7 +4431,7 @@ function ModQueueList({
4409
4431
  filtered.length === 0 ? /* @__PURE__ */ jsxs23("div", { className: "ls-modqueue__empty", children: [
4410
4432
  /* @__PURE__ */ jsx34("span", { className: "ls-modqueue__empty-icon", children: emptyIcon ?? /* @__PURE__ */ jsx34(EmptyModQueueIcon, {}) }),
4411
4433
  /* @__PURE__ */ jsx34("span", { children: emptyText })
4412
- ] }) : /* @__PURE__ */ jsxs23(Fragment12, { children: [
4434
+ ] }) : /* @__PURE__ */ jsxs23(Fragment13, { children: [
4413
4435
  canModerate && (onDeny || onApprove) ? /* @__PURE__ */ jsxs23("div", { className: "ls-modqueue__bulk", children: [
4414
4436
  onDeny ? /* @__PURE__ */ jsxs23(ButtonBase, { className: "ls-modqueue__bulk-btn ls-modqueue__bulk-btn--deny", disableRipple: true, onClick: () => onDeny("all"), children: [
4415
4437
  /* @__PURE__ */ jsx34(CrossBoxIcon, { className: "ls-modqueue__bulk-icon" }),