@ioca/react 1.3.3 → 1.3.4
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.
- package/lib/components/button/button.js +1 -1
- package/lib/components/button/button.js.map +1 -1
- package/lib/components/checkbox/checkbox.js +1 -1
- package/lib/components/checkbox/checkbox.js.map +1 -1
- package/lib/components/datagrid/datagrid.js +1 -1
- package/lib/components/datagrid/datagrid.js.map +1 -1
- package/lib/components/datagrid/resize.js +1 -1
- package/lib/components/datagrid/resize.js.map +1 -1
- package/lib/components/drawer/drawer.js +1 -1
- package/lib/components/drawer/drawer.js.map +1 -1
- package/lib/components/image/image.js +1 -1
- package/lib/components/image/image.js.map +1 -1
- package/lib/components/image/list.js +1 -1
- package/lib/components/image/list.js.map +1 -1
- package/lib/components/input/number.js +1 -1
- package/lib/components/input/number.js.map +1 -1
- package/lib/components/input/range.js +1 -1
- package/lib/components/input/range.js.map +1 -1
- package/lib/components/modal/hookModal.js.map +1 -1
- package/lib/components/modal/modal.js +1 -1
- package/lib/components/modal/modal.js.map +1 -1
- package/lib/components/modal/useModal.js +1 -1
- package/lib/components/modal/useModal.js.map +1 -1
- package/lib/components/picker/colors/index.js +1 -1
- package/lib/components/picker/colors/index.js.map +1 -1
- package/lib/components/popup/popup.js +1 -1
- package/lib/components/popup/popup.js.map +1 -1
- package/lib/components/progress/progress.js +1 -1
- package/lib/components/progress/progress.js.map +1 -1
- package/lib/components/radio/radio.js +1 -1
- package/lib/components/radio/radio.js.map +1 -1
- package/lib/components/resizable/resizable.js +1 -1
- package/lib/components/resizable/resizable.js.map +1 -1
- package/lib/components/swiper/swiper.js +1 -1
- package/lib/components/swiper/swiper.js.map +1 -1
- package/lib/components/tabs/tabs.js +1 -1
- package/lib/components/tabs/tabs.js.map +1 -1
- package/lib/components/text/number.js +1 -1
- package/lib/components/text/number.js.map +1 -1
- package/lib/components/text/time.js +1 -1
- package/lib/components/text/time.js.map +1 -1
- package/lib/components/upload/renderFile.js +1 -1
- package/lib/components/upload/renderFile.js.map +1 -1
- package/lib/components/upload/upload.js +1 -1
- package/lib/components/upload/upload.js.map +1 -1
- package/lib/components/video/video.js +1 -1
- package/lib/components/video/video.js.map +1 -1
- package/lib/css/index.css +1 -1
- package/lib/css/index.css.map +1 -1
- package/lib/js/usePreview/index.js +1 -1
- package/lib/js/usePreview/index.js.map +1 -1
- package/lib/js/usePreview/type.js.map +1 -1
- package/lib/js/utils.js +1 -1
- package/lib/js/utils.js.map +1 -1
- package/lib/types/components/affix/affix.d.ts +2 -0
- package/lib/types/components/affix/index.d.ts +2 -0
- package/lib/types/components/affix/totop.d.ts +2 -0
- package/lib/types/components/affix/type.d.ts +2 -0
- package/lib/types/components/badge/badge.d.ts +2 -0
- package/lib/types/components/badge/index.d.ts +2 -0
- package/lib/types/components/badge/type.d.ts +2 -0
- package/lib/types/components/button/button.d.ts +2 -0
- package/lib/types/components/button/group.d.ts +2 -0
- package/lib/types/components/button/index.d.ts +2 -0
- package/lib/types/components/button/toggle.d.ts +2 -0
- package/lib/types/components/button/type.d.ts +2 -0
- package/lib/types/components/card/card.d.ts +2 -0
- package/lib/types/components/card/index.d.ts +2 -0
- package/lib/types/components/card/type.d.ts +2 -0
- package/lib/types/components/checkbox/checkbox.d.ts +2 -0
- package/lib/types/components/checkbox/index.d.ts +2 -0
- package/lib/types/components/checkbox/item.d.ts +2 -0
- package/lib/types/components/checkbox/type.d.ts +2 -0
- package/lib/types/components/collapse/collapse.d.ts +2 -0
- package/lib/types/components/collapse/index.d.ts +2 -0
- package/lib/types/components/collapse/item.d.ts +2 -0
- package/lib/types/components/collapse/type.d.ts +2 -0
- package/lib/types/components/datagrid/datagrid.d.ts +2 -0
- package/lib/types/components/datagrid/index.d.ts +2 -0
- package/lib/types/components/datagrid/type.d.ts +2 -0
- package/lib/types/components/description/description.d.ts +2 -0
- package/lib/types/components/description/index.d.ts +2 -0
- package/lib/types/components/description/type.d.ts +2 -0
- package/lib/types/components/drawer/drawer.d.ts +2 -0
- package/lib/types/components/drawer/index.d.ts +2 -0
- package/lib/types/components/drawer/type.d.ts +2 -0
- package/lib/types/components/dropdown/dropdown.d.ts +2 -0
- package/lib/types/components/dropdown/index.d.ts +2 -0
- package/lib/types/components/dropdown/type.d.ts +2 -0
- package/lib/types/components/editor/editor.d.ts +2 -0
- package/lib/types/components/editor/index.d.ts +2 -0
- package/lib/types/components/editor/type.d.ts +2 -0
- package/lib/types/components/flex/flex.d.ts +2 -0
- package/lib/types/components/flex/index.d.ts +2 -0
- package/lib/types/components/flex/type.d.ts +2 -0
- package/lib/types/components/form/field.d.ts +2 -0
- package/lib/types/components/form/form.d.ts +2 -0
- package/lib/types/components/form/index.d.ts +2 -0
- package/lib/types/components/form/type.d.ts +2 -0
- package/lib/types/components/form/useForm.d.ts +2 -0
- package/lib/types/components/icon/icon.d.ts +2 -0
- package/lib/types/components/icon/index.d.ts +2 -0
- package/lib/types/components/icon/type.d.ts +2 -0
- package/lib/types/components/image/image.d.ts +2 -0
- package/lib/types/components/image/index.d.ts +2 -0
- package/lib/types/components/image/list.d.ts +2 -0
- package/lib/types/components/image/type.d.ts +2 -0
- package/lib/types/components/input/index.d.ts +2 -0
- package/lib/types/components/input/input.d.ts +2 -0
- package/lib/types/components/input/number.d.ts +2 -0
- package/lib/types/components/input/range.d.ts +2 -0
- package/lib/types/components/input/textarea.d.ts +2 -0
- package/lib/types/components/input/type.d.ts +2 -0
- package/lib/types/components/list/index.d.ts +2 -0
- package/lib/types/components/list/list.d.ts +2 -0
- package/lib/types/components/list/type.d.ts +2 -0
- package/lib/types/components/loading/index.d.ts +2 -0
- package/lib/types/components/loading/loading.d.ts +2 -0
- package/lib/types/components/loading/type.d.ts +2 -0
- package/lib/types/components/message/index.d.ts +2 -0
- package/lib/types/components/message/message.d.ts +2 -0
- package/lib/types/components/message/type.d.ts +2 -0
- package/lib/types/components/modal/index.d.ts +2 -0
- package/lib/types/components/modal/modal.d.ts +2 -0
- package/lib/types/components/modal/type.d.ts +2 -0
- package/lib/types/components/modal/useModal.d.ts +2 -0
- package/lib/types/components/pagination/index.d.ts +2 -0
- package/lib/types/components/pagination/pagination.d.ts +2 -0
- package/lib/types/components/pagination/type.d.ts +2 -0
- package/lib/types/components/picker/colors/index.d.ts +2 -0
- package/lib/types/components/picker/dates/index.d.ts +2 -0
- package/lib/types/components/picker/time/index.d.ts +2 -0
- package/lib/types/components/picker/type.d.ts +2 -0
- package/lib/types/components/popconfirm/index.d.ts +2 -0
- package/lib/types/components/popconfirm/popconfirm.d.ts +2 -0
- package/lib/types/components/popconfirm/type.d.ts +2 -0
- package/lib/types/components/popup/index.d.ts +2 -0
- package/lib/types/components/popup/popup.d.ts +2 -0
- package/lib/types/components/popup/type.d.ts +2 -0
- package/lib/types/components/progress/index.d.ts +2 -0
- package/lib/types/components/progress/progress.d.ts +2 -0
- package/lib/types/components/progress/type.d.ts +2 -0
- package/lib/types/components/radio/index.d.ts +2 -0
- package/lib/types/components/radio/item.d.ts +2 -0
- package/lib/types/components/radio/radio.d.ts +2 -0
- package/lib/types/components/radio/type.d.ts +2 -0
- package/lib/types/components/resizable/index.d.ts +2 -0
- package/lib/types/components/resizable/resizable.d.ts +2 -0
- package/lib/types/components/resizable/type.d.ts +2 -0
- package/lib/types/components/select/index.d.ts +2 -0
- package/lib/types/components/select/select.d.ts +2 -0
- package/lib/types/components/select/type.d.ts +2 -0
- package/lib/types/components/step/index.d.ts +2 -0
- package/lib/types/components/step/item.d.ts +2 -0
- package/lib/types/components/step/step.d.ts +2 -0
- package/lib/types/components/step/type.d.ts +2 -0
- package/lib/types/components/swiper/index.d.ts +2 -0
- package/lib/types/components/swiper/item.d.ts +2 -0
- package/lib/types/components/swiper/swiper.d.ts +2 -0
- package/lib/types/components/swiper/type.d.ts +2 -0
- package/lib/types/components/tabs/index.d.ts +2 -0
- package/lib/types/components/tabs/item.d.ts +2 -0
- package/lib/types/components/tabs/tabs.d.ts +2 -0
- package/lib/types/components/tabs/type.d.ts +2 -0
- package/lib/types/components/tag/index.d.ts +2 -0
- package/lib/types/components/tag/tag.d.ts +2 -0
- package/lib/types/components/tag/type.d.ts +2 -0
- package/lib/types/components/text/highlight.d.ts +2 -0
- package/lib/types/components/text/index.d.ts +2 -0
- package/lib/types/components/text/number.d.ts +2 -0
- package/lib/types/components/text/text.d.ts +2 -0
- package/lib/types/components/text/time.d.ts +2 -0
- package/lib/types/components/text/type.d.ts +2 -0
- package/lib/types/components/tree/index.d.ts +2 -0
- package/lib/types/components/tree/tree.d.ts +2 -0
- package/lib/types/components/tree/type.d.ts +2 -0
- package/lib/types/components/upload/index.d.ts +2 -0
- package/lib/types/components/upload/type.d.ts +2 -0
- package/lib/types/components/upload/upload.d.ts +2 -0
- package/lib/types/components/video/index.d.ts +2 -0
- package/lib/types/components/video/type.d.ts +2 -0
- package/lib/types/components/video/video.d.ts +2 -0
- package/lib/types/index.d.ts +2 -0
- package/lib/types/js/usePreview/index.d.ts +2 -0
- package/lib/types/js/usePreview/type.d.ts +4 -11
- package/lib/types/type/index.d.ts +2 -0
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"upload.js","sources":["../../../packages/components/upload/upload.tsx"],"sourcesContent":["import { arrayMove } from \"@/packages/js/utils\";\nimport usePreview from \"@p/js/usePreview\";\nimport { TPreviewItem } from \"@p/js/usePreview/type\";\nimport { PlusSharp } from \"@ricons/material\";\nimport { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { uid } from \"radash\";\nimport {\n\tChangeEvent,\n\tCSSProperties,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseMemo,\n\tuseRef,\n} from \"react\";\nimport { SortableItem } from \"react-easy-sort\";\nimport Button from \"../button\";\nimport Icon from \"../icon\";\nimport InputContainer from \"../input/container\";\nimport \"./index.css\";\nimport FileListItem, { ListContainer } from \"./renderFile\";\nimport { IFile, IUpload } from \"./type\";\n\nconst Upload = (props: IUpload) => {\n\tconst {\n\t\tref,\n\t\tlabel,\n\t\tlabelInline,\n\t\tvalue,\n\t\tfiles = [],\n\t\tinitialFiles,\n\t\tplaceholder,\n\t\tstatus = \"normal\",\n\t\tmessage,\n\t\tclassName,\n\t\tstyle,\n\t\tchildren,\n\t\tdefaultText = \"Upload\",\n\t\tmode = \"default\",\n\t\tcardSize = \"4em\",\n\t\tdisabled,\n\t\tsortable,\n\t\tlimit = props.multiple ? Infinity : 1,\n\t\tmultiple,\n\t\trenderItem,\n\t\tshouldUpload = () => true,\n\t\tuploader,\n\t\tonChange,\n\t\tonFilesChange,\n\t\tonUpload,\n\t\t...restProps\n\t} = props;\n\n\tconst state = useReactive({\n\t\tfiles,\n\t\tvalue,\n\t\tstatus,\n\t\tmessage,\n\t});\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\tconst preview = usePreview();\n\n\tconst trigger = useMemo(() => {\n\t\tif (children) return children;\n\n\t\tswitch (mode) {\n\t\t\tcase \"card\":\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName='i-upload-card-btn color-5'\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tflat\n\t\t\t\t\t\toutline\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<PlusSharp />} />\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\tdefault:\n\t\t\t\treturn (\n\t\t\t\t\t<Button className='i-upload-btn' disabled={disabled}>\n\t\t\t\t\t\t{defaultText}\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t}\n\t}, [mode, children]);\n\n\tconst handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n\t\tconst files = Array.from(e.target.files || []) as IFile[];\n\t\tconst { files: before } = state;\n\t\tconst changed: IFile[] = [];\n\n\t\tfiles.map((f) => {\n\t\t\tconst { id, name, size, type } = f;\n\t\t\tconst same = before.find((pf) => {\n\t\t\t\tconst { name: n, size: s, type: t } = pf;\n\t\t\t\treturn n === name && s === size && t === type;\n\t\t\t});\n\t\t\tconst src = URL.createObjectURL(f);\n\n\t\t\tObject.assign(f, {\n\t\t\t\tid: id ?? uid(7),\n\t\t\t\tsrc: src ?? f.name,\n\t\t\t\turl: src ?? f.name,\n\t\t\t});\n\t\t\t!same && changed.push(f);\n\t\t});\n\n\t\tconst after = [...before, ...changed];\n\n\t\tObject.assign(state, {\n\t\t\tfiles: multiple ? after.slice(0, limit) : [after.at(-1)],\n\t\t\tstatus,\n\t\t\tmessage,\n\t\t});\n\n\t\tonFilesChange?.(state.files, changed, e);\n\t\tonChange?.(state.files, e);\n\n\t\thandleUpload(changed);\n\t\tinputRef.current && (inputRef.current.value = \"\");\n\t};\n\n\tconst handleRemove = (i: number) => {\n\t\tconst [...files] = state.files;\n\n\t\tconst changed = files.splice(i, 1);\n\t\tURL.revokeObjectURL(changed[0]?.src || \"\");\n\n\t\tstate.files = files;\n\t\tonFilesChange?.(files, changed);\n\t\tonChange?.(files);\n\n\t\tinputRef.current && (inputRef.current.value = \"\");\n\t};\n\n\tconst handleUpload = async (files: IFile[]) => {\n\t\tif (!uploader) return;\n\n\t\tconst shouldUploadFiles = files.filter(shouldUpload);\n\n\t\tconst result = Promise.all(shouldUploadFiles.map(uploader));\n\n\t\treturn onUpload?.(result);\n\t};\n\n\tconst handlePreview = (i: number) => {\n\t\tpreview({ items: state.files as TPreviewItem[], initial: i });\n\t};\n\n\tconst setFileList = (files?: IFile[] | File[]) => {\n\t\tif (!files) return;\n\n\t\tstate.files = files.map((f) => {\n\t\t\treturn { ...f, id: f.id ?? uid(7) };\n\t\t});\n\t};\n\n\tconst handleSortEnd = (before, after) => {\n\t\tconst [...files] = state.files;\n\n\t\tstate.files = arrayMove(files, before, after);\n\t\tonChange?.(state.files);\n\t};\n\n\tuseEffect(() => {\n\t\tObject.assign(state, {\n\t\t\tstatus,\n\t\t\tmessage,\n\t\t});\n\t}, [status, message]);\n\n\tuseEffect(() => {\n\t\tstate.files = value?.filter?.((file) => !!file.id) ?? [];\n\t}, [value]);\n\n\tuseEffect(() => {\n\t\tsetFileList(initialFiles);\n\t}, []);\n\n\tuseImperativeHandle(\n\t\tref,\n\t\t() => ({\n\t\t\tgetFileList: () => state.files,\n\n\t\t\tsetFileList,\n\t\t}),\n\t\t[]\n\t);\n\n\treturn (\n\t\t<InputContainer\n\t\t\tas='div'\n\t\t\tlabel={label}\n\t\t\tlabelInline={labelInline}\n\t\t\tclassName={classNames(\"i-input-label-file\", className)}\n\t\t\tstyle={style}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-upload-inner\", {\n\t\t\t\t\t[`i-upload-${mode}`]: mode !== \"default\",\n\t\t\t\t})}\n\t\t\t\tstyle={{ [\"--upload-card-size\"]: cardSize } as CSSProperties}\n\t\t\t>\n\t\t\t\t<ListContainer sortable={sortable} onSortEnd={handleSortEnd}>\n\t\t\t\t\t{state.files.map((file: IFile, i: number) => {\n\t\t\t\t\t\tconst node = (\n\t\t\t\t\t\t\t<FileListItem\n\t\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\t\tindex={i}\n\t\t\t\t\t\t\t\tfile={file}\n\t\t\t\t\t\t\t\tmode={mode}\n\t\t\t\t\t\t\t\trenderItem={renderItem}\n\t\t\t\t\t\t\t\tonRemove={handleRemove}\n\t\t\t\t\t\t\t\tonPreview={handlePreview}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\tif (!sortable) return node;\n\n\t\t\t\t\t\treturn <SortableItem key={i}>{node}</SortableItem>;\n\t\t\t\t\t})}\n\t\t\t\t</ListContainer>\n\n\t\t\t\t{state.message && (\n\t\t\t\t\t<span className='i-upload-message'>{state.message}</span>\n\t\t\t\t)}\n\n\t\t\t\t{state.files.length < limit && (\n\t\t\t\t\t<label>\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t{...restProps}\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\tref={inputRef}\n\t\t\t\t\t\t\ttype='file'\n\t\t\t\t\t\t\tclassName='i-input-file-hidden'\n\t\t\t\t\t\t\tmultiple={multiple}\n\t\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{trigger}\n\t\t\t\t\t</label>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</InputContainer>\n\t);\n};\n\nexport default Upload;\n"],"names":["Upload","props","ref","label","labelInline","value","files","initialFiles","placeholder","status","message","className","style","children","defaultText","mode","cardSize","disabled","sortable","limit","multiple","Infinity","renderItem","shouldUpload","uploader","onChange","onFilesChange","onUpload","restProps","state","useReactive","inputRef","useRef","preview","usePreview","trigger","useMemo","_jsx","Button","square","flat","outline","Icon","icon","PlusSharp","handleRemove","i","changed","splice","URL","revokeObjectURL","src","current","handleUpload","async","shouldUploadFiles","filter","result","Promise","all","map","handlePreview","items","initial","setFileList","f","id","uid","useEffect","Object","assign","file","useImperativeHandle","getFileList","InputContainer","as","classNames","_jsxs","ListContainer","onSortEnd","before","after","arrayMove","node","FileListItem","index","onRemove","onPreview","SortableItem","length","type","e","Array","from","target","name","size","same","find","pf","n","s","t","createObjectURL","url","push","slice","at"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"upload.js","sources":["../../../packages/components/upload/upload.tsx"],"sourcesContent":["import { PlusSharp } from \"@ricons/material\";\nimport { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { uid } from \"radash\";\nimport {\n\tChangeEvent,\n\tCSSProperties,\n\tuseEffect,\n\tuseImperativeHandle,\n\tuseMemo,\n\tuseRef,\n} from \"react\";\nimport { SortableItem } from \"react-easy-sort\";\nimport usePreview from \"../../js/usePreview\";\nimport { TPreviewItem } from \"../../js/usePreview/type\";\nimport { arrayMove } from \"../../js/utils\";\nimport Button from \"../button\";\nimport Icon from \"../icon\";\nimport InputContainer from \"../input/container\";\nimport \"./index.css\";\nimport FileListItem, { ListContainer } from \"./renderFile\";\nimport { IFile, IUpload } from \"./type\";\n\nconst Upload = (props: IUpload) => {\n\tconst {\n\t\tref,\n\t\tlabel,\n\t\tlabelInline,\n\t\tvalue,\n\t\tfiles = [],\n\t\tinitialFiles,\n\t\tplaceholder,\n\t\tstatus = \"normal\",\n\t\tmessage,\n\t\tclassName,\n\t\tstyle,\n\t\tchildren,\n\t\tdefaultText = \"Upload\",\n\t\tmode = \"default\",\n\t\tcardSize = \"4em\",\n\t\tdisabled,\n\t\tsortable,\n\t\tlimit = props.multiple ? Infinity : 1,\n\t\tmultiple,\n\t\trenderItem,\n\t\tshouldUpload = () => true,\n\t\tuploader,\n\t\tonChange,\n\t\tonFilesChange,\n\t\tonUpload,\n\t\t...restProps\n\t} = props;\n\n\tconst state = useReactive({\n\t\tfiles,\n\t\tvalue,\n\t\tstatus,\n\t\tmessage,\n\t});\n\tconst inputRef = useRef<HTMLInputElement>(null);\n\tconst preview = usePreview();\n\n\tconst trigger = useMemo(() => {\n\t\tif (children) return children;\n\n\t\tswitch (mode) {\n\t\t\tcase \"card\":\n\t\t\t\treturn (\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName='i-upload-card-btn color-5'\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tflat\n\t\t\t\t\t\toutline\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<PlusSharp />} />\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t\tdefault:\n\t\t\t\treturn (\n\t\t\t\t\t<Button className='i-upload-btn' disabled={disabled}>\n\t\t\t\t\t\t{defaultText}\n\t\t\t\t\t</Button>\n\t\t\t\t);\n\t\t}\n\t}, [mode, children]);\n\n\tconst handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n\t\tconst files = Array.from(e.target.files || []) as IFile[];\n\t\tconst { files: before } = state;\n\t\tconst changed: IFile[] = [];\n\n\t\tfiles.map((f) => {\n\t\t\tconst { id, name, size, type } = f;\n\t\t\tconst same = before.find((pf) => {\n\t\t\t\tconst { name: n, size: s, type: t } = pf;\n\t\t\t\treturn n === name && s === size && t === type;\n\t\t\t});\n\t\t\tconst src = URL.createObjectURL(f);\n\n\t\t\tObject.assign(f, {\n\t\t\t\tid: id ?? uid(7),\n\t\t\t\tsrc: src ?? f.name,\n\t\t\t\turl: src ?? f.name,\n\t\t\t});\n\t\t\t!same && changed.push(f);\n\t\t});\n\n\t\tconst after = [...before, ...changed];\n\n\t\tObject.assign(state, {\n\t\t\tfiles: multiple ? after.slice(0, limit) : [after.at(-1)],\n\t\t\tstatus,\n\t\t\tmessage,\n\t\t});\n\n\t\tonFilesChange?.(state.files, changed, e);\n\t\tonChange?.(state.files, e);\n\n\t\thandleUpload(changed);\n\t\tinputRef.current && (inputRef.current.value = \"\");\n\t};\n\n\tconst handleRemove = (i: number) => {\n\t\tconst [...files] = state.files;\n\n\t\tconst changed = files.splice(i, 1);\n\t\tURL.revokeObjectURL(changed[0]?.src || \"\");\n\n\t\tstate.files = files;\n\t\tonFilesChange?.(files, changed);\n\t\tonChange?.(files);\n\n\t\tinputRef.current && (inputRef.current.value = \"\");\n\t};\n\n\tconst handleUpload = async (files: IFile[]) => {\n\t\tif (!uploader) return;\n\n\t\tconst shouldUploadFiles = files.filter(shouldUpload);\n\n\t\tconst result = Promise.all(shouldUploadFiles.map(uploader));\n\n\t\treturn onUpload?.(result);\n\t};\n\n\tconst handlePreview = (i: number) => {\n\t\tpreview({ items: state.files as TPreviewItem[], initial: i });\n\t};\n\n\tconst setFileList = (files?: IFile[] | File[]) => {\n\t\tif (!files) return;\n\n\t\tstate.files = files.map((f) => {\n\t\t\treturn { ...f, id: f.id ?? uid(7) };\n\t\t});\n\t};\n\n\tconst handleSortEnd = (before, after) => {\n\t\tconst [...files] = state.files;\n\n\t\tstate.files = arrayMove(files, before, after);\n\t\tonChange?.(state.files);\n\t};\n\n\tuseEffect(() => {\n\t\tObject.assign(state, {\n\t\t\tstatus,\n\t\t\tmessage,\n\t\t});\n\t}, [status, message]);\n\n\tuseEffect(() => {\n\t\tstate.files = value?.filter?.((file) => !!file.id) ?? [];\n\t}, [value]);\n\n\tuseEffect(() => {\n\t\tsetFileList(initialFiles);\n\t}, []);\n\n\tuseImperativeHandle(\n\t\tref,\n\t\t() => ({\n\t\t\tgetFileList: () => state.files,\n\n\t\t\tsetFileList,\n\t\t}),\n\t\t[]\n\t);\n\n\treturn (\n\t\t<InputContainer\n\t\t\tas='div'\n\t\t\tlabel={label}\n\t\t\tlabelInline={labelInline}\n\t\t\tclassName={classNames(\"i-input-label-file\", className)}\n\t\t\tstyle={style}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-upload-inner\", {\n\t\t\t\t\t[`i-upload-${mode}`]: mode !== \"default\",\n\t\t\t\t})}\n\t\t\t\tstyle={{ [\"--upload-card-size\"]: cardSize } as CSSProperties}\n\t\t\t>\n\t\t\t\t<ListContainer sortable={sortable} onSortEnd={handleSortEnd}>\n\t\t\t\t\t{state.files.map((file: IFile, i: number) => {\n\t\t\t\t\t\tconst node = (\n\t\t\t\t\t\t\t<FileListItem\n\t\t\t\t\t\t\t\tkey={i}\n\t\t\t\t\t\t\t\tindex={i}\n\t\t\t\t\t\t\t\tfile={file}\n\t\t\t\t\t\t\t\tmode={mode}\n\t\t\t\t\t\t\t\trenderItem={renderItem}\n\t\t\t\t\t\t\t\tonRemove={handleRemove}\n\t\t\t\t\t\t\t\tonPreview={handlePreview}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t);\n\n\t\t\t\t\t\tif (!sortable) return node;\n\n\t\t\t\t\t\treturn <SortableItem key={i}>{node}</SortableItem>;\n\t\t\t\t\t})}\n\t\t\t\t</ListContainer>\n\n\t\t\t\t{state.message && (\n\t\t\t\t\t<span className='i-upload-message'>{state.message}</span>\n\t\t\t\t)}\n\n\t\t\t\t{state.files.length < limit && (\n\t\t\t\t\t<label>\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t{...restProps}\n\t\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t\t\tref={inputRef}\n\t\t\t\t\t\t\ttype='file'\n\t\t\t\t\t\t\tclassName='i-input-file-hidden'\n\t\t\t\t\t\t\tmultiple={multiple}\n\t\t\t\t\t\t\tonChange={handleChange}\n\t\t\t\t\t\t/>\n\t\t\t\t\t\t{trigger}\n\t\t\t\t\t</label>\n\t\t\t\t)}\n\t\t\t</div>\n\t\t</InputContainer>\n\t);\n};\n\nexport default Upload;\n"],"names":["Upload","props","ref","label","labelInline","value","files","initialFiles","placeholder","status","message","className","style","children","defaultText","mode","cardSize","disabled","sortable","limit","multiple","Infinity","renderItem","shouldUpload","uploader","onChange","onFilesChange","onUpload","restProps","state","useReactive","inputRef","useRef","preview","usePreview","trigger","useMemo","_jsx","Button","square","flat","outline","Icon","icon","PlusSharp","handleRemove","i","changed","splice","URL","revokeObjectURL","src","current","handleUpload","async","shouldUploadFiles","filter","result","Promise","all","map","handlePreview","items","initial","setFileList","f","id","uid","useEffect","Object","assign","file","useImperativeHandle","getFileList","InputContainer","as","classNames","_jsxs","ListContainer","onSortEnd","before","after","arrayMove","node","FileListItem","index","onRemove","onPreview","SortableItem","length","type","e","Array","from","target","name","size","same","find","pf","n","s","t","createObjectURL","url","push","slice","at"],"mappings":"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"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{jsxs as e,jsx as r}from"react/jsx-runtime";import{
|
|
1
|
+
import{jsxs as e,jsx as r}from"react/jsx-runtime";import{PauseRound as n,PlayArrowRound as t,StopRound as o,VolumeOffRound as i,VolumeDownRound as s,FullscreenExitRound as l,FullscreenRound as c}from"@ricons/material";import{useReactive as a}from"ahooks";import u from"classnames";import{throttle as m}from"radash";import{useRef as d,useImperativeHandle as v,useEffect as g}from"react";import{exitFullScreen as p,fullScreen as h}from"../../js/utils.js";import"../button/index.js";import f from"../icon/icon.js";import C from"../progress/progress.js";import"../text/index.js";import b from"../button/button.js";import y from"../text/text.js";const E=E=>{const{ref:j,style:T,hideControls:L,autoplay:N,muted:P,volume:k=50,height:x,width:F,useOriginControls:H,timeProgressProps:q={barClass:"bg-blue"},volumeProgressProps:O={barClass:"bg-blue"},className:w,onFullScreenChange:D,...M}=E,S=a({playing:N,volume:P?0:k,volumeCache:0,muted:P,current:0,duration:0,isFullscreen:!1,controlHidden:!0,draggingProgress:!1}),V=d(null),z=d(null),A=e=>{const r=e.target;r.paused||S.draggingProgress||Object.assign(S,{current:r.currentTime})},B=e=>{S.playing=!e.target.paused},G=()=>{const e=V.current?.parentElement;e&&(S.isFullscreen=document.fullscreenElement===e)},I=e=>{const r=e.target;Object.assign(S,{volume:100*r.volume,muted:0===r.volume})},J=()=>{const e=V.current;e&&(e.paused?e.play():e.pause())},K=()=>{const e=V.current;e&&(e.currentTime=0,e.pause())},Q=()=>{const e=V.current?.parentElement;e&&(S.isFullscreen?p():h(e),D?.(!S.isFullscreen))},R=!L&&!H,U=()=>{z.current&&(clearTimeout(z.current),z.current=null)},W=m({interval:900},(()=>{R&&S.controlHidden&&(S.controlHidden=!1,U(),z.current=setTimeout((()=>{S.controlHidden=!0}),1e3))}));v(j,(()=>({play:()=>{const e=V.current;e&&e.play()},pause:()=>{const e=V.current;e&&e.pause()},stop:K,fullscreen:Q,getVideo:()=>V.current}))),g((()=>{const e=V.current;if(e)return e.addEventListener("timeupdate",A),e.addEventListener("play",B),e.addEventListener("pause",B),e.addEventListener("volumechange",I),document.addEventListener("fullscreenchange",G),()=>{U(),e.removeEventListener("timeupdate",A),e.removeEventListener("play",B),e.removeEventListener("pause",B),e.removeEventListener("volumechange",I),document.removeEventListener("fullscreenchange",G)}}),[]);const X=S.current/S.duration*100;return e("div",{className:u("i-video",w),style:{height:x,width:F,...T},onClick:J,onDoubleClick:()=>Q(),onMouseMove:W,children:[r("video",{ref:V,onCanPlay:e=>{const r=e.target;Object.assign(S,{duration:r.duration,current:r.currentTime}),r.volume=S.volume/100},...M,controls:H}),R&&e("div",{className:u("i-video-controls",{"i-video-controls-hidden":S.controlHidden}),onClick:e=>e.stopPropagation(),children:[r(b.Toggle,{className:"i-video-btn",flat:!0,square:!0,after:r(f,{icon:r(n,{})}),active:S.playing,onClick:J,children:r(f,{icon:r(t,{})})}),r(b,{className:"i-video-btn",flat:!0,square:!0,onClick:K,children:r(f,{icon:r(o,{})})}),e("span",{className:"i-video-times font-sm",children:[r(y.Time,{seconds:S.current})," /",r(y.Time,{seconds:S.duration})]}),r(C,{...q,value:X,onChange:e=>{const r=V.current;r&&(r.currentTime=S.duration*e/100)},onDraggingChange:e=>{S.draggingProgress=e}}),e("div",{className:"i-video-control-volume",children:[r(b.Toggle,{className:"i-video-btn",flat:!0,square:!0,active:S.volume<=0,after:r(f,{icon:r(i,{}),style:{padding:".125em"}}),onClick:()=>{const e=V.current;if(e)return e.volume>0?(S.volumeCache=e.volume,void(e.volume=0)):void(e.volume=0===S.volumeCache?.5:S.volumeCache)},children:r(f,{icon:r(s,{})})}),r("div",{className:"i-video-volume",children:r(C,{style:{height:100},vertical:!0,...O,value:S.volume,onChange:e=>{const r=V.current;r&&(r.volume=e/100)}})})]}),r(b.Toggle,{className:"i-video-btn",flat:!0,square:!0,after:r(f,{icon:r(l,{})}),active:S.isFullscreen,onClick:()=>Q(),children:r(f,{icon:r(c,{})})})]})]})};export{E as default};
|
|
2
2
|
//# sourceMappingURL=video.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"video.js","sources":["../../../packages/components/video/video.tsx"],"sourcesContent":["import { exitFullScreen, fullScreen } from \"@p/js/utils\";\nimport {\n\tFullscreenExitRound,\n\tFullscreenRound,\n\tPauseRound,\n\tPlayArrowRound,\n\tStopRound,\n\tVolumeDownRound,\n\tVolumeOffRound,\n} from \"@ricons/material\";\nimport { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { throttle } from \"radash\";\nimport { useEffect, useImperativeHandle, useRef } from \"react\";\nimport Button from \"../button\";\nimport Icon from \"../icon\";\nimport Progress from \"../progress\";\nimport Text from \"../text\";\nimport \"./index.css\";\nimport { IVideo } from \"./type\";\n\nconst Video = (props: IVideo) => {\n\tconst {\n\t\tref,\n\t\tstyle,\n\t\thideControls,\n\t\tautoplay,\n\t\tmuted,\n\t\tvolume = 50,\n\t\theight,\n\t\twidth,\n\t\tuseOriginControls,\n\t\ttimeProgressProps = {\n\t\t\tbarClass: \"bg-blue\",\n\t\t},\n\t\tvolumeProgressProps = {\n\t\t\tbarClass: \"bg-blue\",\n\t\t},\n\t\tclassName,\n\t\tonFullScreenChange,\n\t\t...restProps\n\t} = props;\n\tconst state = useReactive({\n\t\tplaying: autoplay,\n\t\tvolume: muted ? 0 : volume,\n\t\tvolumeCache: 0,\n\t\tmuted,\n\t\tcurrent: 0,\n\t\tduration: 0,\n\t\tisFullscreen: false,\n\t\tcontrolHidden: true,\n\t\tdraggingProgress: false,\n\t});\n\tconst videoRef = useRef<HTMLVideoElement>(null);\n\tconst hiddenTO = useRef<any>(null);\n\n\tconst timeUpdateListener = (e) => {\n\t\tconst tar = e.target;\n\t\tif (tar.paused || state.draggingProgress) return;\n\n\t\tObject.assign(state, {\n\t\t\tcurrent: tar.currentTime,\n\t\t});\n\t};\n\n\tconst playChangeListener = (e) => {\n\t\tstate.playing = !e.target.paused;\n\t};\n\n\tconst fsChangeListener = () => {\n\t\tconst tar = videoRef.current?.parentElement;\n\t\tif (!tar) return;\n\n\t\tstate.isFullscreen = document.fullscreenElement === tar;\n\t};\n\n\tconst volumeChangeListener = (e) => {\n\t\tconst tar = e.target;\n\t\tObject.assign(state, {\n\t\t\tvolume: tar.volume * 100,\n\t\t\tmuted: tar.volume === 0,\n\t\t});\n\t};\n\n\tconst handlePlay = () => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.paused ? v.play() : v.pause();\n\t};\n\n\tconst handleReady = (e) => {\n\t\tconst tar = e.target;\n\t\tObject.assign(state, {\n\t\t\tduration: tar.duration,\n\t\t\tcurrent: tar.currentTime,\n\t\t});\n\t\ttar.volume = state.volume / 100;\n\t};\n\n\tconst handleMuted = () => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tif (v.volume > 0) {\n\t\t\tstate.volumeCache = v.volume;\n\t\t\tv.volume = 0;\n\t\t\treturn;\n\t\t}\n\t\tv.volume = state.volumeCache === 0 ? 0.5 : state.volumeCache;\n\t};\n\n\tconst handleStop = () => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.currentTime = 0;\n\t\tv.pause();\n\t};\n\n\tconst handleFullscreen = () => {\n\t\tconst tar = videoRef.current?.parentElement;\n\t\tif (!tar) return;\n\n\t\tstate.isFullscreen ? exitFullScreen() : fullScreen(tar);\n\t\tonFullScreenChange?.(!state.isFullscreen);\n\t};\n\n\tconst handleUpdateTime = (t) => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.currentTime = (state.duration * t) / 100;\n\t};\n\n\tconst handleUpdateVolume = (t) => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.volume = t / 100;\n\t};\n\n\tconst showControls = !hideControls && !useOriginControls;\n\n\tconst clearHiddenTO = () => {\n\t\tif (!hiddenTO.current) return;\n\t\tclearTimeout(hiddenTO.current);\n\t\thiddenTO.current = null;\n\t};\n\n\tconst setHiddenFalse = () => {\n\t\tif (!showControls || !state.controlHidden) return;\n\t\tstate.controlHidden = false;\n\n\t\tclearHiddenTO();\n\t\thiddenTO.current = setTimeout(() => {\n\t\t\tstate.controlHidden = true;\n\t\t}, 1000);\n\t};\n\n\tconst handleDraggingProgress = (dragging) => {\n\t\tstate.draggingProgress = dragging;\n\t};\n\n\tconst handleMouseMove = throttle({ interval: 900 }, setHiddenFalse);\n\n\tuseImperativeHandle(ref, () => ({\n\t\tplay: () => {\n\t\t\tconst v = videoRef.current;\n\t\t\tif (!v) return;\n\n\t\t\tv.play();\n\t\t},\n\t\tpause: () => {\n\t\t\tconst v = videoRef.current;\n\t\t\tif (!v) return;\n\n\t\t\tv.pause();\n\t\t},\n\t\tstop: handleStop,\n\t\tfullscreen: handleFullscreen,\n\t\tgetVideo: () => videoRef.current,\n\t}));\n\n\tuseEffect(() => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.addEventListener(\"timeupdate\", timeUpdateListener);\n\t\tv.addEventListener(\"play\", playChangeListener);\n\t\tv.addEventListener(\"pause\", playChangeListener);\n\t\tv.addEventListener(\"volumechange\", volumeChangeListener);\n\t\tdocument.addEventListener(\"fullscreenchange\", fsChangeListener);\n\n\t\treturn () => {\n\t\t\tclearHiddenTO();\n\t\t\tv.removeEventListener(\"timeupdate\", timeUpdateListener);\n\t\t\tv.removeEventListener(\"play\", playChangeListener);\n\t\t\tv.removeEventListener(\"pause\", playChangeListener);\n\t\t\tv.removeEventListener(\"volumechange\", volumeChangeListener);\n\t\t\tdocument.removeEventListener(\"fullscreenchange\", fsChangeListener);\n\t\t};\n\t}, []);\n\n\tconst currentValue = (state.current / state.duration) * 100;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\"i-video\", className)}\n\t\t\tstyle={{ height, width, ...style }}\n\t\t\tonClick={handlePlay}\n\t\t\tonDoubleClick={() => handleFullscreen()}\n\t\t\tonMouseMove={handleMouseMove}\n\t\t>\n\t\t\t<video\n\t\t\t\tref={videoRef}\n\t\t\t\tonCanPlay={handleReady}\n\t\t\t\t{...restProps}\n\t\t\t\tcontrols={useOriginControls}\n\t\t\t/>\n\n\t\t\t{showControls && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={classNames(\"i-video-controls\", {\n\t\t\t\t\t\t\"i-video-controls-hidden\": state.controlHidden,\n\t\t\t\t\t})}\n\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t>\n\t\t\t\t\t<Button.Toggle\n\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\tflat\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tafter={<Icon icon={<PauseRound />} />}\n\t\t\t\t\t\tactive={state.playing}\n\t\t\t\t\t\tonClick={handlePlay}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<PlayArrowRound />} />\n\t\t\t\t\t</Button.Toggle>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\tflat\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tonClick={handleStop}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<StopRound />} />\n\t\t\t\t\t</Button>\n\t\t\t\t\t<span className='i-video-times font-sm'>\n\t\t\t\t\t\t<Text.Time seconds={state.current} /> /\n\t\t\t\t\t\t<Text.Time seconds={state.duration} />\n\t\t\t\t\t</span>\n\t\t\t\t\t<Progress\n\t\t\t\t\t\t{...timeProgressProps}\n\t\t\t\t\t\tvalue={currentValue}\n\t\t\t\t\t\tonChange={handleUpdateTime}\n\t\t\t\t\t\tonDraggingChange={handleDraggingProgress}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<div className='i-video-control-volume'>\n\t\t\t\t\t\t<Button.Toggle\n\t\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\t\tflat\n\t\t\t\t\t\t\tsquare\n\t\t\t\t\t\t\tactive={state.volume <= 0}\n\t\t\t\t\t\t\tafter={\n\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\ticon={<VolumeOffRound />}\n\t\t\t\t\t\t\t\t\tstyle={{ padding: \".125em\" }}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick={handleMuted}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon icon={<VolumeDownRound />} />\n\t\t\t\t\t\t</Button.Toggle>\n\n\t\t\t\t\t\t<div className='i-video-volume'>\n\t\t\t\t\t\t\t<Progress\n\t\t\t\t\t\t\t\tstyle={{ height: 100 }}\n\t\t\t\t\t\t\t\tvertical\n\t\t\t\t\t\t\t\t{...volumeProgressProps}\n\t\t\t\t\t\t\t\tvalue={state.volume}\n\t\t\t\t\t\t\t\tonChange={handleUpdateVolume}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<Button.Toggle\n\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\tflat\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tafter={<Icon icon={<FullscreenExitRound />} />}\n\t\t\t\t\t\tactive={state.isFullscreen}\n\t\t\t\t\t\tonClick={() => handleFullscreen()}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<FullscreenRound />} />\n\t\t\t\t\t</Button.Toggle>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default Video;\n"],"names":["Video","props","ref","style","hideControls","autoplay","muted","volume","height","width","useOriginControls","timeProgressProps","barClass","volumeProgressProps","className","onFullScreenChange","restProps","state","useReactive","playing","volumeCache","current","duration","isFullscreen","controlHidden","draggingProgress","videoRef","useRef","hiddenTO","timeUpdateListener","e","tar","target","paused","Object","assign","currentTime","playChangeListener","fsChangeListener","parentElement","document","fullscreenElement","volumeChangeListener","handlePlay","v","play","pause","handleStop","handleFullscreen","exitFullScreen","fullScreen","showControls","clearHiddenTO","clearTimeout","handleMouseMove","throttle","interval","setTimeout","useImperativeHandle","stop","fullscreen","getVideo","useEffect","addEventListener","removeEventListener","currentValue","_jsxs","classNames","onClick","onDoubleClick","onMouseMove","children","_jsx","onCanPlay","controls","stopPropagation","Button","Toggle","flat","square","after","Icon","icon","PauseRound","active","PlayArrowRound","StopRound","Text","Time","seconds","Progress","value","onChange","t","onDraggingChange","dragging","VolumeOffRound","padding","VolumeDownRound","vertical","FullscreenExitRound","FullscreenRound"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"video.js","sources":["../../../packages/components/video/video.tsx"],"sourcesContent":["import {\n\tFullscreenExitRound,\n\tFullscreenRound,\n\tPauseRound,\n\tPlayArrowRound,\n\tStopRound,\n\tVolumeDownRound,\n\tVolumeOffRound,\n} from \"@ricons/material\";\nimport { useReactive } from \"ahooks\";\nimport classNames from \"classnames\";\nimport { throttle } from \"radash\";\nimport { useEffect, useImperativeHandle, useRef } from \"react\";\nimport { exitFullScreen, fullScreen } from \"../../js/utils\";\nimport Button from \"../button\";\nimport Icon from \"../icon\";\nimport Progress from \"../progress\";\nimport Text from \"../text\";\nimport \"./index.css\";\nimport { IVideo } from \"./type\";\n\nconst Video = (props: IVideo) => {\n\tconst {\n\t\tref,\n\t\tstyle,\n\t\thideControls,\n\t\tautoplay,\n\t\tmuted,\n\t\tvolume = 50,\n\t\theight,\n\t\twidth,\n\t\tuseOriginControls,\n\t\ttimeProgressProps = {\n\t\t\tbarClass: \"bg-blue\",\n\t\t},\n\t\tvolumeProgressProps = {\n\t\t\tbarClass: \"bg-blue\",\n\t\t},\n\t\tclassName,\n\t\tonFullScreenChange,\n\t\t...restProps\n\t} = props;\n\tconst state = useReactive({\n\t\tplaying: autoplay,\n\t\tvolume: muted ? 0 : volume,\n\t\tvolumeCache: 0,\n\t\tmuted,\n\t\tcurrent: 0,\n\t\tduration: 0,\n\t\tisFullscreen: false,\n\t\tcontrolHidden: true,\n\t\tdraggingProgress: false,\n\t});\n\tconst videoRef = useRef<HTMLVideoElement>(null);\n\tconst hiddenTO = useRef<any>(null);\n\n\tconst timeUpdateListener = (e) => {\n\t\tconst tar = e.target;\n\t\tif (tar.paused || state.draggingProgress) return;\n\n\t\tObject.assign(state, {\n\t\t\tcurrent: tar.currentTime,\n\t\t});\n\t};\n\n\tconst playChangeListener = (e) => {\n\t\tstate.playing = !e.target.paused;\n\t};\n\n\tconst fsChangeListener = () => {\n\t\tconst tar = videoRef.current?.parentElement;\n\t\tif (!tar) return;\n\n\t\tstate.isFullscreen = document.fullscreenElement === tar;\n\t};\n\n\tconst volumeChangeListener = (e) => {\n\t\tconst tar = e.target;\n\t\tObject.assign(state, {\n\t\t\tvolume: tar.volume * 100,\n\t\t\tmuted: tar.volume === 0,\n\t\t});\n\t};\n\n\tconst handlePlay = () => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.paused ? v.play() : v.pause();\n\t};\n\n\tconst handleReady = (e) => {\n\t\tconst tar = e.target;\n\t\tObject.assign(state, {\n\t\t\tduration: tar.duration,\n\t\t\tcurrent: tar.currentTime,\n\t\t});\n\t\ttar.volume = state.volume / 100;\n\t};\n\n\tconst handleMuted = () => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tif (v.volume > 0) {\n\t\t\tstate.volumeCache = v.volume;\n\t\t\tv.volume = 0;\n\t\t\treturn;\n\t\t}\n\t\tv.volume = state.volumeCache === 0 ? 0.5 : state.volumeCache;\n\t};\n\n\tconst handleStop = () => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.currentTime = 0;\n\t\tv.pause();\n\t};\n\n\tconst handleFullscreen = () => {\n\t\tconst tar = videoRef.current?.parentElement;\n\t\tif (!tar) return;\n\n\t\tstate.isFullscreen ? exitFullScreen() : fullScreen(tar);\n\t\tonFullScreenChange?.(!state.isFullscreen);\n\t};\n\n\tconst handleUpdateTime = (t) => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.currentTime = (state.duration * t) / 100;\n\t};\n\n\tconst handleUpdateVolume = (t) => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.volume = t / 100;\n\t};\n\n\tconst showControls = !hideControls && !useOriginControls;\n\n\tconst clearHiddenTO = () => {\n\t\tif (!hiddenTO.current) return;\n\t\tclearTimeout(hiddenTO.current);\n\t\thiddenTO.current = null;\n\t};\n\n\tconst setHiddenFalse = () => {\n\t\tif (!showControls || !state.controlHidden) return;\n\t\tstate.controlHidden = false;\n\n\t\tclearHiddenTO();\n\t\thiddenTO.current = setTimeout(() => {\n\t\t\tstate.controlHidden = true;\n\t\t}, 1000);\n\t};\n\n\tconst handleDraggingProgress = (dragging) => {\n\t\tstate.draggingProgress = dragging;\n\t};\n\n\tconst handleMouseMove = throttle({ interval: 900 }, setHiddenFalse);\n\n\tuseImperativeHandle(ref, () => ({\n\t\tplay: () => {\n\t\t\tconst v = videoRef.current;\n\t\t\tif (!v) return;\n\n\t\t\tv.play();\n\t\t},\n\t\tpause: () => {\n\t\t\tconst v = videoRef.current;\n\t\t\tif (!v) return;\n\n\t\t\tv.pause();\n\t\t},\n\t\tstop: handleStop,\n\t\tfullscreen: handleFullscreen,\n\t\tgetVideo: () => videoRef.current,\n\t}));\n\n\tuseEffect(() => {\n\t\tconst v = videoRef.current;\n\t\tif (!v) return;\n\n\t\tv.addEventListener(\"timeupdate\", timeUpdateListener);\n\t\tv.addEventListener(\"play\", playChangeListener);\n\t\tv.addEventListener(\"pause\", playChangeListener);\n\t\tv.addEventListener(\"volumechange\", volumeChangeListener);\n\t\tdocument.addEventListener(\"fullscreenchange\", fsChangeListener);\n\n\t\treturn () => {\n\t\t\tclearHiddenTO();\n\t\t\tv.removeEventListener(\"timeupdate\", timeUpdateListener);\n\t\t\tv.removeEventListener(\"play\", playChangeListener);\n\t\t\tv.removeEventListener(\"pause\", playChangeListener);\n\t\t\tv.removeEventListener(\"volumechange\", volumeChangeListener);\n\t\t\tdocument.removeEventListener(\"fullscreenchange\", fsChangeListener);\n\t\t};\n\t}, []);\n\n\tconst currentValue = (state.current / state.duration) * 100;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\"i-video\", className)}\n\t\t\tstyle={{ height, width, ...style }}\n\t\t\tonClick={handlePlay}\n\t\t\tonDoubleClick={() => handleFullscreen()}\n\t\t\tonMouseMove={handleMouseMove}\n\t\t>\n\t\t\t<video\n\t\t\t\tref={videoRef}\n\t\t\t\tonCanPlay={handleReady}\n\t\t\t\t{...restProps}\n\t\t\t\tcontrols={useOriginControls}\n\t\t\t/>\n\n\t\t\t{showControls && (\n\t\t\t\t<div\n\t\t\t\t\tclassName={classNames(\"i-video-controls\", {\n\t\t\t\t\t\t\"i-video-controls-hidden\": state.controlHidden,\n\t\t\t\t\t})}\n\t\t\t\t\tonClick={(e) => e.stopPropagation()}\n\t\t\t\t>\n\t\t\t\t\t<Button.Toggle\n\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\tflat\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tafter={<Icon icon={<PauseRound />} />}\n\t\t\t\t\t\tactive={state.playing}\n\t\t\t\t\t\tonClick={handlePlay}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<PlayArrowRound />} />\n\t\t\t\t\t</Button.Toggle>\n\t\t\t\t\t<Button\n\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\tflat\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tonClick={handleStop}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<StopRound />} />\n\t\t\t\t\t</Button>\n\t\t\t\t\t<span className='i-video-times font-sm'>\n\t\t\t\t\t\t<Text.Time seconds={state.current} /> /\n\t\t\t\t\t\t<Text.Time seconds={state.duration} />\n\t\t\t\t\t</span>\n\t\t\t\t\t<Progress\n\t\t\t\t\t\t{...timeProgressProps}\n\t\t\t\t\t\tvalue={currentValue}\n\t\t\t\t\t\tonChange={handleUpdateTime}\n\t\t\t\t\t\tonDraggingChange={handleDraggingProgress}\n\t\t\t\t\t/>\n\n\t\t\t\t\t<div className='i-video-control-volume'>\n\t\t\t\t\t\t<Button.Toggle\n\t\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\t\tflat\n\t\t\t\t\t\t\tsquare\n\t\t\t\t\t\t\tactive={state.volume <= 0}\n\t\t\t\t\t\t\tafter={\n\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\ticon={<VolumeOffRound />}\n\t\t\t\t\t\t\t\t\tstyle={{ padding: \".125em\" }}\n\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick={handleMuted}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t<Icon icon={<VolumeDownRound />} />\n\t\t\t\t\t\t</Button.Toggle>\n\n\t\t\t\t\t\t<div className='i-video-volume'>\n\t\t\t\t\t\t\t<Progress\n\t\t\t\t\t\t\t\tstyle={{ height: 100 }}\n\t\t\t\t\t\t\t\tvertical\n\t\t\t\t\t\t\t\t{...volumeProgressProps}\n\t\t\t\t\t\t\t\tvalue={state.volume}\n\t\t\t\t\t\t\t\tonChange={handleUpdateVolume}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\n\t\t\t\t\t<Button.Toggle\n\t\t\t\t\t\tclassName='i-video-btn'\n\t\t\t\t\t\tflat\n\t\t\t\t\t\tsquare\n\t\t\t\t\t\tafter={<Icon icon={<FullscreenExitRound />} />}\n\t\t\t\t\t\tactive={state.isFullscreen}\n\t\t\t\t\t\tonClick={() => handleFullscreen()}\n\t\t\t\t\t>\n\t\t\t\t\t\t<Icon icon={<FullscreenRound />} />\n\t\t\t\t\t</Button.Toggle>\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n};\n\nexport default Video;\n"],"names":["Video","props","ref","style","hideControls","autoplay","muted","volume","height","width","useOriginControls","timeProgressProps","barClass","volumeProgressProps","className","onFullScreenChange","restProps","state","useReactive","playing","volumeCache","current","duration","isFullscreen","controlHidden","draggingProgress","videoRef","useRef","hiddenTO","timeUpdateListener","e","tar","target","paused","Object","assign","currentTime","playChangeListener","fsChangeListener","parentElement","document","fullscreenElement","volumeChangeListener","handlePlay","v","play","pause","handleStop","handleFullscreen","exitFullScreen","fullScreen","showControls","clearHiddenTO","clearTimeout","handleMouseMove","throttle","interval","setTimeout","useImperativeHandle","stop","fullscreen","getVideo","useEffect","addEventListener","removeEventListener","currentValue","_jsxs","classNames","onClick","onDoubleClick","onMouseMove","children","_jsx","onCanPlay","controls","stopPropagation","Button","Toggle","flat","square","after","Icon","icon","PauseRound","active","PlayArrowRound","StopRound","Text","Time","seconds","Progress","value","onChange","t","onDraggingChange","dragging","VolumeOffRound","padding","VolumeDownRound","vertical","FullscreenExitRound","FullscreenRound"],"mappings":"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"}
|
package/lib/css/index.css
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
:root{--font-size: 16px;--font: normal 400 var(--font-size) / 1.5 -apple-system, "Helvetica Neue", sans-serif;--transition: all 0.24s ease;--padding: 0.32em 0.628em;--radius: 4px;--shadow: 0px 2px 8px var(--dim);--blur: blur(16px);--breakpoint: 880px;--label-width: auto;--label-align: left}article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}*{margin:0;padding:0;border:0;box-sizing:border-box}h1,h2,h3,h4,h5,h6,p,article,section,body{line-height:1.2}a{color:inherit;text-decoration:none;cursor:pointer;transition:var(--transition)}b,strong{font-weight:700}html{position:relative;font:var(--font);color:var(--color);min-height:100vh;overflow-x:hidden;scroll-behavior:smooth}input,button,textarea,select{font:inherit}input:-webkit-autofill{box-shadow:inherit;transition:none}ul,ol{list-style:none}img,video,audio,iframe{display:block;margin:auto;max-height:100%;max-width:100%;transition:var(--transition)}h1{font-size:2.4rem;line-height:1.2}h2{font-size:2rem;line-height:1.2}h3{font-size:1.5rem}h4{font-size:1.2rem}h5,h6{font-size:1rem}label{cursor:pointer}pre,code{font-family:inherit}::selection{background-color:rgba(255,216,50,.6392156863)}.os-windows ::-webkit-scrollbar{width:6px;height:6px;cursor:pointer}.os-windows ::-webkit-scrollbar-thumb{background-color:var(--color-8);cursor:pointer;border-radius:var(--radius)}:root kbd,:root .kbd,:root code,:root .code{display:inline-block;font-family:inherit;margin:0 .2em;padding:0 .4em;border-radius:4px;font-size:.86em;line-height:1.5;white-space:nowrap}:root .code,:root code{background:var(--color-8);color:var(--color-0);font-family:unset}:root kbd,:root .kbd{background-color:var(--white);color:var(--black);border-right:2px solid var(--grey-2);border-bottom:3px solid var(--grey-2);box-shadow:-1px -1px 1px var(--color-9)}:root .chip{padding:.05em .72em;font-size:.94em;background:var(--color-main);color:var(--color-main-reverse);border-radius:var(--radius);transition:var(--transition)}:root .chip:hover{--background-hover: var(--color-main-1);background:var(--background-hover)}:root .link{display:inline-flex;position:relative;white-space:nowrap;color:var(--blue)}:root .absolute{position:absolute}:root .relative{position:relative}:root .fixed{position:fixed}:root .flex{display:flex;gap:inherit}:root .grid{display:grid}:root .flex-column{flex-direction:column}:root .flex-wrap{flex-wrap:wrap}:root .flex-1{flex:1}:root .flex-shrink{flex-shrink:0}:root .sticky-top{position:sticky;top:0;z-index:10}:root .sticky-bottom{position:sticky;bottom:0;z-index:10}:root .sticky-left{position:sticky;left:0;z-index:10}:root .sticky-right{position:sticky;right:0;z-index:10}:root .text-center{text-align:center}:root .text-right{text-align:right}:root .bordered{border:1px solid var(--color-7)}:root .ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:root .overflow-auto{overflow:auto}:root .justify-center{justify-content:center}:root .justify-evenly{justify-content:space-evenly}:root .justify-between{justify-content:space-between}:root .justify-start{justify-content:flex-start}:root .justify-end{justify-content:flex-end}:root .items-start{align-items:flex-start}:root .items-end{align-items:flex-end}:root .items-center{align-items:center}:root .self-center{align-self:center}:root .h-100vh{height:100vh}:root .bg-blur{background:var(--background-opacity);backdrop-filter:var(--blur)}:root .roundless{border-radius:0}:root .round{border-radius:50vw}:root .round-0{border-radius:var(--radius)}:root .disabled{opacity:.4;cursor:not-allowed}:root .hidden{display:none !important}:root .shadow{box-shadow:var(--shadow)}:root .hover-shadow{transition:var(--transition)}:root .hover-shadow:hover{box-shadow:var(--shadow)}:root .hover-text-shadow{transition:var(--transition)}:root .hover-text-shadow:hover{text-shadow:var(--shadow)}:root .no-transition{transition:none}:root .hover-opacity{opacity:0;transition:var(--transition)}:root .hover-opacity:hover{opacity:1}:root .bg-transparent{background:rgba(0,0,0,0)}:root .font-italic{font-style:italic}:root .font-bold{font-weight:600}:root .font-sm{font-size:.8em}:root .font-lg{font-size:1.2em}:root .mg-auto{margin:auto}:root .mx-auto{margin-inline:auto}:root .my-auto{margin-block:auto}:root .ml-auto{margin-left:auto}:root .mr-auto{margin-right:auto}:root .mt-auto{margin-top:auto}:root .mb-auto{margin-bottom:auto}:root .mg-0{margin:0px}:root .mx-0{margin-inline:0px}:root .my-0{margin-block:0px}:root .mt-0{margin-top:0px}:root .mb-0{margin-bottom:0px}:root .ml-0{margin-left:0px}:root .mr-0{margin-right:0px}:root .pd-0{padding:0px}:root .px-0{padding-inline:0px}:root .py-0{padding-block:0px}:root .pl-0{padding-left:0px}:root .pr-0{padding-right:0px}:root .pt-0{padding-top:0px}:root .pb-0{padding-bottom:0px}:root .gap-0{gap:0px}:root .mg-1{margin:1px}:root .mx-1{margin-inline:1px}:root .my-1{margin-block:1px}:root .mt-1{margin-top:1px}:root .mb-1{margin-bottom:1px}:root .ml-1{margin-left:1px}:root .mr-1{margin-right:1px}:root .pd-1{padding:1px}:root .px-1{padding-inline:1px}:root .py-1{padding-block:1px}:root .pl-1{padding-left:1px}:root .pr-1{padding-right:1px}:root .pt-1{padding-top:1px}:root .pb-1{padding-bottom:1px}:root .gap-1{gap:1px}:root .mg-2{margin:2px}:root .mx-2{margin-inline:2px}:root .my-2{margin-block:2px}:root .mt-2{margin-top:2px}:root .mb-2{margin-bottom:2px}:root .ml-2{margin-left:2px}:root .mr-2{margin-right:2px}:root .pd-2{padding:2px}:root .px-2{padding-inline:2px}:root .py-2{padding-block:2px}:root .pl-2{padding-left:2px}:root .pr-2{padding-right:2px}:root .pt-2{padding-top:2px}:root .pb-2{padding-bottom:2px}:root .gap-2{gap:2px}:root .mg-4{margin:4px}:root .mx-4{margin-inline:4px}:root .my-4{margin-block:4px}:root .mt-4{margin-top:4px}:root .mb-4{margin-bottom:4px}:root .ml-4{margin-left:4px}:root .mr-4{margin-right:4px}:root .pd-4{padding:4px}:root .px-4{padding-inline:4px}:root .py-4{padding-block:4px}:root .pl-4{padding-left:4px}:root .pr-4{padding-right:4px}:root .pt-4{padding-top:4px}:root .pb-4{padding-bottom:4px}:root .gap-4{gap:4px}:root .mg-6{margin:6px}:root .mx-6{margin-inline:6px}:root .my-6{margin-block:6px}:root .mt-6{margin-top:6px}:root .mb-6{margin-bottom:6px}:root .ml-6{margin-left:6px}:root .mr-6{margin-right:6px}:root .pd-6{padding:6px}:root .px-6{padding-inline:6px}:root .py-6{padding-block:6px}:root .pl-6{padding-left:6px}:root .pr-6{padding-right:6px}:root .pt-6{padding-top:6px}:root .pb-6{padding-bottom:6px}:root .gap-6{gap:6px}:root .mg-8{margin:8px}:root .mx-8{margin-inline:8px}:root .my-8{margin-block:8px}:root .mt-8{margin-top:8px}:root .mb-8{margin-bottom:8px}:root .ml-8{margin-left:8px}:root .mr-8{margin-right:8px}:root .pd-8{padding:8px}:root .px-8{padding-inline:8px}:root .py-8{padding-block:8px}:root .pl-8{padding-left:8px}:root .pr-8{padding-right:8px}:root .pt-8{padding-top:8px}:root .pb-8{padding-bottom:8px}:root .gap-8{gap:8px}:root .mg-10{margin:10px}:root .mx-10{margin-inline:10px}:root .my-10{margin-block:10px}:root .mt-10{margin-top:10px}:root .mb-10{margin-bottom:10px}:root .ml-10{margin-left:10px}:root .mr-10{margin-right:10px}:root .pd-10{padding:10px}:root .px-10{padding-inline:10px}:root .py-10{padding-block:10px}:root .pl-10{padding-left:10px}:root .pr-10{padding-right:10px}:root .pt-10{padding-top:10px}:root .pb-10{padding-bottom:10px}:root .gap-10{gap:10px}:root .mg-12{margin:12px}:root .mx-12{margin-inline:12px}:root .my-12{margin-block:12px}:root .mt-12{margin-top:12px}:root .mb-12{margin-bottom:12px}:root .ml-12{margin-left:12px}:root .mr-12{margin-right:12px}:root .pd-12{padding:12px}:root .px-12{padding-inline:12px}:root .py-12{padding-block:12px}:root .pl-12{padding-left:12px}:root .pr-12{padding-right:12px}:root .pt-12{padding-top:12px}:root .pb-12{padding-bottom:12px}:root .gap-12{gap:12px}:root .mg-16{margin:16px}:root .mx-16{margin-inline:16px}:root .my-16{margin-block:16px}:root .mt-16{margin-top:16px}:root .mb-16{margin-bottom:16px}:root .ml-16{margin-left:16px}:root .mr-16{margin-right:16px}:root .pd-16{padding:16px}:root .px-16{padding-inline:16px}:root .py-16{padding-block:16px}:root .pl-16{padding-left:16px}:root .pr-16{padding-right:16px}:root .pt-16{padding-top:16px}:root .pb-16{padding-bottom:16px}:root .gap-16{gap:16px}:root .mg-20{margin:20px}:root .mx-20{margin-inline:20px}:root .my-20{margin-block:20px}:root .mt-20{margin-top:20px}:root .mb-20{margin-bottom:20px}:root .ml-20{margin-left:20px}:root .mr-20{margin-right:20px}:root .pd-20{padding:20px}:root .px-20{padding-inline:20px}:root .py-20{padding-block:20px}:root .pl-20{padding-left:20px}:root .pr-20{padding-right:20px}:root .pt-20{padding-top:20px}:root .pb-20{padding-bottom:20px}:root .gap-20{gap:20px}:root .mg-24{margin:24px}:root .mx-24{margin-inline:24px}:root .my-24{margin-block:24px}:root .mt-24{margin-top:24px}:root .mb-24{margin-bottom:24px}:root .ml-24{margin-left:24px}:root .mr-24{margin-right:24px}:root .pd-24{padding:24px}:root .px-24{padding-inline:24px}:root .py-24{padding-block:24px}:root .pl-24{padding-left:24px}:root .pr-24{padding-right:24px}:root .pt-24{padding-top:24px}:root .pb-24{padding-bottom:24px}:root .gap-24{gap:24px}:root .mg-28{margin:28px}:root .mx-28{margin-inline:28px}:root .my-28{margin-block:28px}:root .mt-28{margin-top:28px}:root .mb-28{margin-bottom:28px}:root .ml-28{margin-left:28px}:root .mr-28{margin-right:28px}:root .pd-28{padding:28px}:root .px-28{padding-inline:28px}:root .py-28{padding-block:28px}:root .pl-28{padding-left:28px}:root .pr-28{padding-right:28px}:root .pt-28{padding-top:28px}:root .pb-28{padding-bottom:28px}:root .gap-28{gap:28px}:root .mg-32{margin:32px}:root .mx-32{margin-inline:32px}:root .my-32{margin-block:32px}:root .mt-32{margin-top:32px}:root .mb-32{margin-bottom:32px}:root .ml-32{margin-left:32px}:root .mr-32{margin-right:32px}:root .pd-32{padding:32px}:root .px-32{padding-inline:32px}:root .py-32{padding-block:32px}:root .pl-32{padding-left:32px}:root .pr-32{padding-right:32px}:root .pt-32{padding-top:32px}:root .pb-32{padding-bottom:32px}:root .gap-32{gap:32px}:root .mg-36{margin:36px}:root .mx-36{margin-inline:36px}:root .my-36{margin-block:36px}:root .mt-36{margin-top:36px}:root .mb-36{margin-bottom:36px}:root .ml-36{margin-left:36px}:root .mr-36{margin-right:36px}:root .pd-36{padding:36px}:root .px-36{padding-inline:36px}:root .py-36{padding-block:36px}:root .pl-36{padding-left:36px}:root .pr-36{padding-right:36px}:root .pt-36{padding-top:36px}:root .pb-36{padding-bottom:36px}:root .gap-36{gap:36px}:root .mg-40{margin:40px}:root .mx-40{margin-inline:40px}:root .my-40{margin-block:40px}:root .mt-40{margin-top:40px}:root .mb-40{margin-bottom:40px}:root .ml-40{margin-left:40px}:root .mr-40{margin-right:40px}:root .pd-40{padding:40px}:root .px-40{padding-inline:40px}:root .py-40{padding-block:40px}:root .pl-40{padding-left:40px}:root .pr-40{padding-right:40px}:root .pt-40{padding-top:40px}:root .pb-40{padding-bottom:40px}:root .gap-40{gap:40px}:root .mg-48{margin:48px}:root .mx-48{margin-inline:48px}:root .my-48{margin-block:48px}:root .mt-48{margin-top:48px}:root .mb-48{margin-bottom:48px}:root .ml-48{margin-left:48px}:root .mr-48{margin-right:48px}:root .pd-48{padding:48px}:root .px-48{padding-inline:48px}:root .py-48{padding-block:48px}:root .pl-48{padding-left:48px}:root .pr-48{padding-right:48px}:root .pt-48{padding-top:48px}:root .pb-48{padding-bottom:48px}:root .gap-48{gap:48px}:root .mg-56{margin:56px}:root .mx-56{margin-inline:56px}:root .my-56{margin-block:56px}:root .mt-56{margin-top:56px}:root .mb-56{margin-bottom:56px}:root .ml-56{margin-left:56px}:root .mr-56{margin-right:56px}:root .pd-56{padding:56px}:root .px-56{padding-inline:56px}:root .py-56{padding-block:56px}:root .pl-56{padding-left:56px}:root .pr-56{padding-right:56px}:root .pt-56{padding-top:56px}:root .pb-56{padding-bottom:56px}:root .gap-56{gap:56px}:root .mg-60{margin:60px}:root .mx-60{margin-inline:60px}:root .my-60{margin-block:60px}:root .mt-60{margin-top:60px}:root .mb-60{margin-bottom:60px}:root .ml-60{margin-left:60px}:root .mr-60{margin-right:60px}:root .pd-60{padding:60px}:root .px-60{padding-inline:60px}:root .py-60{padding-block:60px}:root .pl-60{padding-left:60px}:root .pr-60{padding-right:60px}:root .pt-60{padding-top:60px}:root .pb-60{padding-bottom:60px}:root .gap-60{gap:60px}:root .mg-72{margin:72px}:root .mx-72{margin-inline:72px}:root .my-72{margin-block:72px}:root .mt-72{margin-top:72px}:root .mb-72{margin-bottom:72px}:root .ml-72{margin-left:72px}:root .mr-72{margin-right:72px}:root .pd-72{padding:72px}:root .px-72{padding-inline:72px}:root .py-72{padding-block:72px}:root .pl-72{padding-left:72px}:root .pr-72{padding-right:72px}:root .pt-72{padding-top:72px}:root .pb-72{padding-bottom:72px}:root .gap-72{gap:72px}:root .mg-80{margin:80px}:root .mx-80{margin-inline:80px}:root .my-80{margin-block:80px}:root .mt-80{margin-top:80px}:root .mb-80{margin-bottom:80px}:root .ml-80{margin-left:80px}:root .mr-80{margin-right:80px}:root .pd-80{padding:80px}:root .px-80{padding-inline:80px}:root .py-80{padding-block:80px}:root .pl-80{padding-left:80px}:root .pr-80{padding-right:80px}:root .pt-80{padding-top:80px}:root .pb-80{padding-bottom:80px}:root .gap-80{gap:80px}:root .mg-96{margin:96px}:root .mx-96{margin-inline:96px}:root .my-96{margin-block:96px}:root .mt-96{margin-top:96px}:root .mb-96{margin-bottom:96px}:root .ml-96{margin-left:96px}:root .mr-96{margin-right:96px}:root .pd-96{padding:96px}:root .px-96{padding-inline:96px}:root .py-96{padding-block:96px}:root .pl-96{padding-left:96px}:root .pr-96{padding-right:96px}:root .pt-96{padding-top:96px}:root .pb-96{padding-bottom:96px}:root .gap-96{gap:96px}:root .mg-100{margin:100px}:root .mx-100{margin-inline:100px}:root .my-100{margin-block:100px}:root .mt-100{margin-top:100px}:root .mb-100{margin-bottom:100px}:root .ml-100{margin-left:100px}:root .mr-100{margin-right:100px}:root .pd-100{padding:100px}:root .px-100{padding-inline:100px}:root .py-100{padding-block:100px}:root .pl-100{padding-left:100px}:root .pr-100{padding-right:100px}:root .pt-100{padding-top:100px}:root .pb-100{padding-bottom:100px}:root .gap-100{gap:100px}:root .mg-120{margin:120px}:root .mx-120{margin-inline:120px}:root .my-120{margin-block:120px}:root .mt-120{margin-top:120px}:root .mb-120{margin-bottom:120px}:root .ml-120{margin-left:120px}:root .mr-120{margin-right:120px}:root .pd-120{padding:120px}:root .px-120{padding-inline:120px}:root .py-120{padding-block:120px}:root .pl-120{padding-left:120px}:root .pr-120{padding-right:120px}:root .pt-120{padding-top:120px}:root .pb-120{padding-bottom:120px}:root .gap-120{gap:120px}:root .mg-160{margin:160px}:root .mx-160{margin-inline:160px}:root .my-160{margin-block:160px}:root .mt-160{margin-top:160px}:root .mb-160{margin-bottom:160px}:root .ml-160{margin-left:160px}:root .mr-160{margin-right:160px}:root .pd-160{padding:160px}:root .px-160{padding-inline:160px}:root .py-160{padding-block:160px}:root .pl-160{padding-left:160px}:root .pr-160{padding-right:160px}:root .pt-160{padding-top:160px}:root .pb-160{padding-bottom:160px}:root .gap-160{gap:160px}:root .mg-200{margin:200px}:root .mx-200{margin-inline:200px}:root .my-200{margin-block:200px}:root .mt-200{margin-top:200px}:root .mb-200{margin-bottom:200px}:root .ml-200{margin-left:200px}:root .mr-200{margin-right:200px}:root .pd-200{padding:200px}:root .px-200{padding-inline:200px}:root .py-200{padding-block:200px}:root .pl-200{padding-left:200px}:root .pr-200{padding-right:200px}:root .pt-200{padding-top:200px}:root .pb-200{padding-bottom:200px}:root .gap-200{gap:200px}:root .w-10{width:10%}:root .h-10{height:10%}:root .w-20{width:20%}:root .h-20{height:20%}:root .w-25{width:25%}:root .h-25{height:25%}:root .w-30{width:30%}:root .h-30{height:30%}:root .w-40{width:40%}:root .h-40{height:40%}:root .w-50{width:50%}:root .h-50{height:50%}:root .w-60{width:60%}:root .h-60{height:60%}:root .w-70{width:70%}:root .h-70{height:70%}:root .w-75{width:75%}:root .h-75{height:75%}:root .w-80{width:80%}:root .h-80{height:80%}:root .w-90{width:90%}:root .h-90{height:90%}:root .w-100{width:100%}:root .h-100{height:100%}@media(min-width: 880px){:root .screen-sm{display:none !important}}@media(max-width: 880px){:root .screen-lg{display:none !important}}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes bounce{20%{transform:translate(12px, 0)}50%{transform:translate(-8px, 0)}80%{transform:translate(6px, 0)}}:root{--background: #fff;--background-1: #f1f1f1;--background-opacity: #ffffffa6;--background-opacity-1: #e9e9e999;--background-opacity-2: #f1f1f1a6;--color: #212121;--color-main: #444;--color-main-0: #f1f1f1;--color-main-1: #313131;--color-main-reverse: #fafafa;--color-backdrop: rgba(0, 0, 0, 0.25);--dim: rgba(0, 0, 0, 0.15);--color-0: black;--color-1: rgb(26.775, 26.775, 26.775);--color-2: rgb(53.55, 53.55, 53.55);--color-3: rgb(80.325, 80.325, 80.325);--color-4: rgb(107.1, 107.1, 107.1);--color-5: rgb(133.875, 133.875, 133.875);--color-6: rgb(160.65, 160.65, 160.65);--color-7: rgb(187.425, 187.425, 187.425);--color-8: rgb(214.2, 214.2, 214.2);--color-9: rgb(240.975, 240.975, 240.975);--white-0: white;--white-1: whitesmoke;--white-2: #ebebeb;--white: white;--black-0: #dbdbdb;--black-1: #212121;--black-2: #313131;--black: black;--red-0: #fcdfe4;--red-1: #dc143c;--red-2: #ee4063;--red: #dc143c;--blue-0: #d6ebff;--blue-1: #007cf4;--blue-2: #47a4ff;--blue: #1e90ff;--green-0: #e7fff2;--green-1: #37a467;--green-2: #53c586;--green: #3cb371;--yellow-0: #fffae5;--yellow-1: #ffb820;--yellow-2: #ffd272;--yellow: #ffc549;--brown-0: #fbece2;--brown-1: #8b3a07;--brown-2: #6d2e07;--brown: #95410c;--grey-0: #f6f6f6;--grey-1: #b1b1b1;--grey-2: #9c9c9c;--grey: #d7d7d7;--pink-0: #ffe3f1;--pink-1: #ff55aa;--pink-2: #ff92c8;--pink: #ff69b4;--purple-0: #eddefb;--purple-1: #751bc9;--purple-2: #a861e9;--purple: #8a2be2;--aqua-0: #e8ffff;--aqua-1: #1efdfd;--aqua-2: #0ae0e0;--aqua: aqua;--orange-0: #fff1e8;--orange-1: #eb7521;--orange-2: #e66a12;--orange: #fb812a;--warning-0: #fff0bf;--warning-1: #f0a313;--warning-2: #fda605;--warning: #ffb01f;--error-0: #ffdbdb;--error-1: #f13636;--error-2: #db1e1e;--error: #ff4545;--success-0: #acf899;--success-1: #4ad926;--success-2: #40d01c;--success: #52e12e}:root .color-main{color:var(--color-main)}:root .bg-main{background:var(--color-main);color:var(--color-main-reverse)}:root .color-0{--color: var(--color-0);color:var(--color)}:root .bg-0{--background: var(--color-0);background:var(--background);color:var(--white)}:root .opacity-0{opacity:0}:root .color-1{--color: var(--color-1);color:var(--color)}:root .bg-1{--background: var(--color-1);background:var(--background);color:var(--white)}:root .opacity-1{opacity:0.1}:root .color-2{--color: var(--color-2);color:var(--color)}:root .bg-2{--background: var(--color-2);background:var(--background);color:var(--white)}:root .opacity-2{opacity:0.2}:root .color-3{--color: var(--color-3);color:var(--color)}:root .bg-3{--background: var(--color-3);background:var(--background);color:var(--white)}:root .opacity-3{opacity:0.3}:root .color-4{--color: var(--color-4);color:var(--color)}:root .bg-4{--background: var(--color-4);background:var(--background);color:var(--white)}:root .opacity-4{opacity:0.4}:root .color-5{--color: var(--color-5);color:var(--color)}:root .bg-5{--background: var(--color-5);background:var(--background)}:root .opacity-5{opacity:0.5}:root .color-6{--color: var(--color-6);color:var(--color)}:root .bg-6{--background: var(--color-6);background:var(--background)}:root .opacity-6{opacity:0.6}:root .color-7{--color: var(--color-7);color:var(--color)}:root .bg-7{--background: var(--color-7);background:var(--background)}:root .opacity-7{opacity:0.7}:root .color-8{--color: var(--color-8);color:var(--color)}:root .bg-8{--background: var(--color-8);background:var(--background)}:root .opacity-8{opacity:0.8}:root .color-9{--color: var(--color-9);color:var(--color)}:root .bg-9{--background: var(--color-9);background:var(--background)}:root .opacity-9{opacity:0.9}:root .bg-white-0{--background: var(--white-0);background:var(--white-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--white)}:root .bg-white-0:hover{--background-hover: var(--white);--color-hover: var(--white)}:root .bg-white-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-white-1{--background: var(--white-1);background:var(--white-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-white-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-white-2{--background: var(--white-2);background:var(--white-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-white-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-white{--background: var(--white);background:var(--white);color:var(--color);--color: var(--black);--color-hover: var(--black)}:root .bg-white:hover{--background-hover: var(--white-1)}:root .bg-white.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-black-0{--background: var(--black-0);background:var(--black-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--black)}:root .bg-black-0:hover{--background-hover: var(--black);--color-hover: var(--white)}:root .bg-black-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-black-1{--background: var(--black-1);background:var(--black-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-black-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-black-2{--background: var(--black-2);background:var(--black-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-black-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-black{--background: var(--black);background:var(--black);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-black:hover{--background-hover: var(--black-1)}:root .bg-black.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-red-0{--background: var(--red-0);background:var(--red-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--red)}:root .bg-red-0:hover{--background-hover: var(--red);--color-hover: var(--white)}:root .bg-red-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-red-1{--background: var(--red-1);background:var(--red-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-red-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-red-2{--background: var(--red-2);background:var(--red-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-red-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-red{--background: var(--red);background:var(--red);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-red:hover{--background-hover: var(--red-1)}:root .bg-red.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-blue-0{--background: var(--blue-0);background:var(--blue-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--blue)}:root .bg-blue-0:hover{--background-hover: var(--blue);--color-hover: var(--white)}:root .bg-blue-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-blue-1{--background: var(--blue-1);background:var(--blue-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-blue-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-blue-2{--background: var(--blue-2);background:var(--blue-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-blue-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-blue{--background: var(--blue);background:var(--blue);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-blue:hover{--background-hover: var(--blue-1)}:root .bg-blue.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-green-0{--background: var(--green-0);background:var(--green-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--green)}:root .bg-green-0:hover{--background-hover: var(--green);--color-hover: var(--white)}:root .bg-green-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-green-1{--background: var(--green-1);background:var(--green-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-green-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-green-2{--background: var(--green-2);background:var(--green-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-green-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-green{--background: var(--green);background:var(--green);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-green:hover{--background-hover: var(--green-1)}:root .bg-green.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-yellow-0{--background: var(--yellow-0);background:var(--yellow-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--yellow)}:root .bg-yellow-0:hover{--background-hover: var(--yellow);--color-hover: var(--white)}:root .bg-yellow-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-yellow-1{--background: var(--yellow-1);background:var(--yellow-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-yellow-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-yellow-2{--background: var(--yellow-2);background:var(--yellow-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-yellow-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-yellow{--background: var(--yellow);background:var(--yellow);color:var(--color);--color: var(--black);--color-hover: var(--black)}:root .bg-yellow:hover{--background-hover: var(--yellow-1)}:root .bg-yellow.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-brown-0{--background: var(--brown-0);background:var(--brown-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--brown)}:root .bg-brown-0:hover{--background-hover: var(--brown);--color-hover: var(--white)}:root .bg-brown-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-brown-1{--background: var(--brown-1);background:var(--brown-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-brown-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-brown-2{--background: var(--brown-2);background:var(--brown-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-brown-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-brown{--background: var(--brown);background:var(--brown);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-brown:hover{--background-hover: var(--brown-1)}:root .bg-brown.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-grey-0{--background: var(--grey-0);background:var(--grey-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--grey)}:root .bg-grey-0:hover{--background-hover: var(--grey);--color-hover: var(--white)}:root .bg-grey-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-grey-1{--background: var(--grey-1);background:var(--grey-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-grey-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-grey-2{--background: var(--grey-2);background:var(--grey-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-grey-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-grey{--background: var(--grey);background:var(--grey);color:var(--color);--color: var(--black);--color-hover: var(--black)}:root .bg-grey:hover{--background-hover: var(--grey-1)}:root .bg-grey.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-pink-0{--background: var(--pink-0);background:var(--pink-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--pink)}:root .bg-pink-0:hover{--background-hover: var(--pink);--color-hover: var(--white)}:root .bg-pink-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-pink-1{--background: var(--pink-1);background:var(--pink-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-pink-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-pink-2{--background: var(--pink-2);background:var(--pink-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-pink-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-pink{--background: var(--pink);background:var(--pink);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-pink:hover{--background-hover: var(--pink-1)}:root .bg-pink.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-purple-0{--background: var(--purple-0);background:var(--purple-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--purple)}:root .bg-purple-0:hover{--background-hover: var(--purple);--color-hover: var(--white)}:root .bg-purple-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-purple-1{--background: var(--purple-1);background:var(--purple-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-purple-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-purple-2{--background: var(--purple-2);background:var(--purple-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-purple-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-purple{--background: var(--purple);background:var(--purple);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-purple:hover{--background-hover: var(--purple-1)}:root .bg-purple.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-aqua-0{--background: var(--aqua-0);background:var(--aqua-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--aqua)}:root .bg-aqua-0:hover{--background-hover: var(--aqua);--color-hover: var(--white)}:root .bg-aqua-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-aqua-1{--background: var(--aqua-1);background:var(--aqua-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-aqua-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-aqua-2{--background: var(--aqua-2);background:var(--aqua-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-aqua-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-aqua{--background: var(--aqua);background:var(--aqua);color:var(--color);--color: var(--black);--color-hover: var(--black)}:root .bg-aqua:hover{--background-hover: var(--aqua-1)}:root .bg-aqua.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-orange-0{--background: var(--orange-0);background:var(--orange-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--orange)}:root .bg-orange-0:hover{--background-hover: var(--orange);--color-hover: var(--white)}:root .bg-orange-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-orange-1{--background: var(--orange-1);background:var(--orange-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-orange-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-orange-2{--background: var(--orange-2);background:var(--orange-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-orange-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-orange{--background: var(--orange);background:var(--orange);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-orange:hover{--background-hover: var(--orange-1)}:root .bg-orange.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-warning-0{--background: var(--warning-0);background:var(--warning-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--warning)}:root .bg-warning-0:hover{--background-hover: var(--warning);--color-hover: var(--white)}:root .bg-warning-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-warning-1{--background: var(--warning-1);background:var(--warning-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-warning-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-warning-2{--background: var(--warning-2);background:var(--warning-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-warning-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-warning{--background: var(--warning);background:var(--warning);color:var(--color);--color: var(--black);--color-hover: var(--black)}:root .bg-warning:hover{--background-hover: var(--warning-1)}:root .bg-warning.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-error-0{--background: var(--error-0);background:var(--error-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--error)}:root .bg-error-0:hover{--background-hover: var(--error);--color-hover: var(--white)}:root .bg-error-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-error-1{--background: var(--error-1);background:var(--error-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-error-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-error-2{--background: var(--error-2);background:var(--error-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-error-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-error{--background: var(--error);background:var(--error);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-error:hover{--background-hover: var(--error-1)}:root .bg-error.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-success-0{--background: var(--success-0);background:var(--success-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--success)}:root .bg-success-0:hover{--background-hover: var(--success);--color-hover: var(--white)}:root .bg-success-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-success-1{--background: var(--success-1);background:var(--success-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-success-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-success-2{--background: var(--success-2);background:var(--success-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-success-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-success{--background: var(--success);background:var(--success);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-success:hover{--background-hover: var(--success-1)}:root .bg-success.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .white-0{--color: var(--white-0);color:var(--color)}:root .white-1{--color: var(--white-1);color:var(--color)}:root .white-2{--color: var(--white-2);color:var(--color)}:root .white{--color: var(--white);--background-hover: var(--white-0);--color-hover: var(--white);color:var(--color)}:root .black-0{--color: var(--black-0);color:var(--color)}:root .black-1{--color: var(--black-1);color:var(--color)}:root .black-2{--color: var(--black-2);color:var(--color)}:root .black{--color: var(--black);--background-hover: var(--black-0);--color-hover: var(--black);color:var(--color)}:root .red-0{--color: var(--red-0);color:var(--color)}:root .red-1{--color: var(--red-1);color:var(--color)}:root .red-2{--color: var(--red-2);color:var(--color)}:root .red{--color: var(--red);--background-hover: var(--red-0);--color-hover: var(--red);color:var(--color)}:root .blue-0{--color: var(--blue-0);color:var(--color)}:root .blue-1{--color: var(--blue-1);color:var(--color)}:root .blue-2{--color: var(--blue-2);color:var(--color)}:root .blue{--color: var(--blue);--background-hover: var(--blue-0);--color-hover: var(--blue);color:var(--color)}:root .green-0{--color: var(--green-0);color:var(--color)}:root .green-1{--color: var(--green-1);color:var(--color)}:root .green-2{--color: var(--green-2);color:var(--color)}:root .green{--color: var(--green);--background-hover: var(--green-0);--color-hover: var(--green);color:var(--color)}:root .yellow-0{--color: var(--yellow-0);color:var(--color)}:root .yellow-1{--color: var(--yellow-1);color:var(--color)}:root .yellow-2{--color: var(--yellow-2);color:var(--color)}:root .yellow{--color: var(--yellow);--background-hover: var(--yellow-0);--color-hover: var(--yellow);color:var(--color)}:root .brown-0{--color: var(--brown-0);color:var(--color)}:root .brown-1{--color: var(--brown-1);color:var(--color)}:root .brown-2{--color: var(--brown-2);color:var(--color)}:root .brown{--color: var(--brown);--background-hover: var(--brown-0);--color-hover: var(--brown);color:var(--color)}:root .grey-0{--color: var(--grey-0);color:var(--color)}:root .grey-1{--color: var(--grey-1);color:var(--color)}:root .grey-2{--color: var(--grey-2);color:var(--color)}:root .grey{--color: var(--grey);--background-hover: var(--grey-0);--color-hover: var(--grey);color:var(--color)}:root .pink-0{--color: var(--pink-0);color:var(--color)}:root .pink-1{--color: var(--pink-1);color:var(--color)}:root .pink-2{--color: var(--pink-2);color:var(--color)}:root .pink{--color: var(--pink);--background-hover: var(--pink-0);--color-hover: var(--pink);color:var(--color)}:root .purple-0{--color: var(--purple-0);color:var(--color)}:root .purple-1{--color: var(--purple-1);color:var(--color)}:root .purple-2{--color: var(--purple-2);color:var(--color)}:root .purple{--color: var(--purple);--background-hover: var(--purple-0);--color-hover: var(--purple);color:var(--color)}:root .aqua-0{--color: var(--aqua-0);color:var(--color)}:root .aqua-1{--color: var(--aqua-1);color:var(--color)}:root .aqua-2{--color: var(--aqua-2);color:var(--color)}:root .aqua{--color: var(--aqua);--background-hover: var(--aqua-0);--color-hover: var(--aqua);color:var(--color)}:root .orange-0{--color: var(--orange-0);color:var(--color)}:root .orange-1{--color: var(--orange-1);color:var(--color)}:root .orange-2{--color: var(--orange-2);color:var(--color)}:root .orange{--color: var(--orange);--background-hover: var(--orange-0);--color-hover: var(--orange);color:var(--color)}:root .warning-0{--color: var(--warning-0);color:var(--color)}:root .warning-1{--color: var(--warning-1);color:var(--color)}:root .warning-2{--color: var(--warning-2);color:var(--color)}:root .warning{--color: var(--warning);--background-hover: var(--warning-0);--color-hover: var(--warning);color:var(--color)}:root .error-0{--color: var(--error-0);color:var(--color)}:root .error-1{--color: var(--error-1);color:var(--color)}:root .error-2{--color: var(--error-2);color:var(--color)}:root .error{--color: var(--error);--background-hover: var(--error-0);--color-hover: var(--error);color:var(--color)}:root .success-0{--color: var(--success-0);color:var(--color)}:root .success-1{--color: var(--success-1);color:var(--color)}:root .success-2{--color: var(--success-2);color:var(--color)}:root .success{--color: var(--success);--background-hover: var(--success-0);--color-hover: var(--success);color:var(--color)}.bg-slight{background-color:var(--color-9);color:var(--black)}.slight{color:var(--color-8)}.theme-dark{--background: #313131;--background-1: #3a3a3a;--background-opacity: #313131a6;--background-opacity-1: #313131aa;--background-opacity-2: #2a2a2aca;--color: #fff;--color-main: #6cc73b;--color-main-0: #313d2b;--color-main-1: #69d62f;--color-main-2: #53b320;--color-main-reverse: #212121;--dim: rgba(0, 0, 0, 0.25);--shadow: 0px 4px 12px var(--dim);background:var(--background);color:var(--color);--color-0: white;--color-1: rgb(233.325, 233.325, 233.325);--color-2: rgb(211.65, 211.65, 211.65);--color-3: rgb(189.975, 189.975, 189.975);--color-4: rgb(168.3, 168.3, 168.3);--color-5: rgb(146.625, 146.625, 146.625);--color-6: rgb(124.95, 124.95, 124.95);--color-7: rgb(103.275, 103.275, 103.275);--color-8: rgb(81.6, 81.6, 81.6);--color-9: rgb(59.925, 59.925, 59.925);--white-0: #595959;--black-0: #6d6d6d;--red-0: #4d3232;--yellow-0: #4b421f;--green-0: #114911;--aqua-0: #1e3d3d;--blue-0: #2d4467;--pink-0: #5d2f37;--brown-0: #3b2d2d;--orange-0: #473514;--purple-0: #372337;--grey-0: #414141;--warning-0: #4b3e13;--error-0: #533535;--success-0: #123b08}.theme-dark .color-0{color:var(--color-0)}.theme-dark .bg-0{--background: var(--color-0);background:var(--background);color:var(--black)}.theme-dark .color-1{color:var(--color-1)}.theme-dark .bg-1{--background: var(--color-1);background:var(--background);color:var(--black)}.theme-dark .color-2{color:var(--color-2)}.theme-dark .bg-2{--background: var(--color-2);background:var(--background);color:var(--black)}.theme-dark .color-3{color:var(--color-3)}.theme-dark .bg-3{--background: var(--color-3);background:var(--background);color:var(--black)}.theme-dark .color-4{color:var(--color-4)}.theme-dark .bg-4{--background: var(--color-4);background:var(--background);color:var(--black)}.theme-dark .color-5{color:var(--color-5)}.theme-dark .bg-5{--background: var(--color-5);background:var(--background)}.theme-dark .color-6{color:var(--color-6)}.theme-dark .bg-6{--background: var(--color-6);background:var(--background)}.theme-dark .color-7{color:var(--color-7)}.theme-dark .bg-7{--background: var(--color-7);background:var(--background)}.theme-dark .color-8{color:var(--color-8)}.theme-dark .bg-8{--background: var(--color-8);background:var(--background)}.theme-dark .color-9{color:var(--color-9)}.theme-dark .bg-9{--background: var(--color-9);background:var(--background)}.theme-dark .bg-slight{color:var(--white)}.theme-dark kbd,.theme-dark .kbd{background-color:var(--black-1);color:var(--white);border-right:2px solid var(--color-8);border-bottom:3px solid var(--color-8);box-shadow:-1px -1px 1px var(--black-2)}@media(prefers-color-scheme: dark){.theme-auto{--background: #313131;--background-1: #3a3a3a;--background-opacity: #313131a6;--background-opacity-1: #313131aa;--background-opacity-2: #2a2a2aca;--color: #fff;--color-main: #6cc73b;--color-main-0: #313d2b;--color-main-1: #69d62f;--color-main-2: #53b320;--color-main-reverse: #212121;--dim: rgba(0, 0, 0, 0.25);--shadow: 0px 4px 12px var(--dim);background:var(--background);color:var(--color);--color-0: white;--color-1: rgb(233.325, 233.325, 233.325);--color-2: rgb(211.65, 211.65, 211.65);--color-3: rgb(189.975, 189.975, 189.975);--color-4: rgb(168.3, 168.3, 168.3);--color-5: rgb(146.625, 146.625, 146.625);--color-6: rgb(124.95, 124.95, 124.95);--color-7: rgb(103.275, 103.275, 103.275);--color-8: rgb(81.6, 81.6, 81.6);--color-9: rgb(59.925, 59.925, 59.925);--white-0: #595959;--black-0: #6d6d6d;--red-0: #4d3232;--yellow-0: #4b421f;--green-0: #114911;--aqua-0: #1e3d3d;--blue-0: #2d4467;--pink-0: #5d2f37;--brown-0: #3b2d2d;--orange-0: #473514;--purple-0: #372337;--grey-0: #414141;--warning-0: #4b3e13;--error-0: #533535;--success-0: #123b08}.theme-auto .color-0{color:var(--color-0)}.theme-auto .bg-0{--background: var(--color-0);background:var(--background);color:var(--black)}.theme-auto .color-1{color:var(--color-1)}.theme-auto .bg-1{--background: var(--color-1);background:var(--background);color:var(--black)}.theme-auto .color-2{color:var(--color-2)}.theme-auto .bg-2{--background: var(--color-2);background:var(--background);color:var(--black)}.theme-auto .color-3{color:var(--color-3)}.theme-auto .bg-3{--background: var(--color-3);background:var(--background);color:var(--black)}.theme-auto .color-4{color:var(--color-4)}.theme-auto .bg-4{--background: var(--color-4);background:var(--background);color:var(--black)}.theme-auto .color-5{color:var(--color-5)}.theme-auto .bg-5{--background: var(--color-5);background:var(--background)}.theme-auto .color-6{color:var(--color-6)}.theme-auto .bg-6{--background: var(--color-6);background:var(--background)}.theme-auto .color-7{color:var(--color-7)}.theme-auto .bg-7{--background: var(--color-7);background:var(--background)}.theme-auto .color-8{color:var(--color-8)}.theme-auto .bg-8{--background: var(--color-8);background:var(--background)}.theme-auto .color-9{color:var(--color-9)}.theme-auto .bg-9{--background: var(--color-9);background:var(--background)}.theme-auto .bg-slight{color:var(--white)}.theme-auto kbd,.theme-auto .kbd{background-color:var(--black-1);color:var(--white);border-right:2px solid var(--color-8);border-bottom:3px solid var(--color-8);box-shadow:-1px -1px 1px var(--black-2)}}.i-input-label{display:flex;flex-wrap:wrap;align-items:baseline;align-content:flex-start;gap:.5em;width:100%;max-width:100%}.i-input-label:has(.i-input-success){--color: var(--green)}.i-input-label:has(.i-input-warning){--color: var(--yellow)}.i-input-label:has(.i-input-error){--color: var(--error)}.i-input-inline{flex-wrap:nowrap}.i-input-inline .i-input-item,.i-input-inline .i-upload-inner,.i-input-inline .i-radio-options{flex:1 1 auto}.i-input-label-text{flex:0 0 var(--label-width);text-align:var(--label-align);border-radius:inherit;font-weight:500;transition:all .12s}.i-input-item{--input-border-width: 2px;--invert-input-border-width: calc(var(--input-border-width) * -1);flex:1 1 100%;display:flex;align-items:baseline;transition:var(--transition);border-radius:var(--radius);border:var(--input-border-width) solid var(--color-9);max-width:100%}.i-input-item .i-btn{align-self:stretch}.i-input-item:hover,.i-input-item:focus-within,.i-input-item.i-input-focus{border-color:var(--color-8)}.i-input-item.i-input-success{border-color:var(--green-0)}.i-input-item.i-input-warning{border-color:var(--yellow-0)}.i-input-item.i-input-error{border-color:var(--error-0)}.i-input-borderless{border-color:rgba(0,0,0,0);background:var(--background-opacity-2)}.i-input{padding:var(--padding);flex:1;width:100%;color:inherit;outline:none;transition:var(--transition);background:rgba(0,0,0,0);border-radius:inherit}.i-input[type=number]::-webkit-inner-spin-button,.i-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.i-input[readonly]{caret-color:rgba(0,0,0,0)}.i-input:disabled{background:var(--background-opacity-1);cursor:not-allowed}.i-input-message{--color: var(--color-5);flex:1 1 auto;align-self:center;z-index:1;font-size:.8em;color:var(--color);border-radius:var(--radius);pointer-events:none}.i-input-success{--color: var(--green)}.i-input-warning{--color: var(--yellow)}.i-input-error{--color: var(--error)}.i-textarea{display:block;transition:var(--transition),width 0s,height 0s;max-width:100%;min-height:2.5em}.i-input-prepend,.i-input-append{margin:var(--invert-input-border-width);display:flex;align-self:stretch;place-items:center}.i-input-prepend .i-btn,.i-input-append .i-btn{border-radius:inherit;height:unset}.i-input-prepend{margin-right:0;border-top-left-radius:inherit;border-bottom-left-radius:inherit}.i-input-append{margin-left:0;border-top-right-radius:inherit;border-bottom-right-radius:inherit}.i-options-block>.i-checkbox-item,.i-options-block>.i-radio-item{flex:1 1 100%}.i-input-number{text-align:center;padding:var(--padding);padding-inline:0}.i-badge{position:relative;display:inline-flex;align-self:center;flex-shrink:0;border-radius:var(--radius)}.i-badge-content{position:absolute;z-index:1;inset:0 0 auto auto;padding:.2em .5em;transition:all .16s;transform:translate(50%, -50%) scale(1);border-radius:inherit;background:var(--background-opacity);backdrop-filter:var(--blur);box-shadow:var(--shadow);font-size:.86em;pointer-events:none}.i-badge-content.i-badge-dot{height:1em;width:1em;padding:0;border-radius:1em;overflow:hidden;color:rgba(0,0,0,0)}.i-badge-content:empty,.i-badge-content.i-badge-hidden{transform:translate(50%, -50%) scale(0)}.i-datagrid-container{border-radius:var(--radius)}.i-datagrid-loading{overflow:hidden !important;user-select:none}.i-datagrid-loading .i-datagrid{max-height:100%;max-width:100%}.i-datagrid-loading .i-loading-container{position:absolute;inset:0;z-index:10;background:var(--background-opacity);backdrop-filter:blur(2px)}.i-datagrid{display:grid;contain:content;content-visibility:auto;width:fit-content;grid-template-columns:var(--grid-template-columns);grid-template-rows:var(--grid-template-rows);min-width:100%}.i-datagrid .i-empty{margin:1em auto;grid-column:1/-1}.i-datagrid-bordered{--datagrid-border-color: var(--color-9);outline:1px solid var(--datagrid-border-color)}.i-datagrid-bordered .i-datagrid-cell{outline:1px solid var(--datagrid-border-color)}.i-datagrid-striped .i-datagrid-row{--datagrid-border-color: var(--color-8)}.i-datagrid-striped .i-datagrid-row:nth-child(odd){--datagrid-cell-background: var(--color-9)}.i-datagrid .i-datagrid-row{--datagrid-cell-background: var(--background);display:contents}.i-datagrid .i-datagrid-row:hover{--datagrid-border-color: var(--color-8);--datagrid-cell-background: var(--color-main-0)}.i-datagrid .i-datagrid-row:hover .i-datagrid-cell{z-index:1}.i-datagrid .i-datagrid-row:hover [class*=" i-datagrid-cell-fixed"]{z-index:3}.i-datagrid-cell{position:sticky;display:flex;align-items:center;justify-content:var(--datagrid-justify);gap:4px;padding:var(--cell-padding);background:var(--datagrid-cell-background);transition:background-color .12s;overflow:hidden}.i-datagrid-cell:first-child{border-top-left-radius:var(--radius);border-bottom-left-radius:var(--radius)}.i-datagrid-cell:last-child{border-top-right-radius:var(--radius);border-bottom-right-radius:var(--radius)}[class*=" i-datagrid-cell-fixed"]{z-index:2}.i-datagrid-cell-fixed-right{box-shadow:-2px 0 4px var(--color-9)}.i-datagrid-cell-fixed-left{box-shadow:2px 0 4px var(--color-9)}.i-datagrid-cell-content{min-width:0;flex:1 1 auto;display:inherit;gap:inherit;justify-content:inherit;white-space:nowrap;overflow:hidden}.i-datagrid-cell-content-ellipsis{display:block;text-overflow:ellipsis;text-align:var(--datagrid-justify)}.i-datagrid-header .i-datagrid-cell{--datagrid-cell-background: var(--background-opacity-2);z-index:3;white-space:nowrap;text-overflow:ellipsis;line-height:1;user-select:none;backdrop-filter:var(--blur)}.i-datagrid-header [class*=" i-datagrid-cell-fixed"]{z-index:4}.i-datagrid-resizor{position:absolute;inset:0 0 0 auto;width:4px;transition:.12s;cursor:ew-resize}.i-datagrid-resizor:hover{background-color:var(--color-5)}.i-datagrid-has-sorter{cursor:pointer}.i-datagrid-has-sorter:hover{--datagrid-cell-background: var(--color-8)}.i-datagrid-sorter{display:flex;flex-direction:column;flex-shrink:0;width:.8em;overflow:hidden;color:var(--color-7)}.i-datagrid-sorter-caret:first-child{margin-bottom:-0.4em;transform:rotate(-90deg)}.i-datagrid-sorter-caret:last-child{transform:rotate(90deg)}.i-datagrid-sorter-asc .i-datagrid-sorter-caret:first-child{color:var(--color-main)}.i-datagrid-sorter-desc .i-datagrid-sorter-caret:last-child{color:var(--color-main)}.i-checkbox{gap:1em}.i-checkbox-item{display:inline-flex;align-items:baseline;gap:.25em;border-radius:var(--radius);align-self:flex-start}.i-checkbox-item:hover .i-checkbox-input{box-shadow:inset 0 0 0 2px var(--color-5)}.i-checkbox-item:hover .i-checkbox-switch{box-shadow:inset 0 0 0 2px var(--color-8)}.i-checkbox-item:hover .i-checkbox-partof{box-shadow:none}.i-checkbox-item .i-checkbox-input:checked{box-shadow:none}.i-checkbox-options{flex:1 1 100%;position:relative;display:flex;flex-wrap:wrap;gap:.625em;align-self:baseline}.i-checkbox-text{display:inline-flex;transition:var(--transition);user-select:none;border-radius:inherit;color:var(--color-3)}.i-checkbox-text:empty{display:none}.i-checkbox-input{position:relative;display:flex;cursor:inherit;height:1.125em;width:1.125em;overflow:hidden;appearance:none;border-radius:inherit;transition:var(--transition);outline:0;align-self:center}.i-checkbox-custom{width:0;height:0}.i-checkbox-switch{height:1.125em;width:2.2em;overflow:unset;border-radius:2.4em;box-shadow:inset 0 0 0 2px var(--color-9);background:var(--color-9)}.i-checkbox-switch:hover:after{box-shadow:0 0 0 2px var(--color-7);background-color:var(--color-main-0)}.i-checkbox-default{border-radius:2px;box-shadow:inset 0 0 0 2px var(--color-7)}.i-checkbox-button{display:none}.i-checkbox-default:after,.i-checkbox-switch:before,.i-checkbox-switch:after,.i-checkbox-partof:after{content:" ";position:absolute;transition:var(--transition)}.i-checkbox-default:after{left:34%;top:16%;height:50%;width:20%;border-bottom:2px solid var(--color-main-reverse);border-right:2px solid var(--color-main-reverse);transform:rotate(90deg) scale(0);border-radius:1px}.i-checkbox-switch:after{left:0;top:50%;width:1em;height:1em;transform:translate(0, -50%);box-shadow:0 0 0 2px var(--color-8);border-radius:1em;transition:var(--transition);background-color:var(--background)}.i-checkbox-switch:active:after{width:1.5em}.i-checkbox-switch:active:checked:after{left:-0.5em}.i-checkbox-input:checked.i-checkbox-default{background-color:var(--color-main)}.i-checkbox-input:checked.i-checkbox-default:after{transform:rotate(45deg)}.i-checkbox-input:checked.i-checkbox-switch{background-color:var(--color-main)}.i-checkbox-input:checked.i-checkbox-switch:after{box-shadow:0 0 0 2px var(--color-main);transform:translate(1.2em, -50%);background-color:var(--background)}.i-checkbox-input:checked+.i-checkbox-text{color:var(--color-main)}.i-checkbox-button+.i-checkbox-text{padding:0 1em;line-height:1.8;font-size:.9em;display:flex;align-items:center;white-space:nowrap;border-radius:2em;border:1px solid var(--color-9)}.i-checkbox-button:hover+.i-checkbox-text{background-color:var(--color-9);border-color:var(--color-8)}.i-checkbox-button:checked+.i-checkbox-text{background-color:var(--color-main);color:var(--color-main-reverse)}.i-checkbox-partof{border-radius:2px;background-color:var(--color-main)}.i-checkbox-partof:after{background-color:var(--color-main-reverse);height:2px;width:.5em;left:50%;top:50%;transform:translate(-50%, -50%);border-radius:var(--radius)}.i-checkbox-message{margin-top:.5em;font-size:.8em;align-self:flex-start;pointer-events:none}.i-checkbox-success .i-checkbox-input{box-shadow:inset 0 0 0 2px var(--success-0)}.i-checkbox-success .i-checkbox-input:checked{background-color:var(--success-0)}.i-checkbox-success .i-checkbox-message{color:var(--success)}.i-checkbox-warning .i-checkbox-input{box-shadow:inset 0 0 0 2px var(--warning-0)}.i-checkbox-warning .i-checkbox-input:checked{background-color:var(--warning-0)}.i-checkbox-warning .i-checkbox-message{color:var(--warning)}.i-checkbox-error .i-checkbox-input{box-shadow:inset 0 0 0 2px var(--error-0)}.i-checkbox-error .i-checkbox-input:checked{background-color:var(--error-0)}.i-checkbox-error .i-checkbox-message{color:var(--error)}.i-collapse{border-radius:var(--radius)}.i-collapse-bordered{border:1px solid var(--color-8)}.i-collapse-bordered .i-collapse-item+.i-collapse-item{border-top:1px solid var(--color-8)}.i-collapse-item{border-radius:var(--radius)}.i-collapse-header{display:flex;justify-content:space-between;align-items:center;padding:.5em;transition:var(--transition);font-weight:500;border-radius:var(--radius)}.i-collapse-header:hover{background-color:var(--background-opacity-1)}.i-collapse-toggle{margin:0;display:flex;user-select:none}.i-collapse-content{padding:0 .5em;height:0;overflow:hidden;transition:var(--transition);border-radius:var(--radius)}.i-collapse-active>.i-collapse-header,.i-collapse-header:hover{opacity:1}.i-collapse-active>.i-collapse-content{padding:.5em;height:unset}.i-collapse-disabled{pointer-events:none;opacity:.4}.i-collapse-disabled>.i-collapse-content{padding:0 .5em;height:0;overflow:hidden}.i-preview{padding:0}.i-preview .i-modal{position:static;background:rgba(0,0,0,0);overflow:unset;transform:none;pointer-events:none !important;width:100%;height:100%}.i-preview-container{position:relative;width:100%;height:100%}.i-preview-content{display:flex;align-items:center;justify-content:center;width:100%;height:100%;transition:var(--transition);pointer-events:none}.i-preview-content *{pointer-events:all}.i-preview-controls{position:fixed;z-index:10;right:.5em;top:.5em;padding:4px;display:flex;align-items:center;gap:1px;background:var(--background-opacity);border-radius:var(--radius);font-size:.9em;pointer-events:all;transition:all .24s ease-out}.i-preview-controls:hover{opacity:1}.i-preview-controls-hidden{opacity:0}.i-preview-unknown{display:flex;flex-direction:column;align-items:center;padding:.5em 1em;background:var(--background);border-radius:var(--radius)}.i-affix{position:fixed;z-index:50;display:flex;flex-direction:column;gap:.5em;transition:var(--transition)}.i-affix-hidden .i-affix-totop{opacity:0}.i-btn{--gap: 0.5em;--background: var(--color-main);--background-hover: var(--color-main-1);--color: var(--color-main-reverse);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--gap);padding:0 .6em;height:2.25em;border-radius:var(--radius);border:2px solid rgba(0,0,0,0);transition:var(--transition);user-select:none;cursor:pointer;white-space:nowrap;outline:none;font-weight:500;font-size:.94em;background:var(--background);color:var(--color);line-height:1;flex-shrink:0}.i-btn .i-ripple-container{inset:-2px}.i-btn-toggle{overflow:hidden}.i-btn-toggle-content{display:inline-flex;gap:var(--gap);align-items:center;transform:scale(0.4)}.i-btn-toggle-content.i-btn-toggle-active{transition:var(--transition);transform:none}.i-btn-block{width:100%}.i-btn-large{font-size:1.25em}.i-btn-extreme{font-size:2em;height:2em}.i-btn-small{height:2em;line-height:2;font-size:.86em;padding:0 .4em}.i-btn-mini{line-height:1;height:1.4em;font-size:.8em;padding:0 .2em}.i-btn-square{padding:0;width:2.25em}.i-btn-square.i-btn-extreme,.i-btn-square.i-btn-small{width:2em}.i-btn:hover{--background: var(--background-hover)}.i-btn:active{--background: var(--color-main)}.i-btn-secondary{--background-hover: var(--color-8);--background: var(--color-9);--color: var(--color-1)}.i-btn-flat{--background-hover: var(--color-9);--color-main-reverse: var(--color);--background: transparent;--color: var(--color-1)}.i-btn-outline{--background-hover: var(--color-main-0);--color: var(--color-main)}.i-btn-outline.i-btn{--background: transparent;border-color:var(--color)}.i-btn.i-btn-outline:hover,.i-btn.i-btn-secondary:hover,.i-btn.i-btn-flat:hover{--background: var(--background-hover)}.i-btn-content{display:contents}.i-btn-loading{opacity:.628;cursor:default}.i-btn-group-horizonal{display:flex}.i-btn-group-horizonal .i-btn:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.i-btn-group-horizonal .i-btn:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.i-btn-group-vertical{display:flex;flex-direction:column}.i-btn-group-vertical .i-btn:not(:first-child){border-top-left-radius:0;border-top-right-radius:0}.i-btn-group-vertical .i-btn:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0}.i-description{display:grid}.i-description-item{display:flex;gap:.5em}.i-description-item-vertical{flex-direction:column}.i-description-label{flex-shrink:0;width:var(--description-label-width);color:var(--color-5)}.i-description-value{flex:1}.i-backdrop-drawer{position:fixed;inset:0;z-index:100;pointer-events:none;background:var(--color-backdrop);backdrop-filter:blur(8px);transition:var(--transition);opacity:0;display:flex}.i-backdrop-drawer.i-active{opacity:1;pointer-events:unset}.i-drawer{position:absolute;display:flex;flex-direction:column;max-width:100%;max-height:100%;overflow:auto;box-shadow:var(--shadow);transition:var(--transition);background:var(--background-1);backdrop-filter:var(--blur)}.i-drawer-left{inset:0 auto 0 0;transform:translate3d(-100%, 0, 0)}.i-drawer-top{inset:0 0 auto;transform:translate3d(0, -100%, 0)}.i-drawer-right{inset:0 0 0 auto;transform:translate3d(100%, 0, 0)}.i-drawer-bottom{inset:auto 0 0;transform:translate3d(0, 100%, 0)}.i-active>.i-drawer{opacity:1;transform:none;pointer-events:unset}.i-drawer-header,.i-drawer-footer{display:flex;align-items:center;padding:12px}.i-drawer-header:empty,.i-drawer-footer:empty{display:none}.i-drawer-content{flex:1;overflow-x:hidden}.i-drawer-close{margin:0 0 0 auto;display:flex;align-self:flex-start;border-radius:var(--radius)}.i-dropdown-content{display:flex;flex-direction:column;max-height:40vh;padding:8px;gap:2px;overflow-x:hidden;border-radius:inherit}.i-editor{display:flex;flex-direction:column}.i-editor:focus-within>.i-editor-controls,.i-editor:focus-within>.i-editor-content,.i-editor:hover>.i-editor-controls,.i-editor:hover>.i-editor-content{border-color:var(--color-8)}.i-editor-borderless{border-radius:var(--radius)}.i-editor-borderless>.i-editor-controls,.i-editor-borderless>.i-editor-content{border:none}.i-editor-controls{display:flex;gap:2px;border:2px solid var(--color-9);border-bottom:0;padding:2px;border-radius:var(--radius) var(--radius) 0 0;transition:var(--transition)}.i-editor-controls .i-btn{--color: var(--color-5)}.i-editor-controls .i-btn:hover{--color: var(--color)}.i-editor-controls .i-btn:hover .i-editor-control-tip{opacity:1}.i-editor-control-tip{position:absolute;z-index:1;top:100%;left:50%;transform:translate(-50%, 0);opacity:0;pointer-events:none;transition:var(--transition)}.i-editor-content{flex:1;outline:none;padding:var(--padding);border:2px solid var(--color-9);border-radius:0 0 var(--radius) var(--radius);transition:var(--transition);overflow:auto;white-space:pre-wrap;word-wrap:break-word;word-break:break-all;tab-size:1em}.i-editor-content:first-child{border-radius:var(--radius)}.i-editor-content:hover,.i-editor-content:focus{border-color:var(--color-8)}.i-editor-content a{color:var(--blue)}.i-editor-content img{margin:0}.i-editor-content:empty:before{content:attr(data-placeholder);color:var(--color-5)}.i-image{position:relative;display:inline-flex;align-items:center;justify-content:center;align-self:center;border-radius:var(--radius);overflow:hidden;vertical-align:middle;background:var(--background-opacity);backdrop-filter:var(--blur)}.i-image .i-loading-container{z-index:1;backdrop-filter:var(--blur)}.i-image>img{border-radius:inherit}.i-image-cover{position:absolute;inset:0;padding:.5em;display:flex;align-items:center;justify-content:center;backdrop-filter:var(--blur)}.i-form{display:grid;max-width:100%}.i-form-inline{--label-inline: nowrap}.i-form-inline .i-input-label{flex-wrap:nowrap}.i-card{--card-padding: 8px 12px;display:flex;flex-direction:column;background:var(--background-opacity-2);backdrop-filter:var(--blur);border-radius:var(--radius)}.i-card-bordered{border:1px solid var(--color-8)}.i-card-header{display:flex;align-items:center;padding:var(--card-padding);gap:.25em}.i-card-content{flex:1}.i-card-footer{margin-top:auto;display:flex;align-items:center;padding:var(--card-padding);gap:.25em}.icon{vertical-align:middle}.i-list{overflow:auto}.i-list-item{display:flex;gap:.5em;padding:.32em .4em;transition:var(--transition);border-radius:var(--radius)}.i-list-option{position:relative;cursor:pointer;user-select:none;white-space:nowrap;justify-content:space-between}.i-list-option:hover{background-color:var(--background-opacity-1)}.i-list-item-label{align-self:flex-start}.i-modal-container{position:absolute;inset:0;z-index:100;padding:12px;transition:var(--transition);opacity:0;pointer-events:none;display:flex;overflow:hidden}.i-modal-container.i-modal-active{opacity:1}.i-modal-backdrop{background:var(--color-backdrop);backdrop-filter:blur(8px)}.i-modal-backdrop.i-modal-active{pointer-events:unset}.i-modal-customized{overflow:unset}.i-modal{position:relative;display:flex;flex-direction:column;margin:auto;max-width:100%;max-height:100%;overflow-x:hidden;border-radius:var(--radius);transform:translate(0, 12px);transition:var(--transition);background:var(--background)}.i-modal.bounced{animation:bounce .4s ease-in-out 0s}.i-modal-active>.i-modal{opacity:1;transform:none;pointer-events:unset}.i-modal-header,.i-modal-footer{display:flex;align-items:center;padding:12px;gap:12px}.i-modal-header:empty,.i-modal-footer:empty{display:none}.i-modal-footer{justify-content:center}.i-modal-content{flex:1;max-height:100%;overflow-x:hidden}.i-modal .i-modal-close{margin:0 0 0 auto;display:flex;align-self:flex-start;border-radius:var(--radius)}.i-messages{position:fixed;inset:12px;pointer-events:none;display:flex;flex-direction:column;justify-content:center;z-index:10000;transition:var(--transition);cursor:default}.i-message{position:absolute;padding:var(--padding);pointer-events:all;opacity:0;transition:var(--transition);transform:translate(80px, 0) scale(0.86) skew(-40deg);background:var(--background-opacity);border-radius:var(--radius);box-shadow:var(--shadow);backdrop-filter:var(--blur)}.i-message.i-message-active{opacity:1;transform:translate(0, 0)}.i-loading-container{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.5em;font-size:inherit;transform:translateZ(0);border-radius:inherit}.i-loading-icon{stroke:var(--color);width:1em;height:1em;animation:rotate .628s linear 0s infinite}.i-pagination{display:flex;align-items:center;gap:.2em}.i-page{--background: transparent;--color: var(--color-7);position:relative;display:inline-flex;align-items:center;justify-content:center;padding:0 .32em;height:2.25em;min-width:2.25em;border-radius:var(--radius);border:2px solid rgba(0,0,0,0);transition:var(--transition);user-select:none;cursor:pointer;white-space:nowrap;outline:none;color:var(--color);background:var(--background)}.i-page .i-ripple-container{inset:-2px}.i-page .i-loading-container{position:absolute;inset:0;z-index:1;background:var(--background-opacity);backdrop-filter:var(--blur)}.i-page:hover{--background: var(--background-opacity-1)}.i-page.i-page-active{--background: var(--color-main-0);--color: var(--color-main);cursor:default}.i-page.i-page-loading{--background: unset;cursor:default}.i-popconfirm{padding:12px}.i-resizable{display:flex;overflow:hidden}.i-resizable-vertical{flex-direction:column}.i-resizable-vertical>.i-resizable-line{cursor:ns-resize;width:100%;height:2px}.i-resizable-a{overflow:auto}.i-resizable-b{flex:1;overflow:auto}.i-resizable-line{position:relative;display:flex;justify-content:center;align-items:center;width:2px;height:100%;background:var(--color-8);cursor:ew-resize;transition:var(--transition);touch-action:none;user-select:none}.i-resizable-line:hover,.i-resizable-line.i-resizable-resizing{outline:1px solid var(--color-8)}.i-resizable-line:hover>.i-resizable-line-node,.i-resizable-line.i-resizable-resizing>.i-resizable-line-node{opacity:1}.i-resizable-line-node{display:flex;position:relative;z-index:1;pointer-events:none;opacity:0;transition:var(--transition);background:inherit;border-radius:var(--radius);font-size:.8em}.i-radio{position:relative;display:inline-flex;flex-wrap:wrap;gap:1em}.i-radio-label{width:var(--label-width);text-align:var(--label-align);font-weight:500}.i-radio-item{display:inline-flex;align-items:baseline;border-radius:var(--radius)}.i-radio-item:hover .i-radio-input{box-shadow:inset 0 0 0 3px var(--color-7);background-color:var(--color-main-0)}.i-radio-item-custom>.i-radio-input{width:0;height:0}.i-input-success .i-radio-input{box-shadow:inset 0 0 0 3px var(--green-0)}.i-input-warning .i-radio-input{box-shadow:inset 0 0 0 3px var(--yellow-0)}.i-input-error .i-radio-input{box-shadow:inset 0 0 0 3px var(--error-0)}.i-radio-options{flex:1 1 100%;position:relative;display:flex;flex-wrap:wrap;gap:.625em;align-self:baseline}.i-radio-options-button{flex:none}.i-radio-text{display:inline-flex;margin-left:.4em;transition:var(--transition);user-select:none;border-radius:inherit;color:var(--color-3)}.i-radio-input{position:relative;display:flex;cursor:inherit;height:1.125em;width:1.125em;flex-shrink:0;overflow:hidden;appearance:none;border-radius:50%;transition:all .15s;outline:0;align-self:center;box-shadow:inset 0 0 0 3px var(--color-8)}.i-radio-default{border:0 solid rgba(0,0,0,0)}.i-radio-input:checked.i-radio-default{border-width:.4em;border-color:var(--color-main);background:var(--color-main-reverse);box-shadow:none}.i-radio-input:checked.i-radio-default+.i-radio-text{color:var(--color-main)}.i-radio-default:active{transform:scale(1.1)}.i-radio-button{display:none}.i-radio-button+.i-radio-text{margin-left:0;padding:0 .628em;line-height:1.8;font-size:.94em;white-space:nowrap;border:1px solid var(--color-9)}.i-radio-button+.i-radio-text:hover{background:var(--color-main-0);border-color:var(--color-8)}.i-radio-button:checked+.i-radio-text{background:var(--color-main);color:var(--color-main-reverse);box-shadow:0 0 2px var(--dim);border-color:var(--color-main)}.i-radio-message{margin-top:.5em;font-size:.8em;align-self:flex-start;pointer-events:none}.i-radio-success .i-radio-input{box-shadow:inset 0 0 0 3px var(--success-0)}.i-radio-success .i-radio-message{color:var(--success)}.i-radio-warning .i-radio-input{box-shadow:inset 0 0 0 3px var(--warning-0)}.i-radio-warning .i-radio-message{color:var(--warning)}.i-radio-error .i-radio-input{box-shadow:inset 0 0 0 3px var(--error-0)}.i-radio-error .i-radio-message{color:var(--error)}.i-select{display:flex;gap:.5em}.i-select-multiple{flex-wrap:wrap;padding:.25em .628em}.i-select-multiple .i-tag{position:relative;padding:0 .5em;line-height:1.425em;background:var(--color-8)}.i-select-options{display:flex;flex-direction:column;max-height:40vh;padding:4px;gap:2px;overflow-x:hidden;border-radius:inherit}.i-select-options .i-list-item{justify-content:unset;align-items:center;color:var(--color-5)}.i-select-options .i-list-item.i-list-item-active{color:var(--color-main);background:var(--color-main-0)}.i-select-options .i-list-item.i-list-item-active .i-select-option-check{opacity:1}.i-select-options .i-list-item.disabled{pointer-events:none}.i-select-options-multiple .i-list-item.i-list-item-active{background:rgba(0,0,0,0)}.i-select-option-check{opacity:0}.i-select-filter{position:sticky;top:0;z-index:1;display:flex;flex-wrap:wrap;background:var(--background-opacity);backdrop-filter:var(--blur);border-bottom:1px solid var(--background-opacity-1)}.i-select-filter:empty{display:none}.i-progress{flex:1 1 100%;position:relative;display:flex;background:var(--background-1);border-radius:var(--radius);cursor:pointer}.i-progress-vertical{height:100%}.i-progress-vertical>.i-progress-bar{height:100%;align-self:flex-end}.i-progress-bar{position:relative;width:100%;background:var(--color-main);border-radius:var(--radius);transform-origin:left;transition:var(--transition)}.i-progress-cursor{position:absolute;right:0;top:50%;display:flex;min-height:120%;min-width:1em;transform:translate(50%, -50%) scale(0);transition:var(--transition);border-radius:inherit;box-shadow:var(--shadow);user-select:none;overflow:hidden}.i-progress:hover .i-progress-cursor,.no-transition>.i-progress-cursor{transform:translate(50%, -50%) scale(1)}.i-progress-circle{position:relative}.i-progress-circle-path{transition:var(--transition);border-radius:50px}.i-progress-circle-value{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);font-size:1.5em}.i-popup{position:absolute;z-index:100;opacity:0;transition:opacity .12s,transform .12s;border-radius:var(--radius);background:var(--background);box-shadow:var(--shadow);transform:translate(0, 2px)}.i-popup-arrow{position:absolute;width:8px;height:24px;pointer-events:none;color:unset}.i-popup-arrow path{fill:var(--background)}.i-step{display:flex;flex-wrap:wrap;gap:.5em;overflow:hidden}.i-step-vertical{flex-direction:column}.i-step-vertical .i-step-item{flex-direction:row}.i-step-vertical .i-step-item:not(:last-child) .i-step-item-right{padding-bottom:1em}.i-step-item{display:flex;flex-direction:column;gap:.5em;flex:1 1 auto;transition:var(--transition)}.i-step-item:last-child{flex:none}.i-step-item:last-child .i-step-divider{display:none}.i-step-item.i-step-item-finished{opacity:.4}.i-step-item.i-step-item-finished .i-step-divider{border-style:solid}.i-step-item.i-step-item-pending{opacity:.4}.i-step-item:hover{opacity:1}.i-step-item-index{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.5em;line-height:1.5em;border-radius:1.5em;background:var(--color-4);color:var(--background)}.i-step-divider{flex:1;align-self:center;border:1px dashed var(--color-7)}.i-step-item-title{display:flex;align-items:center;gap:.5em;white-space:nowrap}.i-step-item-left{display:flex;flex-direction:column;align-items:center;gap:.5em}.i-step-item-right{display:flex;flex-direction:column;gap:.5em}.i-video{position:relative;background:#000;border-radius:var(--radius);overflow:hidden}.i-video video{width:100%;height:100%}.i-video-controls{position:absolute;left:0;bottom:0;right:0;display:flex;align-items:center;padding:4px;gap:4px;font-size:.9em;white-space:nowrap;user-select:none;transition:var(--transition);background:var(--background-opacity);backdrop-filter:var(--blur)}.i-video-controls .i-btn{flex-shrink:0}.i-video-controls .i-icon{font-size:1.2em}.i-video-controls:hover{opacity:1;pointer-events:unset}.i-video-controls-hidden{opacity:0;pointer-events:none}.i-video-control{display:flex;align-items:center}.i-video-times{margin-inline:8px;display:flex;align-items:center;gap:4px}.i-video-volume{position:absolute;z-index:1;bottom:100%;left:50%;transform:translate(-50%, 4px);padding:8px;opacity:0;pointer-events:none;border-radius:var(--radius);transition:var(--transition);backdrop-filter:var(--blur);background:var(--background-opacity)}.i-video-control-volume{position:relative}.i-video-control-volume:hover .i-video-volume{opacity:1;pointer-events:unset}.i-text-gradient{-webkit-text-fill-color:rgba(0,0,0,0)}.i-text-gradient-wave{background-size:200% 100%;background-position:0 0;animation:text-wave 1.2s linear 0s infinite}@keyframes text-wave{100%{background-position:-100% 0}}.i-tag{--background: var(--color-9);--color: var(--color-1);position:relative;display:inline-flex;align-items:center;justify-content:center;align-self:center;gap:.5em;padding:.1em .5em;border-radius:var(--radius);background:var(--background);color:var(--color);border:2px solid rgba(0,0,0,0);transition:var(--transition);font-size:.81em;line-height:1}.i-tag:hover .i-tag-hover-close{opacity:1;transform:translate(50%, -50%) scale(1)}.i-tag-large{font-size:1em}.i-tag-extreme{font-size:1.5em;height:2em}.i-tag-small{font-size:.72em;padding:.125em .4em}.i-tag-dot{content:" ";width:.385em;height:.385em;border-radius:50%;background-color:var(--color);box-shadow:0 -1px 1px 0 rgba(var(--color), 0.3);flex-shrink:0;transition:inherit}.i-tag-outline{--background: transparent;border-color:var(--color)}.i-tag-close{position:absolute;right:0;top:0;z-index:1;margin:0;background:var(--error);color:var(--white);transform:translate(50%, -50%);font-size:.81em;transition:all .16s}.i-tag-close:hover{background:var(--error-1);color:var(--white)}.i-tag-hover-close{transform:translate(50%, -50%) scale(0);opacity:0}.i-tag-clickable{cursor:pointer}.i-tag-clickable:hover{background:var(--background-hover);color:var(--color-hover)}.i-tree{display:flex;flex-direction:column;gap:1px;color:var(--color-2)}.i-tree-group-title{position:relative;font-size:1em;display:flex;font-weight:300;font-style:italic;font-size:.9em}.i-tree-group-title:after{content:" ";margin-left:.5em;flex:1;height:1px;align-self:center;background:var(--color-8)}.i-tree-item-header{position:relative;display:flex;align-items:center;gap:.25em;padding:.4em;user-select:none;border-radius:var(--radius);overflow:hidden;color:var(--color-6)}.i-tree-item-header.i-tree-item-round{border-radius:100px}.i-tree-item-header.i-tree-item-selected,.i-tree-item-header:hover{background:var(--color-main-0);color:var(--color-main)}.i-tree-round{--radius: 100px}.i-tree-item-icon{display:flex}.i-tree-checkbox{align-self:center}.i-tree-toggle{margin-left:auto;transition:var(--transition);border-radius:inherit;color:var(--color-6)}.i-tree-toggle:hover{color:var(--color-3);background:var(--background-opacity)}.i-tree-item-content{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(0, 1, 0, 1)}.i-tree-expand>.i-tree-item-content{transition:max-height .25s cubic-bezier(1, 0, 1, 0);max-height:2000px}.i-tree-expand>.i-tree-item-header{color:var(--color-main);opacity:1}.i-tree-expand>.i-tree-item-header>.i-tree-toggle{transform:rotateX(180deg)}.i-tabs{max-width:100%;gap:.5em}.i-tabs-line .i-tab-navs{gap:1em}.i-tabs-line .i-tab-nav{padding:.4em 0}.i-tabs-line .i-tab-nav.i-tab-active{--color: var(--color-main)}.i-tabs-line .i-tab-navs-bar{background:var(--color-main)}.i-tabs-line .i-tab-navs-vertical>.i-tab-navs{gap:.5em}.i-tabs-line .i-tab-navs-vertical>.i-tab-navs>.i-tab-nav{padding:.25em 1em}.i-tab-navs-container{display:flex;border-radius:var(--radius);scroll-behavior:smooth;gap:4px;align-items:center}.i-tab-navs-vertical{align-items:flex-end;flex-direction:column}.i-tab-navs{flex:1;position:relative;display:flex;flex-direction:inherit;overflow:auto;user-select:none;scroll-behavior:unset;scrollbar-width:none;gap:1px}.i-tab-navs::-webkit-scrollbar{display:none}.i-tabs-pane .i-tab-navs-container{position:relative}.i-tabs-pane .i-tab-navs-container:before{position:absolute;bottom:0;left:0;right:0;width:100%;border-top:1px solid var(--color-8);content:"";z-index:1}.i-tabs-pane .i-tab-navs{gap:4px}.i-tabs-pane .i-tab-navs .i-tab-nav{border-radius:var(--radius) var(--radius) 0 0;border:1px solid rgba(0,0,0,0)}.i-tabs-pane .i-tab-navs .i-tab-nav:hover{border-color:var(--color-8);border-bottom-color:var(--background)}.i-tabs-pane .i-tab-navs .i-tab-active{z-index:2;background:rgba(0,0,0,0);border-color:var(--color-8);border-bottom:1px solid var(--background);box-shadow:1px 2px 2px var(--color-8)}.i-tabs-pane .i-tab-navs .i-tab-active:hover{background-color:rgba(0,0,0,0)}.i-tabs-pane .i-tab-navs-vertical:before{left:unset;top:0;width:unset;height:100%;border-top:none;border-right:1px solid var(--color-8)}.i-tabs-pane .i-tab-navs-vertical .i-tab-navs .i-tab-nav{border-radius:var(--radius) 0 0 var(--radius);border:1px solid rgba(0,0,0,0)}.i-tabs-pane .i-tab-navs-vertical .i-tab-navs .i-tab-nav:hover{border-color:var(--color-8);border-right-color:var(--background)}.i-tabs-pane .i-tab-navs-vertical .i-tab-navs .i-tab-active{border-color:var(--color-7);border-right:1px solid var(--background)}.i-tabs-pane .i-tab-navs-vertical .i-tab-navs .i-tab-active:hover{background-color:rgba(0,0,0,0)}.i-tab-nav{--color: var(--color-7);position:relative;z-index:1;display:flex;align-items:center;justify-content:center;padding:.4em .5em;user-select:none;flex-shrink:0;gap:.25em;color:var(--color);border-radius:var(--radius)}.i-tab-nav:hover{--color: var(--color-3)}.i-tab-nav.i-tab-active{--color: var(--color-main)}.i-tabs-morelist .i-tab-nav{white-space:nowrap}.i-tabs-morelist .i-tab-active{background:var(--color-main-0)}.i-tab-closable .i-tab-nav{padding-right:0;border-radius:var(--radius) var(--radius) 0 0}.i-tab-closable .i-tab-nav.i-tab-active{box-shadow:2px 0 8px rgba(0,0,0,.0509803922);background-color:var(--background)}.i-tab-nav-close{margin:0;font-size:.7em;padding:0}.i-tab-nav-close:hover{color:var(--error)}.i-tab-navs-bar{position:absolute;bottom:0em;left:0;height:0;background:var(--color-main-0);pointer-events:none;transition:var(--transition);border-radius:4px}.i-tab-navs-vertical>.i-tab-navs{gap:1px}.i-tab-navs-vertical>.i-tab-navs>.i-tab-navs-bar{width:0;left:unset;bottom:unset;right:0;top:0}.i-tab-contents{position:relative;flex:1}.i-tab-content{display:none}.i-tab-content.i-tab-active{display:block}.i-swiper{position:relative;max-width:100%;user-select:none}.i-swiper:hover .i-swiper-arrow{opacity:.72}.i-swiper .i-swiper-arrow:hover{opacity:1}.i-swiper-track{position:relative;overflow:hidden;touch-action:pan-x;border-radius:var(--radius)}.i-swiper-list{display:flex;will-change:transform}.i-swiper-fade>.i-swiper-item{opacity:0}.i-swiper-fade>.i-swiper-active{opacity:1}.i-swiper-vertical .i-swiper-track{height:100%;touch-action:pan-y}.i-swiper-vertical .i-swiper-list{flex-direction:column}.i-swiper-vertical .i-swiper-item{width:100%}.i-swiper-vertical .i-swiper-arrow{left:unset;right:.5em}.i-swiper-vertical .i-swiper-prev{bottom:50%;top:unset;transform:translate(0, -6px)}.i-swiper-vertical .i-swiper-next{transform:translate(0, 6px)}.i-swiper-item{flex:1;flex-shrink:0;display:flex;justify-content:center;align-items:center;overflow:hidden;transition:var(--transition)}.i-swiper-item>.i-image{height:100%}.i-swiper-arrow{position:absolute;top:50%;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius);transform:translate(0, -50%);transition:var(--transition);opacity:0}.i-swiper-prev{left:.5em}.i-swiper-next{right:.5em}.i-swiper-indicators{margin:.5em 0;display:flex;justify-content:center;gap:.5em}.i-swiper-indicators-fixed{position:absolute;bottom:0;left:50%;transform:translate(-50%, 0)}.i-swiper-indicator{width:8px;height:8px;border-radius:50%;flex-shrink:0;background:var(--color);opacity:.25}.i-swiper-indicator:hover{opacity:.8}.i-swiper-indicator.i-indicator-active{opacity:1}.i-ripple-container{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:inherit;contain:strict}.i-ripple{position:absolute;background:var(--color);opacity:.15;transform:translate(-50%, -50%) scale(0.25);transform-origin:50%;border-radius:50%}.i-ripple-active{opacity:0;transform:translate(-50%, -50%) scale(1)}.i-input-label-file{display:inline-flex;width:unset}.i-input-label-file:has(.i-upload-list:empty){align-items:center}.i-input-file-hidden{display:none}.i-upload-inner{flex:1 1 100%;display:flex;flex-wrap:wrap;gap:.5em}.i-upload-card:has(.i-upload-list:not(:empty)){align-self:flex-start}.i-upload-card .i-upload-list{display:contents}.i-upload-list{display:flex;flex-wrap:wrap;width:100%;gap:inherit;user-select:none}.i-upload-list:empty{display:none}.i-upload-delete{opacity:0;margin:0;z-index:1;right:-0.825em;top:-0.825em;box-shadow:var(--shadow)}.i-upload-btn{align-self:center}.i-upload-card-btn{border-style:dashed;width:var(--upload-card-size);height:var(--upload-card-size);opacity:.6;font-size:1em}.i-upload-card-btn:hover{opacity:1}.i-upload-item{position:relative;display:inline-flex;align-items:center;gap:.25em;padding:.25em .4em;border:2px solid var(--background-opacity-1);border-radius:var(--radius);background:var(--background-opacity);transition:var(--transition);font-size:.8em}.i-upload-item .i-upload-delete{position:absolute;background-color:var(--error);color:#fff}.i-upload-item .i-upload-delete:hover{background-color:var(--error);color:#fff}.i-upload-item:hover{background-color:var(--background-opacity-1)}.i-upload-item:hover .i-upload-delete{opacity:1}.i-upload-item-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25em;width:var(--upload-card-size);height:var(--upload-card-size);border-radius:var(--radius);background:var(--background-opacity-1);cursor:pointer}.i-upload-item-card .i-image,.i-upload-item-card video{width:100%;height:100%;object-fit:cover}.i-upload-item-card .i-upload-file-name{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:.8em;padding-inline:4px}.i-upload-item-card .i-upload-delete{font-size:.72em;position:absolute;background-color:var(--error);color:#fff}.i-upload-item-card .i-upload-delete:hover{background-color:var(--error);color:#fff}.i-upload-item-card:hover .i-upload-delete{opacity:1}.i-upload-size{font-size:.8em;color:var(--color-6)}.i-upload-item-dragged{z-index:1000}.i-datepicker{padding:8px}.i-datepicker .i-datepicker-item{cursor:pointer}.i-datepicker-weeks,.i-datepicker-dates{display:grid;grid-template-columns:repeat(7, 1fr);gap:2px}.i-datepicker-week,.i-datepicker-item{display:flex;justify-content:center;padding:.32em .5em}.i-datepicker-week{color:var(--color-5)}.i-datepicker-item{--background: transparent;opacity:.4;border-radius:var(--radius);transition:all .12s;background:var(--background);color:var(--color)}.i-datepicker-item:hover{opacity:1;--background: var(--color-main-0)}.i-datepicker-item.i-datepicker-same-month{opacity:.8}.i-datepicker-item.i-datepicker-today{--background: var(--color-main-0)}.i-datepicker-item.i-datepicker-active{--background: var(--color-main);--color: var(--color-main-reverse);opacity:1}.i-datepicker-item.i-datepicker-disabled{opacity:.2;cursor:not-allowed}.i-datepicker-units{margin-bottom:.5em;display:flex;align-items:center;gap:.125em;color:var(--color-6);font-size:.9em}.i-datepicker-action{position:relative;display:flex;align-items:baseline;gap:.25em;padding:.125em .5em;user-select:none;border-radius:var(--radius)}.i-datepicker-action>span{color:var(--color);font-size:1.15em}.i-datepicker-action:hover{background:var(--color-main-0)}.i-datepicker-icon{margin-right:.25em;opacity:.5;pointer-events:none}.i-datepicker-ym{position:absolute;inset:0;z-index:1;padding:8px;gap:.5em;background:var(--background);backdrop-filter:var(--blur);display:flex;pointer-events:none;opacity:0;transition:var(--transition)}.i-datepicker-ym.i-datepicker-active{opacity:1;pointer-events:unset}.i-datepicker-years{width:5em;overflow-x:hidden;display:flex;flex-direction:column;max-height:100%;gap:.25em}.i-datepicker-months{margin-top:1.5em;flex:1;display:grid;grid-template-columns:repeat(3, 1fr);gap:.25em}.i-datepicker-year{flex:1}.i-datepicker-year,.i-datepicker-month{display:flex;padding:2px;user-select:none;border-radius:var(--radius);justify-content:center;align-items:center}.i-datepicker-year:hover,.i-datepicker-month:hover{background-color:var(--background-opacity-2)}.i-datepicker-year.i-datepicker-active,.i-datepicker-month.i-datepicker-active{background:var(--color-main);color:var(--color-main-reverse);opacity:1}.i-datepicker-close{position:absolute;right:0;top:0}.i-timepicker{display:flex}.i-timepicker-list{min-width:3em;text-align:center;overflow:auto;padding:4px;max-height:12.2em;display:flex;flex-direction:column;gap:2px;scrollbar-width:none}.i-timepicker-list::-webkit-scrollbar{display:none}.i-timepicker-list:not(:last-child){border-right:1px solid var(--color-9)}.i-timepicker-item{display:block;padding:.32em .5em;border-radius:var(--radius);opacity:.5}.i-timepicker-item:hover{background-color:var(--color-9);opacity:1}.i-timepicker-item.i-timepicker-item-active{background:var(--color-main);color:var(--color-main-reverse);opacity:1}.i-timepicker-icon{margin-right:.25em;opacity:.5;pointer-events:none}.i-colorpicker-handle{position:relative;display:inline-flex;align-items:center;font-size:.8em;gap:.25em}.i-colorpicker-square{display:inline-block;width:1.8em;height:1.8em;border:2px solid var(--color-9);border-radius:var(--radius);cursor:pointer;transition:var(--transition)}.i-colorpicker-square:hover{border-color:var(--color-8)}.i-colorpicker-footer{display:flex;gap:4px;font-size:.8em}.i-colorpicker-text{transition:var(--transition);cursor:pointer;padding:.25em .5em;border-radius:var(--radius);background:var(--color-9)}.i-colorpicker-text:hover{background:var(--color-8)}.rc-color-picker-panel{box-shadow:none;background:inherit}.i-empty{margin:auto;width:3em;height:3em;color:var(--color-7)}.i-helpericon{position:relative;margin:.25em;padding:.125em;min-height:1.675em;min-width:1.675em;display:flex;align-items:center;justify-content:center;align-self:center;color:var(--color-7);transition:var(--transition);border-radius:var(--radius);font-size:.8em}.i-helpericon:hover{color:var(--color-3);background:var(--background-opacity-1)}
|
|
1
|
+
@import"@rc-component/color-picker/assets/index.css";:root{--font-size: 16px;--font: normal 400 var(--font-size) / 1.5 -apple-system, "Helvetica Neue", sans-serif;--transition: all 0.24s ease;--padding: 0.32em 0.628em;--radius: 4px;--shadow: 0px 2px 8px var(--dim);--blur: blur(16px);--breakpoint: 880px;--label-width: auto;--label-align: left}article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}*{margin:0;padding:0;border:0;box-sizing:border-box}h1,h2,h3,h4,h5,h6,p,article,section,body{line-height:1.2}a{color:inherit;text-decoration:none;cursor:pointer;transition:var(--transition)}b,strong{font-weight:700}html{position:relative;font:var(--font);color:var(--color);min-height:100vh;overflow-x:hidden;scroll-behavior:smooth}input,button,textarea,select{font:inherit}input:-webkit-autofill{box-shadow:inherit;transition:none}ul,ol{list-style:none}img,video,audio,iframe{display:block;margin:auto;max-height:100%;max-width:100%;transition:var(--transition)}h1{font-size:2.4rem;line-height:1.2}h2{font-size:2rem;line-height:1.2}h3{font-size:1.5rem}h4{font-size:1.2rem}h5,h6{font-size:1rem}label{cursor:pointer}pre,code{font-family:inherit}::selection{background-color:rgba(255,216,50,.6392156863)}.os-windows ::-webkit-scrollbar{width:6px;height:6px;cursor:pointer}.os-windows ::-webkit-scrollbar-thumb{background-color:var(--color-8);cursor:pointer;border-radius:var(--radius)}:root kbd,:root .kbd,:root code,:root .code{display:inline-block;font-family:inherit;margin:0 .2em;padding:0 .4em;border-radius:4px;font-size:.86em;line-height:1.5;white-space:nowrap}:root .code,:root code{background:var(--color-8);color:var(--color-0);font-family:unset}:root kbd,:root .kbd{background-color:var(--white);color:var(--black);border-right:2px solid var(--grey-2);border-bottom:3px solid var(--grey-2);box-shadow:-1px -1px 1px var(--color-9)}:root .chip{padding:.05em .72em;font-size:.94em;background:var(--color-main);color:var(--color-main-reverse);border-radius:var(--radius);transition:var(--transition)}:root .chip:hover{--background-hover: var(--color-main-1);background:var(--background-hover)}:root .link{display:inline-flex;position:relative;white-space:nowrap;color:var(--blue)}:root .absolute{position:absolute}:root .relative{position:relative}:root .fixed{position:fixed}:root .flex{display:flex;gap:inherit}:root .grid{display:grid}:root .flex-column{flex-direction:column}:root .flex-wrap{flex-wrap:wrap}:root .flex-1{flex:1}:root .flex-shrink{flex-shrink:0}:root .sticky-top{position:sticky;top:0;z-index:10}:root .sticky-bottom{position:sticky;bottom:0;z-index:10}:root .sticky-left{position:sticky;left:0;z-index:10}:root .sticky-right{position:sticky;right:0;z-index:10}:root .text-center{text-align:center}:root .text-right{text-align:right}:root .bordered{border:1px solid var(--color-7)}:root .ellipsis{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}:root .overflow-auto{overflow:auto}:root .justify-center{justify-content:center}:root .justify-evenly{justify-content:space-evenly}:root .justify-between{justify-content:space-between}:root .justify-start{justify-content:flex-start}:root .justify-end{justify-content:flex-end}:root .items-start{align-items:flex-start}:root .items-end{align-items:flex-end}:root .items-center{align-items:center}:root .self-center{align-self:center}:root .h-100vh{height:100vh}:root .bg-blur{background:var(--background-opacity);backdrop-filter:var(--blur)}:root .roundless{border-radius:0}:root .round{border-radius:50vw}:root .round-0{border-radius:var(--radius)}:root .disabled{opacity:.4;cursor:not-allowed}:root .hidden{display:none !important}:root .shadow{box-shadow:var(--shadow)}:root .hover-shadow{transition:var(--transition)}:root .hover-shadow:hover{box-shadow:var(--shadow)}:root .hover-text-shadow{transition:var(--transition)}:root .hover-text-shadow:hover{text-shadow:var(--shadow)}:root .no-transition{transition:none}:root .hover-opacity{opacity:0;transition:var(--transition)}:root .hover-opacity:hover{opacity:1}:root .bg-transparent{background:rgba(0,0,0,0)}:root .font-italic{font-style:italic}:root .font-bold{font-weight:600}:root .font-sm{font-size:.8em}:root .font-lg{font-size:1.2em}:root .mg-auto{margin:auto}:root .mx-auto{margin-inline:auto}:root .my-auto{margin-block:auto}:root .ml-auto{margin-left:auto}:root .mr-auto{margin-right:auto}:root .mt-auto{margin-top:auto}:root .mb-auto{margin-bottom:auto}:root .mg-0{margin:0px}:root .mx-0{margin-inline:0px}:root .my-0{margin-block:0px}:root .mt-0{margin-top:0px}:root .mb-0{margin-bottom:0px}:root .ml-0{margin-left:0px}:root .mr-0{margin-right:0px}:root .pd-0{padding:0px}:root .px-0{padding-inline:0px}:root .py-0{padding-block:0px}:root .pl-0{padding-left:0px}:root .pr-0{padding-right:0px}:root .pt-0{padding-top:0px}:root .pb-0{padding-bottom:0px}:root .gap-0{gap:0px}:root .mg-1{margin:1px}:root .mx-1{margin-inline:1px}:root .my-1{margin-block:1px}:root .mt-1{margin-top:1px}:root .mb-1{margin-bottom:1px}:root .ml-1{margin-left:1px}:root .mr-1{margin-right:1px}:root .pd-1{padding:1px}:root .px-1{padding-inline:1px}:root .py-1{padding-block:1px}:root .pl-1{padding-left:1px}:root .pr-1{padding-right:1px}:root .pt-1{padding-top:1px}:root .pb-1{padding-bottom:1px}:root .gap-1{gap:1px}:root .mg-2{margin:2px}:root .mx-2{margin-inline:2px}:root .my-2{margin-block:2px}:root .mt-2{margin-top:2px}:root .mb-2{margin-bottom:2px}:root .ml-2{margin-left:2px}:root .mr-2{margin-right:2px}:root .pd-2{padding:2px}:root .px-2{padding-inline:2px}:root .py-2{padding-block:2px}:root .pl-2{padding-left:2px}:root .pr-2{padding-right:2px}:root .pt-2{padding-top:2px}:root .pb-2{padding-bottom:2px}:root .gap-2{gap:2px}:root .mg-4{margin:4px}:root .mx-4{margin-inline:4px}:root .my-4{margin-block:4px}:root .mt-4{margin-top:4px}:root .mb-4{margin-bottom:4px}:root .ml-4{margin-left:4px}:root .mr-4{margin-right:4px}:root .pd-4{padding:4px}:root .px-4{padding-inline:4px}:root .py-4{padding-block:4px}:root .pl-4{padding-left:4px}:root .pr-4{padding-right:4px}:root .pt-4{padding-top:4px}:root .pb-4{padding-bottom:4px}:root .gap-4{gap:4px}:root .mg-6{margin:6px}:root .mx-6{margin-inline:6px}:root .my-6{margin-block:6px}:root .mt-6{margin-top:6px}:root .mb-6{margin-bottom:6px}:root .ml-6{margin-left:6px}:root .mr-6{margin-right:6px}:root .pd-6{padding:6px}:root .px-6{padding-inline:6px}:root .py-6{padding-block:6px}:root .pl-6{padding-left:6px}:root .pr-6{padding-right:6px}:root .pt-6{padding-top:6px}:root .pb-6{padding-bottom:6px}:root .gap-6{gap:6px}:root .mg-8{margin:8px}:root .mx-8{margin-inline:8px}:root .my-8{margin-block:8px}:root .mt-8{margin-top:8px}:root .mb-8{margin-bottom:8px}:root .ml-8{margin-left:8px}:root .mr-8{margin-right:8px}:root .pd-8{padding:8px}:root .px-8{padding-inline:8px}:root .py-8{padding-block:8px}:root .pl-8{padding-left:8px}:root .pr-8{padding-right:8px}:root .pt-8{padding-top:8px}:root .pb-8{padding-bottom:8px}:root .gap-8{gap:8px}:root .mg-10{margin:10px}:root .mx-10{margin-inline:10px}:root .my-10{margin-block:10px}:root .mt-10{margin-top:10px}:root .mb-10{margin-bottom:10px}:root .ml-10{margin-left:10px}:root .mr-10{margin-right:10px}:root .pd-10{padding:10px}:root .px-10{padding-inline:10px}:root .py-10{padding-block:10px}:root .pl-10{padding-left:10px}:root .pr-10{padding-right:10px}:root .pt-10{padding-top:10px}:root .pb-10{padding-bottom:10px}:root .gap-10{gap:10px}:root .mg-12{margin:12px}:root .mx-12{margin-inline:12px}:root .my-12{margin-block:12px}:root .mt-12{margin-top:12px}:root .mb-12{margin-bottom:12px}:root .ml-12{margin-left:12px}:root .mr-12{margin-right:12px}:root .pd-12{padding:12px}:root .px-12{padding-inline:12px}:root .py-12{padding-block:12px}:root .pl-12{padding-left:12px}:root .pr-12{padding-right:12px}:root .pt-12{padding-top:12px}:root .pb-12{padding-bottom:12px}:root .gap-12{gap:12px}:root .mg-16{margin:16px}:root .mx-16{margin-inline:16px}:root .my-16{margin-block:16px}:root .mt-16{margin-top:16px}:root .mb-16{margin-bottom:16px}:root .ml-16{margin-left:16px}:root .mr-16{margin-right:16px}:root .pd-16{padding:16px}:root .px-16{padding-inline:16px}:root .py-16{padding-block:16px}:root .pl-16{padding-left:16px}:root .pr-16{padding-right:16px}:root .pt-16{padding-top:16px}:root .pb-16{padding-bottom:16px}:root .gap-16{gap:16px}:root .mg-20{margin:20px}:root .mx-20{margin-inline:20px}:root .my-20{margin-block:20px}:root .mt-20{margin-top:20px}:root .mb-20{margin-bottom:20px}:root .ml-20{margin-left:20px}:root .mr-20{margin-right:20px}:root .pd-20{padding:20px}:root .px-20{padding-inline:20px}:root .py-20{padding-block:20px}:root .pl-20{padding-left:20px}:root .pr-20{padding-right:20px}:root .pt-20{padding-top:20px}:root .pb-20{padding-bottom:20px}:root .gap-20{gap:20px}:root .mg-24{margin:24px}:root .mx-24{margin-inline:24px}:root .my-24{margin-block:24px}:root .mt-24{margin-top:24px}:root .mb-24{margin-bottom:24px}:root .ml-24{margin-left:24px}:root .mr-24{margin-right:24px}:root .pd-24{padding:24px}:root .px-24{padding-inline:24px}:root .py-24{padding-block:24px}:root .pl-24{padding-left:24px}:root .pr-24{padding-right:24px}:root .pt-24{padding-top:24px}:root .pb-24{padding-bottom:24px}:root .gap-24{gap:24px}:root .mg-28{margin:28px}:root .mx-28{margin-inline:28px}:root .my-28{margin-block:28px}:root .mt-28{margin-top:28px}:root .mb-28{margin-bottom:28px}:root .ml-28{margin-left:28px}:root .mr-28{margin-right:28px}:root .pd-28{padding:28px}:root .px-28{padding-inline:28px}:root .py-28{padding-block:28px}:root .pl-28{padding-left:28px}:root .pr-28{padding-right:28px}:root .pt-28{padding-top:28px}:root .pb-28{padding-bottom:28px}:root .gap-28{gap:28px}:root .mg-32{margin:32px}:root .mx-32{margin-inline:32px}:root .my-32{margin-block:32px}:root .mt-32{margin-top:32px}:root .mb-32{margin-bottom:32px}:root .ml-32{margin-left:32px}:root .mr-32{margin-right:32px}:root .pd-32{padding:32px}:root .px-32{padding-inline:32px}:root .py-32{padding-block:32px}:root .pl-32{padding-left:32px}:root .pr-32{padding-right:32px}:root .pt-32{padding-top:32px}:root .pb-32{padding-bottom:32px}:root .gap-32{gap:32px}:root .mg-36{margin:36px}:root .mx-36{margin-inline:36px}:root .my-36{margin-block:36px}:root .mt-36{margin-top:36px}:root .mb-36{margin-bottom:36px}:root .ml-36{margin-left:36px}:root .mr-36{margin-right:36px}:root .pd-36{padding:36px}:root .px-36{padding-inline:36px}:root .py-36{padding-block:36px}:root .pl-36{padding-left:36px}:root .pr-36{padding-right:36px}:root .pt-36{padding-top:36px}:root .pb-36{padding-bottom:36px}:root .gap-36{gap:36px}:root .mg-40{margin:40px}:root .mx-40{margin-inline:40px}:root .my-40{margin-block:40px}:root .mt-40{margin-top:40px}:root .mb-40{margin-bottom:40px}:root .ml-40{margin-left:40px}:root .mr-40{margin-right:40px}:root .pd-40{padding:40px}:root .px-40{padding-inline:40px}:root .py-40{padding-block:40px}:root .pl-40{padding-left:40px}:root .pr-40{padding-right:40px}:root .pt-40{padding-top:40px}:root .pb-40{padding-bottom:40px}:root .gap-40{gap:40px}:root .mg-48{margin:48px}:root .mx-48{margin-inline:48px}:root .my-48{margin-block:48px}:root .mt-48{margin-top:48px}:root .mb-48{margin-bottom:48px}:root .ml-48{margin-left:48px}:root .mr-48{margin-right:48px}:root .pd-48{padding:48px}:root .px-48{padding-inline:48px}:root .py-48{padding-block:48px}:root .pl-48{padding-left:48px}:root .pr-48{padding-right:48px}:root .pt-48{padding-top:48px}:root .pb-48{padding-bottom:48px}:root .gap-48{gap:48px}:root .mg-56{margin:56px}:root .mx-56{margin-inline:56px}:root .my-56{margin-block:56px}:root .mt-56{margin-top:56px}:root .mb-56{margin-bottom:56px}:root .ml-56{margin-left:56px}:root .mr-56{margin-right:56px}:root .pd-56{padding:56px}:root .px-56{padding-inline:56px}:root .py-56{padding-block:56px}:root .pl-56{padding-left:56px}:root .pr-56{padding-right:56px}:root .pt-56{padding-top:56px}:root .pb-56{padding-bottom:56px}:root .gap-56{gap:56px}:root .mg-60{margin:60px}:root .mx-60{margin-inline:60px}:root .my-60{margin-block:60px}:root .mt-60{margin-top:60px}:root .mb-60{margin-bottom:60px}:root .ml-60{margin-left:60px}:root .mr-60{margin-right:60px}:root .pd-60{padding:60px}:root .px-60{padding-inline:60px}:root .py-60{padding-block:60px}:root .pl-60{padding-left:60px}:root .pr-60{padding-right:60px}:root .pt-60{padding-top:60px}:root .pb-60{padding-bottom:60px}:root .gap-60{gap:60px}:root .mg-72{margin:72px}:root .mx-72{margin-inline:72px}:root .my-72{margin-block:72px}:root .mt-72{margin-top:72px}:root .mb-72{margin-bottom:72px}:root .ml-72{margin-left:72px}:root .mr-72{margin-right:72px}:root .pd-72{padding:72px}:root .px-72{padding-inline:72px}:root .py-72{padding-block:72px}:root .pl-72{padding-left:72px}:root .pr-72{padding-right:72px}:root .pt-72{padding-top:72px}:root .pb-72{padding-bottom:72px}:root .gap-72{gap:72px}:root .mg-80{margin:80px}:root .mx-80{margin-inline:80px}:root .my-80{margin-block:80px}:root .mt-80{margin-top:80px}:root .mb-80{margin-bottom:80px}:root .ml-80{margin-left:80px}:root .mr-80{margin-right:80px}:root .pd-80{padding:80px}:root .px-80{padding-inline:80px}:root .py-80{padding-block:80px}:root .pl-80{padding-left:80px}:root .pr-80{padding-right:80px}:root .pt-80{padding-top:80px}:root .pb-80{padding-bottom:80px}:root .gap-80{gap:80px}:root .mg-96{margin:96px}:root .mx-96{margin-inline:96px}:root .my-96{margin-block:96px}:root .mt-96{margin-top:96px}:root .mb-96{margin-bottom:96px}:root .ml-96{margin-left:96px}:root .mr-96{margin-right:96px}:root .pd-96{padding:96px}:root .px-96{padding-inline:96px}:root .py-96{padding-block:96px}:root .pl-96{padding-left:96px}:root .pr-96{padding-right:96px}:root .pt-96{padding-top:96px}:root .pb-96{padding-bottom:96px}:root .gap-96{gap:96px}:root .mg-100{margin:100px}:root .mx-100{margin-inline:100px}:root .my-100{margin-block:100px}:root .mt-100{margin-top:100px}:root .mb-100{margin-bottom:100px}:root .ml-100{margin-left:100px}:root .mr-100{margin-right:100px}:root .pd-100{padding:100px}:root .px-100{padding-inline:100px}:root .py-100{padding-block:100px}:root .pl-100{padding-left:100px}:root .pr-100{padding-right:100px}:root .pt-100{padding-top:100px}:root .pb-100{padding-bottom:100px}:root .gap-100{gap:100px}:root .mg-120{margin:120px}:root .mx-120{margin-inline:120px}:root .my-120{margin-block:120px}:root .mt-120{margin-top:120px}:root .mb-120{margin-bottom:120px}:root .ml-120{margin-left:120px}:root .mr-120{margin-right:120px}:root .pd-120{padding:120px}:root .px-120{padding-inline:120px}:root .py-120{padding-block:120px}:root .pl-120{padding-left:120px}:root .pr-120{padding-right:120px}:root .pt-120{padding-top:120px}:root .pb-120{padding-bottom:120px}:root .gap-120{gap:120px}:root .mg-160{margin:160px}:root .mx-160{margin-inline:160px}:root .my-160{margin-block:160px}:root .mt-160{margin-top:160px}:root .mb-160{margin-bottom:160px}:root .ml-160{margin-left:160px}:root .mr-160{margin-right:160px}:root .pd-160{padding:160px}:root .px-160{padding-inline:160px}:root .py-160{padding-block:160px}:root .pl-160{padding-left:160px}:root .pr-160{padding-right:160px}:root .pt-160{padding-top:160px}:root .pb-160{padding-bottom:160px}:root .gap-160{gap:160px}:root .mg-200{margin:200px}:root .mx-200{margin-inline:200px}:root .my-200{margin-block:200px}:root .mt-200{margin-top:200px}:root .mb-200{margin-bottom:200px}:root .ml-200{margin-left:200px}:root .mr-200{margin-right:200px}:root .pd-200{padding:200px}:root .px-200{padding-inline:200px}:root .py-200{padding-block:200px}:root .pl-200{padding-left:200px}:root .pr-200{padding-right:200px}:root .pt-200{padding-top:200px}:root .pb-200{padding-bottom:200px}:root .gap-200{gap:200px}:root .w-10{width:10%}:root .h-10{height:10%}:root .w-20{width:20%}:root .h-20{height:20%}:root .w-25{width:25%}:root .h-25{height:25%}:root .w-30{width:30%}:root .h-30{height:30%}:root .w-40{width:40%}:root .h-40{height:40%}:root .w-50{width:50%}:root .h-50{height:50%}:root .w-60{width:60%}:root .h-60{height:60%}:root .w-70{width:70%}:root .h-70{height:70%}:root .w-75{width:75%}:root .h-75{height:75%}:root .w-80{width:80%}:root .h-80{height:80%}:root .w-90{width:90%}:root .h-90{height:90%}:root .w-100{width:100%}:root .h-100{height:100%}@media(min-width: 880px){:root .screen-sm{display:none !important}}@media(max-width: 880px){:root .screen-lg{display:none !important}}@keyframes rotate{100%{transform:rotate(360deg)}}@keyframes bounce{20%{transform:translate(12px, 0)}50%{transform:translate(-8px, 0)}80%{transform:translate(6px, 0)}}:root{--background: #fff;--background-1: #f1f1f1;--background-opacity: #ffffffa6;--background-opacity-1: #e9e9e999;--background-opacity-2: #f1f1f1a6;--color: #212121;--color-main: #444;--color-main-0: #f1f1f1;--color-main-1: #313131;--color-main-reverse: #fafafa;--color-backdrop: rgba(0, 0, 0, 0.25);--dim: rgba(0, 0, 0, 0.15);--color-0: black;--color-1: rgb(26.775, 26.775, 26.775);--color-2: rgb(53.55, 53.55, 53.55);--color-3: rgb(80.325, 80.325, 80.325);--color-4: rgb(107.1, 107.1, 107.1);--color-5: rgb(133.875, 133.875, 133.875);--color-6: rgb(160.65, 160.65, 160.65);--color-7: rgb(187.425, 187.425, 187.425);--color-8: rgb(214.2, 214.2, 214.2);--color-9: rgb(240.975, 240.975, 240.975);--white-0: white;--white-1: whitesmoke;--white-2: #ebebeb;--white: white;--black-0: #dbdbdb;--black-1: #212121;--black-2: #313131;--black: black;--red-0: #fcdfe4;--red-1: #dc143c;--red-2: #ee4063;--red: #dc143c;--blue-0: #d6ebff;--blue-1: #007cf4;--blue-2: #47a4ff;--blue: #1e90ff;--green-0: #e7fff2;--green-1: #37a467;--green-2: #53c586;--green: #3cb371;--yellow-0: #fffae5;--yellow-1: #ffb820;--yellow-2: #ffd272;--yellow: #ffc549;--brown-0: #fbece2;--brown-1: #8b3a07;--brown-2: #6d2e07;--brown: #95410c;--grey-0: #f6f6f6;--grey-1: #b1b1b1;--grey-2: #9c9c9c;--grey: #d7d7d7;--pink-0: #ffe3f1;--pink-1: #ff55aa;--pink-2: #ff92c8;--pink: #ff69b4;--purple-0: #eddefb;--purple-1: #751bc9;--purple-2: #a861e9;--purple: #8a2be2;--aqua-0: #e8ffff;--aqua-1: #1efdfd;--aqua-2: #0ae0e0;--aqua: aqua;--orange-0: #fff1e8;--orange-1: #eb7521;--orange-2: #e66a12;--orange: #fb812a;--warning-0: #fff0bf;--warning-1: #f0a313;--warning-2: #fda605;--warning: #ffb01f;--error-0: #ffdbdb;--error-1: #f13636;--error-2: #db1e1e;--error: #ff4545;--success-0: #acf899;--success-1: #4ad926;--success-2: #40d01c;--success: #52e12e}:root .color-main{color:var(--color-main)}:root .bg-main{background:var(--color-main);color:var(--color-main-reverse)}:root .color-0{--color: var(--color-0);color:var(--color)}:root .bg-0{--background: var(--color-0);background:var(--background);color:var(--white)}:root .opacity-0{opacity:0}:root .color-1{--color: var(--color-1);color:var(--color)}:root .bg-1{--background: var(--color-1);background:var(--background);color:var(--white)}:root .opacity-1{opacity:0.1}:root .color-2{--color: var(--color-2);color:var(--color)}:root .bg-2{--background: var(--color-2);background:var(--background);color:var(--white)}:root .opacity-2{opacity:0.2}:root .color-3{--color: var(--color-3);color:var(--color)}:root .bg-3{--background: var(--color-3);background:var(--background);color:var(--white)}:root .opacity-3{opacity:0.3}:root .color-4{--color: var(--color-4);color:var(--color)}:root .bg-4{--background: var(--color-4);background:var(--background);color:var(--white)}:root .opacity-4{opacity:0.4}:root .color-5{--color: var(--color-5);color:var(--color)}:root .bg-5{--background: var(--color-5);background:var(--background)}:root .opacity-5{opacity:0.5}:root .color-6{--color: var(--color-6);color:var(--color)}:root .bg-6{--background: var(--color-6);background:var(--background)}:root .opacity-6{opacity:0.6}:root .color-7{--color: var(--color-7);color:var(--color)}:root .bg-7{--background: var(--color-7);background:var(--background)}:root .opacity-7{opacity:0.7}:root .color-8{--color: var(--color-8);color:var(--color)}:root .bg-8{--background: var(--color-8);background:var(--background)}:root .opacity-8{opacity:0.8}:root .color-9{--color: var(--color-9);color:var(--color)}:root .bg-9{--background: var(--color-9);background:var(--background)}:root .opacity-9{opacity:0.9}:root .bg-white-0{--background: var(--white-0);background:var(--white-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--white)}:root .bg-white-0:hover{--background-hover: var(--white);--color-hover: var(--white)}:root .bg-white-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-white-1{--background: var(--white-1);background:var(--white-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-white-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-white-2{--background: var(--white-2);background:var(--white-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-white-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-white{--background: var(--white);background:var(--white);color:var(--color);--color: var(--black);--color-hover: var(--black)}:root .bg-white:hover{--background-hover: var(--white-1)}:root .bg-white.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-black-0{--background: var(--black-0);background:var(--black-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--black)}:root .bg-black-0:hover{--background-hover: var(--black);--color-hover: var(--white)}:root .bg-black-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-black-1{--background: var(--black-1);background:var(--black-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-black-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-black-2{--background: var(--black-2);background:var(--black-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-black-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-black{--background: var(--black);background:var(--black);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-black:hover{--background-hover: var(--black-1)}:root .bg-black.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-red-0{--background: var(--red-0);background:var(--red-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--red)}:root .bg-red-0:hover{--background-hover: var(--red);--color-hover: var(--white)}:root .bg-red-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-red-1{--background: var(--red-1);background:var(--red-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-red-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-red-2{--background: var(--red-2);background:var(--red-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-red-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-red{--background: var(--red);background:var(--red);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-red:hover{--background-hover: var(--red-1)}:root .bg-red.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-blue-0{--background: var(--blue-0);background:var(--blue-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--blue)}:root .bg-blue-0:hover{--background-hover: var(--blue);--color-hover: var(--white)}:root .bg-blue-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-blue-1{--background: var(--blue-1);background:var(--blue-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-blue-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-blue-2{--background: var(--blue-2);background:var(--blue-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-blue-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-blue{--background: var(--blue);background:var(--blue);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-blue:hover{--background-hover: var(--blue-1)}:root .bg-blue.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-green-0{--background: var(--green-0);background:var(--green-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--green)}:root .bg-green-0:hover{--background-hover: var(--green);--color-hover: var(--white)}:root .bg-green-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-green-1{--background: var(--green-1);background:var(--green-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-green-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-green-2{--background: var(--green-2);background:var(--green-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-green-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-green{--background: var(--green);background:var(--green);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-green:hover{--background-hover: var(--green-1)}:root .bg-green.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-yellow-0{--background: var(--yellow-0);background:var(--yellow-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--yellow)}:root .bg-yellow-0:hover{--background-hover: var(--yellow);--color-hover: var(--white)}:root .bg-yellow-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-yellow-1{--background: var(--yellow-1);background:var(--yellow-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-yellow-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-yellow-2{--background: var(--yellow-2);background:var(--yellow-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-yellow-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-yellow{--background: var(--yellow);background:var(--yellow);color:var(--color);--color: var(--black);--color-hover: var(--black)}:root .bg-yellow:hover{--background-hover: var(--yellow-1)}:root .bg-yellow.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-brown-0{--background: var(--brown-0);background:var(--brown-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--brown)}:root .bg-brown-0:hover{--background-hover: var(--brown);--color-hover: var(--white)}:root .bg-brown-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-brown-1{--background: var(--brown-1);background:var(--brown-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-brown-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-brown-2{--background: var(--brown-2);background:var(--brown-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-brown-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-brown{--background: var(--brown);background:var(--brown);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-brown:hover{--background-hover: var(--brown-1)}:root .bg-brown.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-grey-0{--background: var(--grey-0);background:var(--grey-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--grey)}:root .bg-grey-0:hover{--background-hover: var(--grey);--color-hover: var(--white)}:root .bg-grey-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-grey-1{--background: var(--grey-1);background:var(--grey-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-grey-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-grey-2{--background: var(--grey-2);background:var(--grey-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-grey-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-grey{--background: var(--grey);background:var(--grey);color:var(--color);--color: var(--black);--color-hover: var(--black)}:root .bg-grey:hover{--background-hover: var(--grey-1)}:root .bg-grey.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-pink-0{--background: var(--pink-0);background:var(--pink-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--pink)}:root .bg-pink-0:hover{--background-hover: var(--pink);--color-hover: var(--white)}:root .bg-pink-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-pink-1{--background: var(--pink-1);background:var(--pink-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-pink-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-pink-2{--background: var(--pink-2);background:var(--pink-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-pink-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-pink{--background: var(--pink);background:var(--pink);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-pink:hover{--background-hover: var(--pink-1)}:root .bg-pink.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-purple-0{--background: var(--purple-0);background:var(--purple-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--purple)}:root .bg-purple-0:hover{--background-hover: var(--purple);--color-hover: var(--white)}:root .bg-purple-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-purple-1{--background: var(--purple-1);background:var(--purple-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-purple-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-purple-2{--background: var(--purple-2);background:var(--purple-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-purple-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-purple{--background: var(--purple);background:var(--purple);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-purple:hover{--background-hover: var(--purple-1)}:root .bg-purple.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-aqua-0{--background: var(--aqua-0);background:var(--aqua-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--aqua)}:root .bg-aqua-0:hover{--background-hover: var(--aqua);--color-hover: var(--white)}:root .bg-aqua-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-aqua-1{--background: var(--aqua-1);background:var(--aqua-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-aqua-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-aqua-2{--background: var(--aqua-2);background:var(--aqua-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-aqua-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-aqua{--background: var(--aqua);background:var(--aqua);color:var(--color);--color: var(--black);--color-hover: var(--black)}:root .bg-aqua:hover{--background-hover: var(--aqua-1)}:root .bg-aqua.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-orange-0{--background: var(--orange-0);background:var(--orange-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--orange)}:root .bg-orange-0:hover{--background-hover: var(--orange);--color-hover: var(--white)}:root .bg-orange-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-orange-1{--background: var(--orange-1);background:var(--orange-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-orange-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-orange-2{--background: var(--orange-2);background:var(--orange-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-orange-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-orange{--background: var(--orange);background:var(--orange);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-orange:hover{--background-hover: var(--orange-1)}:root .bg-orange.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-warning-0{--background: var(--warning-0);background:var(--warning-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--warning)}:root .bg-warning-0:hover{--background-hover: var(--warning);--color-hover: var(--white)}:root .bg-warning-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-warning-1{--background: var(--warning-1);background:var(--warning-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-warning-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-warning-2{--background: var(--warning-2);background:var(--warning-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-warning-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-warning{--background: var(--warning);background:var(--warning);color:var(--color);--color: var(--black);--color-hover: var(--black)}:root .bg-warning:hover{--background-hover: var(--warning-1)}:root .bg-warning.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-error-0{--background: var(--error-0);background:var(--error-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--error)}:root .bg-error-0:hover{--background-hover: var(--error);--color-hover: var(--white)}:root .bg-error-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-error-1{--background: var(--error-1);background:var(--error-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-error-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-error-2{--background: var(--error-2);background:var(--error-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-error-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-error{--background: var(--error);background:var(--error);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-error:hover{--background-hover: var(--error-1)}:root .bg-error.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-success-0{--background: var(--success-0);background:var(--success-0);color:var(--color);--color: var(--white);--color-hover: var(--white);--color: var(--success)}:root .bg-success-0:hover{--background-hover: var(--success);--color-hover: var(--white)}:root .bg-success-0.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-success-1{--background: var(--success-1);background:var(--success-1);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-success-1.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-success-2{--background: var(--success-2);background:var(--success-2);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-success-2.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .bg-success{--background: var(--success);background:var(--success);color:var(--color);--color: var(--white);--color-hover: var(--white)}:root .bg-success:hover{--background-hover: var(--success-1)}:root .bg-success.i-btn:hover{background:var(--background-hover);color:var(--color-hover)}:root .white-0{--color: var(--white-0);color:var(--color)}:root .white-1{--color: var(--white-1);color:var(--color)}:root .white-2{--color: var(--white-2);color:var(--color)}:root .white{--color: var(--white);--background-hover: var(--white-0);--color-hover: var(--white);color:var(--color)}:root .black-0{--color: var(--black-0);color:var(--color)}:root .black-1{--color: var(--black-1);color:var(--color)}:root .black-2{--color: var(--black-2);color:var(--color)}:root .black{--color: var(--black);--background-hover: var(--black-0);--color-hover: var(--black);color:var(--color)}:root .red-0{--color: var(--red-0);color:var(--color)}:root .red-1{--color: var(--red-1);color:var(--color)}:root .red-2{--color: var(--red-2);color:var(--color)}:root .red{--color: var(--red);--background-hover: var(--red-0);--color-hover: var(--red);color:var(--color)}:root .blue-0{--color: var(--blue-0);color:var(--color)}:root .blue-1{--color: var(--blue-1);color:var(--color)}:root .blue-2{--color: var(--blue-2);color:var(--color)}:root .blue{--color: var(--blue);--background-hover: var(--blue-0);--color-hover: var(--blue);color:var(--color)}:root .green-0{--color: var(--green-0);color:var(--color)}:root .green-1{--color: var(--green-1);color:var(--color)}:root .green-2{--color: var(--green-2);color:var(--color)}:root .green{--color: var(--green);--background-hover: var(--green-0);--color-hover: var(--green);color:var(--color)}:root .yellow-0{--color: var(--yellow-0);color:var(--color)}:root .yellow-1{--color: var(--yellow-1);color:var(--color)}:root .yellow-2{--color: var(--yellow-2);color:var(--color)}:root .yellow{--color: var(--yellow);--background-hover: var(--yellow-0);--color-hover: var(--yellow);color:var(--color)}:root .brown-0{--color: var(--brown-0);color:var(--color)}:root .brown-1{--color: var(--brown-1);color:var(--color)}:root .brown-2{--color: var(--brown-2);color:var(--color)}:root .brown{--color: var(--brown);--background-hover: var(--brown-0);--color-hover: var(--brown);color:var(--color)}:root .grey-0{--color: var(--grey-0);color:var(--color)}:root .grey-1{--color: var(--grey-1);color:var(--color)}:root .grey-2{--color: var(--grey-2);color:var(--color)}:root .grey{--color: var(--grey);--background-hover: var(--grey-0);--color-hover: var(--grey);color:var(--color)}:root .pink-0{--color: var(--pink-0);color:var(--color)}:root .pink-1{--color: var(--pink-1);color:var(--color)}:root .pink-2{--color: var(--pink-2);color:var(--color)}:root .pink{--color: var(--pink);--background-hover: var(--pink-0);--color-hover: var(--pink);color:var(--color)}:root .purple-0{--color: var(--purple-0);color:var(--color)}:root .purple-1{--color: var(--purple-1);color:var(--color)}:root .purple-2{--color: var(--purple-2);color:var(--color)}:root .purple{--color: var(--purple);--background-hover: var(--purple-0);--color-hover: var(--purple);color:var(--color)}:root .aqua-0{--color: var(--aqua-0);color:var(--color)}:root .aqua-1{--color: var(--aqua-1);color:var(--color)}:root .aqua-2{--color: var(--aqua-2);color:var(--color)}:root .aqua{--color: var(--aqua);--background-hover: var(--aqua-0);--color-hover: var(--aqua);color:var(--color)}:root .orange-0{--color: var(--orange-0);color:var(--color)}:root .orange-1{--color: var(--orange-1);color:var(--color)}:root .orange-2{--color: var(--orange-2);color:var(--color)}:root .orange{--color: var(--orange);--background-hover: var(--orange-0);--color-hover: var(--orange);color:var(--color)}:root .warning-0{--color: var(--warning-0);color:var(--color)}:root .warning-1{--color: var(--warning-1);color:var(--color)}:root .warning-2{--color: var(--warning-2);color:var(--color)}:root .warning{--color: var(--warning);--background-hover: var(--warning-0);--color-hover: var(--warning);color:var(--color)}:root .error-0{--color: var(--error-0);color:var(--color)}:root .error-1{--color: var(--error-1);color:var(--color)}:root .error-2{--color: var(--error-2);color:var(--color)}:root .error{--color: var(--error);--background-hover: var(--error-0);--color-hover: var(--error);color:var(--color)}:root .success-0{--color: var(--success-0);color:var(--color)}:root .success-1{--color: var(--success-1);color:var(--color)}:root .success-2{--color: var(--success-2);color:var(--color)}:root .success{--color: var(--success);--background-hover: var(--success-0);--color-hover: var(--success);color:var(--color)}.bg-slight{background-color:var(--color-9);color:var(--black)}.slight{color:var(--color-8)}.theme-dark{--background: #313131;--background-1: #3a3a3a;--background-opacity: #313131a6;--background-opacity-1: #313131aa;--background-opacity-2: #2a2a2aca;--color: #fff;--color-main: #6cc73b;--color-main-0: #313d2b;--color-main-1: #69d62f;--color-main-2: #53b320;--color-main-reverse: #212121;--dim: rgba(0, 0, 0, 0.25);--shadow: 0px 4px 12px var(--dim);background:var(--background);color:var(--color);--color-0: white;--color-1: rgb(233.325, 233.325, 233.325);--color-2: rgb(211.65, 211.65, 211.65);--color-3: rgb(189.975, 189.975, 189.975);--color-4: rgb(168.3, 168.3, 168.3);--color-5: rgb(146.625, 146.625, 146.625);--color-6: rgb(124.95, 124.95, 124.95);--color-7: rgb(103.275, 103.275, 103.275);--color-8: rgb(81.6, 81.6, 81.6);--color-9: rgb(59.925, 59.925, 59.925);--white-0: #595959;--black-0: #6d6d6d;--red-0: #4d3232;--yellow-0: #4b421f;--green-0: #114911;--aqua-0: #1e3d3d;--blue-0: #2d4467;--pink-0: #5d2f37;--brown-0: #3b2d2d;--orange-0: #473514;--purple-0: #372337;--grey-0: #414141;--warning-0: #4b3e13;--error-0: #533535;--success-0: #123b08}.theme-dark .color-0{color:var(--color-0)}.theme-dark .bg-0{--background: var(--color-0);background:var(--background);color:var(--black)}.theme-dark .color-1{color:var(--color-1)}.theme-dark .bg-1{--background: var(--color-1);background:var(--background);color:var(--black)}.theme-dark .color-2{color:var(--color-2)}.theme-dark .bg-2{--background: var(--color-2);background:var(--background);color:var(--black)}.theme-dark .color-3{color:var(--color-3)}.theme-dark .bg-3{--background: var(--color-3);background:var(--background);color:var(--black)}.theme-dark .color-4{color:var(--color-4)}.theme-dark .bg-4{--background: var(--color-4);background:var(--background);color:var(--black)}.theme-dark .color-5{color:var(--color-5)}.theme-dark .bg-5{--background: var(--color-5);background:var(--background)}.theme-dark .color-6{color:var(--color-6)}.theme-dark .bg-6{--background: var(--color-6);background:var(--background)}.theme-dark .color-7{color:var(--color-7)}.theme-dark .bg-7{--background: var(--color-7);background:var(--background)}.theme-dark .color-8{color:var(--color-8)}.theme-dark .bg-8{--background: var(--color-8);background:var(--background)}.theme-dark .color-9{color:var(--color-9)}.theme-dark .bg-9{--background: var(--color-9);background:var(--background)}.theme-dark .bg-slight{color:var(--white)}.theme-dark kbd,.theme-dark .kbd{background-color:var(--black-1);color:var(--white);border-right:2px solid var(--color-8);border-bottom:3px solid var(--color-8);box-shadow:-1px -1px 1px var(--black-2)}@media(prefers-color-scheme: dark){.theme-auto{--background: #313131;--background-1: #3a3a3a;--background-opacity: #313131a6;--background-opacity-1: #313131aa;--background-opacity-2: #2a2a2aca;--color: #fff;--color-main: #6cc73b;--color-main-0: #313d2b;--color-main-1: #69d62f;--color-main-2: #53b320;--color-main-reverse: #212121;--dim: rgba(0, 0, 0, 0.25);--shadow: 0px 4px 12px var(--dim);background:var(--background);color:var(--color);--color-0: white;--color-1: rgb(233.325, 233.325, 233.325);--color-2: rgb(211.65, 211.65, 211.65);--color-3: rgb(189.975, 189.975, 189.975);--color-4: rgb(168.3, 168.3, 168.3);--color-5: rgb(146.625, 146.625, 146.625);--color-6: rgb(124.95, 124.95, 124.95);--color-7: rgb(103.275, 103.275, 103.275);--color-8: rgb(81.6, 81.6, 81.6);--color-9: rgb(59.925, 59.925, 59.925);--white-0: #595959;--black-0: #6d6d6d;--red-0: #4d3232;--yellow-0: #4b421f;--green-0: #114911;--aqua-0: #1e3d3d;--blue-0: #2d4467;--pink-0: #5d2f37;--brown-0: #3b2d2d;--orange-0: #473514;--purple-0: #372337;--grey-0: #414141;--warning-0: #4b3e13;--error-0: #533535;--success-0: #123b08}.theme-auto .color-0{color:var(--color-0)}.theme-auto .bg-0{--background: var(--color-0);background:var(--background);color:var(--black)}.theme-auto .color-1{color:var(--color-1)}.theme-auto .bg-1{--background: var(--color-1);background:var(--background);color:var(--black)}.theme-auto .color-2{color:var(--color-2)}.theme-auto .bg-2{--background: var(--color-2);background:var(--background);color:var(--black)}.theme-auto .color-3{color:var(--color-3)}.theme-auto .bg-3{--background: var(--color-3);background:var(--background);color:var(--black)}.theme-auto .color-4{color:var(--color-4)}.theme-auto .bg-4{--background: var(--color-4);background:var(--background);color:var(--black)}.theme-auto .color-5{color:var(--color-5)}.theme-auto .bg-5{--background: var(--color-5);background:var(--background)}.theme-auto .color-6{color:var(--color-6)}.theme-auto .bg-6{--background: var(--color-6);background:var(--background)}.theme-auto .color-7{color:var(--color-7)}.theme-auto .bg-7{--background: var(--color-7);background:var(--background)}.theme-auto .color-8{color:var(--color-8)}.theme-auto .bg-8{--background: var(--color-8);background:var(--background)}.theme-auto .color-9{color:var(--color-9)}.theme-auto .bg-9{--background: var(--color-9);background:var(--background)}.theme-auto .bg-slight{color:var(--white)}.theme-auto kbd,.theme-auto .kbd{background-color:var(--black-1);color:var(--white);border-right:2px solid var(--color-8);border-bottom:3px solid var(--color-8);box-shadow:-1px -1px 1px var(--black-2)}}.i-input-label{display:flex;flex-wrap:wrap;align-items:baseline;align-content:flex-start;gap:.5em;width:100%;max-width:100%}.i-input-label:has(.i-input-success){--color: var(--green)}.i-input-label:has(.i-input-warning){--color: var(--yellow)}.i-input-label:has(.i-input-error){--color: var(--error)}.i-input-inline{flex-wrap:nowrap}.i-input-inline .i-input-item,.i-input-inline .i-upload-inner,.i-input-inline .i-radio-options{flex:1 1 auto}.i-input-label-text{flex:0 0 var(--label-width);text-align:var(--label-align);border-radius:inherit;font-weight:500;transition:all .12s}.i-input-item{--input-border-width: 2px;--invert-input-border-width: calc(var(--input-border-width) * -1);flex:1 1 100%;display:flex;align-items:baseline;transition:var(--transition);border-radius:var(--radius);border:var(--input-border-width) solid var(--color-9);max-width:100%}.i-input-item .i-btn{align-self:stretch}.i-input-item:hover,.i-input-item:focus-within,.i-input-item.i-input-focus{border-color:var(--color-8)}.i-input-item.i-input-success{border-color:var(--green-0)}.i-input-item.i-input-warning{border-color:var(--yellow-0)}.i-input-item.i-input-error{border-color:var(--error-0)}.i-input-borderless{border-color:rgba(0,0,0,0);background:var(--background-opacity-2)}.i-input{padding:var(--padding);flex:1;width:100%;color:inherit;outline:none;transition:var(--transition);background:rgba(0,0,0,0);border-radius:inherit}.i-input[type=number]::-webkit-inner-spin-button,.i-input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none}.i-input[readonly]{caret-color:rgba(0,0,0,0)}.i-input:disabled{background:var(--background-opacity-1);cursor:not-allowed}.i-input-message{--color: var(--color-5);flex:1 1 auto;align-self:center;z-index:1;font-size:.8em;color:var(--color);border-radius:var(--radius);pointer-events:none}.i-input-success{--color: var(--green)}.i-input-warning{--color: var(--yellow)}.i-input-error{--color: var(--error)}.i-textarea{display:block;transition:var(--transition),width 0s,height 0s;max-width:100%;min-height:2.5em}.i-input-prepend,.i-input-append{margin:var(--invert-input-border-width);display:flex;align-self:stretch;place-items:center}.i-input-prepend .i-btn,.i-input-append .i-btn{border-radius:inherit;height:unset}.i-input-prepend{margin-right:0;border-top-left-radius:inherit;border-bottom-left-radius:inherit}.i-input-append{margin-left:0;border-top-right-radius:inherit;border-bottom-right-radius:inherit}.i-options-block>.i-checkbox-item,.i-options-block>.i-radio-item{flex:1 1 100%}.i-input-number{text-align:center;padding:var(--padding);padding-inline:0}.i-preview{padding:0}.i-preview .i-modal{position:static;background:rgba(0,0,0,0);overflow:unset;transform:none;pointer-events:none !important;width:100%;height:100%}.i-preview-container{position:relative;width:100%;height:100%}.i-preview-content{display:flex;align-items:center;justify-content:center;width:100%;height:100%;transition:var(--transition);pointer-events:none}.i-preview-content *{pointer-events:all}.i-preview-controls{position:fixed;z-index:10;right:.5em;top:.5em;padding:4px;display:flex;align-items:center;gap:1px;background:var(--background-opacity);border-radius:var(--radius);font-size:.9em;pointer-events:all;transition:all .24s ease-out}.i-preview-controls:hover{opacity:1}.i-preview-controls-hidden{opacity:0}.i-preview-unknown{display:flex;flex-direction:column;align-items:center;padding:.5em 1em;background:var(--background);border-radius:var(--radius)}.i-badge{position:relative;display:inline-flex;align-self:center;flex-shrink:0;border-radius:var(--radius)}.i-badge-content{position:absolute;z-index:1;inset:0 0 auto auto;padding:.2em .5em;transition:all .16s;transform:translate(50%, -50%) scale(1);border-radius:inherit;background:var(--background-opacity);backdrop-filter:var(--blur);box-shadow:var(--shadow);font-size:.86em;pointer-events:none}.i-badge-content.i-badge-dot{height:1em;width:1em;padding:0;border-radius:1em;overflow:hidden;color:rgba(0,0,0,0)}.i-badge-content:empty,.i-badge-content.i-badge-hidden{transform:translate(50%, -50%) scale(0)}.i-datagrid-container{border-radius:var(--radius);overflow:auto}.i-datagrid-loading{overflow:hidden !important;user-select:none}.i-datagrid-loading .i-datagrid{max-height:100%;max-width:100%}.i-datagrid-loading .i-loading-container{position:absolute;inset:0;z-index:10;background:var(--background-opacity);backdrop-filter:blur(2px)}.i-datagrid{display:grid;contain:content;content-visibility:auto;width:fit-content;grid-template-columns:var(--grid-template-columns);grid-template-rows:var(--grid-template-rows);min-width:100%}.i-datagrid .i-empty{margin:1em auto;grid-column:1/-1}.i-datagrid-bordered{--datagrid-border-color: var(--color-9);outline:1px solid var(--datagrid-border-color)}.i-datagrid-bordered .i-datagrid-cell{outline:1px solid var(--datagrid-border-color)}.i-datagrid-striped .i-datagrid-row{--datagrid-border-color: var(--color-8)}.i-datagrid-striped .i-datagrid-row:nth-child(odd){--datagrid-cell-background: var(--color-9)}.i-datagrid .i-datagrid-row{--datagrid-cell-background: var(--background);display:contents}.i-datagrid .i-datagrid-row:hover{--datagrid-border-color: var(--color-8);--datagrid-cell-background: var(--color-main-0)}.i-datagrid .i-datagrid-row:hover .i-datagrid-cell{z-index:1}.i-datagrid .i-datagrid-row:hover [class*=" i-datagrid-cell-fixed"]{z-index:3}.i-datagrid-cell{position:sticky;display:flex;align-items:center;justify-content:var(--datagrid-justify);gap:4px;padding:var(--cell-padding);background:var(--datagrid-cell-background);transition:background-color .12s;overflow:hidden}.i-datagrid-cell:first-child{border-top-left-radius:var(--radius);border-bottom-left-radius:var(--radius)}.i-datagrid-cell:last-child{border-top-right-radius:var(--radius);border-bottom-right-radius:var(--radius)}[class*=" i-datagrid-cell-fixed"]{z-index:2}.i-datagrid-cell-fixed-right{box-shadow:-2px 0 4px var(--color-9)}.i-datagrid-cell-fixed-left{box-shadow:2px 0 4px var(--color-9)}.i-datagrid-cell-content{min-width:0;flex:1 1 auto;display:inherit;gap:inherit;justify-content:inherit;white-space:nowrap;overflow:hidden}.i-datagrid-cell-content-ellipsis{display:block;text-overflow:ellipsis;text-align:var(--datagrid-justify)}.i-datagrid-header .i-datagrid-cell{--datagrid-cell-background: var(--background-opacity-2);z-index:3;white-space:nowrap;text-overflow:ellipsis;line-height:1;user-select:none;backdrop-filter:var(--blur)}.i-datagrid-header [class*=" i-datagrid-cell-fixed"]{z-index:4}.i-datagrid-resizor{position:absolute;inset:0 0 0 auto;width:4px;transition:.12s;cursor:ew-resize}.i-datagrid-resizor:hover{background-color:var(--color-5)}.i-datagrid-has-sorter{cursor:pointer}.i-datagrid-has-sorter:hover{--datagrid-cell-background: var(--color-8)}.i-datagrid-sorter{display:flex;flex-direction:column;flex-shrink:0;width:.8em;overflow:hidden;color:var(--color-7)}.i-datagrid-sorter-caret:first-child{margin-bottom:-0.4em;transform:rotate(-90deg)}.i-datagrid-sorter-caret:last-child{transform:rotate(90deg)}.i-datagrid-sorter-asc .i-datagrid-sorter-caret:first-child{color:var(--color-main)}.i-datagrid-sorter-desc .i-datagrid-sorter-caret:last-child{color:var(--color-main)}.i-affix{position:fixed;z-index:50;display:flex;flex-direction:column;gap:.5em;transition:var(--transition)}.i-affix-hidden .i-affix-totop{opacity:0}.i-description{display:grid}.i-description-item{display:flex;gap:.5em}.i-description-item-vertical{flex-direction:column}.i-description-label{flex-shrink:0;width:var(--description-label-width);color:var(--color-5)}.i-description-value{flex:1}.i-checkbox{gap:1em}.i-checkbox-item{display:inline-flex;align-items:baseline;gap:.25em;border-radius:var(--radius);align-self:flex-start}.i-checkbox-item:hover .i-checkbox-input{box-shadow:inset 0 0 0 2px var(--color-5)}.i-checkbox-item:hover .i-checkbox-switch{box-shadow:inset 0 0 0 2px var(--color-8)}.i-checkbox-item:hover .i-checkbox-partof{box-shadow:none}.i-checkbox-item .i-checkbox-input:checked{box-shadow:none}.i-checkbox-options{flex:1 1 100%;position:relative;display:flex;flex-wrap:wrap;gap:.625em;align-self:baseline}.i-checkbox-text{display:inline-flex;transition:var(--transition);user-select:none;border-radius:inherit;color:var(--color-3)}.i-checkbox-text:empty{display:none}.i-checkbox-input{position:relative;display:flex;cursor:inherit;height:1.125em;width:1.125em;overflow:hidden;appearance:none;border-radius:inherit;transition:var(--transition);outline:0;align-self:center}.i-checkbox-custom{width:0;height:0}.i-checkbox-switch{height:1.125em;width:2.2em;overflow:unset;border-radius:2.4em;box-shadow:inset 0 0 0 2px var(--color-9);background:var(--color-9)}.i-checkbox-switch:hover:after{box-shadow:0 0 0 2px var(--color-7);background-color:var(--color-main-0)}.i-checkbox-default{border-radius:2px;box-shadow:inset 0 0 0 2px var(--color-7)}.i-checkbox-button{display:none}.i-checkbox-default:after,.i-checkbox-switch:before,.i-checkbox-switch:after,.i-checkbox-partof:after{content:" ";position:absolute;transition:var(--transition)}.i-checkbox-default:after{left:34%;top:16%;height:50%;width:20%;border-bottom:2px solid var(--color-main-reverse);border-right:2px solid var(--color-main-reverse);transform:rotate(90deg) scale(0);border-radius:1px}.i-checkbox-switch:after{left:0;top:50%;width:1em;height:1em;transform:translate(0, -50%);box-shadow:0 0 0 2px var(--color-8);border-radius:1em;transition:var(--transition);background-color:var(--background)}.i-checkbox-switch:active:after{width:1.5em}.i-checkbox-switch:active:checked:after{left:-0.5em}.i-checkbox-input:checked.i-checkbox-default{background-color:var(--color-main)}.i-checkbox-input:checked.i-checkbox-default:after{transform:rotate(45deg)}.i-checkbox-input:checked.i-checkbox-switch{background-color:var(--color-main)}.i-checkbox-input:checked.i-checkbox-switch:after{box-shadow:0 0 0 2px var(--color-main);transform:translate(1.2em, -50%);background-color:var(--background)}.i-checkbox-input:checked+.i-checkbox-text{color:var(--color-main)}.i-checkbox-button+.i-checkbox-text{padding:0 1em;line-height:1.8;font-size:.9em;display:flex;align-items:center;white-space:nowrap;border-radius:2em;border:1px solid var(--color-9)}.i-checkbox-button:hover+.i-checkbox-text{background-color:var(--color-9);border-color:var(--color-8)}.i-checkbox-button:checked+.i-checkbox-text{background-color:var(--color-main);color:var(--color-main-reverse)}.i-checkbox-partof{border-radius:2px;background-color:var(--color-main)}.i-checkbox-partof:after{background-color:var(--color-main-reverse);height:2px;width:.5em;left:50%;top:50%;transform:translate(-50%, -50%);border-radius:var(--radius)}.i-checkbox-message{margin-top:.5em;font-size:.8em;align-self:flex-start;pointer-events:none}.i-checkbox-success .i-checkbox-input{box-shadow:inset 0 0 0 2px var(--success-0)}.i-checkbox-success .i-checkbox-input:checked{background-color:var(--success-0)}.i-checkbox-success .i-checkbox-message{color:var(--success)}.i-checkbox-warning .i-checkbox-input{box-shadow:inset 0 0 0 2px var(--warning-0)}.i-checkbox-warning .i-checkbox-input:checked{background-color:var(--warning-0)}.i-checkbox-warning .i-checkbox-message{color:var(--warning)}.i-checkbox-error .i-checkbox-input{box-shadow:inset 0 0 0 2px var(--error-0)}.i-checkbox-error .i-checkbox-input:checked{background-color:var(--error-0)}.i-checkbox-error .i-checkbox-message{color:var(--error)}.i-backdrop-drawer{position:fixed;inset:0;z-index:100;pointer-events:none;background:var(--color-backdrop);backdrop-filter:blur(8px);transition:var(--transition);opacity:0;display:flex}.i-backdrop-drawer.i-active{opacity:1;pointer-events:unset}.i-drawer{position:absolute;display:flex;flex-direction:column;max-width:100%;max-height:100%;overflow:auto;box-shadow:var(--shadow);transition:var(--transition);background:var(--background-1);backdrop-filter:var(--blur)}.i-drawer-left{inset:0 auto 0 0;transform:translate3d(-100%, 0, 0)}.i-drawer-top{inset:0 0 auto;transform:translate3d(0, -100%, 0)}.i-drawer-right{inset:0 0 0 auto;transform:translate3d(100%, 0, 0)}.i-drawer-bottom{inset:auto 0 0;transform:translate3d(0, 100%, 0)}.i-active>.i-drawer{opacity:1;transform:none;pointer-events:unset}.i-drawer-header,.i-drawer-footer{display:flex;align-items:center;padding:12px}.i-drawer-header:empty,.i-drawer-footer:empty{display:none}.i-drawer-content{flex:1;overflow-x:hidden}.i-drawer-close{margin:0 0 0 auto;display:flex;align-self:flex-start;border-radius:var(--radius)}.i-collapse{border-radius:var(--radius)}.i-collapse-bordered{border:1px solid var(--color-8)}.i-collapse-bordered .i-collapse-item+.i-collapse-item{border-top:1px solid var(--color-8)}.i-collapse-item{border-radius:var(--radius)}.i-collapse-header{display:flex;justify-content:space-between;align-items:center;padding:.5em;transition:var(--transition);font-weight:500;border-radius:var(--radius)}.i-collapse-header:hover{background-color:var(--background-opacity-1)}.i-collapse-toggle{margin:0;display:flex;user-select:none}.i-collapse-content{padding:0 .5em;height:0;overflow:hidden;transition:var(--transition);border-radius:var(--radius)}.i-collapse-active>.i-collapse-header,.i-collapse-header:hover{opacity:1}.i-collapse-active>.i-collapse-content{padding:.5em;height:unset}.i-collapse-disabled{pointer-events:none;opacity:.4}.i-collapse-disabled>.i-collapse-content{padding:0 .5em;height:0;overflow:hidden}.i-dropdown-content{display:flex;flex-direction:column;max-height:40vh;padding:8px;gap:2px;overflow-x:hidden;border-radius:inherit}.i-editor{display:flex;flex-direction:column}.i-editor:focus-within>.i-editor-controls,.i-editor:focus-within>.i-editor-content,.i-editor:hover>.i-editor-controls,.i-editor:hover>.i-editor-content{border-color:var(--color-8)}.i-editor-borderless{border-radius:var(--radius)}.i-editor-borderless>.i-editor-controls,.i-editor-borderless>.i-editor-content{border:none}.i-editor-controls{display:flex;gap:2px;border:2px solid var(--color-9);border-bottom:0;padding:2px;border-radius:var(--radius) var(--radius) 0 0;transition:var(--transition)}.i-editor-controls .i-btn{--color: var(--color-5)}.i-editor-controls .i-btn:hover{--color: var(--color)}.i-editor-controls .i-btn:hover .i-editor-control-tip{opacity:1}.i-editor-control-tip{position:absolute;z-index:1;top:100%;left:50%;transform:translate(-50%, 0);opacity:0;pointer-events:none;transition:var(--transition)}.i-editor-content{flex:1;outline:none;padding:var(--padding);border:2px solid var(--color-9);border-radius:0 0 var(--radius) var(--radius);transition:var(--transition);overflow:auto;white-space:pre-wrap;word-wrap:break-word;word-break:break-all;tab-size:1em}.i-editor-content:first-child{border-radius:var(--radius)}.i-editor-content:hover,.i-editor-content:focus{border-color:var(--color-8)}.i-editor-content a{color:var(--blue)}.i-editor-content img{margin:0}.i-editor-content:empty:before{content:attr(data-placeholder);color:var(--color-5)}.i-card{--card-padding: 8px 12px;display:flex;flex-direction:column;background:var(--background-opacity-2);backdrop-filter:var(--blur);border-radius:var(--radius)}.i-card-bordered{border:1px solid var(--color-8)}.i-card-header{display:flex;align-items:center;padding:var(--card-padding);gap:.25em}.i-card-content{flex:1}.i-card-footer{margin-top:auto;display:flex;align-items:center;padding:var(--card-padding);gap:.25em}.icon{vertical-align:middle}.i-form{display:grid;max-width:100%}.i-form-inline{--label-inline: nowrap}.i-form-inline .i-input-label{flex-wrap:nowrap}.i-btn{--gap: 0.5em;--background: var(--color-main);--background-hover: var(--color-main-1);--color: var(--color-main-reverse);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:var(--gap);padding:0 .6em;height:2.25em;border-radius:var(--radius);border:2px solid rgba(0,0,0,0);transition:var(--transition);user-select:none;cursor:pointer;white-space:nowrap;outline:none;font-weight:500;font-size:.94em;background:var(--background);color:var(--color);line-height:1;flex-shrink:0}.i-btn .i-ripple-container{inset:-2px}.i-btn-toggle{overflow:hidden}.i-btn-toggle-content{display:inline-flex;gap:var(--gap);align-items:center;transform:scale(0.4)}.i-btn-toggle-content.i-btn-toggle-active{transition:var(--transition);transform:none}.i-btn-block{width:100%}.i-btn-large{font-size:1.25em}.i-btn-extreme{font-size:2em;height:2em}.i-btn-small{height:2em;line-height:2;font-size:.86em;padding:0 .4em}.i-btn-mini{line-height:1;height:1.4em;font-size:.8em;padding:0 .2em}.i-btn-square{padding:0;width:2.25em}.i-btn-square.i-btn-extreme,.i-btn-square.i-btn-small{width:2em}.i-btn:hover{--background: var(--background-hover)}.i-btn:active{--background: var(--color-main)}.i-btn-secondary{--background-hover: var(--color-8);--background: var(--color-9);--color: var(--color-1)}.i-btn-flat{--background-hover: var(--color-9);--color-main-reverse: var(--color);--background: transparent;--color: var(--color-1)}.i-btn-outline{--background-hover: var(--color-main-0);--color: var(--color-main)}.i-btn-outline.i-btn{--background: transparent;border-color:var(--color)}.i-btn.i-btn-outline:hover,.i-btn.i-btn-secondary:hover,.i-btn.i-btn-flat:hover{--background: var(--background-hover)}.i-btn-content{display:contents}.i-btn-loading{opacity:.628;cursor:default}.i-btn-group-horizonal{display:flex}.i-btn-group-horizonal .i-btn:not(:first-child){border-top-left-radius:0;border-bottom-left-radius:0}.i-btn-group-horizonal .i-btn:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}.i-btn-group-vertical{display:flex;flex-direction:column}.i-btn-group-vertical .i-btn:not(:first-child){border-top-left-radius:0;border-top-right-radius:0}.i-btn-group-vertical .i-btn:not(:last-child){border-bottom-right-radius:0;border-bottom-left-radius:0}.i-image{position:relative;display:inline-flex;align-items:center;justify-content:center;align-self:center;border-radius:var(--radius);overflow:hidden;vertical-align:middle;background:var(--background-opacity);backdrop-filter:var(--blur)}.i-image .i-loading-container{z-index:1;backdrop-filter:var(--blur)}.i-image>img{border-radius:inherit}.i-image-cover{position:absolute;inset:0;padding:.5em;display:flex;align-items:center;justify-content:center;backdrop-filter:var(--blur)}.i-loading-container{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:.5em;font-size:inherit;transform:translateZ(0);border-radius:inherit}.i-loading-icon{stroke:var(--color);width:1em;height:1em;animation:rotate .628s linear 0s infinite}.i-pagination{display:flex;align-items:center;gap:.2em}.i-page{--background: transparent;--color: var(--color-7);position:relative;display:inline-flex;align-items:center;justify-content:center;padding:0 .32em;height:2.25em;min-width:2.25em;border-radius:var(--radius);border:2px solid rgba(0,0,0,0);transition:var(--transition);user-select:none;cursor:pointer;white-space:nowrap;outline:none;color:var(--color);background:var(--background)}.i-page .i-ripple-container{inset:-2px}.i-page .i-loading-container{position:absolute;inset:0;z-index:1;background:var(--background-opacity);backdrop-filter:var(--blur)}.i-page:hover{--background: var(--background-opacity-1)}.i-page.i-page-active{--background: var(--color-main-0);--color: var(--color-main);cursor:default}.i-page.i-page-loading{--background: unset;cursor:default}.i-messages{position:fixed;inset:12px;pointer-events:none;display:flex;flex-direction:column;justify-content:center;z-index:10000;transition:var(--transition);cursor:default}.i-message{position:absolute;padding:var(--padding);pointer-events:all;opacity:0;transition:var(--transition);transform:translate(80px, 0) scale(0.86) skew(-40deg);background:var(--background-opacity);border-radius:var(--radius);box-shadow:var(--shadow);backdrop-filter:var(--blur)}.i-message.i-message-active{opacity:1;transform:translate(0, 0)}.i-list{overflow:auto}.i-list-item{display:flex;gap:.5em;padding:.32em .4em;transition:var(--transition);border-radius:var(--radius)}.i-list-option{position:relative;cursor:pointer;user-select:none;white-space:nowrap;justify-content:space-between}.i-list-option:hover{background-color:var(--background-opacity-1)}.i-list-item-label{align-self:flex-start}.i-modal-container{position:absolute;inset:0;z-index:100;padding:12px;transition:var(--transition);opacity:0;pointer-events:none;display:flex;overflow:hidden}.i-modal-container.i-modal-active{opacity:1}.i-modal-backdrop{background:var(--color-backdrop);backdrop-filter:blur(8px)}.i-modal-backdrop.i-modal-active{pointer-events:unset}.i-modal-customized{overflow:unset}.i-modal{position:relative;display:flex;flex-direction:column;margin:auto;max-width:100%;max-height:100%;overflow-x:hidden;border-radius:var(--radius);transform:translate(0, 12px);transition:var(--transition);background:var(--background)}.i-modal.bounced{animation:bounce .4s ease-in-out 0s}.i-modal-active>.i-modal{opacity:1;transform:none;pointer-events:unset}.i-modal-header,.i-modal-footer{display:flex;align-items:center;padding:12px;gap:12px}.i-modal-header:empty,.i-modal-footer:empty{display:none}.i-modal-footer{justify-content:center}.i-modal-content{flex:1;max-height:100%;overflow-x:hidden}.i-modal .i-modal-close{margin:0 0 0 auto;display:flex;align-self:flex-start;border-radius:var(--radius)}.i-popconfirm{padding:12px}.i-radio{position:relative;display:inline-flex;flex-wrap:wrap;gap:1em}.i-radio-label{width:var(--label-width);text-align:var(--label-align);font-weight:500}.i-radio-item{display:inline-flex;align-items:baseline;border-radius:var(--radius)}.i-radio-item:hover .i-radio-input{box-shadow:inset 0 0 0 3px var(--color-7);background-color:var(--color-main-0)}.i-radio-item-custom>.i-radio-input{width:0;height:0}.i-input-success .i-radio-input{box-shadow:inset 0 0 0 3px var(--green-0)}.i-input-warning .i-radio-input{box-shadow:inset 0 0 0 3px var(--yellow-0)}.i-input-error .i-radio-input{box-shadow:inset 0 0 0 3px var(--error-0)}.i-radio-options{flex:1 1 100%;position:relative;display:flex;flex-wrap:wrap;gap:.625em;align-self:baseline}.i-radio-options-button{flex:none}.i-radio-text{display:inline-flex;margin-left:.4em;transition:var(--transition);user-select:none;border-radius:inherit;color:var(--color-3)}.i-radio-input{position:relative;display:flex;cursor:inherit;height:1.125em;width:1.125em;flex-shrink:0;overflow:hidden;appearance:none;border-radius:50%;transition:all .15s;outline:0;align-self:center;box-shadow:inset 0 0 0 3px var(--color-8)}.i-radio-default{border:0 solid rgba(0,0,0,0)}.i-radio-input:checked.i-radio-default{border-width:.4em;border-color:var(--color-main);background:var(--color-main-reverse);box-shadow:none}.i-radio-input:checked.i-radio-default+.i-radio-text{color:var(--color-main)}.i-radio-default:active{transform:scale(1.1)}.i-radio-button{display:none}.i-radio-button+.i-radio-text{margin-left:0;padding:0 .628em;line-height:1.8;font-size:.94em;white-space:nowrap;border:1px solid var(--color-9)}.i-radio-button+.i-radio-text:hover{background:var(--color-main-0);border-color:var(--color-8)}.i-radio-button:checked+.i-radio-text{background:var(--color-main);color:var(--color-main-reverse);box-shadow:0 0 2px var(--dim);border-color:var(--color-main)}.i-radio-message{margin-top:.5em;font-size:.8em;align-self:flex-start;pointer-events:none}.i-radio-success .i-radio-input{box-shadow:inset 0 0 0 3px var(--success-0)}.i-radio-success .i-radio-message{color:var(--success)}.i-radio-warning .i-radio-input{box-shadow:inset 0 0 0 3px var(--warning-0)}.i-radio-warning .i-radio-message{color:var(--warning)}.i-radio-error .i-radio-input{box-shadow:inset 0 0 0 3px var(--error-0)}.i-radio-error .i-radio-message{color:var(--error)}.i-resizable{display:flex;overflow:hidden}.i-resizable-vertical{flex-direction:column}.i-resizable-vertical>.i-resizable-line{cursor:ns-resize;width:100%;height:2px}.i-resizable-a{overflow:auto}.i-resizable-b{flex:1;overflow:auto}.i-resizable-line{position:relative;display:flex;justify-content:center;align-items:center;width:2px;height:100%;background:var(--color-8);cursor:ew-resize;transition:var(--transition);touch-action:none;user-select:none}.i-resizable-line:hover,.i-resizable-line.i-resizable-resizing{outline:1px solid var(--color-8)}.i-resizable-line:hover>.i-resizable-line-node,.i-resizable-line.i-resizable-resizing>.i-resizable-line-node{opacity:1}.i-resizable-line-node{display:flex;position:relative;z-index:1;pointer-events:none;opacity:0;transition:var(--transition);background:inherit;border-radius:var(--radius);font-size:.8em}.i-progress{flex:1 1 100%;position:relative;display:flex;background:var(--background-1);border-radius:var(--radius);cursor:pointer}.i-progress-vertical{height:100%}.i-progress-vertical>.i-progress-bar{height:100%;align-self:flex-end}.i-progress-bar{position:relative;width:100%;background:var(--color-main);border-radius:var(--radius);transform-origin:left;transition:var(--transition)}.i-progress-cursor{position:absolute;right:0;top:50%;display:flex;min-height:120%;min-width:1em;transform:translate(50%, -50%) scale(0);transition:var(--transition);border-radius:inherit;box-shadow:var(--shadow);user-select:none;overflow:hidden}.i-progress:hover .i-progress-cursor,.no-transition>.i-progress-cursor{transform:translate(50%, -50%) scale(1)}.i-progress-circle{position:relative}.i-progress-circle-path{transition:var(--transition);border-radius:50px}.i-progress-circle-value{position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);font-size:1.5em}.i-popup{position:absolute;z-index:100;opacity:0;transition:opacity .12s,transform .12s;border-radius:var(--radius);background:var(--background);box-shadow:var(--shadow);transform:translate(0, 2px)}.i-popup-arrow{position:absolute;width:8px;height:24px;pointer-events:none;color:unset}.i-popup-arrow path{fill:var(--background)}.i-select{display:flex;gap:.5em}.i-select-multiple{flex-wrap:wrap;padding:.25em .628em}.i-select-multiple .i-tag{position:relative;padding:0 .5em;line-height:1.425em;background:var(--color-8)}.i-select-options{display:flex;flex-direction:column;max-height:40vh;padding:4px;gap:2px;overflow-x:hidden;border-radius:inherit}.i-select-options .i-list-item{justify-content:unset;align-items:center;color:var(--color-5)}.i-select-options .i-list-item.i-list-item-active{color:var(--color-main);background:var(--color-main-0)}.i-select-options .i-list-item.i-list-item-active .i-select-option-check{opacity:1}.i-select-options .i-list-item.disabled{pointer-events:none}.i-select-options-multiple .i-list-item.i-list-item-active{background:rgba(0,0,0,0)}.i-select-option-check{opacity:0}.i-select-filter{position:sticky;top:0;z-index:1;display:flex;flex-wrap:wrap;background:var(--background-opacity);backdrop-filter:var(--blur);border-bottom:1px solid var(--background-opacity-1)}.i-select-filter:empty{display:none}.i-tabs{max-width:100%;gap:.5em}.i-tabs-line .i-tab-navs{gap:1em}.i-tabs-line .i-tab-nav{padding:.4em 0}.i-tabs-line .i-tab-nav.i-tab-active{--color: var(--color-main)}.i-tabs-line .i-tab-navs-bar{background:var(--color-main)}.i-tabs-line .i-tab-navs-vertical>.i-tab-navs{gap:.5em}.i-tabs-line .i-tab-navs-vertical>.i-tab-navs>.i-tab-nav{padding:.25em 1em}.i-tab-navs-container{display:flex;border-radius:var(--radius);scroll-behavior:smooth;gap:4px;align-items:center}.i-tab-navs-vertical{align-items:flex-end;flex-direction:column}.i-tab-navs{flex:1;position:relative;display:flex;flex-direction:inherit;overflow:auto;user-select:none;scroll-behavior:unset;scrollbar-width:none;gap:1px}.i-tab-navs::-webkit-scrollbar{display:none}.i-tabs-pane .i-tab-navs-container{position:relative}.i-tabs-pane .i-tab-navs-container:before{position:absolute;bottom:0;left:0;right:0;width:100%;border-top:1px solid var(--color-8);content:"";z-index:1}.i-tabs-pane .i-tab-navs{gap:4px}.i-tabs-pane .i-tab-navs .i-tab-nav{border-radius:var(--radius) var(--radius) 0 0;border:1px solid rgba(0,0,0,0)}.i-tabs-pane .i-tab-navs .i-tab-nav:hover{border-color:var(--color-8);border-bottom-color:var(--background)}.i-tabs-pane .i-tab-navs .i-tab-active{z-index:2;background:rgba(0,0,0,0);border-color:var(--color-8);border-bottom:1px solid var(--background);box-shadow:1px 2px 2px var(--color-8)}.i-tabs-pane .i-tab-navs .i-tab-active:hover{background-color:rgba(0,0,0,0)}.i-tabs-pane .i-tab-navs-vertical:before{left:unset;top:0;width:unset;height:100%;border-top:none;border-right:1px solid var(--color-8)}.i-tabs-pane .i-tab-navs-vertical .i-tab-navs .i-tab-nav{border-radius:var(--radius) 0 0 var(--radius);border:1px solid rgba(0,0,0,0)}.i-tabs-pane .i-tab-navs-vertical .i-tab-navs .i-tab-nav:hover{border-color:var(--color-8);border-right-color:var(--background)}.i-tabs-pane .i-tab-navs-vertical .i-tab-navs .i-tab-active{border-color:var(--color-7);border-right:1px solid var(--background)}.i-tabs-pane .i-tab-navs-vertical .i-tab-navs .i-tab-active:hover{background-color:rgba(0,0,0,0)}.i-tab-nav{--color: var(--color-7);position:relative;z-index:1;display:flex;align-items:center;justify-content:center;padding:.4em .5em;user-select:none;flex-shrink:0;gap:.25em;color:var(--color);border-radius:var(--radius)}.i-tab-nav:hover{--color: var(--color-3)}.i-tab-nav.i-tab-active{--color: var(--color-main)}.i-tabs-morelist .i-tab-nav{white-space:nowrap}.i-tabs-morelist .i-tab-active{background:var(--color-main-0)}.i-tab-closable .i-tab-nav{padding-right:0;border-radius:var(--radius) var(--radius) 0 0}.i-tab-closable .i-tab-nav.i-tab-active{box-shadow:2px 0 8px rgba(0,0,0,.0509803922);background-color:var(--background)}.i-tab-nav-close{margin:0;font-size:.7em;padding:0}.i-tab-nav-close:hover{color:var(--error)}.i-tab-navs-bar{position:absolute;bottom:0em;left:0;height:0;background:var(--color-main-0);pointer-events:none;transition:var(--transition);border-radius:4px}.i-tab-navs-vertical>.i-tab-navs{gap:1px}.i-tab-navs-vertical>.i-tab-navs>.i-tab-navs-bar{width:0;left:unset;bottom:unset;right:0;top:0}.i-tab-contents{position:relative;flex:1}.i-tab-content{display:none}.i-tab-content.i-tab-active{display:block}.i-step{display:flex;flex-wrap:wrap;gap:.5em;overflow:hidden}.i-step-vertical{flex-direction:column}.i-step-vertical .i-step-item{flex-direction:row}.i-step-vertical .i-step-item:not(:last-child) .i-step-item-right{padding-bottom:1em}.i-step-item{display:flex;flex-direction:column;gap:.5em;flex:1 1 auto;transition:var(--transition)}.i-step-item:last-child{flex:none}.i-step-item:last-child .i-step-divider{display:none}.i-step-item.i-step-item-finished{opacity:.4}.i-step-item.i-step-item-finished .i-step-divider{border-style:solid}.i-step-item.i-step-item-pending{opacity:.4}.i-step-item:hover{opacity:1}.i-step-item-index{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:1.5em;line-height:1.5em;border-radius:1.5em;background:var(--color-4);color:var(--background)}.i-step-divider{flex:1;align-self:center;border:1px dashed var(--color-7)}.i-step-item-title{display:flex;align-items:center;gap:.5em;white-space:nowrap}.i-step-item-left{display:flex;flex-direction:column;align-items:center;gap:.5em}.i-step-item-right{display:flex;flex-direction:column;gap:.5em}.i-swiper{position:relative;max-width:100%;user-select:none}.i-swiper:hover .i-swiper-arrow{opacity:.72}.i-swiper .i-swiper-arrow:hover{opacity:1}.i-swiper-track{position:relative;overflow:hidden;touch-action:pan-x;border-radius:var(--radius)}.i-swiper-list{display:flex;will-change:transform}.i-swiper-fade>.i-swiper-item{opacity:0}.i-swiper-fade>.i-swiper-active{opacity:1}.i-swiper-vertical .i-swiper-track{height:100%;touch-action:pan-y}.i-swiper-vertical .i-swiper-list{flex-direction:column}.i-swiper-vertical .i-swiper-item{width:100%}.i-swiper-vertical .i-swiper-arrow{left:unset;right:.5em}.i-swiper-vertical .i-swiper-prev{bottom:50%;top:unset;transform:translate(0, -6px)}.i-swiper-vertical .i-swiper-next{transform:translate(0, 6px)}.i-swiper-item{flex:1;flex-shrink:0;display:flex;justify-content:center;align-items:center;overflow:hidden;transition:var(--transition)}.i-swiper-item>.i-image{height:100%}.i-swiper-arrow{position:absolute;top:50%;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius);transform:translate(0, -50%);transition:var(--transition);opacity:0}.i-swiper-prev{left:.5em}.i-swiper-next{right:.5em}.i-swiper-indicators{margin:.5em 0;display:flex;justify-content:center;gap:.5em}.i-swiper-indicators-fixed{position:absolute;bottom:0;left:50%;transform:translate(-50%, 0)}.i-swiper-indicator{width:8px;height:8px;border-radius:50%;flex-shrink:0;background:var(--color);opacity:.25}.i-swiper-indicator:hover{opacity:.8}.i-swiper-indicator.i-indicator-active{opacity:1}.i-tag{--background: var(--color-9);--color: var(--color-1);position:relative;display:inline-flex;align-items:center;justify-content:center;align-self:center;gap:.5em;padding:.1em .5em;border-radius:var(--radius);background:var(--background);color:var(--color);border:2px solid rgba(0,0,0,0);transition:var(--transition);font-size:.81em;line-height:1}.i-tag:hover .i-tag-hover-close{opacity:1;transform:translate(50%, -50%) scale(1)}.i-tag-large{font-size:1em}.i-tag-extreme{font-size:1.5em;height:2em}.i-tag-small{font-size:.72em;padding:.125em .4em}.i-tag-dot{content:" ";width:.385em;height:.385em;border-radius:50%;background-color:var(--color);box-shadow:0 -1px 1px 0 rgba(var(--color), 0.3);flex-shrink:0;transition:inherit}.i-tag-outline{--background: transparent;border-color:var(--color)}.i-tag-close{position:absolute;right:0;top:0;z-index:1;margin:0;background:var(--error);color:var(--white);transform:translate(50%, -50%);font-size:.81em;transition:all .16s}.i-tag-close:hover{background:var(--error-1);color:var(--white)}.i-tag-hover-close{transform:translate(50%, -50%) scale(0);opacity:0}.i-tag-clickable{cursor:pointer}.i-tag-clickable:hover{background:var(--background-hover);color:var(--color-hover)}.i-text-gradient{-webkit-text-fill-color:rgba(0,0,0,0)}.i-text-gradient-wave{background-size:200% 100%;background-position:0 0;animation:text-wave 1.2s linear 0s infinite}@keyframes text-wave{100%{background-position:-100% 0}}.i-video{position:relative;background:#000;border-radius:var(--radius);overflow:hidden}.i-video video{width:100%;height:100%}.i-video-controls{position:absolute;left:0;bottom:0;right:0;display:flex;align-items:center;padding:4px;gap:4px;font-size:.9em;white-space:nowrap;user-select:none;transition:var(--transition);background:var(--background-opacity);backdrop-filter:var(--blur)}.i-video-controls .i-btn{flex-shrink:0}.i-video-controls .i-icon{font-size:1.2em}.i-video-controls:hover{opacity:1;pointer-events:unset}.i-video-controls-hidden{opacity:0;pointer-events:none}.i-video-control{display:flex;align-items:center}.i-video-times{margin-inline:8px;display:flex;align-items:center;gap:4px}.i-video-volume{position:absolute;z-index:1;bottom:100%;left:50%;transform:translate(-50%, 4px);padding:8px;opacity:0;pointer-events:none;border-radius:var(--radius);transition:var(--transition);backdrop-filter:var(--blur);background:var(--background-opacity)}.i-video-control-volume{position:relative}.i-video-control-volume:hover .i-video-volume{opacity:1;pointer-events:unset}.i-tree{display:flex;flex-direction:column;gap:1px;color:var(--color-2)}.i-tree-group-title{position:relative;font-size:1em;display:flex;font-weight:300;font-style:italic;font-size:.9em}.i-tree-group-title:after{content:" ";margin-left:.5em;flex:1;height:1px;align-self:center;background:var(--color-8)}.i-tree-item-header{position:relative;display:flex;align-items:center;gap:.25em;padding:.4em;user-select:none;border-radius:var(--radius);overflow:hidden;color:var(--color-6)}.i-tree-item-header.i-tree-item-round{border-radius:100px}.i-tree-item-header.i-tree-item-selected,.i-tree-item-header:hover{background:var(--color-main-0);color:var(--color-main)}.i-tree-round{--radius: 100px}.i-tree-item-icon{display:flex}.i-tree-checkbox{align-self:center}.i-tree-toggle{margin-left:auto;transition:var(--transition);border-radius:inherit;color:var(--color-6)}.i-tree-toggle:hover{color:var(--color-3);background:var(--background-opacity)}.i-tree-item-content{max-height:0;overflow:hidden;transition:max-height .5s cubic-bezier(0, 1, 0, 1)}.i-tree-expand>.i-tree-item-content{transition:max-height .25s cubic-bezier(1, 0, 1, 0);max-height:2000px}.i-tree-expand>.i-tree-item-header{color:var(--color-main);opacity:1}.i-tree-expand>.i-tree-item-header>.i-tree-toggle{transform:rotateX(180deg)}.i-colorpicker-handle{position:relative;display:inline-flex;align-items:center;font-size:.8em;gap:.25em}.i-colorpicker-square{display:inline-block;width:1.8em;height:1.8em;border:2px solid var(--color-9);border-radius:var(--radius);cursor:pointer;transition:var(--transition)}.i-colorpicker-square:hover{border-color:var(--color-8)}.i-colorpicker-footer{display:flex;gap:4px;font-size:.8em}.i-colorpicker-text{transition:var(--transition);cursor:pointer;padding:.25em .5em;border-radius:var(--radius);background:var(--color-9)}.i-colorpicker-text:hover{background:var(--color-8)}.rc-color-picker-panel{box-shadow:none;background:inherit}.i-ripple-container{position:absolute;inset:0;overflow:hidden;pointer-events:none;border-radius:inherit;contain:strict}.i-ripple{position:absolute;background:var(--color);opacity:.15;transform:translate(-50%, -50%) scale(0.25);transform-origin:50%;border-radius:50%}.i-ripple-active{opacity:0;transform:translate(-50%, -50%) scale(1)}.i-input-label-file{display:inline-flex;width:unset}.i-input-label-file:has(.i-upload-list:empty){align-items:center}.i-input-file-hidden{display:none}.i-upload-inner{flex:1 1 100%;display:flex;flex-wrap:wrap;gap:.5em}.i-upload-card:has(.i-upload-list:not(:empty)){align-self:flex-start}.i-upload-card .i-upload-list{display:contents}.i-upload-list{display:flex;flex-wrap:wrap;width:100%;gap:inherit;user-select:none}.i-upload-list:empty{display:none}.i-upload-delete{opacity:0;margin:0;z-index:1;right:-0.825em;top:-0.825em;box-shadow:var(--shadow)}.i-upload-btn{align-self:center}.i-upload-card-btn{border-style:dashed;width:var(--upload-card-size);height:var(--upload-card-size);opacity:.6;font-size:1em}.i-upload-card-btn:hover{opacity:1}.i-upload-item{position:relative;display:inline-flex;align-items:center;gap:.25em;padding:.25em .4em;border:2px solid var(--background-opacity-1);border-radius:var(--radius);background:var(--background-opacity);transition:var(--transition);font-size:.8em}.i-upload-item .i-upload-delete{position:absolute;background-color:var(--error);color:#fff}.i-upload-item .i-upload-delete:hover{background-color:var(--error);color:#fff}.i-upload-item:hover{background-color:var(--background-opacity-1)}.i-upload-item:hover .i-upload-delete{opacity:1}.i-upload-item-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.25em;width:var(--upload-card-size);height:var(--upload-card-size);border-radius:var(--radius);background:var(--background-opacity-1);cursor:pointer}.i-upload-item-card .i-image,.i-upload-item-card video{width:100%;height:100%;object-fit:cover}.i-upload-item-card .i-upload-file-name{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:.8em;padding-inline:4px}.i-upload-item-card .i-upload-delete{font-size:.72em;position:absolute;background-color:var(--error);color:#fff}.i-upload-item-card .i-upload-delete:hover{background-color:var(--error);color:#fff}.i-upload-item-card:hover .i-upload-delete{opacity:1}.i-upload-size{font-size:.8em;color:var(--color-6)}.i-upload-item-dragged{z-index:1000}.i-timepicker{display:flex}.i-timepicker-list{min-width:3em;text-align:center;overflow:auto;padding:4px;max-height:12.2em;display:flex;flex-direction:column;gap:2px;scrollbar-width:none}.i-timepicker-list::-webkit-scrollbar{display:none}.i-timepicker-list:not(:last-child){border-right:1px solid var(--color-9)}.i-timepicker-item{display:block;padding:.32em .5em;border-radius:var(--radius);opacity:.5}.i-timepicker-item:hover{background-color:var(--color-9);opacity:1}.i-timepicker-item.i-timepicker-item-active{background:var(--color-main);color:var(--color-main-reverse);opacity:1}.i-timepicker-icon{margin-right:.25em;opacity:.5;pointer-events:none}.i-datepicker{padding:8px}.i-datepicker .i-datepicker-item{cursor:pointer}.i-datepicker-weeks,.i-datepicker-dates{display:grid;grid-template-columns:repeat(7, 1fr);gap:2px}.i-datepicker-week,.i-datepicker-item{display:flex;justify-content:center;padding:.32em .5em}.i-datepicker-week{color:var(--color-5)}.i-datepicker-item{--background: transparent;opacity:.4;border-radius:var(--radius);transition:all .12s;background:var(--background);color:var(--color)}.i-datepicker-item:hover{opacity:1;--background: var(--color-main-0)}.i-datepicker-item.i-datepicker-same-month{opacity:.8}.i-datepicker-item.i-datepicker-today{--background: var(--color-main-0)}.i-datepicker-item.i-datepicker-active{--background: var(--color-main);--color: var(--color-main-reverse);opacity:1}.i-datepicker-item.i-datepicker-disabled{opacity:.2;cursor:not-allowed}.i-datepicker-units{margin-bottom:.5em;display:flex;align-items:center;gap:.125em;color:var(--color-6);font-size:.9em}.i-datepicker-action{position:relative;display:flex;align-items:baseline;gap:.25em;padding:.125em .5em;user-select:none;border-radius:var(--radius)}.i-datepicker-action>span{color:var(--color);font-size:1.15em}.i-datepicker-action:hover{background:var(--color-main-0)}.i-datepicker-icon{margin-right:.25em;opacity:.5;pointer-events:none}.i-datepicker-ym{position:absolute;inset:0;z-index:1;padding:8px;gap:.5em;background:var(--background);backdrop-filter:var(--blur);display:flex;pointer-events:none;opacity:0;transition:var(--transition)}.i-datepicker-ym.i-datepicker-active{opacity:1;pointer-events:unset}.i-datepicker-years{width:5em;overflow-x:hidden;display:flex;flex-direction:column;max-height:100%;gap:.25em}.i-datepicker-months{margin-top:1.5em;flex:1;display:grid;grid-template-columns:repeat(3, 1fr);gap:.25em}.i-datepicker-year{flex:1}.i-datepicker-year,.i-datepicker-month{display:flex;padding:2px;user-select:none;border-radius:var(--radius);justify-content:center;align-items:center}.i-datepicker-year:hover,.i-datepicker-month:hover{background-color:var(--background-opacity-2)}.i-datepicker-year.i-datepicker-active,.i-datepicker-month.i-datepicker-active{background:var(--color-main);color:var(--color-main-reverse);opacity:1}.i-datepicker-close{position:absolute;right:0;top:0}.i-empty{margin:auto;width:3em;height:3em;color:var(--color-7)}.i-helpericon{position:relative;margin:.25em;padding:.125em;min-height:1.675em;min-width:1.675em;display:flex;align-items:center;justify-content:center;align-self:center;color:var(--color-7);transition:var(--transition);border-radius:var(--radius);font-size:.8em}.i-helpericon:hover{color:var(--color-3);background:var(--background-opacity-1)}
|
|
2
2
|
|
|
3
3
|
/*# sourceMappingURL=index.css.map */
|