@sonhero/explanation-package 1.9.1

package/dist/index.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/modal/PopupViewPdf.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface IProps {
+    open: boolean;
+    setOpen: any;
+    url: string;
+}
+declare const _default: React.MemoExoticComponent<({ open, setOpen, url }: IProps) => React.JSX.Element>;
+export default _default;

package/dist/modal/SappModal.d.ts

@@ -0,0 +1,64 @@
+import React, { Dispatch, ReactNode, SetStateAction } from 'react';
+interface IProps {
+    open?: boolean;
+    setOpen?: Dispatch<SetStateAction<boolean>>;
+    children: ReactNode;
+    cancelButtonCaption?: string;
+    okButtonCaption?: string;
+    okButtonClass?: string | undefined;
+    cancelButtonClass?: string | undefined;
+    buttonSize?: 'small' | 'medium' | 'lager' | 'extra';
+    handleCancel?: () => Promise<void> | void;
+    handleSubmit?: () => Promise<void> | void;
+    disabled?: boolean;
+    title?: string;
+    customTitle?: ReactNode;
+    showHeader?: boolean;
+    customHeader?: ReactNode;
+    showFooter?: boolean;
+    customFooter?: ReactNode;
+    confirmOnclose?: boolean | string[];
+    size?: string;
+    modelClassname?: string;
+    refClass?: string;
+    childClass?: string;
+    parentChildClass?: string;
+    footerButtonClassName?: string;
+    overlayClass?: string;
+    color?: any;
+    colorCancel?: any;
+    position?: 'center' | 'start' | 'end';
+    fullWidthBtn?: boolean;
+    isFullScreen?: boolean;
+    isContentFull?: boolean;
+    isInner?: boolean;
+    isBordered?: boolean;
+    closeAfterSubmit?: boolean;
+    showOkButton?: boolean;
+    showCancelButton?: boolean;
+    zIndex?: string;
+    scrollbale?: boolean;
+    footerClassName?: string;
+    externalLoading?: boolean;
+    revertFunction?: boolean;
+}
+/**
+ * Hàm này tạo một modal component bằng React
+ * @param open: boolean - biến xác định modal có được mở hay không
+ * @param setOpen: function - hàm xác định modal có được mở hay không
+ * @param children: ReactNode - biến chứa các phần tử con của modal
+ * @param cancelButtonCaption: string - biến xác định nội dung của nút hủy
+ * @param okButtonCaption: string - biến xác định nội dung của nút xác nhận
+ * @param handleCancel: function - hàm xử lý khi người dùng nhấn nút hủy
+ * @param handleSubmit: function - hàm xử lý khi người dùng nhấn nút xác nhận
+ * @param disabled: boolean - biến xác định modal có bị vô hiệu hóa hay không
+ * @param title: string - biến xác định tiêu đề của modal
+ * @param showTitle: boolean - biến xác định modal có hiển thị tiêu đề hay không
+ * @param customTitle: ReactNode - biến chứa phần tử tùy chỉnh cho tiêu đề
+ * @param showFooter: boolean - biến xác định modal có hiển thị footer hay không
+ * @param customFooter: ReactNode - biến chứa phần tử tùy chỉnh cho footer
+ * @param confirmOnclose: boolean - biến xác định modal có yêu cầu xác nhận khi đóng hay không
+ * @param width: number - biến xác định modal width
+ */
+declare const SappModal: React.FC<IProps>;
+export default SappModal;

package/dist/modal/SappModalImage.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+declare type Props = {
+    src?: string;
+    setSrc: React.Dispatch<React.SetStateAction<string | undefined>>;
+};
+declare function SappModalImage({ src, setSrc }: Props): React.JSX.Element;
+export default SappModalImage;

package/dist/modal/SappModalVideo.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+declare type Props = {
+    src?: string;
+    setSrc: React.Dispatch<React.SetStateAction<string | undefined>>;
+};
+declare function SappModalVideo({ src, setSrc }: Props): React.JSX.Element;
+export default SappModalVideo;

package/dist/pdf/pdf-viewer.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+export default function PDFViewer({ file }: {
+    file: string;
+}): React.JSX.Element;

package/dist/pdf/popupViewPdf.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface IProps {
+    open: boolean;
+    setOpen: any;
+    url: string;
+}
+declare const _default: React.MemoExoticComponent<({ open, setOpen, url }: IProps) => React.JSX.Element>;
+export default _default;

package/dist/questionType/ConstructedQuestion.d.ts

@@ -0,0 +1,19 @@
+import React, { RefObject } from 'react';
+import { IFileAnswer, ICommment } from '../conts';
+export declare type IPreviewProp = {
+    data: any;
+    index: number;
+    control: any;
+    name: string;
+    question_data: any;
+    defaultValue?: any;
+    answer_file?: IFileAnswer;
+    setOpenPdf?: any;
+    listGrades?: ICommment;
+    commentRef?: RefObject<HTMLElement>;
+    editorRef?: RefObject<HTMLElement>;
+    bodyRef?: RefObject<HTMLDivElement>;
+    grading_file?: IFileAnswer;
+};
+declare const _default: React.MemoExoticComponent<({ data, index, name, control, question_data, defaultValue, answer_file, setOpenPdf, listGrades, commentRef, editorRef, bodyRef, grading_file }: IPreviewProp) => React.JSX.Element>;
+export default _default;

package/dist/questionType/DragNDrop.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+interface IProps {
+    data?: any;
+    action?: any;
+    handleSaveHighLight?: any;
+    highlighted?: any;
+    removeHighlight?: any;
+    allowHighLight?: boolean;
+    defaultAnswer?: any;
+    extenalRef?: any;
+    corrects?: any;
+    solution?: string;
+    resetDefaultAnswer?: boolean;
+    allowUnHighLight?: boolean;
+}
+declare const DragNDropPreivew: React.ForwardRefExoticComponent<IProps & React.RefAttributes<any>>;
+export default DragNDropPreivew;

package/dist/questionType/FillText.d.ts

@@ -0,0 +1,21 @@
+import React from 'react';
+interface IProps {
+    data: any;
+    action?: any;
+    handleSaveHighLight?: any;
+    highlighted?: any;
+    removeHighlight?: any;
+    allowHighLight?: boolean;
+    defaultAnswer?: any;
+    corrects?: {
+        id: string;
+        answer: string;
+        is_correct: boolean;
+        answer_position: number;
+    }[];
+    extenalRef?: any;
+    solution?: string;
+    allowUnHighLight?: boolean;
+}
+declare const AddWordPreview: React.ForwardRefExoticComponent<IProps & React.RefAttributes<any>>;
+export default AddWordPreview;

package/dist/questionType/MatchingQuestion.d.ts

@@ -0,0 +1,18 @@
+import React from 'react';
+interface IProps {
+    data: any;
+    action?: any;
+    handleSaveHighLight?: any;
+    highlighted?: any;
+    removeHighlight?: any;
+    allowHighLight?: boolean;
+    defaultAnswer?: any;
+    done?: boolean;
+    extenalRef?: any;
+    index?: number;
+    corrects?: any;
+    solution?: string;
+    allowUnHighLight?: boolean;
+}
+declare const _default: React.MemoExoticComponent<React.ForwardRefExoticComponent<IProps & React.RefAttributes<any>>>;
+export default _default;

package/dist/questionType/MultipleChoiceQuestion.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { IPreviewProp } from './OneChoiceQuestion';
+declare const MultiChoiceQuestion: ({ data, control, corrects, name, defaultValues, setValue, handleSaveHighLight, highlighted, removeHighlight, allowHighLight, solution, allowUnHighLight }: IPreviewProp) => React.JSX.Element;
+export default MultiChoiceQuestion;

package/dist/questionType/OneChoiceQuestion.d.ts

@@ -0,0 +1,19 @@
+import React from 'react';
+export declare type IPreviewProp = {
+    data: any;
+    control: any;
+    name?: string;
+    corrects?: {
+        [key: string]: boolean;
+    };
+    defaultValues?: any;
+    setValue?: any;
+    handleSaveHighLight?: any;
+    highlighted?: any;
+    removeHighlight?: any;
+    allowHighLight?: boolean;
+    solution?: any;
+    allowUnHighLight?: boolean;
+};
+declare const OneChoiceQuestion: ({ data, control, corrects, name, defaultValues, setValue, handleSaveHighLight, highlighted, removeHighlight, allowHighLight, solution, allowUnHighLight }: IPreviewProp) => React.JSX.Element;
+export default OneChoiceQuestion;

package/dist/questionType/SelectWordQuestion.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+interface IProps {
+    data: any;
+    handleSaveHighLight?: any;
+    highlighted?: any;
+    allowHighLight?: boolean;
+    defaultAnswer?: Array<{
+        answer_id: string;
+        answer_position: number;
+    }>;
+    corrects?: {
+        id: string;
+        answer: string;
+        is_correct: boolean;
+        answer_position: number;
+    }[];
+    extenalRef?: any;
+    solution?: string;
+    allowUnHighLight?: boolean;
+    isHideExhibit?: boolean;
+    exhibitText?: string;
+    onChange?: (values: Array<{
+        answer_id: string;
+        answer_position: number;
+    }>) => void;
+}
+declare const SelectWord: React.ForwardRefExoticComponent<IProps & React.RefAttributes<any>>;
+export default SelectWord;

package/dist/radiobutton/HookFormRadioGroup.d.ts

@@ -0,0 +1,26 @@
+import { Control } from 'react-hook-form';
+import React from 'react';
+interface IHookFormRadioGroupProps {
+    name: string;
+    control: Control<any>;
+    defaultValue?: unknown;
+    options: Array<{
+        label?: string;
+        value: string | boolean;
+        description?: string;
+        disabled?: boolean;
+    }>;
+    direction?: 'horizontal' | 'vertical';
+    separator?: boolean;
+    justify?: 'between' | 'start' | 'center' | 'end';
+    gap?: string;
+    onChange?: React.ChangeEventHandler<HTMLInputElement>;
+    labelClass?: string;
+    labelClassChecked?: string;
+    disabled?: boolean;
+    corrects?: {
+        [key: string]: boolean;
+    };
+}
+declare const HookFormRadioGroup: ({ name, control, defaultValue, options, direction, separator, gap, onChange, justify, labelClass, labelClassChecked, disabled, corrects }: IHookFormRadioGroupProps) => React.JSX.Element;
+export default HookFormRadioGroup;

package/dist/radiobutton/SAPPRadio.d.ts

@@ -0,0 +1,15 @@
+import React from 'react';
+interface IProps {
+    name?: string;
+    value?: string | boolean;
+    ktCheck?: boolean;
+    checkTarget?: string;
+    checked: boolean;
+    onChange: React.ChangeEventHandler<HTMLInputElement>;
+    className?: string;
+    disabled?: boolean;
+    state?: 'default' | 'error' | 'success';
+    size?: 'small' | 'medium' | 'lager';
+}
+declare const SAPPRadio: ({ name, value, ktCheck, checkTarget, checked, onChange, className, disabled, state, size, }: IProps) => React.JSX.Element;
+export default SAPPRadio;

package/dist/style.d.ts

@@ -0,0 +1 @@
+export declare const styles = "\n\n.fortune-container {\n  display: flex;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  padding: 0;\n  flex-direction: column;\n  font-family: \"Helvetica Neue\", Helvetica, Arial, \"PingFang SC\", \"Hiragino Sans GB\", \"Heiti SC\", \"Microsoft YaHei\", \"WenQuanYi Micro Hei\", sans-serif;\n  background-color: white;\n  position: relative;\n}\n\n.fortune-workarea {\n  width: 100%;\n}\n\n.fortune-popover-backdrop {\n  position: absolute;\n  top: 0;\n  left: 0;\n  z-index: 1003;\n  /* should below .fortune-context-menu */\n  height: 100%;\n  width: 100%;\n}\n\n.fortune-modal-container {\n  background: rgba(255, 255, 255, 0.5);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\nhtml::-webkit-scrollbar-button {\n  display: none;\n}\n\n.fortune-stat-area {\n  display: flex;\n  justify-content: flex-end;\n  align-items: center;\n}\n\n.fortune-sheet-container {\n  display: flex;\n  flex: 1;\n  flex-direction: column;\n}\n\n.fortune-col-body {\n  display: flex;\n  flex: 1;\n  flex-direction: row;\n}\n\n.fortune-sheet-area {\n  flex: 1;\n  position: relative;\n}\n\n.fortune-sheet-canvas-placeholder,\n.fortune-sheet-canvas {\n  width: 100%;\n  height: 100%;\n  display: block;\n}\n\n.fortune-sheet-canvas {\n  position: absolute;\n}\n.fortune-sheet-overlay {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  outline-style: none;\n}\n\n.fortune-cell-area {\n  border-collapse: collapse;\n  position: relative;\n  overflow: hidden;\n  outline-style: none;\n  cursor: default;\n}\n\n.fortune-row-body {\n  display: flex;\n  flex-direction: row;\n}\n\n.fortune-row-header {\n  position: relative;\n  flex-shrink: 0;\n  outline-style: none;\n  color: #5e5e5e;\n  overflow: hidden;\n  padding: 0;\n  margin-top: -2px;\n  padding-top: 2px;\n  cursor: default;\n  width: 45px;\n}\n\n.fortune-row-header-hover {\n  position: absolute;\n  z-index: 11;\n  border: 0 none;\n  right: 0;\n  width: 100%;\n  margin-top: 2px;\n  display: none;\n  background-color: rgba(194, 194, 194, 0.4);\n}\n\n.fortune-row-header-selected {\n  position: absolute;\n  z-index: 10;\n  border-right: 1px solid #0188fb;\n  right: 0;\n  width: 100%;\n  margin-top: 2px;\n  display: none;\n  background-color: rgba(76, 76, 76, 0.1);\n}\n\n.fortune-col-header-wrap {\n  display: flex;\n  flex-direction: row;\n}\n\n.fortune-col-header {\n  color: #5e5e5e;\n  overflow: hidden;\n  padding: 0;\n  cursor: default;\n  flex: 1;\n  height: 19px;\n  outline-style: none;\n  position: relative;\n}\n\n.fortune-col-header-hover {\n  color: #5e5e5e;\n  cursor: default;\n  position: absolute;\n  z-index: 11;\n  border: 0 none;\n  bottom: 0;\n  height: 100%;\n  margin-left: 0px;\n  display: none;\n  background-color: rgba(194, 194, 194, 0.4);\n}\n\n.fortune-col-header-hover .header-arrow {\n  position: absolute;\n  right: 6px;\n  top: 50%;\n  transform: translate(0%, -44%);\n}\n\n.fortune-col-header-selected {\n  color: #5e5e5e;\n  cursor: default;\n  position: absolute;\n  z-index: 10;\n  border-bottom: 1px solid #0188fb;\n  bottom: 0;\n  height: 100%;\n  margin-left: 0px;\n  display: none;\n  background-color: rgba(76, 76, 76, 0.1);\n}\n\n.fortune-left-top {\n  width: 44.5px;\n  height: 18.5px;\n  border: solid 0 #dfdfdf;\n  position: relative;\n  padding-top: 0;\n  border-width: 0 1px 1px 0;\n  padding-left: 0;\n  cursor: pointer;\n  background-color: white;\n}\n\n.fortune-add-row-button {\n  padding: 1px 20px;\n  margin-right: 5px;\n  display: inline-flex;\n  align-items: center;\n  margin: 0 8px;\n  border: none;\n  border-radius: 4px;\n  font-size: 14px;\n  line-height: 20px;\n  outline: none;\n  cursor: pointer;\n  color: rgb(38, 42, 51);\n  background-color: rgb(255, 255, 255);\n  border: 1px solid rgb(200, 200, 200);\n}\n\n.luckysheet-cell-selected-focus {\n  position: absolute;\n  pointer-events: none;\n  z-index: 14;\n  /*border:1px solid #fff;*/\n  margin: 0px 0 0 0px;\n  background: rgba(0, 80, 208, 0.15);\n  display: none;\n}\n\n.fortune-selection-copy {\n  position: absolute;\n  pointer-events: none;\n  z-index: 18;\n  border: none;\n  margin: 0px 0 0 0px;\n}\n\n.fortune-selection-copy .fortune-copy {\n  position: absolute;\n  z-index: 18;\n  background-color: transparent;\n}\n\n.fortune-selection-copy-hc {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  border: 2px dashed #12a5ff;\n  z-index: 8;\n}\n\n.fortune-selection-highlight {\n  position: absolute;\n  /*pointer-events: none;*/\n  z-index: 14;\n  border: none;\n  margin: 0px 0 0 0px;\n  /* display: none; */\n}\n\n.fortune-cell-selected-extend {\n  position: absolute;\n  pointer-events: none;\n  z-index: 16;\n  border: 1px dashed #0188fb;\n  margin: -1px 0 0 -1px;\n  display: none;\n}\n\n.fortune-cell-selected-move {\n  cursor: move;\n  position: absolute;\n  /* pointer-events: none; */\n  z-index: 16;\n  border: 2px solid #0188fb;\n  margin: -1px 0 0 -1px;\n  display: none;\n}\n\n.luckysheet-cell-selected {\n  position: absolute;\n  pointer-events: none;\n  z-index: 15;\n  border: 1px solid #0188fb;\n  margin: -1px 0 0 -1px;\n  background: rgba(1, 136, 251, 0.15);\n  display: none;\n  box-sizing: content-box;\n}\n\n.luckysheet-cs-inner-border {\n  pointer-events: none;\n  border: 1px solid #fff;\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n}\n\n.luckysheet-cs-fillhandle {\n  position: absolute;\n  width: 6px;\n  height: 6px;\n  bottom: -5px;\n  cursor: crosshair;\n  background-color: #0188fb;\n  border: solid 1px #fff;\n  z-index: 16;\n  pointer-events: auto;\n  right: -5px;\n}\n\n.luckysheet-cs-draghandle {\n  position: absolute;\n  cursor: move;\n  background-color: #fff;\n  opacity: 0.01;\n  z-index: 15;\n  pointer-events: auto;\n  border: 2px solid #fff;\n}\n\n.luckysheet-cs-draghandle-top {\n  top: -4px;\n  left: -2px;\n  right: -2px;\n  height: 2px;\n}\n\n.luckysheet-cs-draghandle-bottom {\n  right: 0;\n  left: -2px;\n  bottom: -4px;\n  height: 2px;\n}\n\n.luckysheet-cs-draghandle-left {\n  top: 0;\n  left: -4px;\n  bottom: 0;\n  width: 2px;\n}\n\n.luckysheet-cs-draghandle-right {\n  top: 0;\n  right: -4px;\n  bottom: 0;\n  width: 2px;\n}\n\n.luckysheet-cs-touchhandle {\n  display: none;\n  position: absolute;\n  width: 16px;\n  height: 16px;\n  padding: 5px;\n  z-index: 100;\n  pointer-events: auto;\n  touch-action: auto;\n}\n\n.luckysheet-cs-touchhandle:before {\n  content: \"\";\n  display: block;\n  width: 16px;\n  height: 16px;\n  border: 0.5px solid rgba(0, 0, 0, 0.15);\n  background-color: #ffffff;\n  box-sizing: border-box;\n  border-radius: 50%;\n}\n\n.luckysheet-cs-touchhandle-lt {\n  left: -13px;\n  top: -13px;\n}\n\n.luckysheet-cs-touchhandle-lb {\n  left: -13px;\n  bottom: -13px;\n}\n\n.luckysheet-cs-touchhandle-rt {\n  right: -13px;\n  top: -13px;\n}\n\n.luckysheet-cs-touchhandle-rb {\n  right: -13px;\n  bottom: -13px;\n}\n\n.luckysheet-cs-touchhandle .luckysheet-cs-touchhandle-btn {\n  position: absolute;\n  width: 10px;\n  height: 10px;\n  left: 8px;\n  top: 8px;\n  background-color: #018ffb;\n  background-position: center;\n  box-sizing: border-box;\n  border-radius: 50%;\n  z-index: 11;\n}\n\n.luckysheet-input-box {\n  position: absolute;\n  font: normal normal 400 13px arial, sans, sans-serif;\n  z-index: 15;\n  display: flex;\n  flex-direction: column;\n}\n\n.luckysheet-input-box-inner {\n  font: normal normal 400 13px arial, sans, sans-serif;\n  text-align: left;\n  max-height: 9900px;\n  max-width: 9900px;\n  border: 1px #5292f7 solid;\n  padding: 0 2px;\n  margin: 0;\n  resize: none;\n  overflow: hidden;\n  white-space: pre-wrap;\n  outline: none;\n  -webkit-box-shadow: 0 2px 5px rgb(0 0 0 / 40%);\n  -moz-box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);\n  box-shadow: 0 2px 5px rgb(0 0 0 / 40%);\n  word-wrap: break-word;\n  background-color: rgb(255, 255, 255);\n  font-size: 13px;\n  right: auto;\n  overflow-y: auto;\n  box-sizing: border-box;\n}\n\n.luckysheet-cell-input {\n  width: 100%;\n  margin: 0;\n  outline: none;\n  cursor: text;\n  white-space: pre-wrap;\n}\n\n.luckysheet-formula-text-color {\n  color: black;\n}\n\n.luckysheet-formula-text-string {\n  color: forestgreen;\n}\n\n.luckysheet-cell-flow {\n  margin: 0;\n  padding: 0;\n  border: none 0;\n  position: relative;\n  touch-action: manipulation;\n}\n\n.luckysheet-cell-flow-clip {\n  border-collapse: collapse;\n  cursor: default;\n  width: 5000000px;\n  touch-action: manipulation;\n  overflow: hidden;\n}\n\n.luckysheet-cell-flow-col {\n  margin: 0;\n  padding: 0;\n  border: none 0;\n  position: relative;\n  touch-action: manipulation;\n  overflow: hidden;\n  float: left;\n  direction: ltr;\n}\n\n.luckysheet-cell-sheettable {\n  position: relative;\n  /*background-color: #fff;*/\n  text-align: left;\n  font-size: 11pt;\n  color: #000000;\n  text-decoration: none;\n}\n\n.luckysheet-bottom-controll-row {\n  position: absolute;\n  height: 30px;\n  /*width: 400px;*/\n  /* background: #000; */\n  bottom: 38px;\n  left: 0px;\n  z-index: 1000;\n}\n\n#luckysheet-bottom-add-row {\n  padding: 5px 20px;\n  margin-right: 5px;\n  margin-top: -2px;\n}\n\n#luckysheet-bottom-add-row-input {\n  width: 40px;\n  min-width: 40px;\n}\n\n#luckysheet-bottom-return-top {\n  padding: 5px 6px;\n  margin-left: 10px;\n  margin-top: -2px;\n}\n\n.luckysheet-cell-flow-column {\n  position: absolute;\n  height: inherit;\n  width: inherit;\n  top: 0;\n  left: 0;\n  z-index: 1;\n  touch-action: manipulation;\n}\n\n.luckysheet-cell-flow-column-line {\n  position: absolute;\n  border-right: 1px solid #d4d4d4;\n  height: inherit;\n}\n\n.luckysheet-cell-flow-row {\n  text-align: left;\n  position: absolute;\n  height: inherit;\n  width: inherit;\n  top: 0;\n  left: 0;\n  z-index: 1;\n  touch-action: manipulation;\n}\n\n.luckysheet-cell-flow-row-line {\n  position: absolute;\n  border-bottom: 1px solid #d4d4d4;\n  width: inherit;\n}\n\n.fortune-cols-change-size,\n.fortune-rows-change-size,\n.fortune-change-size-line,\n.fortune-cols-freeze-handle,\n.fortune-rows-freeze-handle,\n.fortune-freeze-drag-line {\n  /*display: none;*/\n  -webkit-user-drag: none;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  position: absolute;\n  z-index: 12;\n}\n\n.fortune-cols-change-size {\n  width: 5px;\n  height: 100%;\n  background: #0188fb;\n  cursor: ew-resize;\n  opacity: 0;\n}\n\n.fortune-rows-change-size {\n  width: 100%;\n  height: 5px;\n  background: #0188fb;\n  cursor: ns-resize;\n  opacity: 0;\n}\n\n.fortune-change-size-line {\n  border-color: #0188fb;\n  border-style: solid;\n  z-index: 15;\n  cursor: ew-resize;\n}\n\n.fortune-cols-freeze-handle {\n  position: absolute;\n  left: 0;\n  width: 3px;\n  height: 100%;\n  background-color: #ddd;\n  cursor: grab;\n  z-index: 20;\n}\n\n.fortune-rows-freeze-handle {\n  position: absolute;\n  top: 0;\n  height: 3px;\n  width: 100%;\n  background-color: #ddd;\n  cursor: grab;\n  z-index: 20;\n}\n\n.fortune-freeze-drag-line {\n  border-color: #ccc;\n  border-style: solid;\n  z-index: 15;\n  cursor: ew-resize;\n}\n\n/*\u6279\u6CE8\u805A\u7126\u6846 \u79FB\u52A8 \u6539\u53D8\u5927\u5C0F*/\n.luckysheet-postil-dialog-move {\n  position: absolute;\n  margin: 0px;\n  padding: 0px;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  right: 0;\n  pointer-events: none;\n}\n\n.luckysheet-postil-dialog-move .luckysheet-postil-dialog-move-item {\n  /*background: #000;*/\n  position: absolute;\n  pointer-events: all;\n  cursor: move;\n}\n\n.luckysheet-postil-dialog-move .luckysheet-postil-dialog-move-item-t {\n  width: 100%;\n  height: 3px;\n  /* border-bottom: 1px solid #000; */\n  left: 0;\n  top: -4px;\n}\n\n.luckysheet-postil-dialog-move .luckysheet-postil-dialog-move-item-r {\n  width: 3px;\n  height: 100%;\n  /* border-left: 1px solid #000; */\n  right: -4px;\n  top: 0;\n}\n\n.luckysheet-postil-dialog-move .luckysheet-postil-dialog-move-item-b {\n  width: 100%;\n  height: 3px;\n  /* border-top: 1px solid #000; */\n  left: 0;\n  bottom: -4px;\n}\n\n.luckysheet-postil-dialog-move .luckysheet-postil-dialog-move-item-l {\n  width: 3px;\n  height: 100%;\n  /* border-right: 1px solid #000; */\n  left: -4px;\n  top: 0;\n}\n\n.luckysheet-postil-show-active\n  .luckysheet-postil-dialog-move\n  .luckysheet-postil-dialog-move-item {\n  border-color: #0188fb;\n}\n\n.luckysheet-postil-dialog-resize {\n  position: absolute;\n  margin: 0px;\n  padding: 0px;\n  top: -2px;\n  left: -2px;\n  bottom: -2px;\n  right: -2px;\n  pointer-events: none;\n}\n\n.luckysheet-postil-dialog-resize .luckysheet-postil-dialog-resize-item {\n  position: absolute;\n  height: 6px;\n  width: 6px;\n  border: 1px solid #0188fb;\n  pointer-events: all;\n}\n\n.luckysheet-postil-dialog-resize .luckysheet-postil-dialog-resize-item-lt {\n  left: -6px;\n  top: -6px;\n  cursor: nw-resize;\n}\n\n.luckysheet-postil-dialog-resize .luckysheet-postil-dialog-resize-item-mt {\n  left: 50%;\n  top: -6px;\n  margin-left: -4px;\n  cursor: n-resize;\n}\n\n.luckysheet-postil-dialog-resize .luckysheet-postil-dialog-resize-item-lm {\n  top: 50%;\n  left: -6px;\n  margin-top: -4px;\n  cursor: w-resize;\n}\n\n.luckysheet-postil-dialog-resize .luckysheet-postil-dialog-resize-item-rm {\n  top: 50%;\n  right: -6px;\n  margin-top: -4px;\n  cursor: e-resize;\n}\n\n.luckysheet-postil-dialog-resize .luckysheet-postil-dialog-resize-item-rt {\n  right: -6px;\n  top: -6px;\n  cursor: ne-resize;\n}\n\n.luckysheet-postil-dialog-resize .luckysheet-postil-dialog-resize-item-lb {\n  left: -6px;\n  bottom: -6px;\n  cursor: sw-resize;\n}\n\n.luckysheet-postil-dialog-resize .luckysheet-postil-dialog-resize-item-mb {\n  left: 50%;\n  bottom: -6px;\n  margin-left: -4px;\n  cursor: s-resize;\n}\n\n.luckysheet-postil-dialog-resize .luckysheet-postil-dialog-resize-item-rb {\n  right: -6px;\n  bottom: -6px;\n  cursor: se-resize;\n}\n\n.fortune-selection-copy-top {\n  left: 0;\n  right: 0;\n  height: 2px;\n  top: 0;\n  background-position: bottom;\n  /* background-image: url(\"EwaAntH.gif\"); */\n}\n\n.fortune-selection-copy-right {\n  top: 0;\n  bottom: 0;\n  width: 2px;\n  right: 0;\n  /* background-image: url(\"EwaAntV.gif\"); */\n}\n\n.fortune-selection-copy-bottom {\n  left: 0;\n  right: 0;\n  height: 2px;\n  bottom: 0;\n  /* background-image: url(\"EwaAntH.gif\"); */\n}\n\n.fortune-selection-copy-left {\n  top: 0;\n  bottom: 0;\n  width: 2px;\n  left: 0;\n  background-position: right;\n  /* background-image: url(\"EwaAntV.gif\"); */\n}\n\n.fortune-selection-copy-hc {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  border: 2px dashed #12a5ff;\n  z-index: 8;\n}\n\n.luckysheet-modal-dialog-resize {\n  position: absolute;\n  border: 2px solid #0188fb;\n  margin: 0px;\n  padding: 0px;\n  top: -2px;\n  left: -2px;\n  bottom: -2px;\n  right: -2px;\n  pointer-events: none;\n}\n\n.luckysheet-modal-dialog-resize-item {\n  position: absolute;\n  height: 6px;\n  width: 6px;\n  background: #ffffff;\n  border: 2px solid #0188fb;\n  pointer-events: all;\n  border-radius: 6px;\n}\n\n.luckysheet-modal-dialog-resize-item-lt {\n  left: -6px;\n  top: -6px;\n  cursor: se-resize;\n}\n\n.luckysheet-modal-dialog-resize-item-mt {\n  left: 50%;\n  top: -6px;\n  margin-left: -4px;\n  cursor: s-resize;\n}\n\n.luckysheet-modal-dialog-resize-item-rt {\n  right: -6px;\n  top: -6px;\n  cursor: ne-resize;\n}\n\n.luckysheet-modal-dialog-resize-item-lm {\n  top: 50%;\n  left: -6px;\n  margin-top: -4px;\n  cursor: w-resize;\n}\n\n.luckysheet-modal-dialog-resize-item-rm {\n  top: 50%;\n  right: -6px;\n  margin-top: -4px;\n  cursor: w-resize;\n}\n\n.luckysheet-modal-dialog-resize-item-lb {\n  left: -6px;\n  bottom: -6px;\n  cursor: ne-resize;\n}\n\n.luckysheet-modal-dialog-resize-item-mb {\n  left: 50%;\n  bottom: -6px;\n  margin-left: -4px;\n  cursor: s-resize;\n}\n\n.luckysheet-modal-dialog-resize-item-rb {\n  right: -6px;\n  bottom: -6px;\n  cursor: se-resize;\n}\n\n.fortune-formula-functionrange-highlight .fortune-copy {\n  background-image: none;\n  background: #0188fb;\n  position: absolute;\n  z-index: 18;\n  cursor: move;\n  opacity: 0.9;\n  box-sizing: content-box;\n  /*border: 1px solid #fff;*/\n}\n\n.fortune-formula-functionrange-highlight .fortune-selection-copy-top {\n  top: -2px;\n  border-top: 2px solid #fff;\n  border-bottom: 2px solid #fff;\n}\n\n.fortune-formula-functionrange-highlight .fortune-selection-copy-right {\n  right: -2px;\n  border-left: 2px solid #fff;\n  border-right: 2px solid #fff;\n}\n\n.fortune-formula-functionrange-highlight .fortune-selection-copy-bottom {\n  bottom: -2px;\n  border-top: 2px solid #fff;\n  border-bottom: 2px solid #fff;\n}\n\n.fortune-formula-functionrange-highlight .fortune-selection-copy-left {\n  left: -2px;\n  border-left: 2px solid #fff;\n  border-right: 2px solid #fff;\n}\n\n.fortune-formula-functionrange-highlight .fortune-selection-copy-hc {\n  border: 2px solid #5e5e5e;\n  opacity: 0.03;\n  z-index: initial;\n}\n\n.fortune-selection-highlight-lt {\n  left: -3px;\n  top: -3px;\n  cursor: se-resize;\n}\n\n.fortune-selection-highlight-rt {\n  right: -3px;\n  top: -3px;\n  cursor: ne-resize;\n}\n\n.fortune-selection-highlight-lb {\n  left: -3px;\n  bottom: -3px;\n  cursor: ne-resize;\n}\n\n.fortune-selection-highlight-rb {\n  right: -3px;\n  bottom: -3px;\n  cursor: se-resize;\n}\n\n.fortune-formula-functionrange-highlight .luckysheet-highlight {\n  position: absolute;\n  z-index: 19;\n  border: 1px solid #fff;\n  background: #0188fb;\n  width: 6px;\n  height: 6px;\n}\n\n.fortune-presence-username {\n  position: absolute;\n  padding-left: 6px;\n  padding-right: 6px;\n  padding-top: 2px;\n  padding-bottom: 2px;\n  left: -2px;\n  font-size: 12px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  box-sizing: content-box;\n  color: #fff;\n}\n\n.fortune-presence-selection {\n  position: absolute;\n  border-style: solid;\n  border-width: 1;\n  opacity: 0.7;\n}\n\n.luckysheet-filter-options {\n  color: #897bff;\n  cursor: pointer;\n  position: absolute;\n  z-index: 200;\n  border: 1px solid #897bff;\n  border-radius: 3px;\n  top: 3px;\n  margin-left: 0px;\n  display: \"block\";\n  padding: 0px 4px;\n  font-size: 12px;\n  height: 15px;\n  background: #fff;\n}\n\n.luckysheet-filter-options:hover {\n  color: #fff;\n  border: 1px solid #fff;\n  background: #897bff;\n}\n\n.luckysheet-filter-options-active {\n  color: #fff;\n  border: 1px solid #897bff;\n  padding: 0px 1px;\n  background: #897bff;\n}\n\n.caret {\n  margin-top: 6px;\n  width: 0;\n  height: 0;\n  display: inline-block;\n  border: 4px solid transparent;\n}\n\n.caret.down {\n  border-top-color: #897bff;\n}\n\n.luckysheet-filter-options:hover .caret.down {\n  border-top-color: #ffffff;\n}\n\n.luckysheet-filter-selected {\n  background: #ffffff00;\n}\n\n#luckysheet-dataVerification-showHintBox {\n  display: none;\n  padding: 10px;\n  background-color: #ffffff;\n  border: 1px solid #ccc;\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n  position: absolute;\n  z-index: 1000;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  cursor: default;\n  white-space: nowrap;\n  font-size: 12px;\n}\n\n#luckysheet-dataVerification-dropdown-btn {\n  display: none;\n  width: 20px;\n  height: 20px;\n  background-color: #ffffff;\n  position: absolute;\n  z-index: 10;\n  overflow: hidden;\n}\n\n.luckysheet-formula-search-c {\n  position: absolute;\n  border: 1px solid rgba(0, 0, 0, 0.2);\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n  color: #535353;\n  font-size: 12px;\n  background: #fff;\n  z-index: 1003;\n  width: 300px;\n}\n\n.luckysheet-formula-search-c .luckysheet-formula-search-item {\n  background: #fff;\n  padding: 5px 10px;\n  cursor: pointer;\n}\n\n.luckysheet-formula-search-c\n  .luckysheet-formula-search-item\n  .luckysheet-formula-search-detail {\n  display: none;\n  color: #444;\n}\n\n.luckysheet-formula-search-c\n  .luckysheet-formula-search-item\n  .luckysheet-formula-search-func {\n  color: #222;\n  font-size: 14px;\n}\n\n.luckysheet-formula-search-c .luckysheet-formula-search-item-active {\n  display: block;\n  border-top: 1px solid #ebebeb;\n  border-bottom: 1px solid #ebebeb;\n  background: #f5f5f5;\n}\n\n.luckysheet-formula-search-c\n  .luckysheet-formula-search-item-active\n  .luckysheet-formula-search-detail {\n  display: block;\n}\n\n.luckysheet-formula-help-c {\n  position: absolute;\n  border: 1px solid rgba(0, 0, 0, 0.2);\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n  color: #535353;\n  font-size: 12px;\n  background: #fff;\n  z-index: 1003;\n  width: 300px;\n}\n\n.luckysheet-formula-help-c .luckysheet-formula-help-content {\n  max-height: 300px;\n  overflow-y: scroll;\n}\n\n.luckysheet-formula-help-content-example {\n  margin-top: 5px;\n}\n\n.luckysheet-formula-help-title {\n  display: block;\n  border-top: 1px solid #ebebeb;\n  border-bottom: 1px solid #ebebeb;\n  background: #f5f5f5;\n  padding: 2px 10px;\n  font-size: 14px;\n}\n\n.luckysheet-formula-help-title-formula {\n  width: 250px;\n  word-break: break-word;\n}\n\n.luckysheet-arguments-help-section {\n  margin-top: 5px;\n  margin-bottom: 5px;\n  color: #222;\n}\n\n.luckysheet-arguments-help-section-title {\n  padding: 1px 10px;\n  color: #666;\n}\n\n.luckysheet-arguments-help-parameter-content {\n  padding: 1px 10px;\n  display: inline-block;\n  word-wrap: break-word;\n}\n\n.luckysheet-arguments-help-formula {\n  padding: 1px 10px;\n  font-size: 14px;\n}\n\n.luckysheet-arguments-help-parameter-active {\n  background-color: #fff9b2;\n}\n\n.luckysheet-formula-help-collapse {\n  position: absolute;\n  top: 0px;\n  right: 25px;\n  font-size: 16px;\n  cursor: pointer;\n  color: #bbb;\n}\n\n.luckysheet-formula-help-close {\n  position: absolute;\n  top: 0px;\n  right: 5px;\n  font-size: 16px;\n  cursor: pointer;\n  color: #bbb;\n}\n\n.luckysheet-formula-help-close:hover,\n.luckysheet-formula-help-collapse:hover {\n  color: #555;\n}\n\n.luckysheet-scrollbar-ltr {\n  position: absolute;\n  overflow: hidden;\n  z-index: 1003;\n}\n\n.luckysheet-scrollbar-ltr div {\n  height: 1px;\n  width: 1px;\n}\n\n.luckysheet-scrollbar-x {\n  bottom: 0px;\n  overflow-x: scroll;\n}\n\n.luckysheet-scrollbar-y {\n  right: 0px;\n  top: 0px;\n  overflow-y: scroll;\n}\n\n.luckysheet-scrollbar-ltr::-webkit-scrollbar {\n  background-color: transparent;\n  width: 8px;\n  height: 8px;\n}\n\n.luckysheet-scrollbar-ltr::-webkit-scrollbar-track {\n  background-color: transparent;\n}\n\n.luckysheet-scrollbar-ltr::-webkit-scrollbar-thumb {\n  background-color: #babac0;\n  border-radius: 16px;\n}\n\n.luckysheet-scrollbar-ltr::-webkit-scrollbar-button {\n  display: none;\n}\n\n.fortune-dialog {\n  max-width: 90%;\n  max-height: 90%;\n  overflow: scroll;\n  border-radius: 6px;\n  background: white;\n  box-shadow: rgb(0 0 0 / 10%) 5px 5px 30px;\n  box-sizing: border-box;\n  overflow: auto;\n}\n\n.fortune-dialog-box-button-container {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.fortune-dialog-box-content {\n  padding: 0px 25px;\n}\n\n.fortune-dialog-box-button-container {\n  padding-top: 10px;\n  padding-bottom: 20px;\n}\n\n.fortune-message-box-button {\n  display: inline-flex;\n  align-items: center;\n  padding: 6px 12px;\n  margin: 0 8px;\n  border: none;\n  border-radius: 4px;\n  font-size: 14px;\n  line-height: 20px;\n  outline: none;\n  cursor: pointer;\n}\n\n.fortune-message-box-button.button-default {\n  color: rgb(38, 42, 51);\n  background-color: rgb(255, 255, 255);\n  border: 1px solid rgb(235, 235, 235);\n}\n\n.fortune-message-box-button.button-primary {\n  color: white;\n  background-color: #0188FB;\n}\n\n.fortune-modal-dialog-header {\n  outline: 0;\n  display: flex;\n  justify-content: flex-end;\n}\n\n.fortune-modal-dialog-icon-close {\n  color: #d4d4d4;\n  opacity: 0.3;\n}\n\n.fortune-modal-dialog-icon-close:hover {\n  opacity: 0.7;\n}\n/*\u67E5\u627E\u66FF\u6362\u5F39\u51FA\u6846\u6837\u5F0F*/\n#fortune-search-replace {\n  position: absolute;\n  padding: 30px 42px;\n  z-index: 1002;\n}\n\n#fortune-search-replace .icon-close {\n  position: absolute;\n  right: 3px;\n  top: 3px;\n}\n\n#fortune-search-replace .tabBox {\n  margin-top: 10px;\n  font-size: 0;\n}\n\n#fortune-search-replace .tabBox span {\n  display: inline-block;\n  text-align: center;\n  width: 100px;\n  border: 1px solid rgb(235, 235, 235);\n  font-size: 14px;\n  line-height: 2;\n}\n\n#fortune-search-replace .tabBox span.on {\n  background-color: #8C89FE;\n  border-color: #726EFE;\n  color: #fff;\n}\n\n#fortune-search-replace .ctBox {\n  padding: 5px 10px;\n  border: 1px solid rgb(235, 235, 235);\n  font-size: 14px;\n  min-width: 500px;\n}\n\n#fortune-search-replace .ctBox .row {\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n}\n\n#fortune-search-replace .inputBox {\n  height: 90px;\n  position: relative;\n}\n\n#fortune-search-replace .inputBox .textboxs {\n  height: 30px;\n  line-height: 30px;\n}\n\n#fortune-search-replace .checkboxs {\n  height: 90px;\n}\n\n#fortune-search-replace .checkboxs div {\n  height: 30px;\n  line-height: 30px;\n}\n\n#fortune-search-replace .checkboxs input[type=\"checkbox\"] {\n  float: left;\n  margin-top: 9px;\n}\n\n#fortune-search-replace .btnBox {\n  margin-top: 10px;\n}\n\n#fortune-search-replace .btnBox .button-default {\n  margin-right: 8px;\n  margin-left: 0px;\n}\n\n#fortune-search-replace .close-button {\n  margin-left: 0px;\n  margin-top: 10px;\n}\n\n#fortune-search-replace #searchAllbox {\n  height: 210px;\n  border: 1px solid #d4d4d4;\n  margin-top: 10px;\n  overflow-y: auto;\n  position: relative;\n}\n\n#fortune-search-replace #searchAllbox .boxTitle {\n  width: 100%;\n  height: 30px;\n  line-height: 29px;\n  padding: 0 5px;\n  background-color: #fff;\n  border-bottom: 1px solid #d4d4d4;\n  box-sizing: border-box;\n  position: sticky;\n  left: 0;\n  top: 0;\n}\n\n#fortune-search-replace #searchAllbox .boxTitle span {\n  display: inline-block;\n  text-align: center;\n}\n\n#fortune-search-replace #searchAllbox .boxTitle span:nth-of-type(1) {\n  width: 25%;\n}\n\n#fortune-search-replace #searchAllbox .boxTitle span:nth-of-type(2) {\n  width: 25%;\n}\n\n#fortune-search-replace #searchAllbox .boxTitle span:nth-of-type(3) {\n  width: 50%;\n}\n\n#fortune-search-replace #searchAllbox .boxMain .boxItem {\n  height: 30px;\n  line-height: 29px;\n  border-bottom: 1px solid #d4d4d4;\n  padding: 0 5px;\n  box-sizing: border-box;\n}\n\n#fortune-search-replace #searchAllbox .boxMain .boxItem.on {\n  background-color: #8C89FE;\n  color: #fff;\n}\n\n#fortune-search-replace #searchAllbox .boxMain .boxItem span {\n  display: block;\n  text-align: center;\n  float: left;\n}\n\n#fortune-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(1) {\n  width: 25%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n#fortune-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(2) {\n  width: 25%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n#fortune-search-replace #searchAllbox .boxMain .boxItem span:nth-of-type(3) {\n  width: 50%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.fortune-link-modify-modal {\n  position: absolute;\n  overflow: hidden;\n  background-color: #fff;\n  z-index: 300;\n  padding: 6px 20px 10px 20px;\n  box-shadow: 0 2px 6px 0 rgb(0 0 0 / 16%);\n  border: solid 0.5px #e5e5e5;\n  border-radius: 6px;\n}\n\n.fortune-link-modify-modal.link-toolbar {\n  display: flex;\n  flex-direction: row;\n  padding: 2px 8px 2px 16px;\n  align-items: center;\n}\n\n\n.fortune-link-modify-modal .link-content {\n  margin-right: 6px;\n}\n\n.fortune-link-modify-modal .link-content:hover {\n  color: #2674fb;\n  cursor: pointer;\n}\n\n.fortune-link-modify-modal .divider {\n  width: 1px;\n  height: 16px;\n  margin: 0px 6px ;\n  background-color: #e0e0e0;\n  flex-shrink: 0;\n}\n\n.fortune-link-modify-modal .fortune-toolbar-button {\n  padding: 6px;\n}\n\n.fortune-link-modify-modal .fortune-toolbar-button:hover {\n  background-color: rgba(0, 0, 0, 0.06);\n  cursor: pointer;\n}\n\n.fortune-link-modify-modal.range-selection-modal {\n  width: 380px;\n  padding: 22px;\n  -webkit-user-select: auto;\n     -moz-user-select: auto;\n      -ms-user-select: auto;\n          user-select: auto;\n  background-color: #fff;\n}\n\n.fortune-link-modify-line {\n  padding-top: 10px;\n}\n\n.fortune-link-modify-title {\n  font-size: 12px;\n  display: inline-block;\n  height: 16px;\n  width: 74px;\n  line-height: 16px;\n  padding: 7px 0;\n  color: #333333;\n  margin-right: 6px;\n}\n\n.fortune-link-modify-input,\n.fortune-link-modify-select {\n  width: 232px;\n  box-sizing: border-box;\n  height: 26px;\n  border-radius: 5px;\n  border: 1px solid #d9d9d9;\n  font-size: 12px;\n  padding: 1px 8px;\n  outline: none;\n  -webkit-user-select: auto;\n  -moz-user-select: auto;\n  -ms-user-select: auto;\n  user-select: auto;\n}\n\n.fortune-link-modify-input:focus,\n.fortune-link-modify-modal .range-selection-input:focus {\n  border-color: #4d90fe;\n}\n\n.fortune-link-modify-input.error-input,\n.fortune-link-modify-modal .range-selection-input.error-input {\n  border: 1px solid #EF4E2F !important;\n}\n\n.fortune-link-modify-cell-selector {\n  width: 20px;\n  right: 24px;\n  padding: 4px;\n  position: absolute;\n  display: inline-block;\n  border: none;\n  cursor: pointer;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n}\n\n.fortune-link-modify-modal .modal-title {\n  font-weight: 500;\n  font-size: 16px;\n  color: rgba(0, 0, 0, .88);\n  margin-bottom: 12px;\n  line-height: 24px;\n}\n\n.fortune-link-modify-modal .range-selection-input {\n  display: block;\n  outline: none;\n  font-size: 14px;\n  height: 32px;\n  width: 100%;\n  -webkit-box-sizing: border-box;\n  box-sizing: border-box;\n  padding: 7px 11px;\n  border: 1px solid #e0e0e0;\n  border-radius: 4px;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  appearance: none;\n  margin: 0;\n}\n\n.fortune-link-modify-modal .modal-icon-close {\n  position: absolute;\n  right: 22px;\n  top: 22px;\n  cursor: pointer;\n}\n\n.fortune-link-modify-modal .validation-input-tip {\n  height: 17px;\n  font-size: 12px;\n  color: #EF4E2F;\n  margin: 3px 0px ;\n}\n\n.fortune-link-modify-modal .button-group {\n  display: flex;\n}\n\n.fortune-link-modify-modal .modal-footer {\n  display: flex;\n  justify-content: flex-end;\n  padding: 0px 0px 5px 0px;\n}\n\n.fortune-link-modify-modal.range-selection-modal .modal-footer {\n  padding: 0px;\n}\n\n.fortune-link-modify-modal .button-basic {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  font-size: 14px;\n  height: 32px;\n  width: 88px;\n  padding: 0;\n  border-radius: 4px;\n  cursor: pointer;\n}\n\n.fortune-link-modify-modal .button-default {\n  color: rgb(38, 42, 51);\n  background-color: rgb(255, 255, 255);\n  border: 1px solid rgb(235, 235, 235);\n}\n\n.fortune-link-modify-modal .button-primary {\n  color: white;\n  background-color: #0188FB;\n  margin-left: 14px;\n}\n#fortune-data-verification {\n  min-width: 500px;\n  padding: 10px 0px;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n#fortune-data-verification .title {\n  font-size: 16px;\n}\n\n#fortune-data-verification .box {\n  font-size: 14px;\n}\n\n#fortune-data-verification .box .box-item {\n  padding: 10px;\n  border-bottom: 1px solid #E1E4E8;\n}\n\n#fortune-data-verification .box .box-item .box-item-title {\n  font-size: 14px;\n  font-weight: 600;\n  margin-bottom: 10px;\n}\n\n#fortune-data-verification .box .box-item .data-verification-range {\n  width: 100%;\n  height: 30px;\n  border: 1px solid #d4d4d4;\n}\n\n#fortune-data-verification .box .box-item .show-box-item {\n  margin-top: 6px;\n  font-size: 12px;\n}\n\n#fortune-data-verification .box .box-item .show-box-item .check-box {\n  height: 30px;\n  line-height: 30px;\n  margin-bottom: 10px;\n\n}\n\n#fortune-data-verification .box .box-item .show-box-item .check-box input {\n  height: 30px;\n  padding: 0 10px;\n  border: 1px solid #d4d4d4;\n  box-sizing: border-box;\n}\n\n#fortune-data-verification .input-box input {\n  height: 30px;\n  padding: 4px 10px 4px 10px;\n  border: 1px solid #d4d4d4;\n  box-sizing: border-box;\n  margin-top: 6px;\n}\n\n#fortune-data-verification .input-box span {\n  margin: 0px 16px;\n}\n\n.data-verification-range .formulaInputFocus {\n  width: calc(100% - 30px);\n  height: 30px;\n  padding: 0 10px px;\n  float: left;\n  border: none;\n  outline-style: none;\n  box-sizing: border-box;\n}\n\n.data-verification-range .icon {\n  float: right;\n  margin-top: 4px;\n  margin-right: 5px;\n  cursor: pointer;\n}\n\n#fortune-data-verification .box .box-item .data-verification-type-select {\n  width: 100%;\n  height: 30px;\n  border-color: #d4d4d4;\n  outline-style: none;\n}\n\n#fortune-data-verification .box .box-item .check {\n  font-size: 12px;\n  line-height: 24px;\n}\n\n#fortune-data-verification .box .box-item .check input {\n  vertical-align: text-top;\n}\n\n#fortune-data-verification .button-basic {\n  display: inline-block;\n  margin-bottom: 0;\n  font-weight: 400;\n  text-align: center;\n  vertical-align: middle;\n  touch-action: manipulation;\n  cursor: pointer;\n  white-space: nowrap;\n  padding: 4px 8px;\n  font-size: 14px;\n  line-height: 1.42857143;\n  border-radius: 2px;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  margin-top: 10px;\n}\n\n#fortune-data-verification .button-primary {\n  background: #0188fb;\n  border: 1px solid #0188fb;\n  color: #fff;\n  margin-right: 10px;\n}\n\n#fortune-data-verification .button-close {\n  color: #333;\n  background-color: #fff;\n  border: 1px solid #ccc;\n  margin-right: 10px;\n}\n\n\n#range-dialog {\n  box-shadow: 0 4px 16px rgb(0 0 0 / 20%);\n  background: #fff;\n  background-clip: padding-box;\n  border: 1px solid rgba(0, 0, 0, .333);\n  outline: 0;\n  position: absolute;\n  color: #000;\n  padding: 30px 42px;\n  z-index: 100003;\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -90%);\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n#range-dialog .dialog-title {\n  background-color: #fff;\n  color: #000;\n  cursor: default;\n  font-size: 16px;\n  font-weight: normal;\n  line-height: 24px;\n  margin: 0 0 16px;\n}\n\n#range-dialog input {\n  height: 30px;\n  padding: 0 10px;\n  border: 1px solid #d4d4d4;\n  outline-style: none;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n#range-dialog .button-primary {\n  background: #0188fb;\n  border: 1px solid #0188fb;\n  color: #fff;\n  margin-right: 10px;\n}\n\n#range-dialog .button-close {\n  color: #333;\n  background-color: #fff;\n  border: 1px solid #ccc;\n  margin-right: 10px;\n}\n\n#luckysheet-dataVerification-dropdown-List {\n  background-color: #fff;\n  border: 1px solid #ccc;\n  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);\n  position: absolute;\n  z-index: 10000;\n  box-sizing: border-box;\n  font-size: 12px;\n}\n\n#luckysheet-dataVerification-dropdown-List .dropdown-List-item {\n  padding: 5px 10px;\n  box-sizing: border-box;\n  cursor: pointer;\n}\n\n#luckysheet-dataVerification-dropdown-List .dropdown-List-item:hover {\n  background-color: #E1E1E1;\n}\n.condition-format-sub-menu {\n  position: absolute;\n  top: -8px;\n  box-shadow: 0 2px 4px rgb(0 0 0 / 20%);\n  background: #fff;\n  border: 1px solid rgba(0, 0, 0, .2);\n  cursor: default;\n  font-size: 12px;\n  z-index: 1004;\n  box-sizing: border-box;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  outline: none;\n}\n\n.condition-format-item {\n  display: flex;\n  justify-content: space-between;\n  padding: 6px 18px;\n  z-index: 1005;\n}\n\n.condition-format-item:hover {\n  background: #efefef;\n}\n\n.condition-format-item span {\n  font-size: 10px;\n  color: #afafaf;\n}\n\n.horizontal-line {\n  border-top: 1px solid #ebebeb;\n  margin-top: 6px;\n  margin-bottom: 6px;\n}\n\n\n\n.condition-rules .button-basic {\n  display: inline-block;\n  margin-bottom: 0;\n  font-weight: 400;\n  text-align: center;\n  vertical-align: middle;\n  touch-action: manipulation;\n  cursor: pointer;\n  white-space: nowrap;\n  padding: 4px 8px;\n  font-size: 14px;\n  line-height: 1.42857143;\n  border-radius: 2px;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  margin-top: 10px;\n}\n\n.condition-rules .button-primary {\n  background: #0188fb;\n  border: 1px solid #0188fb;\n  color: #fff;\n  margin-right: 10px;\n}\n\n.condition-rules .button-close {\n  color: #333;\n  background-color: #fff;\n  border: 1px solid #ccc;\n}\n\n.condition-rules {\n  padding: 0px 42px 34px 42px;\n  font-size: 12px;\n}\n\n.condition-rules-title {\n  color: #000;\n  cursor: default;\n  font-size: 16px;\n  margin-bottom: 18px;\n}\n\n.conditin-rules-value {\n  margin: 5px 0;\n  font-weight: 600;\n}\n\n.condition-rules-inpbox {\n  width: 198px;\n  height: 28px;\n  border: 1px solid #d4d4d4;\n}\n\n.condition-rules-input {\n  width: 150px;\n  height: 28px;\n  padding: 0 10px;\n  border: none;\n  outline-style: none;\n  float: left;\n}\n\n.condition-relues-inputicon {\n  float: right;\n  margin-top: 2px;\n  margin-right: 5px;\n  cursor: pointer;\n}\n\n.condition-rules-set-title {\n  margin: 6px 0px;\n}\n\n.condition-rules-setbox {\n  border: 1px solid #d4d4d4;\n}\n\n.condition-rules-set {\n  padding: 5px 10px;\n}\n\n.condition-rules-color {\n  height: 30px;\n  line-height: 30px;\n  position: relative;\n}\n\n.condition-rules-check {\n  float: left;\n  margin-top: 10px;\n}\n\n.condition-rules-label {\n  display: inline-block;\n  width: 80px;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n.condition-rules-select-color {\n  padding: 2px;\n  border: solid 1px #E5E5E5;\n  background: #F5F5F5;\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(20%, -50%);\n}\n\n.condition-rules-between-box {\n  display: flex;\n  align-items: center;\n}\n\n.condition-rules-between-inpbox {\n  width: 108px;\n  height: 28px;\n  border: 1px solid #d4d4d4;\n}\n\n.condition-rules-between-input {\n  width: 60px;\n  height: 28px;\n  padding: 0 10px;\n  border: none;\n  outline-style: none;\n  float: left;\n}\n\n.condition-rules-date {\n  width: 98%;\n  border: none;\n  line-height: 26px;\n}\n\n.condition-rules-select {\n  width: 150px;\n  height: 30px;\n}\n\n.condition-rules-project-box {\n  display: flex;\n  align-items: center;\n}\n\n.condition-rules-project-input {\n  margin: 0px 6px;\n}\n.fortune-toolbar {\n  display: flex;\n  flex-direction: row;\n  background: #fafafc;\n  position: relative;\n  padding: 5px 0px 3px 15px;\n  border-bottom: 1px solid #d4d4d4;\n  white-space: nowrap;\n  align-items: center;\n}\n\n.fortune-toolbar-divider {\n  width: 1px;\n  height: 20px;\n  margin: 0 6px;\n  background-color: #e0e0e0;\n  flex-shrink: 0;\n}\n\n.fortune-toolbar-menu-line {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  position: relative;\n}\n\n.fortune-toolbar-menu-divider {\n  width: \"100%\";\n  height: 1px;\n  margin: 2px 6px;\n  background-color: #e0e0e0;\n}\n\n.fortune-toolbar-button,\n.fortune-toolbar-combo {\n  -webkit-border-radius: 4px;\n  -moz-border-radius: 4px;\n  border-radius: 4px;\n  -webkit-user-select: none;\n  -moz-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n  background: 0;\n  outline: none;\n  padding: 0;\n  list-style: none;\n  text-decoration: none;\n  display: flex;\n  align-items: center;\n  padding: 2px;\n  margin: 2px 4px;\n}\n\n.fortune-toolbar-combo-button,\n.fortune-toolbar-combo-arrow {\n  display: flex;\n  align-items: center;\n}\n\n.fortune-toolbar-button:hover,\n.fortune-toolbar-combo:hover {\n  background-color: rgba(0, 0, 0, 0.06);\n  cursor: pointer;\n}\n\n.fortune-toolbar-combo-arrow:hover {\n  background-color: rgba(0, 0, 0, 0.06);\n  cursor: pointer;\n}\n\n.fortune-toolbar-button:active,\n.fortune-toolbar-combo:active {\n  background-color: rgba(0, 0, 0, 0.12);\n  cursor: pointer;\n}\n\n.fortune-toobar-combo-container {\n  position: relative;\n}\n\n.fortune-toolbar-combo-popup {\n  position: absolute;\n  white-space: nowrap;\n  top: 32px;\n  left: 0;\n  z-index: 1004;\n}\n\n.fortune-toolbar-select::-webkit-scrollbar {\n  display: none ;\n}\n\n.fortune-toolbar-select,\n.fortune-toolbar-color-picker {\n  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);\n  padding: 10px;\n  border-radius: 6px;\n  background: white;\n}\n\n.fortune-toolbar-select {\n  padding-left: 0;\n  padding-right: 0;\n  overflow: auto;\n  max-height: 75vh;\n}\n\n.fortune-toolbar-combo-button {\n  font-size: 12px;\n}\n\n.fortune-toolbar-select-option {\n  font-size: 12px;\n  min-width: 60px;\n  padding: 8px 12px;\n  cursor: pointer;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n.fortune-toolbar-select-option:hover {\n  background: #efefef;\n}\n\n.fortune-toolbar-select::-webkit-scrollbar {\n  display: none;\n}\n\n.fortune-toolbar-color-picker-row {\n  display: flex;\n  flex-direction: row;\n}\n\n.fortune-toolbar-combo-text {\n  margin: 0 4px;\n}\n\n.fortune-toolbar-color-picker-item {\n  width: 16px;\n  height: 16px;\n  margin: 1px;\n  cursor: pointer;\n}\n\n.fortune-tooltip {\n  visibility: hidden;\n  background-color: #666;\n  color: #fff;\n  text-align: center;\n  border-radius: 2px;\n  padding: 6px;\n  font-size: 12px;\n  position: absolute;\n  z-index: 25; /* higher than toolbar tips */\n  top: 40px;\n  white-space: nowrap;\n}\n\n.fortune-toolbar-button:hover .fortune-tooltip,\n.fortune-toolbar-combo:hover .fortune-tooltip {\n  visibility: visible;\n}\n\n.fortune-toolbar-more-container {\n  position: absolute;\n  display: flex;\n  flex-direction: row;\n  align-items: center;\n  align-self: flex-end;\n  margin-right: 40px;\n  top: 40px;\n  max-width: 348px;\n  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);\n  background: white;\n  flex-wrap: wrap;\n  z-index: 1002;\n}\n\n.fortune-toolbar-subtext {\n  -webkit-transition: all 0.218s;\n  -moz-transition: all 0.218s;\n  -o-transition: all 0.218s;\n  transition: all 0.218s;\n  font-size: 12px;\n  left: auto;\n  padding-top: 1px;\n  padding-left: 24px;\n  text-align: right;\n  opacity: .5;\n  filter: alpha(opacity=50);\n  color: #000;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  font-family: Arial;\n  line-height: 100%;\n}\n\n.toolbar-item-sub-menu {\n  position: absolute;\n  box-shadow: 0 2px 4px rgb(0 0 0 / 20%);\n  background: #fff;\n  border: 1px solid rgba(0, 0, 0, .2);\n  cursor: default;\n  font-size: 12px;\n  z-index: 1004;\n  box-sizing: border-box;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  outline: none;\n  border-radius: 6px;\n}\n\n#fortune-custom-color {\n  min-width: 164px;\n  background: rgb(240, 240, 240);\n  border-radius: 6px;\n  box-shadow: 0 2px 4px rgb(0 0 0 / 20%);\n  border: 1px solid rgba(0, 0, 0, .2);\n  font-size: 12px;\n}\n\n#fortune-custom-color .color-reset {\n  position: relative;\n  color: #333;\n  cursor: pointer;\n  list-style: none;\n  padding: 10px;\n  white-space: nowrap;\n  padding-left: 8px;\n  vertical-align: middle;\n  padding-right: 24px;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  border-radius: 6px;\n  background: white;\n}\n\n#fortune-custom-color .color-reset:hover {\n  background: rgb(230, 230, 230);\n}\n\n#fortune-custom-color .custom-color {\n  position: relative;\n  margin: auto;\n  padding: 10px;\n  border-radius: 6px;\n  background: white;\n  display: flex;\n  align-items: center;\n  margin: 1px 0px;\n  display: flex;\n  justify-content: space-around;\n}\n\n.button-basic {\n  display: inline-block;\n  margin-bottom: 0;\n  font-weight: 400;\n  text-align: center;\n  vertical-align: middle;\n  touch-action: manipulation;\n  cursor: pointer;\n  white-space: nowrap;\n  padding: 4px 8px;\n  font-size: 12px;\n  line-height: 1.42857143;\n  border-radius: 2px;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n.button-primary {\n  background: #0188fb;\n  border: 1px solid #0188fb;\n  color: #fff;\n  margin-right: -4px;\n}\n\n.fortune-border-select-menu{\n    position: absolute;\n    bottom: 0px;\n}\n\n.fortune-border-color-preview {\n  height: 3px;\n}\n\n.fortune-border-select-option {\n  font-size: 12px;\n  height: 24px;\n  line-height: 24px;\n  min-width: 60px;\n  padding: 8px 12px;\n}\n\n.fortune-border-select-option:hover {\n  background: #efefef;\n  cursor: pointer;\n}\n\n.fortune-border-style-preview{\n  height: 3px;\n  overflow: hidden;\n}\n\n.fortune-border-style-picker-menu{\n  padding: 0px 10px;\n}\n\n.fortune-border-style-picker-menu:hover{\n  background: #efefef;\n  cursor: pointer;\n}\n\n/*\u51FD\u6570\u516C\u5F0F\u67E5\u627E\u6837\u5F0F*/\n#luckysheet-search-formula {\n  font-size: 12px;\n}\n\n#luckysheet-search-formula .inpbox {\n  margin-bottom: 5px;\n}\n\n#luckysheet-search-formula .inpbox div {\n  display: block;\n  margin-bottom: 5px;\n}\n\n#luckysheet-search-formula .inpbox input {\n  width: 100%;\n  height: 24px;\n  line-height: 24px;\n  border: 1px solid #d4d4d4;\n  padding: 0 10px;\n  box-sizing: border-box;\n  font-size: 12px;\n}\n\n#luckysheet-search-formula .selbox {\n  margin-bottom: 5px;\n}\n\n#luckysheet-search-formula .selbox select {\n  width: 50%;\n  height: 24px;\n  line-height: 24px;\n  border: 1px solid #d4d4d4;\n  box-sizing: border-box;\n  font-size: 12px;\n}\n\n#luckysheet-search-formula .listbox label {\n  display: block;\n  margin-bottom: 5px;\n}\n\n#formulaTypeList {\n  width: 300px;\n  height: 170px;\n  border: 1px solid #d4d4d4;\n  overflow-y: scroll;\n}\n\n.formulaList {\n  width: 300px;\n  height: 170px;\n  border: 1px solid #d4d4d4;\n  overflow-y: scroll;\n}\n\n.listBox {\n  padding: 5px;\n  border-bottom: 1px solid #d4d4d4;\n}\n\n.listBox.on {\n  background-color: #8C89FE;\n  color: #fff;\n}\n\n#fortune-split-column {\n    /* position: absolute;\n    padding: 30px 42px;\n    z-index: 1002; */\n    min-width: 500px;\n}\n#fortune-split-column label {\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none\n}\n#fortune-split-column .title {\n    font-size: 16px;\n}\n#fortune-split-column .splitDelimiters {\n    margin-top: 10px;\n}\n#fortune-split-column .splitSymbols {\n    position: relative;\n    border: 1px solid #dfdfdf;\n    padding: 5px;\n    margin: 5px 0px;\n}\n#fortune-split-column .splitSymbol {\n    font-size: 14px;\n}\n#fortune-split-column .splitSimple {\n    position: absolute;\n    top: 114px;\n    left: 0px;\n}\n#fortune-split-column #otherValue {\n    margin-left: 5px;\n    width: 50px;\n    padding: 0 5px;\n}\n#fortune-split-column .splitDataPreview {\n    font-size: 14px;\n    margin-top: 26px;\n}\n#fortune-split-column .splitColumnData {\n    border: 1px solid #dfdfdf;\n    padding: 5px;\n    margin: 5px 0px;\n    height: 100px;\n    overflow-y: scroll;\n}\n#fortune-split-column .button-basic {\n    display: inline-block;\n    margin-bottom: 0;\n    font-weight: 400;\n    text-align: center;\n    vertical-align: middle;\n    touch-action: manipulation;\n    cursor: pointer;\n    white-space: nowrap;\n    padding: 4px 8px;\n    font-size: 14px;\n    line-height: 1.42857143;\n    border-radius: 2px;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n}\n#fortune-split-column .button-primary {\n    background: #0188fb;\n    border: 1px solid #0188fb;\n    color: #fff;\n    margin-right: 10px;\n}\n#fortune-split-column .button-close {\n    color: #333;\n    background-color: #fff;\n    border: 1px solid #ccc;\n}\n#fortune-split-column table {\n    border-collapse: collapse;\n}\n#fortune-split-column tr {\n    display: table-row;\n    vertical-align: inherit;\n    border-color: inherit;\n}\n#fortune-split-column td {\n    border: 1px solid #333;\n    display: table-cell;\n    vertical-align: inherit;\n}\nlabel {\n    cursor: default;\n}\n#fortune-location-condition {\n    min-width: 500px;\n}\n#fortune-location-condition .title {\n    background-color: #fff;\n    color: #000;\n    cursor: default;\n    font-size: 16px;\n    font-weight: normal;\n    line-height: 48px;\n}\n#fortune-location-condition .listbox {\n    border: 1px solid #dfdfdf;\n    padding: 10px;\n    font-size: 14px;\n    color: #000;\n}\n#fortune-location-condition .listbox .listItem {\n    padding: 5px 0;\n}\n#fortune-location-condition .listbox .listItem input[type=\"radio\"] {\n    float: left;\n    margin-top: 5px;\n}\n#fortune-location-condition .listItem {\n    padding: 5px 0;\n}\n#fortune-location-condition .listItem .subItem {\n    height: 30px;\n    padding: 0 10px;\n    display: block;\n}\n#fortune-location-condition input[type=\"radio\"] {\n    float: left;\n    margin-top: 3px;\n}\n#fortune-location-condition .listbox .listItem .subbox {\n    height: 30px;\n    padding: 0 10px;\n}\n#fortune-location-condition .listbox .listItem .subbox .subItem {\n    float: left;\n    margin-right: 5px;\n}\n#fortune-location-condition .button-basic {\n    display: inline-block;\n    margin-bottom: 0;\n    font-weight: 400;\n    text-align: center;\n    vertical-align: middle;\n    touch-action: manipulation;\n    cursor: pointer;\n    white-space: nowrap;\n    padding: 4px 8px;\n    font-size: 14px;\n    line-height: 1.42857143;\n    border-radius: 2px;\n    -webkit-user-select: none;\n       -moz-user-select: none;\n        -ms-user-select: none;\n            user-select: none;\n    margin-top: 10px;\n}\n#fortune-location-condition .button-primary {\n    background: #0188fb;\n    border: 1px solid #0188fb;\n    color: #fff;\n    margin-right: 10px;\n}\n#fortune-location-condition .button-close {\n    color: #333;\n    background-color: #fff;\n    border: 1px solid #ccc;\n}\n.listBox {\n  display: flex;\n  justify-content: space-between;\n}\n\n.inpbox {\n  margin-bottom: 10px;\n}\n\n.decimal-places-input {\n  width: 70px;\n}\n\n\n.format-list {\n  width: 300px;\n  height: 170px;\n  border: 1px solid #d4d4d4;\n  overflow-y: scroll;\n}\n\n\n\n.fortune-fx-editor {\n  display: flex;\n  flex-direction: row;\n  height: 28px;\n  border-bottom: 1px solid #d4d4d4;\n}\n\n.fortune-fx-icon {\n  display: flex;\n  align-items: center;\n  margin: 0 12px;\n}\n\n.fortune-name-box-container {\n  width: 99px;\n  border-right: 1px solid #d4d4d4;\n  font-size: 14px;\n  display: flex;\n  align-items: center;\n}\n\n.fortune-name-box {\n  width: 100%;\n  text-align: center;\n  margin: 0;\n  outline: none;\n  cursor: text;\n  /* -webkit-user-modify: read-write-plaintext-only; */\n  white-space: nowrap;\n  overflow: hidden;\n  -webkit-transform: translateZ(0);\n  background-color: white;\n  word-wrap: break-word;\n  -webkit-nbsp-mode: space;\n  -webkit-line-break: after-white-space;\n}\n\n.fortune-fx-input-container {\n  padding-left: 10px;\n  overflow: visible;\n  padding: 0;\n  flex: 1;\n  display: flex;\n  align-items: center;\n  position: relative;\n  border-left: 1px solid #e5e5e5;\n}\n\n.fortune-fx-input {\n  flex: 1;\n  height: 100%;\n  overflow-y: scroll;\n  padding-left: 2px;\n  font-size: 14px;\n  line-height: 14px;\n  margin: 0;\n  outline: none;\n  cursor: text;\n  white-space: pre-wrap;\n  word-wrap: break-word;\n  -webkit-transform: translateZ(0);\n  -webkit-nbsp-mode: space;\n  -webkit-line-break: after-white-space;\n  background-color: white;\n  padding-top: 7px;\n  box-sizing: border-box;\n  color:black;\n  text-align: left;\n}\n.fortune-fx-input[contenteditable=\"true\"] {\n  -webkit-user-modify: read-write-plaintext-only;\n}\n.luckysheet-sheet-area {\n  width: 100%;\n  box-sizing: border-box;\n  background-color: #fafafc;\n  color: #444;\n  height: 31px;\n  padding: 0 30px 0 44px;\n  margin: 0;\n  -webkit-touch-callout: none;\n  cursor: default;\n  transition: 0.3s ease all;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  position: relative;\n}\n\n#luckysheet-sheet-content {\n  width: 0;\n  flex: 3;\n  display: flex;\n  align-items: center;\n}\n\n#luckysheet-bottom-pager {\n  width: 0;\n  background-color: #fafafc;\n  z-index: 1;\n  flex: 2;\n  text-align: right;\n  white-space: nowrap;\n}\n\n.luckysheet-sheet-area>div,\n.luckysheet-sheet-area .luckysheet-sheets-item {\n  display: inline-block;\n  /* margin-right: 6px;\n  margin-top: 1px;\n  padding: 1px 6px; */\n  /* padding: 6px 10px; */\n}\n\n.fortune-sheettab-container {\n  padding: 0px 0px;\n  margin-left: 0px;\n  position: relative;\n  max-width: 54%;\n  vertical-align: bottom;\n  display: inline-block;\n}\n\n.fortune-sheettab-container .boundary {\n  position: absolute;\n  top: 0;\n  width: 6px;\n  height: 100%;\n  z-index: 1;\n  background: rgb(255, 255, 255);\n}\n\n.fortune-sheettab-container .boundary-left {\n  left: 0;\n  background-image: linear-gradient(to right, var(--tw-gradient-stops));\n  --tw-gradient-from: #4445;\n  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, #8880);\n}\n\n.fortune-sheettab-container .boundary-right {\n  right: 0;\n  background-image: linear-gradient(to left, var(--tw-gradient-stops));\n  --tw-gradient-from: #4445;\n  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, #8880);\n}\n\n.fortune-sheettab-container .fortune-sheettab-container-c {\n  padding: 0px 0px;\n  margin-left: 0px;\n  overflow: hidden;\n  white-space: nowrap;\n  position: relative;\n  max-width: 100%;\n  vertical-align: bottom;\n  display: inline-block;\n}\n\n.luckysheet-sheet-container-menu-hide .luckysheet-sheets-item {\n  padding-right: 5px !important;\n}\n\n.luckysheet-sheet-container-menu-hide .luckysheet-sheets-item-menu {\n  display: none !important;\n}\n\n.luckysheet-sheet-area div.luckysheet-sheets-item {\n  padding: 2px 6px;\n  height: 29px;\n  line-height: 29px;\n  background-color: #fafafc;\n  color: #676464;\n  min-width: 30px;\n  top: 0px;\n  position: relative;\n  margin-right: -1px;\n  cursor: pointer;\n  transition: all 0.1s;\n  font-size: 13px;\n  padding: 2px 19px 0px 5px;\n  box-sizing: border-box;\n  border-left: 1px solid #e0e0e0;\n  border-right: 1px solid #e0e0e0;\n  vertical-align: middle;\n}\n\n.luckysheet-sheet-area div.luckysheet-sheets-item:last-child {\n  margin-right: 1px;\n}\n\n.luckysheet-sheet-area div.luckysheet-sheets-item:hover {\n  background-color: #efefef;\n  /* border-color: #a5a5a5; */\n  color: #490500;\n}\n\n.luckysheet-sheet-area div.luckysheet-sheets-item .luckysheet-sheets-item-menu {\n  margin-left: 2px;\n  display: inline-block;\n  top: -2px;\n  position: relative;\n  color: #a1a1a1;\n  position: absolute;\n  height: 100%;\n  width: 15px;\n  right: 0px;\n  text-align: center;\n}\n\n.luckysheet-sheet-area div.luckysheet-sheets-item .luckysheet-sheets-item-menu:hover {\n  color: #2a2a2a;\n  cursor: pointer;\n}\n\n.luckysheet-sheet-area div.luckysheet-sheets-item .luckysheet-sheets-item-name {\n  padding: 0px 3px;\n}\n\n.luckysheet-sheets-item-color {\n  width: 100%;\n  height: 10%;\n  position: absolute;\n  bottom: 0;\n  left: 0;\n}\n\n.luckysheet-sheet-area div.luckysheet-sheets-item .luckysheet-sheets-item-name[contenteditable=\"true\"] {\n  border: 1px solid #d9d9d9;\n  display: inline-block;\n  height: 18px;\n  line-height: 18px;\n  min-width: 8px;\n  margin: -4px -1px;\n  -moz-user-modify: read-write-plaintext-only;\n  -webkit-user-modify: read-write-plaintext-only;\n  -moz-user-select: text !important;\n  -ms-user-select: text !important;\n  -webkit-user-select: text !important;\n}\n\n.luckysheet-sheet-area div.luckysheet-sheets-item .luckysheet-sheets-item-name[contenteditable=\"true\"]:focus {\n  -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3);\n  -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3);\n  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.3);\n  border: 1px solid #4d90fe;\n  outline: none;\n}\n\n.luckysheet-sheet-area div.luckysheet-sheets-item-active {\n  /* padding: 2px 8px; */\n  height: 29px;\n  line-height: 29px;\n  background-color: #efefef;\n  /* border-color: #aaa; */\n  border-top-color: #fff;\n  color: #222;\n  /* box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2); */\n  cursor: default;\n  /* top: -2px; */\n  /* border-bottom: none; */\n  /* padding-right: 20px; */\n}\n\n.luckysheet-sheet-area div.luckysheet-sheets-item-active:hover {\n  background-color: #ececec;\n  /* border-color: #aaa; */\n  color: #222;\n}\n\n.fortune-sheettab-button {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 29px;\n  width: 29px;\n}\n\n.fortune-sheettab-button:hover {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  height: 29px;\n  width: 29px;\n  background-color: #efefef;\n}\n\n.luckysheet-noselected-text {\n  -moz-user-select: -moz-test;\n  -khtml-user-select: none;\n  -webkit-user-select: none;\n  -ms-user-select: none;\n  user-select: none;\n}\n\n.fortune-sheettab-scroll {\n  display: flex;\n  align-items: center;\n  padding: 0 5px;\n  height: 29px;\n  cursor: pointer;\n}\n\n.fortune-sheettab-scroll:hover {\n  background-color: #e0e0e0;\n}\n\n.fortune-sheettab-placeholder {\n  display: inline-block;\n  width: 30px;\n  height: 29px;\n  line-height: 29px;\n  vertical-align: middle;\n}\n\n.sheet-list-container {\n  overflow: visible;\n  display: flex;\n  flex-direction: column;\n  justify-content: flex-end;\n}\n\n.luckysheet-sheet-selection-calInfo {\n  display: flex;\n  font-size: 12px;\n  align-content: center;\n  padding: 0 0 0 44px;\n  height: 22px;\n  align-self: flex-end;\n}\n\n.luckysheet-sheet-selection-calInfo div {\n  margin: auto 0;\n  white-space: nowrap;\n  margin-right: 7px;\n}\n\n.luckysheet-sheets-item-function {\n  width: 12px;\n  height: 24px;\n  position: absolute;\n  top: 4px;\n  right: 2px;\n}\n\n.fortune-sheet-area-right {\n  display: flex !important;\n}\n.fortune-zoom-container {\n  white-space: nowrap;\n  overflow: visible;\n  display: flex;\n  align-items: center;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n.fortune-zoom-button {\n  display: flex;\n  cursor: pointer;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n}\n\n.fortune-zoom-button:hover {\n  background: #efefef;\n}\n\n.fortune-zoom-ratio {\n  position: relative;\n  display: flex;\n  justify-content: center;\n  width: 48px;\n  color: #1e1e1f;\n  font-size: 12px;\n  cursor: pointer;\n}\n\n.fortune-zoom-ratio-current {\n  width: 100%;\n}\n\n.fortune-zoom-ratio-item:hover {\n  background: #efefef;\n}\n\n.fortune-zoom-ratio-menu {\n  position: absolute;\n  bottom: 30px;\n  left: 0;\n  line-height: 24px;\n  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);\n  padding: 10px 0px 10px 0px;\n  border-radius: 6px;\n  background: white;\n  z-index: 1004;\n}\n\n.fortune-zoom-ratio-text {\n  padding: 0px 10px 0px 10px;\n}\n\n.fortune-context-menu {\n  max-height: 100%;\n  overflow-y: auto;\n  border-radius: 4px;\n  box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.15);\n  transition: opacity 0.218s;\n  background: #fff;\n  border: 1px solid #ccc;\n  border: 1px solid rgba(0, 0, 0, 0.2);\n  cursor: default;\n  font-size: 13px;\n  margin: 0;\n  outline: none;\n  padding: 6px 0;\n  position: absolute;\n  z-index: 1004;\n  box-sizing: border-box;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n.fortune-context-menu input.luckysheet-mousedown-cancel {\n  width: 35px;\n  text-align: center;\n  margin-left: 5px;\n  margin-right: 5px;\n}\n\n.fortune-context-menu-divider {\n  width: \"100%\";\n  height: 1px;\n  margin: 4px 0;\n  background-color: #e0e0e0;\n}\n\n.luckysheet-cols-menu .luckysheet-cols-menuitem {\n  position: relative;\n  color: #333;\n  cursor: pointer;\n  list-style: none;\n  margin: 0;\n  padding: 1px 6em 1px 20px;\n  white-space: nowrap;\n  padding-left: 8px;\n  vertical-align: middle;\n  padding-right: 24px;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n/* \u53F3\u51FB\u83DC\u5355\u9879\u76EE hover\u80CC\u666F\u8272 */\n.luckysheet-cols-menu .luckysheet-cols-menuitem:hover,\n.luckysheet-cols-menu .luckysheet-cols-menuitem-hover {\n  background: #EFEFEF;\n}\n\n.luckysheet-cols-menu .luckysheet-cols-menuitem .luckysheet-cols-menuitem-content {\n  position: relative;\n  color: #333;\n  cursor: pointer;\n  list-style: none;\n  margin: 0;\n  padding: 6px 7em 6px 30px;\n  white-space: nowrap;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n.fortune-filter-menu .luckysheet-cols-menuitem {\n  padding: 0px;\n}\n\n.fortune-filter-menu .luckysheet-cols-menuitem .luckysheet-cols-menuitem-content {\n  padding: 7px 24px;\n}\n\n.fortune-menuitem-row {\n  display: flex;\n  padding: 7px 24px;\n  white-space: pre;\n  align-items: center;\n}\n\n.fortune-byvalue-btn {\n  cursor: pointer;\n  color: blue;\n  text-decoration: underline;\n}\n\n\n.luckysheet-filter-bycolor-submenu .button-basic,\n.fortune-filter-menu .button-basic {\n  display: flex;\n  flex-flow: row nowrap;\n  justify-content: center;\n  align-items: center;\n  font-size: 14px;\n  padding: 4px 8px;\n  border-radius: 4px;\n  cursor: pointer;\n}\n\n.luckysheet-filter-bycolor-submenu .button-basic {\n  margin: 5px 20px;\n}\n\n.luckysheet-filter-bycolor-submenu .button-default,\n.fortune-filter-menu .button-default {\n  color: rgb(38, 42, 51);\n  background-color: rgb(255, 255, 255);\n  border: 1px solid rgb(235, 235, 235);\n  margin-left: 10px;\n}\n\n.luckysheet-filter-bycolor-submenu .button-default:hover,\n.fortune-filter-menu .button-default:hover {\n  background-color: #e6e6e6;\n}\n\n.luckysheet-filter-bycolor-submenu .button-primary,\n.fortune-filter-menu .button-primary {\n  color: white;\n  background-color: #0188FB;\n}\n\n.luckysheet-filter-bycolor-submenu .button-primary:hover,\n.fortune-filter-menu .button-primary:hover {\n  background: #5391ff;\n}\n\n.fortune-filter-menu .button-danger {\n  color: white;\n  background-color: #d9534f;\n  margin-left: 10px;\n}\n\n.fortune-filter-menu .button-danger:hover {\n  background-color: #c9302c;\n}\n\n.filter-bycolor-container {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n\n.filtermenu-input-container {\n  padding: 0px;\n}\n\n.filtermenu-input-container input.luckysheet-mousedown-cancel {\n  margin: 0px 20px;\n  width: 230px;\n  box-sizing: border-box;\n  height: 26px;\n  border-radius: 3px;\n  border: 1px solid #d9d9d9;\n  font-size: 12px;\n  padding: 1px 8px;\n  outline: none;\n  -webkit-user-select: auto;\n  -moz-user-select: auto;\n  -ms-user-select: auto;\n  user-select: auto;\n  text-align: start;\n}\n\n.filtermenu-input-container input.luckysheet-mousedown-cancel {\n  border: 1px solid #A1A1A1;\n}\n\n.filtermenu-input-container input.luckysheet-mousedown-cancel:focus {\n  border: 1px solid rgb(1, 136, 251);\n  outline: none;\n}\n\n.byvalue-btn-row {\n  justify-content: space-between;\n  padding-bottom: 0px;\n  align-items: flex-start;\n}\n\n.filter-caret {\n  width: 0;\n  height: 0;\n  display: inline-block;\n  border: 4px solid transparent;\n}\n\n.filter-caret.right {\n  margin-left: 2px;\n  margin-right: 3px;\n  border-left-color: #000000;\n}\n\n.filter-caret.down {\n  margin-top: 5px;\n  margin-right: 5px;\n  border-top-color: #000000;\n}\n\n.filter-checkbox {\n  margin-left: 0px;\n  margin-right: 5px;\n}\n\n#luckysheet-filter-byvalue-select {\n  min-height: 100px;\n  overflow-y: auto;\n  overflow-x: hidden;\n  padding: 4px 24px;\n}\n\n#luckysheet-filter-byvalue-select .count,\n#luckysheet-pivotTableFilter-byvalue-select .count {\n  color: gray;\n  margin-left: 5px;\n}\n\n#luckysheet-filter-byvalue-select .select-item {\n  display: flex;\n  align-items: center;\n}\n\n/*\u989C\u8272\u7B5B\u9009 -- pan*/\n.luckysheet-filter-bycolor-submenu {\n  position: absolute;\n  min-width: 170px;\n  font-size: 12px;\n  padding: 5px 0;\n  z-index: 1004;\n  border: 1px solid rgba(0, 0, 0, .2);\n  background-color: #ffffff;\n}\n\n.luckysheet-filter-bycolor-submenu .title {\n  padding: 10px;\n  font-weight: 600;\n  color: #333;\n  background-color: #f4f4f4;\n  text-align: center;\n}\n\n.luckysheet-filter-bycolor-submenu .one-color-tip {\n  padding: 7px 30px;\n  text-align: center;\n}\n\n.luckysheet-filter-bycolor-submenu .color-list {\n  max-height: 128px;\n  overflow: auto;\n}\n\n.luckysheet-filter-bycolor-submenu .item {\n  padding: 5px 40px 5px 20px;\n  cursor: pointer;\n  position: relative;\n  background-color: #ffffff;\n}\n\n.luckysheet-filter-bycolor-submenu .item:hover {\n  background-color: #d3d3d3;\n}\n\n.luckysheet-filter-bycolor-submenu .item .color-label {\n  display: block;\n  width: 70px;\n  height: 20px;\n  border: 1px solid #d1d1d1;\n}\n\n.luckysheet-filter-bycolor-submenu .item input[type=\"checkbox\"] {\n  position: absolute;\n  right: 10px;\n  top: 6px;\n}\n\n.change-color-triangle {\n  position: absolute;\n  top: 3px;\n  right: -18px;\n}\n.fortune-sort-title {\n  background-color: #fff;\n  color: #000;\n  cursor: default;\n  font-size: 16px;\n  font-weight: 400;\n  line-height: 24px;\n  margin: 0 0 16px;\n}\n\n.fortune-sort-modal > div {\n  margin-bottom: 10px;\n}\n\n.fortune-sort-tablec td {\n  padding: 5px;\n  white-space: nowrap;\n}\n\n.fortune-sort-button {\n  margin-top: 10px;\n  margin-bottom: 25px;\n}\n\n#fortune-change-color {\n  min-width: 164px;\n  height: 252px;\n  background: rgb(240, 240, 240);\n  position: absolute;\n  bottom: -110px;\n  left: 197px;\n  border-radius: 6px;\n  box-shadow: 0 2px 4px rgb(0 0 0 / 20%);\n  border: 1px solid rgba(0, 0, 0, .2);\n}\n\n#fortune-change-color .color-reset {\n  position: relative;\n  color: #333;\n  cursor: pointer;\n  list-style: none;\n  padding: 10px;\n  white-space: nowrap;\n  padding-left: 8px;\n  vertical-align: middle;\n  padding-right: 24px;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n  border-radius: 6px;\n  background: white;\n}\n\n#fortune-change-color .color-reset:hover {\n  background: rgb(230, 230, 230);\n}\n\n#fortune-change-color .custom-color {\n  position: relative;\n  margin: auto;\n  padding: 10px;\n  border-radius: 6px;\n  background: white;\n  display: flex;\n  align-items: center;\n  margin: 1px 0px;\n  display: flex;\n  justify-content: space-around;\n}\n\n.button-basic {\n  display: inline-block;\n  margin-bottom: 0;\n  font-weight: 400;\n  text-align: center;\n  vertical-align: middle;\n  touch-action: manipulation;\n  cursor: pointer;\n  white-space: nowrap;\n  padding: 4px 8px;\n  font-size: 12px;\n  line-height: 1.42857143;\n  border-radius: 2px;\n  -webkit-user-select: none;\n     -moz-user-select: none;\n      -ms-user-select: none;\n          user-select: none;\n}\n\n.button-primary {\n  background: #0188fb;\n  border: 1px solid #0188fb;\n  color: #fff;\n  margin-right: -4px;\n}\n.fortune-sheet-list {\n  overflow-y: auto;\n  overflow-x: hidden;\n  min-width: 120px;\n  position: absolute;\n  z-index: 10002;\n  bottom: 53px;\n  margin-left: 72px;\n  max-height: 60%;\n}\n\n.fortune-sheet-list-item {\n  height: 30px;\n  line-height: 30px;\n  width: 100%;\n  margin-right: 46px;\n  cursor: pointer;\n}\n\n.fortune-sheet-list-item-name {\n  margin-right: 15px;\n  position: relative;\n}\n\n.fortune-sheet-list-item-name .luckysheet-sheets-list-item-color {\n  width: 6%;\n  height: 100%;\n  position: absolute;\n  bottom: 0;\n  left: -6px;\n}\n\n.fortune-sheet-list :hover {\n  background-color: #EFEFEF;\n}\n\n.fortune-sheet-hidden-button {\n  margin-right: 15px;\n  display: inline-flex;\n  position: absolute;\n  right: 0;\n  justify-content: flex-end;\n}\n\n.fortune-sheet-hidden-button :hover {\n  background-color: #D0D0D0;\n}\n\n.fortune-sheet-selected-check-sapce {\n  width: 20px;\n  display: inline-block;\n  margin-left: 15px;\n}\n\n*,\n::before,\n::after {\n  box-sizing: border-box;\n  border-width: 0;\n  border-style: solid;\n  border-color: #DCDDDD;\n}\n::before,\n::after {\n  --tw-content: '';\n}\n\nhtml,\n:host {\n  line-height: 1.5;\n  -webkit-text-size-adjust: 100%;\n  -moz-tab-size: 4;\n  tab-size: 4;\n  font-family: Inter, sans-serif;\n  font-feature-settings: normal;\n  font-variation-settings: normal;\n  -webkit-tap-highlight-color: transparent;\n  font-size: initial !important;\n  background-color: white !important\n}\n\nbody {\n  margin: 0;\n  line-height: inherit;\n}\n\nhr {\n  height: 0;\n  color: inherit;\n  border-top-width: 1px;\n}\n\nabbr:where([title]) {\n  text-decoration: underline dotted;\n}\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n  font-size: inherit;\n  font-weight: inherit;\n}\n\na {\n  color: inherit;\n  text-decoration: inherit;\n}\n\nb,\nstrong {\n  font-weight: bolder;\n}\n\ncode,\nkbd,\nsamp,\npre {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace;\n  font-feature-settings: normal;\n  font-variation-settings: normal;\n  font-size: 1em;\n}\n\nsmall {\n  font-size: 80%;\n}\n\nsub,\nsup {\n  font-size: 75%;\n  line-height: 0;\n  position: relative;\n  vertical-align: baseline;\n}\nsub {\n  bottom: -0.25em;\n}\nsup {\n  top: -0.5em;\n}\n\ntable {\n  text-indent: 0;\n  border-color: inherit;\n  border-collapse: collapse;\n}\n\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n  font-family: inherit;\n  font-feature-settings: inherit;\n  font-variation-settings: inherit;\n  font-size: 100%;\n  font-weight: inherit;\n  line-height: inherit;\n  color: inherit;\n  margin: 0;\n  padding: 0;\n}\n\nbutton,\nselect {\n  text-transform: none;\n}\n\nbutton,\n[type='button'],\n[type='reset'],\n[type='submit'] {\n  -webkit-appearance: button;\n  background-color: transparent;\n  background-image: none;\n}\n\n:-moz-focusring {\n  outline: auto;\n}\n\n:-moz-ui-invalid {\n  box-shadow: none;\n}\n\nprogress {\n  vertical-align: baseline;\n}\n\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n  height: auto;\n}\n\n[type='search'] {\n  -webkit-appearance: textfield;\n  outline-offset: -2px;\n}\n\n::-webkit-search-decoration {\n  -webkit-appearance: none;\n}\n\n::-webkit-file-upload-button {\n  -webkit-appearance: button;\n  font: inherit;\n}\n\nsummary {\n  display: list-item;\n}\n\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n  margin: 0;\n}\nfieldset {\n  margin: 0;\n  padding: 0;\n}\nlegend {\n  padding: 0;\n}\nol,\nul,\nmenu {\n  list-style: none;\n  margin: 0;\n  padding: 0;\n}\n\ndialog {\n  padding: 0;\n}\n\ntextarea {\n  resize: vertical;\n}\n\ninput::placeholder,\ntextarea::placeholder {\n  opacity: 1;\n  color: #9ca3af;\n}\n\nbutton,\n[role=\"button\"] {\n  cursor: pointer;\n}\n\n:disabled {\n  cursor: default;\n}\n\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n  display: block;\n  vertical-align: middle;\n}\n\nimg,\nvideo {\n  max-width: 100%;\n  height: auto;\n}\n\n[hidden] {\n  display: none;\n}\n[type='text'],input:where(:not([type])),[type='email'],[type='url'],[type='password'],[type='number'],[type='date'],[type='datetime-local'],[type='month'],[type='search'],[type='tel'],[type='time'],[type='week'],[multiple],textarea,select{\n  appearance: none;\n  background-color: #fff;\n  border-color: #6b7280;\n  border-width: 1px;\n  border-radius: 0px;\n  padding-top: 0.5rem;\n  padding-right: 0.75rem;\n  padding-bottom: 0.5rem;\n  padding-left: 0.75rem;\n  font-size: 1rem;\n  line-height: 1.5rem;\n  --tw-shadow: 0 0 #0000;\n}\n[type='text']:focus, input:where(:not([type])):focus, [type='email']:focus, [type='url']:focus, [type='password']:focus, [type='number']:focus, [type='date']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='week']:focus, [multiple]:focus, textarea:focus, select:focus{\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n  --tw-ring-inset: var(--tw-empty, );\n  --tw-ring-offset-width: 0px;\n  --tw-ring-offset-color: #fff;\n  --tw-ring-color: #2563eb;\n  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  border-color: #2563eb;\n}\ninput::placeholder,textarea::placeholder{\n  color: #6b7280;\n  opacity: 1;\n}\n::-webkit-datetime-edit-fields-wrapper{\n  padding: 0;\n}\n::-webkit-date-and-time-value{\n  min-height: 1.5em;\n  text-align: inherit;\n}\n::-webkit-datetime-edit{\n  display: inline-flex;\n}\n::-webkit-datetime-edit,::-webkit-datetime-edit-year-field,::-webkit-datetime-edit-month-field,::-webkit-datetime-edit-day-field,::-webkit-datetime-edit-hour-field,::-webkit-datetime-edit-minute-field,::-webkit-datetime-edit-second-field,::-webkit-datetime-edit-millisecond-field,::-webkit-datetime-edit-meridiem-field{\n  padding-top: 0;\n  padding-bottom: 0;\n}\nselect{\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e\");\n  background-position: right 0.5rem center;\n  background-repeat: no-repeat;\n  background-size: 1.5em 1.5em;\n  padding-right: 2.5rem;\n  print-color-adjust: exact;\n}\n[multiple],[size]:where(select:not([size=\"1\"])){\n  background-image: initial;\n  background-position: initial;\n  background-repeat: unset;\n  background-size: initial;\n  padding-right: 0.75rem;\n  print-color-adjust: unset;\n}\n[type='checkbox'],[type='radio']{\n  appearance: none;\n  padding: 0;\n  print-color-adjust: exact;\n  display: inline-block;\n  vertical-align: middle;\n  background-origin: border-box;\n  user-select: none;\n  flex-shrink: 0;\n  height: 1rem;\n  width: 1rem;\n  color: #2563eb;\n  background-color: #fff;\n  border-color: #6b7280;\n  border-width: 1px;\n  --tw-shadow: 0 0 #0000;\n}\n[type='checkbox']{\n  border-radius: 0px;\n}\n[type='radio']{\n  border-radius: 100%;\n}\n[type='checkbox']:focus,[type='radio']:focus{\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n  --tw-ring-inset: var(--tw-empty, );\n  --tw-ring-offset-width: 2px;\n  --tw-ring-offset-color: #fff;\n  --tw-ring-color: #2563eb;\n  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n}\n[type='checkbox']:checked,[type='radio']:checked{\n  border-color: transparent;\n  background-color: currentColor;\n  background-size: 100% 100%;\n  background-position: center;\n  background-repeat: no-repeat;\n}\n[type='checkbox']:checked{\n  background-image: url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e\");\n}\n@media (forced-colors: active) {\n  [type='checkbox']:checked{\n    appearance: auto;\n  }\n}\n[type='radio']:checked{\n  background-image: url(\"data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e\");\n}\n@media (forced-colors: active) {\n  [type='radio']:checked{\n    appearance: auto;\n  }\n}\n[type='checkbox']:checked:hover,[type='checkbox']:checked:focus,[type='radio']:checked:hover,[type='radio']:checked:focus{\n  border-color: transparent;\n  background-color: currentColor;\n}\n[type='checkbox']:indeterminate{\n  background-image: url(\"data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e\");\n  border-color: transparent;\n  background-color: currentColor;\n  background-size: 100% 100%;\n  background-position: center;\n  background-repeat: no-repeat;\n}\n@media (forced-colors: active) {\n  [type='checkbox']:indeterminate{\n    appearance: auto;\n  }\n}\n[type='checkbox']:indeterminate:hover,[type='checkbox']:indeterminate:focus{\n  border-color: transparent;\n  background-color: currentColor;\n}\n[type='file']{\n  background: unset;\n  border-color: inherit;\n  border-width: 0;\n  border-radius: 0;\n  padding: 0;\n  font-size: unset;\n  line-height: inherit;\n}\n[type='file']:focus{\n  outline: 1px solid ButtonText;\n  outline: 1px auto -webkit-focus-ring-color;\n}\n*, ::before, ::after{\n  --tw-border-spacing-x: 0;\n  --tw-border-spacing-y: 0;\n  --tw-translate-x: 0;\n  --tw-translate-y: 0;\n  --tw-rotate: 0;\n  --tw-skew-x: 0;\n  --tw-skew-y: 0;\n  --tw-scale-x: 1;\n  --tw-scale-y: 1;\n  --tw-pan-x:  ;\n  --tw-pan-y:  ;\n  --tw-pinch-zoom:  ;\n  --tw-scroll-snap-strictness: proximity;\n  --tw-gradient-from-position:  ;\n  --tw-gradient-via-position:  ;\n  --tw-gradient-to-position:  ;\n  --tw-ordinal:  ;\n  --tw-slashed-zero:  ;\n  --tw-numeric-figure:  ;\n  --tw-numeric-spacing:  ;\n  --tw-numeric-fraction:  ;\n  --tw-ring-inset:  ;\n  --tw-ring-offset-width: 0px;\n  --tw-ring-offset-color: #fff;\n  --tw-ring-color: rgb(59 130 246 / 0.5);\n  --tw-ring-offset-shadow: 0 0 #0000;\n  --tw-ring-shadow: 0 0 #0000;\n  --tw-shadow: 0 0 #0000;\n  --tw-shadow-colored: 0 0 #0000;\n  --tw-blur:  ;\n  --tw-brightness:  ;\n  --tw-contrast:  ;\n  --tw-grayscale:  ;\n  --tw-hue-rotate:  ;\n  --tw-invert:  ;\n  --tw-saturate:  ;\n  --tw-sepia:  ;\n  --tw-drop-shadow:  ;\n  --tw-backdrop-blur:  ;\n  --tw-backdrop-brightness:  ;\n  --tw-backdrop-contrast:  ;\n  --tw-backdrop-grayscale:  ;\n  --tw-backdrop-hue-rotate:  ;\n  --tw-backdrop-invert:  ;\n  --tw-backdrop-opacity:  ;\n  --tw-backdrop-saturate:  ;\n  --tw-backdrop-sepia:  ;\n}\n::backdrop{\n  --tw-border-spacing-x: 0;\n  --tw-border-spacing-y: 0;\n  --tw-translate-x: 0;\n  --tw-translate-y: 0;\n  --tw-rotate: 0;\n  --tw-skew-x: 0;\n  --tw-skew-y: 0;\n  --tw-scale-x: 1;\n  --tw-scale-y: 1;\n  --tw-pan-x:  ;\n  --tw-pan-y:  ;\n  --tw-pinch-zoom:  ;\n  --tw-scroll-snap-strictness: proximity;\n  --tw-gradient-from-position:  ;\n  --tw-gradient-via-position:  ;\n  --tw-gradient-to-position:  ;\n  --tw-ordinal:  ;\n  --tw-slashed-zero:  ;\n  --tw-numeric-figure:  ;\n  --tw-numeric-spacing:  ;\n  --tw-numeric-fraction:  ;\n  --tw-ring-inset:  ;\n  --tw-ring-offset-width: 0px;\n  --tw-ring-offset-color: #fff;\n  --tw-ring-color: rgb(59 130 246 / 0.5);\n  --tw-ring-offset-shadow: 0 0 #0000;\n  --tw-ring-shadow: 0 0 #0000;\n  --tw-shadow: 0 0 #0000;\n  --tw-shadow-colored: 0 0 #0000;\n  --tw-blur:  ;\n  --tw-brightness:  ;\n  --tw-contrast:  ;\n  --tw-grayscale:  ;\n  --tw-hue-rotate:  ;\n  --tw-invert:  ;\n  --tw-saturate:  ;\n  --tw-sepia:  ;\n  --tw-drop-shadow:  ;\n  --tw-backdrop-blur:  ;\n  --tw-backdrop-brightness:  ;\n  --tw-backdrop-contrast:  ;\n  --tw-backdrop-grayscale:  ;\n  --tw-backdrop-hue-rotate:  ;\n  --tw-backdrop-invert:  ;\n  --tw-backdrop-opacity:  ;\n  --tw-backdrop-saturate:  ;\n  --tw-backdrop-sepia:  ;\n}\n.sr-only{\n  position: absolute;\n  width: 1px;\n  height: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip: rect(0, 0, 0, 0);\n  white-space: nowrap;\n  border-width: 0;\n}\n.pointer-events-none{\n  pointer-events: none;\n}\n.visible{\n  visibility: visible;\n}\n.invisible{\n  visibility: hidden;\n}\n.collapse{\n  visibility: collapse;\n}\n.fixed{\n  position: fixed;\n}\n.absolute{\n  position: absolute;\n}\n.relative{\n  position: relative;\n}\n.sticky{\n  position: sticky;\n}\n.inset-0{\n  inset: 0px;\n}\n.bottom-0{\n  bottom: 0px;\n}\n.left-0{\n  left: 0px;\n}\n.right-0{\n  right: 0px;\n}\n.top-0{\n  top: 0px;\n}\n.-z-10{\n  z-index: -10;\n}\n.z-50{\n  z-index: 50;\n}\n.-mx-6{\n  margin-left: -1.5rem;\n  margin-right: -1.5rem;\n}\n.mx-auto{\n  margin-left: auto;\n  margin-right: auto;\n}\n.my-5{\n  margin-top: 1.25rem;\n  margin-bottom: 1.25rem;\n}\n.my-6{\n  margin-top: 1.5rem;\n  margin-bottom: 1.5rem;\n}\n.\\!mb-\\[32px\\]{\n  margin-bottom: 32px !important;\n}\n.-mr-4{\n  margin-right: -1rem;\n}\n.-mt-1{\n  margin-top: -0.25rem;\n}\n.mb-11{\n  margin-bottom: 2.75rem;\n}\n.mb-2{\n  margin-bottom: 0.5rem;\n}\n.mb-4{\n  margin-bottom: 1rem;\n}\n.me-2{\n  margin-inline-end: 0.5rem;\n}\n.ml-2{\n  margin-left: 0.5rem;\n}\n.ml-3{\n  margin-left: 0.75rem;\n}\n.ml-4{\n  margin-left: 1rem;\n}\n.ml-auto{\n  margin-left: auto;\n}\n.mr-3{\n  margin-right: 0.75rem;\n}\n.mt-1{\n  margin-top: 0.25rem;\n}\n.mt-1\\.5{\n  margin-top: 0.375rem;\n}\n.mt-2{\n  margin-top: 0.5rem;\n}\n.mt-28{\n  margin-top: 7rem;\n}\n.mt-4{\n  margin-top: 1rem;\n}\n.mt-5{\n  margin-top: 1.25rem;\n}\n.mt-6{\n  margin-top: 1.5rem;\n}\n.mt-8{\n  margin-top: 2rem;\n}\n.mt-9{\n  margin-top: 2.25rem;\n}\n.mt-\\[1px\\]{\n  margin-top: 1px;\n}\n.mt-\\[3px\\]{\n  margin-top: 3px;\n}\n.block{\n  display: block;\n}\n.inline-block{\n  display: inline-block;\n}\n.flex{\n  display: flex;\n}\n.table{\n  display: table;\n}\n.hidden{\n  display: none;\n}\n.h-2{\n  height: 0.5rem;\n}\n.h-4{\n  height: 1rem;\n}\n.h-4\\.5{\n  height: 1.125rem;\n}\n.h-\\[1px\\]{\n  height: 1px;\n}\n.h-\\[24px\\]{\n  height: 24px;\n}\n.h-\\[30px\\]{\n  height: 30px;\n}\n.h-\\[500px\\]{\n  height: 500px;\n}\n.h-full{\n  height: 100%;\n}\n.max-h-5{\n  max-height: 1.25rem;\n}\n.max-h-5\\.5{\n  max-height: 22px;\n}\n.max-h-full{\n  max-height: 100%;\n}\n.max-h-screen{\n  max-height: 100vh;\n}\n.min-h-12{\n  min-height: 3rem;\n}\n.min-h-\\[50px\\]{\n  min-height: 50px;\n}\n.min-h-large{\n  min-height: 56px;\n}\n.w-1{\n  width: 0.25rem;\n}\n.w-2{\n  width: 0.5rem;\n}\n.w-4{\n  width: 1rem;\n}\n.w-4\\.5{\n  width: 1.125rem;\n}\n.w-\\[24px\\]{\n  width: 24px;\n}\n.w-\\[30px\\]{\n  width: 30px;\n}\n.w-\\[950px\\]{\n  width: 950px;\n}\n.w-\\[998px\\]{\n  width: 998px;\n}\n.w-fit{\n  width: fit-content;\n}\n.w-full{\n  width: 100%;\n}\n.w-max{\n  width: max-content;\n}\n.min-w-132px{\n  min-width: 132px;\n}\n.min-w-fit{\n  min-width: fit-content;\n}\n.max-w-full{\n  max-width: 100%;\n}\n.max-w-lg{\n  max-width: 512px;\n}\n.max-w-md{\n  max-width: 448px;\n}\n.max-w-xxl{\n  max-width: 1144px;\n}\n.flex-1{\n  flex: 1 1 0%;\n}\n.flex-auto{\n  flex: 1 1 auto;\n}\n.flex-none{\n  flex: none;\n}\n.flex-shrink{\n  flex-shrink: 1;\n}\n.border-collapse{\n  border-collapse: collapse;\n}\n.translate-y-full{\n  --tw-translate-y: 100%;\n  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.transform{\n  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n@keyframes bounce{\n  0%, 100%{\n    transform: translateY(-25%);\n    animation-timing-function: cubic-bezier(0.8,0,1,1);\n  }\n  50%{\n    transform: none;\n    animation-timing-function: cubic-bezier(0,0,0.2,1);\n  }\n}\n.animate-bounce{\n  animation: bounce 1s infinite;\n}\n@keyframes fade-in-overlay{\n  0%{\n    opacity: 0;\n  }\n  100%{\n    opacity: 0.;\n  }\n}\n.animate-fade-in-overlay{\n  animation: fade-in-overlay 0.2s ease-in-out;\n}\n@keyframes fade-out-overlay{\n  0%{\n    opacity: 0.8;\n  }\n  100%{\n    opacity: 0;\n  }\n}\n.animate-fade-out-overlay{\n  animation: fade-out-overlay 0.1s ease-out;\n}\n@keyframes jump-in{\n  0%{\n    transform: scale(0.5);\n  }\n  100%{\n    transform: scale(1);\n  }\n}\n.animate-jump-in{\n  animation: jump-in 0.1s ease-in-out;\n}\n@keyframes jump-out{\n  0%{\n    transform: scale(1);\n  }\n  100%{\n    transform: scale(0.5);\n  }\n}\n.animate-jump-out{\n  animation: jump-out 0.1s ease-in-out;\n}\n.cursor-not-allowed{\n  cursor: not-allowed;\n}\n.cursor-pointer{\n  cursor: pointer;\n}\n.select-none{\n  user-select: none;\n}\n.resize{\n  resize: both;\n}\n.snap-y{\n  scroll-snap-type: y var(--tw-scroll-snap-strictness);\n}\n.flex-row{\n  flex-direction: row;\n}\n.flex-col{\n  flex-direction: column;\n}\n.flex-col-reverse{\n  flex-direction: column-reverse;\n}\n.flex-wrap{\n  flex-wrap: wrap;\n}\n.flex-nowrap{\n  flex-wrap: nowrap;\n}\n.\\!items-start{\n  align-items: flex-start !important;\n}\n.items-start{\n  align-items: flex-start;\n}\n.items-center{\n  align-items: center;\n}\n.justify-start{\n  justify-content: flex-start;\n}\n.justify-end{\n  justify-content: flex-end;\n}\n.justify-center{\n  justify-content: center;\n}\n.justify-between{\n  justify-content: space-between;\n}\n.gap-1{\n  gap: 0.25rem;\n}\n.gap-1\\.5{\n  gap: 0.375rem;\n}\n.gap-2{\n  gap: 0.5rem;\n}\n.gap-3{\n  gap: 0.75rem;\n}\n.gap-4{\n  gap: 1rem;\n}\n.gap-5{\n  gap: 1.25rem;\n}\n.gap-6{\n  gap: 1.5rem;\n}\n.gap-x-2{\n  column-gap: 0.5rem;\n}\n.gap-x-4{\n  column-gap: 1rem;\n}\n.gap-x-8{\n  column-gap: 2rem;\n}\n.gap-y-5{\n  row-gap: 1.25rem;\n}\n.space-x-2 > :not([hidden]) ~ :not([hidden]){\n  --tw-space-x-reverse: 0;\n  margin-right: calc(0.5rem * var(--tw-space-x-reverse));\n  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));\n}\n.overflow-auto{\n  overflow: auto;\n}\n.overflow-hidden{\n  overflow: hidden;\n}\n.overflow-clip{\n  overflow: clip;\n}\n.overflow-scroll{\n  overflow: scroll;\n}\n.overflow-y-scroll{\n  overflow-y: scroll;\n}\n.truncate{\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.whitespace-nowrap{\n  white-space: nowrap;\n}\n.break-all{\n  word-break: break-all;\n}\n.rounded{\n  border-radius: 0.25rem;\n}\n.rounded-full{\n  border-radius: 9999px;\n}\n.rounded-sm{\n  border-radius: 0.125rem;\n}\n.rounded-lg{\n  border-radius: 0.5rem !important;\n}\n.border{\n  border-width: 1px;\n}\n.border-0{\n  border-width: 0px;\n}\n.border-1\\.5{\n  border-width: 1.5px;\n}\n.border-b{\n  border-bottom-width: 1px;\n}\n.border-none{\n  border-style: none;\n}\n.\\!border-danger{\n  --tw-border-opacity: 1 !important;\n  border-color: rgb(211 85 99 / var(--tw-border-opacity)) !important;\n}\n.\\!border-gray-6{\n  --tw-border-opacity: 1 !important;\n  border-color: rgb(216 216 229 / var(--tw-border-opacity)) !important;\n}\n.\\!border-success{\n  --tw-border-opacity: 1 !important;\n  border-color: rgb(57 120 57 / var(--tw-border-opacity)) !important;\n}\n.border-gray-15 {\n  border-color: #D1D5DB;\n}\n.border-bw-1{\n  --tw-border-opacity: 1;\n  border-color: rgb(20 20 20 / var(--tw-border-opacity));\n}\n.border-danger{\n  --tw-border-opacity: 1;\n  border-color: rgb(211 85 99 / var(--tw-border-opacity));\n}\n.border-error{\n  --tw-border-opacity: 1;\n  border-color: rgb(185 14 10 / var(--tw-border-opacity));\n}\n.border-gray-2{\n  --tw-border-opacity: 1;\n  border-color: rgb(241 241 241 / var(--tw-border-opacity));\n}\n.border-success{\n  --tw-border-opacity: 1;\n  border-color: rgb(57 120 57 / var(--tw-border-opacity));\n}\n.border-transparent{\n  border-color: transparent;\n}\n.border-b-gray-2{\n  --tw-border-opacity: 1;\n  border-bottom-color: rgb(241 241 241 / var(--tw-border-opacity));\n}\n.bg-black{\n  --tw-bg-opacity: 1;\n  background-color: rgb(0 0 0 / var(--tw-bg-opacity));\n}\n.bg-bw-1{\n  --tw-bg-opacity: 1;\n  background-color: rgb(20 20 20 / var(--tw-bg-opacity));\n}\n.bg-danger{\n  --tw-bg-opacity: 1;\n  background-color: rgb(211 85 99 / var(--tw-bg-opacity));\n}\n.bg-gray-1{\n  --tw-bg-opacity: 1;\n  background-color: rgb(161 161 161 / var(--tw-bg-opacity));\n}\n.bg-gray-3{\n  --tw-bg-opacity: 1;\n  background-color: rgb(241 241 241 / var(--tw-bg-opacity));\n}\n.bg-gray-4{\n  --tw-bg-opacity: 1;\n  background-color: rgb(249 249 249 / var(--tw-bg-opacity));\n}\n.bg-primary{\n  --tw-bg-opacity: 1;\n  background-color: rgb(255 184 0 / var(--tw-bg-opacity));\n}\n.bg-white{\n  --tw-bg-opacity: 1;\n  background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n.bg-none{\n  background-image: none;\n}\n.bg-radio-normal{\n  background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23A1A1A1' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='12'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='11.25' fill='white'%3E%3C/circle%3E%3C/svg%3E\");\n}\n.bg-center{\n  background-position: center;\n}\n.bg-no-repeat{\n  background-repeat: no-repeat;\n}\n.fill-bw-1{\n  fill: #141414;\n}\n.fill-gray-1{\n  fill: #A1A1A1;\n}\n.fill-primary{\n  fill: #FFB800;\n}\n.stroke-bw-1{\n  stroke: #141414;\n}\n.stroke-primary{\n  stroke: #FFB800;\n}\n.p-4{\n  padding: 1rem;\n}\n.p-5{\n  padding: 1.25rem;\n}\n.p-6{\n  padding: 1.5rem;\n}\n.px-17\\.5{\n  padding-left: 4.375rem;\n  padding-right: 4.375rem;\n}\n.px-19{\n  padding-left: 4.75rem;\n  padding-right: 4.75rem;\n}\n.px-2{\n  padding-left: 0.5rem;\n  padding-right: 0.5rem;\n}\n.px-3{\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n}\n.px-5{\n  padding-left: 1.25rem;\n  padding-right: 1.25rem;\n}\n.px-6{\n  padding-left: 1.5rem;\n  padding-right: 1.5rem;\n}\n.px-7{\n  padding-left: 1.75rem;\n  padding-right: 1.75rem;\n}\n.px-8{\n  padding-left: 2rem;\n  padding-right: 2rem;\n}\n.px-9{\n  padding-left: 2.25rem;\n  padding-right: 2.25rem;\n}\n.px-\\[123px\\]{\n  padding-left: 123px;\n  padding-right: 123px;\n}\n.py-1{\n  padding-top: 0.25rem;\n  padding-bottom: 0.25rem;\n}\n.py-1\\.5{\n  padding-top: 0.375rem;\n  padding-bottom: 0.375rem;\n}\n.py-11{\n  padding-top: 2.75rem;\n  padding-bottom: 2.75rem;\n}\n.py-19{\n  padding-top: 4.75rem;\n  padding-bottom: 4.75rem;\n}\n.py-2{\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n}\n.py-2\\.8{\n  padding-top: 0.71875rem;\n  padding-bottom: 0.71875rem;\n}\n.py-4{\n  padding-top: 1rem;\n  padding-bottom: 1rem;\n}\n.py-5{\n  padding-top: 1.25rem;\n  padding-bottom: 1.25rem;\n}\n.py-8{\n  padding-top: 2rem;\n  padding-bottom: 2rem;\n}\n.\\!pt-0{\n  padding-top: 0px !important;\n}\n.pb-5{\n  padding-bottom: 1.25rem;\n}\n.pb-\\[26px\\]{\n  padding-bottom: 26px;\n}\n.pb-\\[14px\\]{\n  padding-bottom: 14px;\n}\n.pt-5{\n  padding-top: 1.25rem;\n}\n.pt-\\[18px\\]{\n  padding-top: 18px;\n}\n.pt-\\[22px\\]{\n  padding-top: 18px;\n}\n.pt-\\[26px\\]{\n  padding-top: 26px;\n}\n.pt-\\[24px\\]{\n  padding-top: 24px;\n}\n.pt-\\[28px\\]{\n  padding-top: 28px;\n}\n.pt-\\[31px\\]{\n  padding-top: 31px;\n}\n.pt-\\[34px\\]{\n  padding-top: 34px;\n}\n.pt-\\[42px\\]{\n  padding-top: 42px;\n}\n.pt-\\[42px\\]{\n  padding-top: 42px;\n}\n.text-left{\n  text-align: left;\n}\n.text-center{\n  text-align: center;\n}\n.align-middle{\n  vertical-align: middle;\n}\n.text-2xl{\n  font-size: 24px;\n  line-height: 30px;\n}\n.text-\\[0\\.875rem\\]{\n  font-size: 0.875rem;\n}\n.text-\\[1rem\\]{\n  font-size: 1rem;\n}\n.text-base{\n  font-size: 16px;\n  line-height: 24px;\n}\n.text-lg{\n  font-size: 18px;\n  line-height: 24px;\n}\n.text-sm{\n  font-size: 14px;\n  line-height: 24px;\n}\n.text-ssm{\n  font-size: 12px;\n  line-height: 20px;\n}\n.text-xl{\n  font-size: 20px;\n  line-height: 25px;\n}\n.\\!font-normal{\n  font-weight: 400 !important;\n}\n.font-bold{\n  font-weight: 700;\n}\n.font-medium{\n  font-weight: 500;\n}\n.font-normal{\n  font-weight: 400;\n}\n.font-semibold{\n  font-weight: 600;\n}\n.uppercase{\n  text-transform: uppercase;\n}\n.italic{\n  font-style: italic;\n}\n.leading-4{\n  line-height: 1rem;\n}\n.leading-4\\.5{\n  line-height: 17px;\n}\n.leading-6{\n  line-height: 1.5rem;\n}\n.leading-6\\.5{\n  line-height: 27px;\n}\n.text-bw-1{\n  --tw-text-opacity: 1;\n  color: rgb(20 20 20 / var(--tw-text-opacity));\n}\n.text-danger{\n  --tw-text-opacity: 1;\n  color: rgb(211 85 99 / var(--tw-text-opacity));\n}\n.text-gray-1{\n  --tw-text-opacity: 1;\n  color: rgb(161 161 161 / var(--tw-text-opacity));\n}\n.text-gray-2{\n  --tw-text-opacity: 1;\n  color: rgb(220 221 221 / var(--tw-text-opacity));\n}\n.text-gray-500{\n  --tw-text-opacity: 1;\n  color: rgb(107 114 128 / var(--tw-text-opacity));\n}\n.text-state-error{\n  --tw-text-opacity: 1;\n  color: rgb(185 14 10 / var(--tw-text-opacity));\n}\n.text-state-info{\n  --tw-text-opacity: 1;\n  color: rgb(57 100 234 / var(--tw-text-opacity));\n}\n.text-state-success{\n  --tw-text-opacity: 1;\n  color: rgb(57 120 57 / var(--tw-text-opacity));\n}\n.text-white{\n  --tw-text-opacity: 1;\n  color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n.underline{\n  text-decoration-line: underline;\n}\n.underline-offset-2{\n  text-underline-offset: 2px;\n}\n.antialiased{\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n}\n.opacity-50{\n  opacity: 0.5;\n}\n.opacity-60{\n  opacity: 0.6;\n}\n.opacity-80{\n  opacity: 0.8;\n}\n.shadow-box{\n  --tw-shadow: 0px 2px 4px 0px #00000014, 0px 0px 6px 0px #00000005;\n  --tw-shadow-colored: 0px 2px 4px 0px var(--tw-shadow-color), 0px 0px 6px 0px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-md{\n  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);\n  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-xl{\n  --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);\n  --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);\n  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.outline-none{\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n}\n.outline{\n  outline-style: solid;\n}\n.ring-0{\n  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n.ring-offset-0{\n  --tw-ring-offset-width: 0px;\n}\n.grayscale{\n  --tw-grayscale: grayscale(100%);\n  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.invert{\n  --tw-invert: invert(100%);\n  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.filter{\n  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.transition{\n  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n.transition-all{\n  transition-property: all;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n.transition-opacity{\n  transition-property: opacity;\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n  transition-duration: 150ms;\n}\n.duration-300{\n  transition-duration: 300ms;\n}\n.ease-in-out{\n  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n}\n.\\[animation-delay\\:-0\\.15s\\]{\n  animation-delay: -0.15s;\n}\n.\\[animation-delay\\:-0\\.3s\\]{\n  animation-delay: -0.3s;\n}\n@font-face {\n  font-family: techNology;\n  src: url(\"../assets/fonts/Technology/Technology.ttf\");\n}\n#globalLoader {\n  position: fixed;\n  z-index: 9999;\n  top: 50%;\n  left: 50%;\n  --tw-backdrop-blur: blur(4px);\n  backdrop-filter: var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia);\n  transform: translate(-50%, -50%);\n  width: 100%;\n  height: 100%;\n  justify-content: center;\n  align-items: center;\n  display: flex;\n}\n\n*:not(math, math *),\n*:not(math, math *)::after,\n*:not(math, math *)::before {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n  font-family: \"Roboto\", sans-serif;\n  -webkit-font-smoothing: antialiased;\n}\n\n* .sheet,\n* .iconfont::before,\n.sheet *,\n* .sheet,\n.sheet *::before {\n  font-family: unset;\n}\n\n* .fa,\n* .fa::before {\n  font-family: \"Font Awesome 5 Free\";\n}\n\nhtml {\n  font-size: 100%;\n}\n\nbody {\n  box-sizing: border-box;\n}\n\na {\n  color: inherit;\n  text-decoration: none;\n}\n\n*::-webkit-scrollbar{\n  height: 1rem;\n  width: 0.5rem;\n  border-width: 1px;\n  --tw-bg-opacity: 1;\n  background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n*::-webkit-scrollbar-track{\n  border-width: 1px;\n  --tw-bg-opacity: 1;\n  background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n*::-webkit-scrollbar-thumb{\n  border-width: 1px;\n  --tw-bg-opacity: 1;\n  background-color: rgb(126 130 153 / var(--tw-bg-opacity));\n}\n\nbody *::-webkit-scrollbar {\n  width: 17px;\n}\n\nbody *::-webkit-scrollbar-track {\n  background-color: transparent;\n}\n\nbody *::-webkit-scrollbar-thumb {\n  background-color: #d6dee1;\n  border-radius: 20px;\n  border: 6px solid transparent;\n  background-clip: content-box;\n}\n\nbody *::-webkit-scrollbar-thumb:hover {\n  background-color: #a8bbbf;\n}\n\n.menu-sub-dropdown{\n  display: none;\n}\n\n.active + .menu-sub-dropdown{\n  display: block;\n}\n\n.table-responsive tr:last-child td{\n  border-bottom-width: 0px;\n}\n\n.solution .topic p{\n  margin-bottom: 1.5rem;\n}\n\n.sapp-answer-wrapper{\n  display: flex;\n  flex-wrap: wrap;\n  row-gap: 1.5rem;\n  padding-top: 0.5rem;\n}\n.sapp-answer-wrapper .answer{\n  display: flex;\n  align-items: flex-start;\n  column-gap: 0.75rem;\n  overflow-wrap: break-word;\n}\n.sapp-answer-wrapper .answer .desciption{\n  flex: 1 1 0%;\n}\n\n.sapp-questions{\n  margin-bottom: 1rem;\n}\n.sapp-questions p{\n  margin-bottom: 0.5rem;\n  overflow-wrap: break-word;\n}\n\n.editor-wrap hr{\n  display: none;\n}\n.editor-wrap p{\n  margin-bottom: 0.5rem;\n  overflow-wrap: break-word;\n}\n.editor-wrap thead,\n.editor-wrap tbody,\n.editor-wrap tfoot,\n.editor-wrap td,\n.editor-wrap th {\n  border-width: 1px;\n  border-style: inset;\n  --tw-border-opacity: 1;\n  border-color: rgb(161 161 161 / var(--tw-border-opacity));\n\n}\n.editor-wrap tr {\n  border-style: initial;\n  border-width: initial;\n}\n.editor-wrap ol,\n.editor-wrap ul,\n.editor-wrap menu {\n  padding-inline-start: 40px !important;\n  list-style: auto;\n}\n.editor-wrap ul {\n  list-style-type: disc;\n}\n.editor-wrap hr{\n  --tw-border-opacity: 1;\n  border-color: rgb(220 221 221 / var(--tw-border-opacity));\n}\n.editor-wrap .sapp_overlay_video {\n  position: absolute;\n  right: 50%;\n  top: 50%;\n  transform: translate(50%, -50%);\n  z-index: 1;\n}\n.editor-wrap .sapp_overlay_video::before {\n  color: white;\n  content: \"\u25B6\";\n  opacity: 0.5;\n  cursor: pointer;\n  text-shadow: 0 3px black;\n  font-size: 50px;\n}\n\n.sapp-questions .sapp-input-preview {\n  border: 1px solid #dfdfdf;\n  border-radius: 2px;\n  padding: 8px;\n  width: 110px;\n  height: 35px;\n  margin-bottom: 4px;\n  --tw-bg-opacity: 1;\n  background-color: rgb(249 249 249 / var(--tw-bg-opacity));\n  text-align: center;\n  font-size: 16px;\n  line-height: 24px;\n  font-weight: 700;\n}\n\n.sapp-select--selectword-preview,\n.sapp-select--selectword-preview:focus{\n  min-width: 78px;\n  border-radius: 0.25rem;\n  --tw-ring-color: unset;\n  --tw-ring-offset-shadow: unset;\n  --tw-ring-shadow: unset;\n  -webkit-appearance: none;\n  -moz-appearance: none;\n  background: #f9f9f9;\n  background-image: url('data:image/svg+xml,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"8\" viewBox=\"0 0 12 8\" fill=\"non\"><path d=\"M10.9827 0.571289H9.97827C9.90996 0.571289 9.84568 0.604771 9.8055 0.659682L6.00059 5.90433L2.19568 0.659682C2.1555 0.604771 2.09121 0.571289 2.02291 0.571289H1.01845C0.931392 0.571289 0.880499 0.670396 0.931392 0.741379L5.65371 7.25165C5.82514 7.48736 6.17603 7.48736 6.34612 7.25165L11.0684 0.741379C11.1207 0.670396 11.0698 0.571289 10.9827 0.571289Z\" fill=\"%23DCDDDD\" /></svg>');\n  background-repeat: no-repeat;\n  background-position-x: 90%;\n  background-position-y: 13px;\n  border: 1px solid #dfdfdf;\n  border-radius: 2px;\n  padding-right: 1.5rem;\n  padding-left: 0.5rem;\n  width: 110px;\n  height: 35px;\n  max-width: 150px;\n  margin-bottom: 8px;\n}\n.sapp-select--selectword-preview:required:invalid,\n.sapp-select--selectword-preview:focus:required:invalid {\n  color: #dcdddd;\n}\n.sapp-select--selectword-preview option,\n.sapp-select--selectword-preview:focus option {\n  max-width: 100%;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n.sapp-select--selectword-preview option[value=\"\"][disabled],\n.sapp-select--selectword-preview:focus option[value=\"\"][disabled] {\n  display: none;\n}\n.sapp-select--selectword-preview option[disabled],\n.sapp-select--selectword-preview:focus option[disabled] {\n  color: #dcdddd;\n}\n.sapp-select--selectword-preview option,\n.sapp-select--selectword-preview:focus option {\n  color: #404041;\n}\n.sapp-select--selectword-preview.sapp-select-confirmed,\n.sapp-select--selectword-preview:focus.sapp-select-confirmed {\n  background-image: none;\n  text-align: center;\n  padding: 0;\n  --tw-bg-opacity: 1;\n  background-color: rgb(249 249 249 / var(--tw-bg-opacity));\n}\n\n.sapp-notched-container{\n  position: relative;\n  display: flex;\n  height: 100%;\n  flex: 1 1 0%;\n  align-items: center;\n  justify-content: flex-start;\n  overflow-wrap: break-word;\n  border-width: 1px;\n  border-style: solid;\n  --tw-border-opacity: 1;\n  border-color: rgb(216 216 229 / var(--tw-border-opacity));\n  --tw-bg-opacity: 1;\n  background-color: rgb(241 241 241 / var(--tw-bg-opacity));\n  padding: 1.25rem;\n  padding-inline-start: 2rem;\n}\n\n.sapp-notched-container:before {\n  content: \"\";\n  left: -1.2px;\n\n  width: 30px;\n  height: 30px;\n  transform: translate(-50%, 0) rotate(-135deg);\n  -webkit-clip-path: polygon(0px 0px, 0% 100%, 100% 100%);\n          clip-path: polygon(0px 0px, 0% 100%, 100% 100%);\n          position: absolute;\n          z-index: 0;\n          border-width: 1px;\n          border-style: solid;\n          --tw-border-opacity: 1;\n          border-color: rgb(216 216 229 / var(--tw-border-opacity));\n          --tw-bg-opacity: 1;\n          background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n\n.sapp-arrowed-container{\n  position: relative;\n  display: flex;\n  height: auto;\n  width: 40%;\n  align-items: center;\n  justify-content: flex-start;\n  overflow-wrap: break-word;\n  border-width: 1px;\n  border-style: solid;\n  --tw-border-opacity: 1;\n  border-color: rgb(216 216 229 / var(--tw-border-opacity));\n  --tw-bg-opacity: 1;\n  background-color: rgb(241 241 241 / var(--tw-bg-opacity));\n  padding: 1.25rem;\n}\n\n.sapp-arrowed-container:before {\n  border: 1px dashed rgb(224, 221, 227);\n  content: \"\";\n  right: 0;\n\n  width: 30px;\n  height: 30px;\n  transform: translate(50%, 0) rotate(-135deg);\n  -webkit-clip-path: polygon(0px 0px, 0% 100%, 100% 100%);\n          clip-path: polygon(0px 0px, 0% 100%, 100% 100%);\n          position: absolute;\n          right: 0px;\n          z-index: 0;\n          border-width: 1px;\n          border-style: solid;\n          --tw-border-opacity: 1;\n          border-color: rgb(216 216 229 / var(--tw-border-opacity));\n          --tw-bg-opacity: 1;\n          background-color: rgb(241 241 241 / var(--tw-bg-opacity));\n}\n\n.sapp-arrowed-container-corrects{\n  position: relative;\n  display: flex;\n  height: auto;\n  width: 48%;\n  align-items: center;\n  justify-content: flex-start;\n  overflow-wrap: break-word;\n  border-width: 1px;\n  border-style: solid;\n  --tw-border-opacity: 1;\n  border-color: rgb(57 120 57 / var(--tw-border-opacity));\n  --tw-bg-opacity: 1;\n  background-color: rgb(249 250 252 / var(--tw-bg-opacity));\n  padding: 1.25rem;\n}\n\n.sapp-arrowed-container-corrects:before {\n  border: 1px dashed rgb(224, 221, 227);\n  content: \"\";\n  right: 0;\n\n  width: 30px;\n  height: 30px;\n  transform: translate(50%, 0) rotate(-135deg);\n  -webkit-clip-path: polygon(0px 0px, 0% 100%, 100% 100%);\n          clip-path: polygon(0px 0px, 0% 100%, 100% 100%);\n          position: absolute;\n          right: 0px;\n          z-index: 10;\n          border-width: 1px;\n          border-style: solid;\n          --tw-border-opacity: 1;\n          border-color: rgb(57 120 57 / var(--tw-border-opacity));\n          --tw-bg-opacity: 1;\n          background-color: rgb(249 250 252 / var(--tw-bg-opacity));\n}\n\n.sapp-notched-container-corrects{\n  position: relative;\n  display: flex;\n  height: 100%;\n  flex: 1 1 0%;\n  align-items: center;\n  justify-content: flex-start;\n  overflow-wrap: break-word;\n  border-width: 1px;\n  border-left-width: 0px;\n  border-style: solid;\n  --tw-border-opacity: 1;\n  border-color: rgb(57 120 57 / var(--tw-border-opacity));\n  --tw-bg-opacity: 1;\n  background-color: rgb(249 250 252 / var(--tw-bg-opacity));\n  padding: 1.25rem;\n  padding-inline-start: 2rem;\n}\n\n.sapp-notched-container-corrects:before {\n  content: \"\";\n  left: -1.2px;\n\n  width: 30px;\n  height: 30px;\n  transform: translate(-50%, 0) rotate(-135deg);\n  -webkit-clip-path: polygon(0px 0px, 0% 100%, 100% 100%);\n          clip-path: polygon(0px 0px, 0% 100%, 100% 100%);\n          position: absolute;\n          z-index: 0;\n          border-style: solid;\n          --tw-border-opacity: 1;\n          border-color: rgb(57 120 57 / var(--tw-border-opacity));\n          --tw-bg-opacity: 1;\n          background-color: rgb(249 250 252 / var(--tw-bg-opacity));\n}\n\n.sapp-arrowed-container-incorrects{\n  position: relative;\n  display: flex;\n  height: auto;\n  width: 48%;\n  align-items: center;\n  justify-content: flex-start;\n  overflow-wrap: break-word;\n  border-width: 1px;\n  border-style: solid;\n  --tw-border-opacity: 1;\n  border-color: rgb(185 14 10 / var(--tw-border-opacity));\n  --tw-bg-opacity: 1;\n  background-color: rgb(249 250 252 / var(--tw-bg-opacity));\n  padding: 1.25rem;\n}\n\n.sapp-arrowed-container-incorrects:before {\n  border: 1px dashed rgb(224, 221, 227);\n  content: \"\";\n  right: 0;\n\n  width: 30px;\n  height: 30px;\n  transform: translate(50%, 0) rotate(-135deg);\n  -webkit-clip-path: polygon(0px 0px, 0% 100%, 100% 100%);\n          clip-path: polygon(0px 0px, 0% 100%, 100% 100%);\n          position: absolute;\n          right: 0px;\n          z-index: 10;\n          border-width: 1px;\n          border-style: solid;\n          --tw-border-opacity: 1;\n          border-color: rgb(185 14 10 / var(--tw-border-opacity));\n          --tw-bg-opacity: 1;\n          background-color: rgb(249 250 252 / var(--tw-bg-opacity));\n}\n\n.sapp-notched-container-incorrects{\n  position: relative;\n  display: flex;\n  height: 100%;\n  flex: 1 1 0%;\n  align-items: center;\n  justify-content: flex-start;\n  overflow-wrap: break-word;\n  border-width: 1px;\n  border-left-width: 0px;\n  border-style: solid;\n  --tw-border-opacity: 1;\n  border-color: rgb(185 14 10 / var(--tw-border-opacity));\n  --tw-bg-opacity: 1;\n  background-color: rgb(249 250 252 / var(--tw-bg-opacity));\n  padding: 1.25rem;\n  padding-inline-start: 2rem;\n}\n\n.sapp-notched-container-incorrects:before {\n  content: \"\";\n  left: -1.2px;\n\n  width: 30px;\n  height: 30px;\n  border: 0;\n  transform: translate(-50%, 0) rotate(-135deg);\n  -webkit-clip-path: polygon(0px 0px, 0% 100%, 100% 100%);\n          clip-path: polygon(0px 0px, 0% 100%, 100% 100%);\n          position: absolute;\n          z-index: 0;\n          border-style: solid;\n          --tw-border-opacity: 1;\n          border-color: rgb(185 14 10 / var(--tw-border-opacity));\n          --tw-bg-opacity: 1;\n          background-color: rgb(249 250 252 / var(--tw-bg-opacity));\n}\n\n.answer-area{\n  margin-top: 1rem;\n  display: flex;\n  flex-wrap: wrap;\n  gap: 1.25rem;\n}\n\n.answer-box {\n  border: 1px solid rgb(204, 204, 204);\n  background: rgb(243, 243, 243);\n  display: block;\n  padding: 0.5rem;\n}\n\n.sapp-input-dragNDrop:not(:has(.answer-box)){\n  position: relative;\n  display: inline-block;\n  min-height: 17px;\n  min-width: 100px;\n  border-width: 0px;\n  border-bottom-width: 1px;\n  --tw-border-opacity: 1;\n  border-color: rgb(107 114 128 / var(--tw-border-opacity));\n}\n\n.sapp-input-dragNDrop:not(:has(.answer-box))::after {\n  content: \" (\" attr(indexBox) \")\";\n  position: absolute;\n  bottom: 0;\n  left: 50%;\n  transform: translate(-50%, 20%);\n  background: white;\n  --tw-text-opacity: 1;\n  color: rgb(161 161 161 / var(--tw-text-opacity));\n}\n\n.sapp-input-dragNDrop{\n  margin-top: 0.5rem;\n  display: inline-block;\n}\n\n.sapp-input-dragNDrop-answer{\n  margin: 0.25rem;\n  display: inline-block;\n  min-width: 100px;\n  border-width: 1px;\n  --tw-border-opacity: 1;\n  border-color: rgb(107 114 128 / var(--tw-border-opacity));\n  --tw-bg-opacity: 1;\n  background-color: rgb(249 249 249 / var(--tw-bg-opacity));\n  padding: 0.25rem;\n}\n.sapp-input-dragNDrop-answer.corrects{\n  --tw-border-opacity: 1;\n  border-color: rgb(57 120 57 / var(--tw-border-opacity));\n  --tw-text-opacity: 1;\n  color: rgb(57 120 57 / var(--tw-text-opacity));\n}\n.sapp-input-dragNDrop-answer.wrongs{\n  --tw-border-opacity: 1;\n  border-color: rgb(185 14 10 / var(--tw-border-opacity));\n  --tw-text-opacity: 1;\n  color: rgb(185 14 10 / var(--tw-text-opacity));\n}\n\n.sapp-input-dragNDrop-empty{\n  display: inline-block;\n  min-width: 100px;\n  border-width: 0px;\n  text-align: center;\n}\n\n.sapp-questions-essay {\n  margin-bottom: 1rem;\n  font-family: Inter, sans-serif;\n  font-size: 16px;\n  line-height: 24px;\n  font-weight: 600;\n  --tw-text-opacity: 1;\n  color: rgb(20 20 20 / var(--tw-text-opacity));\n}\n\n.sapp-seprate-line-preview{\n  margin-inline-start: -1.5rem;\n  margin-bottom: 1rem;\n  height: 0.75rem;\n  width: calc(100% + 48px);\n  --tw-bg-opacity: 1;\n  background-color: rgb(241 241 241 / var(--tw-bg-opacity));\n}\n\n.sapp-upload-file-preview{\n  margin-bottom: 1rem;\n  display: flex;\n  align-items: center;\n  gap: 0.75rem;\n  padding-left: 0px;\n  padding-right: 0px;\n}\n\n.sapp-upload-button-preview{\n  display: flex;\n  width: max-content;\n  cursor: pointer;\n  align-items: center;\n  justify-content: space-evenly;\n  gap: 0.5rem;\n  border-width: 1px;\n  padding-left: 0.5rem;\n  padding-right: 0.5rem;\n  padding-top: 0px;\n  padding-bottom: 0px;\n}\n\n.resizable{\n  position: absolute;\n  top: 100px px;\n  left: 100px;\n  cursor: move;\n  --tw-bg-opacity: 1;\n  background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n\n.resizable .resizers {\n  display: none;\n  z-index: 500;\n  box-sizing: border-box;\n  height: 100%;\n  width: 100%;\n}\n\n.resizable.enable .resizers {\n  display: block;\n  border-width: 2px;\n  --tw-border-opacity: 1;\n  border-color: rgb(24 28 50 / var(--tw-border-opacity));\n}\n\n.resizable .resizers .resizer {\n  box-shadow: 0px 0px 0px 1px rgba(43, 59, 74, 0.3), 0px 0px 4px 1px rgba(57, 76, 96, 0.15);\n  position: absolute;\n  z-index: 500;\n  height: 12px;\n  width: 12px;\n  border-radius: 9999px;\n  --tw-bg-opacity: 1;\n  background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n\n.resizable .resizers .resizer.top-left{\n  left: -5px;\n  top: -5px;\n  cursor: nwse-resize;\n}\n\n.resizable .resizers .resizer.top-right{\n  right: -5px;\n  top: -5px;\n  cursor: nesw-resize;\n}\n\n.resizable .resizers .resizer.bottom-left{\n  left: -5px;\n  bottom: -5px;\n  cursor: nesw-resize;\n}\n\n.resizable .resizers .resizer.bottom-right{\n  right: -5px;\n  bottom: -5px;\n  cursor: nwse-resize;\n}\n\n.resizable .resizers .resizer.right{\n  right: -2.5px;\n  top: 50%;\n  height: 18px;\n  width: 6px;\n  --tw-translate-y: -50%;\n  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n  cursor: col-resize;\n  border-radius: 3px;\n}\n\n.resizable .resizers .resizer.left{\n  left: -2.5px;\n  top: 50%;\n  height: 18px;\n  width: 6px;\n  --tw-translate-y: -50%;\n  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n  cursor: col-resize;\n  border-radius: 3px;\n}\n\n.sapp-opacity-bg-border {\n  background-color: transparent;\n  border: none;\n  resize: none;\n}\n\n.sapp-text-area {\n  resize: none;\n  border: none;\n}\n\n.result {\n  height: 60px;\n  width: 100%;\n  --tw-bg-opacity: 1;\n  background-color: rgb(220 221 221 / var(--tw-bg-opacity));\n}\n\n.result p {\n  font-size: 40px;\n  margin: 5px;\n}\n\n.calculator-body{\n  display: flex;\n  height: calc(100% - 40px);\n  width: 100%;\n  flex-direction: column;\n}\n\n.button {\n  display: block;\n  flex: 1 1 0%;\n  --tw-bg-opacity: 1;\n  background-color: rgb(220 221 221 / var(--tw-bg-opacity));\n}\n\n.stream-player__progress-bar {\n\n  position: relative;\n}\n\n.stream-player__progress-bar::before {\n\n  position: absolute;\n\n  content: \"\u25CF\";\n\n  font-size: 12px;\n\n  color: white;\n\n  left: 10%;\n\n  top: 50%;\n\n  transform: translate(-50%, -50%);\n}\n\n.stream-player__progress-bar::after {\n\n  position: absolute;\n\n  content: \"\u2605\";\n\n  font-size: 12px;\n\n  color: yellow;\n\n  right: 20%;\n\n  top: 50%;\n\n  transform: translate(50%, -50%);\n}\n\n.required:after {\n  content: \"*\";\n  position: relative;\n  font-size: inherit;\n  color: #d35563;\n  padding-left: 0.25rem;\n  font-weight: 700;\n}\n\n.sapp-hover-device-item:hover .sapp-logo{\n  --tw-border-opacity: 1;\n  border-color: rgb(255 184 0 / var(--tw-border-opacity));\n  --tw-bg-opacity: 1;\n  background-color: rgb(255 250 240 / var(--tw-bg-opacity));\n}\n.sapp-hover-device-item:hover .logo {\n  fill: #ffb800;\n}\n\n.sapp-disable-button {\n  position: relative;\n}\n.sapp-disable-button ::after {\n  content: \"\";\n  --tw-bg-opacity: 1;\n  background-color: rgb(241 241 241 / var(--tw-bg-opacity));\n  opacity: 0.6;\n  width: calc(100% - 2px);\n  height: 100%;\n  position: absolute;\n  left: 1px;\n}\n\n.sapp-separateLine :not(:last-child){\n  border-bottom-width: 1px;\n  --tw-border-opacity: 1;\n  border-color: rgb(249 249 249 / var(--tw-border-opacity));\n}\n\n.active .word_icon path {\n  fill: #295496;\n}\n.active .excel_icon path {\n  fill: #1d5d36;\n}\n\n.word_icon path {\n  fill: #dcdddd;\n}\n\ntextarea.is-invalid:focus {\n  --tw-ring-color: #d35563;\n  --tw-ring-offset-color: #d35563;\n}\n.min-w-\\[63px\\] {\n  min-width: 63px;\n}\n\n.max-w-40 {\n  max-width: 10rem;\n}\n\n.hover-transition-font-weight {\n  transition: font-weight 0.1s ease;\n}\n\n.ant-tooltip-inner {\n  color: #404041 !important;\n}\n\n.first-letter\\:uppercase::first-letter{\n  text-transform: uppercase;\n}\n\n.before\\:\\!border-gray-6::before{\n  content: var(--tw-content);\n  --tw-border-opacity: 1 !important;\n  border-color: rgb(216 216 229 / var(--tw-border-opacity)) !important;\n}\n\n.checked\\:bg-bw-1:checked{\n  --tw-bg-opacity: 1;\n  background-color: rgb(20 20 20 / var(--tw-bg-opacity));\n}\n\n.checked\\:bg-primary:checked{\n  --tw-bg-opacity: 1;\n  background-color: rgb(255 184 0 / var(--tw-bg-opacity));\n}\n\n.checked\\:bg-state-error:checked{\n  --tw-bg-opacity: 1;\n  background-color: rgb(185 14 10 / var(--tw-bg-opacity));\n}\n\n.checked\\:bg-state-success:checked{\n  --tw-bg-opacity: 1;\n  background-color: rgb(57 120 57 / var(--tw-bg-opacity));\n}\n\n.checked\\:bg-radio-default-checked:checked{\n  background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23141414' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='12'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='11.25' fill='white'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='6'%3E%3C/circle%3E%3C/svg%3E\");\n}\n\n.checked\\:bg-radio-error-checked:checked{\n  background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23D35563' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='12'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='11.25' fill='white'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='6'%3E%3C/circle%3E%3C/svg%3E\");\n}\n\n.checked\\:bg-radio-success-checked:checked{\n  background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23008000' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='12'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='11.25' fill='white'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='6'%3E%3C/circle%3E%3C/svg%3E\");\n}\n\n.checked\\:text-transparent:checked{\n  color: transparent;\n}\n\n.hover\\:border-gray-1:hover{\n  --tw-border-opacity: 1;\n  border-color: rgb(161 161 161 / var(--tw-border-opacity));\n}\n\n.hover\\:bg-danger-2:hover{\n  --tw-bg-opacity: 1;\n  background-color: rgb(221 67 57 / var(--tw-bg-opacity));\n}\n\n.hover\\:bg-gray-2:hover{\n  --tw-bg-opacity: 1;\n  background-color: rgb(220 221 221 / var(--tw-bg-opacity));\n}\n\n.hover\\:bg-primary-2:hover{\n  --tw-bg-opacity: 1;\n  background-color: rgb(255 200 58 / var(--tw-bg-opacity));\n}\n\n.hover\\:fill-primary:hover{\n  fill: #FFB800;\n}\n\n.hover\\:text-gray-1:hover{\n  --tw-text-opacity: 1;\n  color: rgb(161 161 161 / var(--tw-text-opacity));\n}\n\n.hover\\:text-primary:hover{\n  --tw-text-opacity: 1;\n  color: rgb(255 184 0 / var(--tw-text-opacity));\n}\n\n.hover\\:text-white:hover{\n  --tw-text-opacity: 1;\n  color: rgb(255 255 255 / var(--tw-text-opacity));\n}\n\n.hover\\:underline:hover{\n  text-decoration-line: underline;\n}\n\n.checked\\:hover\\:bg-bw-1:hover:checked{\n  --tw-bg-opacity: 1;\n  background-color: rgb(20 20 20 / var(--tw-bg-opacity));\n}\n\n.checked\\:hover\\:bg-primary:hover:checked{\n  --tw-bg-opacity: 1;\n  background-color: rgb(255 184 0 / var(--tw-bg-opacity));\n}\n\n.checked\\:hover\\:bg-state-error:hover:checked{\n  --tw-bg-opacity: 1;\n  background-color: rgb(185 14 10 / var(--tw-bg-opacity));\n}\n\n.checked\\:hover\\:bg-state-success:hover:checked{\n  --tw-bg-opacity: 1;\n  background-color: rgb(57 120 57 / var(--tw-bg-opacity));\n}\n\n.checked\\:hover\\:bg-radio-default-checked:hover:checked{\n  background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23141414' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='12'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='11.25' fill='white'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='6'%3E%3C/circle%3E%3C/svg%3E\");\n}\n\n.checked\\:hover\\:bg-radio-error-checked:hover:checked{\n  background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23D35563' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='12'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='11.25' fill='white'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='6'%3E%3C/circle%3E%3C/svg%3E\");\n}\n\n.checked\\:hover\\:bg-radio-success-checked:hover:checked{\n  background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23008000' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='12'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='11.25' fill='white'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='6'%3E%3C/circle%3E%3C/svg%3E\");\n}\n\n.focus\\:outline-none:focus{\n  outline: 2px solid transparent;\n  outline-offset: 2px;\n}\n\n.focus\\:ring-0:focus{\n  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n\n.focus\\:ring-offset-0:focus{\n  --tw-ring-offset-width: 0px;\n}\n\n.checked\\:focus\\:bg-bw-1:focus:checked{\n  --tw-bg-opacity: 1;\n  background-color: rgb(20 20 20 / var(--tw-bg-opacity));\n}\n\n.checked\\:focus\\:bg-primary:focus:checked{\n  --tw-bg-opacity: 1;\n  background-color: rgb(255 184 0 / var(--tw-bg-opacity));\n}\n\n.checked\\:focus\\:bg-state-error:focus:checked{\n  --tw-bg-opacity: 1;\n  background-color: rgb(185 14 10 / var(--tw-bg-opacity));\n}\n\n.checked\\:focus\\:bg-state-success:focus:checked{\n  --tw-bg-opacity: 1;\n  background-color: rgb(57 120 57 / var(--tw-bg-opacity));\n}\n\n.checked\\:focus\\:bg-radio-default-checked:focus:checked{\n  background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23141414' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='12'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='11.25' fill='white'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='6'%3E%3C/circle%3E%3C/svg%3E\");\n}\n\n.checked\\:focus\\:bg-radio-error-checked:focus:checked{\n  background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23D35563' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='12'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='11.25' fill='white'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='6'%3E%3C/circle%3E%3C/svg%3E\");\n}\n\n.checked\\:focus\\:bg-radio-success-checked:focus:checked{\n  background-image: url(\"data:image/svg+xml,%3Csvg viewBox='0 0 24 24' fill='%23008000' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='12' cy='12' r='12'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='11.25' fill='white'%3E%3C/circle%3E%3Ccircle cx='12' cy='12' r='6'%3E%3C/circle%3E%3C/svg%3E\");\n}\n\n.disabled\\:cursor-not-allowed:disabled{\n  cursor: not-allowed;\n}\n\n.disabled\\:bg-danger-2:disabled{\n  --tw-bg-opacity: 1;\n  background-color: rgb(221 67 57 / var(--tw-bg-opacity));\n}\n\n.disabled\\:bg-gray-2:disabled{\n  --tw-bg-opacity: 1;\n  background-color: rgb(220 221 221 / var(--tw-bg-opacity));\n}\n\n.disabled\\:bg-primary-2:disabled{\n  --tw-bg-opacity: 1;\n  background-color: rgb(255 200 58 / var(--tw-bg-opacity));\n}\n\n.disabled\\:bg-white:disabled{\n  --tw-bg-opacity: 1;\n  background-color: rgb(255 255 255 / var(--tw-bg-opacity));\n}\n\n.disabled\\:text-gray-2:disabled{\n  --tw-text-opacity: 1;\n  color: rgb(220 221 221 / var(--tw-text-opacity));\n}\n\n.disabled\\:opacity-60:disabled{\n  opacity: 0.6;\n}\n\n.group:hover .group-hover\\:fill-primary{\n  fill: #FFB800;\n}\n\n.group:hover .group-hover\\:stroke-primary{\n  stroke: #FFB800;\n}\n\n@media (min-width: 640px){\n  .sm\\:justify-end{\n    justify-content: flex-end;\n  }\n}\n\n@media (min-width: 768px){\n  .md\\:px-19{\n    padding-left: 4.75rem;\n    padding-right: 4.75rem;\n  }\n  .md\\:px-6{\n    padding-left: 1.5rem;\n    padding-right: 1.5rem;\n  }\n  .md\\:pb-5{\n    padding-bottom: 1.25rem;\n  }\n  .md\\:pt-5{\n    padding-top: 1.25rem;\n  }\n}\n\n@media (min-width: 1280px){\n  .xl\\:py-8{\n    padding-top: 2rem;\n    padding-bottom: 2rem;\n  }\n}\n\n@media (prefers-color-scheme: dark){\n  .dark\\:invert{\n    --tw-invert: invert(100%);\n    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n  }\n}\n\n.editor-wrap img.Wirisformula {\n  width: auto !important;\n  display: unset !important;\n  max-width: max-content;\n}\n\n.sapp-min-w-100px {\n  min-width: 100px !important;\n}\n\n// Graded feature\n.sapp-comment-highlight {\n  position: relative;\n  background-color: #fff1cc;\n}\n\n.sapp-comment-highlight {\n  position: relative;\n  background-color: #fff1cc;\n  cursor: pointer;\n}\n\n.sapp-grading-highlight {\n  position: relative;\n  text-decoration: underline #397839;\n}\n\n.sapp-comment-highlight *,\n.sapp-grading-highlight * {\n  user-select: none;\n}\n\n.sapp-grade-tooltip {\n  position: absolute;\n  bottom: 24px;\n  height: 30px;\n  min-width: 30px;\n  width: max-content;\n  left: 50%;\n  transform: translateX(-50%);\n  background-color: #397839;\n  color: #fff;;\n  padding: 7px;\n  font-size: 16px;\n  font-weight: 500;\n  line-height: 16px;\n  text-align: center;\n  border-radius: 4px;\n  z-index: 20;\n}\n\n.sapp-grade-tooltip::after {\n    content: '';\n    position: absolute;\n    bottom: -12px;\n    left: 50%;\n    transform: translateX(-50%);\n    border-width: 6px;\n    width: 14px;\n    height: 7px;\n    border-style: solid;\n    border-color: #397839 transparent transparent transparent;\n}\n\n.sapp-grade-questions-content {\n  font-family: 'Roboto';\n  font-size: 16px;\n  font-weight: 400;\n  line-height: 24px;\n}\n\n.max-h-500 {\n  max-height: 500px;\n}\n\n.sapp-grade-questions-content table {\n  border-color: #dcdddd;\n  width: max-content;\n}\n\n.flex-col {\n  flex-direction: column\n}\n\n.d-flex {\n  display: flex\n}\n\n.p-10 {\n  padding: 2.5rem;\n}\n\n.mt-3 {\n  margin-top: 2rem\n}\n\n.grow-1 {\n  flex-grow: 1;\n}\n\n.comment-sidebar {\n min-width: 370px;\n box-shadow: -1px 0px 4px 0px #00000014;\n padding: 30px 20px;\n min-height: calc(-48px + 100vh);\n overflow: auto\n}\n\n.comment-box {\n  background-color: #F9F9F9;\n  position: relative;\n}\n\n.comment-box-comment {\n  padding: 20px 10px;\n}\n\n.comment-box-grade {\n  padding: 20px 10px;\n  position: relative;\n}\n\n\n.comment-box-grade.show-after::after {\n content: '';\n  width: 80%;\n  height: 1px;\n  background-color: #DCDDDD;\n  position: absolute;\n  top: 0;\n  left:10%;\n}\n\n.comment-box:hover, .comment-box-hover {\n  background-color: #FFF;\n  box-shadow: 0px 1px 10px 4px #00000014;\n  cursor:pointer;\n  transition: background-color 0.5s ease;\n  transition: box-shadow 0.5s ease;\n}\n\n.comment-box:hover > .comment-box-grade > p:last-child, .comment-box-grade-hover > p:last-child {\n  color: #397839;\n  font-weight: 500;\n}\n\n.active-comment {\n  display: block\n}\n\n.hide-comment {\n  display: block\n}\n\n.pl-2{\n  padding-left: 0.5rem\n}\n\n@media (max-width: 1204px) {\n  .comment-sidebar {\n    min-width: 370px;\n    box-shadow: -1px 0px 4px 0px #00000014;\n    padding: 30px 20px;\n    min-height: calc(-48px + 100vh);\n    overflow: auto;\n    position: fixed;\n    right: 0;\n    top: 0;\n    bottom: 0;\n    z-index: 100;\n    background:white;\n    display: none\n  }\n\n  .active-comment {\n    display: block;\n    transition: display 0.5s ease;\n  }\n\n  .hide-comment {\n    display: none;\n    transition: display 0.5s ease;\n  }\n}\n\n.highlight-marker {\n    background-color: #fbc22b !important;\n}\n\n.header-container {\n  display: grid;\n  grid-template-columns: auto auto\n}\n\n.min-h-screen {\n  min-height: 100vh\n}\n\n.h-fit {\n  height: fit-content\n}\n\n.h-screen {\n  height: 100vh\n}\n\n.items-center {\n  align-item: center\n}\n\n.items-start {\n  align-item: start\n}\n\n.unsubmitted-state {\n  color: #c9302c\n}\n\n.submitted-state {\n  color: #397839;\n}\n\n.text-gray {\n  color: #A1A1A1;\n}\n\n.tooltip-container {\n  position: relative;\n  display: inline-block;\n  padding: 4px 0px;\n}\n\n.tooltip-text {\n  visibility: hidden;\n  position: absolute;\n  z-index: 10;\n  background-color: white;\n  color: #1f2937; /* Tailwind's text-gray-800 */\n  border: 1px solid #e5e7eb; /* Tailwind's border-gray-200 */\n  border-radius: 8px;\n  padding: 15px;\n  min-width: 300px;\n  text-align: left;\n  white-space: normal;\n  word-wrap: break-word;\n  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);\n  top: 100%;\n  left: 0;\n  transition: transform 0.3s ease;\n  transform: translateY(10px);\n  opacity: 0;\n}\n\n.tooltip-text::after {\n  content: '';\n  position: absolute;\n  background-color: white;\n  top: -5px;\n  left: 20px;\n  width: 10px;\n  height: 10px;\n  transform: rotate(45deg);\n  border-top: 1px solid rgba(0, 0, 0, 0.1);\n  border-left: 1px solid rgba(0, 0, 0, 0.1);\n}\n\n.tooltip-container:hover .tooltip-text {\n  visibility: visible;\n  opacity: 1;\n  transform: translateY(0);\n}\n\n/* K\u00EDch th\u01B0\u1EDBc h\u1ED9p */\n.w-200px {\n  width: 200px;\n}\n\n.min-w-200px {\n  min-width: 200px;\n}\n\n.max-w-400px {\n  max-width: 400px;\n}\n\n/* Vi\u1EC1n v\u00E0 bo g\u00F3c */\n.border {\n  border-width: 1px;\n}\n\n.border-gray-300 {\n  border-color: #d1d5db;\n}\n\n.rounded {\n  border-radius: 0.25rem;\n}\n\n/* Hi\u1EC3n th\u1ECB v\u00E0 v\u1ECB tr\u00ED */\n.relative {\n  position: relative;\n}\n\n.inline-block {\n  display: inline-block;\n}\n\n.absolute {\n  position: absolute;\n}\n\n/* D\u1ECBch chuy\u1EC3n */\n.translate-x-1px {\n  transform: translateX(-1px);\n}\n\n/* V\u1ECB tr\u00ED tuy\u1EC7t \u0111\u1ED1i t\u00F9y ch\u1EC9nh */\n.top-44px {\n  top: 44px;\n}\n\n.left-0 {\n  left: 0;\n}\n\n/* Z-index */\n.z-9 {\n  z-index: 9;\n}\n\n/* M\u00E0u n\u1EC1n v\u00E0 \u0111\u1ED5 b\u00F3ng */\n.bg-white {\n  background-color: white;\n}\n\n.shadow-lg {\n  box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);\n}\n\n/* K\u00EDch th\u01B0\u1EDBc khung ch\u1ECDn */\n.max-h-300px {\n  max-height: 300px;\n}\n\n.overflow-y-auto {\n  overflow-y: auto;\n}\n\n/* Padding */\n.px-3 {\n  padding-left: 0.75rem;\n  padding-right: 0.75rem;\n}\n\n.py-2 {\n  padding-top: 0.5rem;\n  padding-bottom: 0.5rem;\n}\n\n/* Flexbox c\u0103n ch\u1EC9nh */\n.flex {\n  display: flex;\n}\n\n.items-center {\n  align-items: center;\n}\n\n.justify-between {\n  justify-content: space-between;\n}\n\n/* Hi\u1EC7u \u1EE9ng hover */\n.option:hover {\n  background-color: #e5e7eb;\n}\n\n/* Con tr\u1ECF chu\u1ED9t */\n.cursor-pointer {\n  cursor: pointer;\n}\n\n/* M\u00E0u ch\u1EEF */\n.text-gray-500 {\n  color: #6b7280;\n}\n\n/* Margin tr\u00E1i */\n.ml-2 {\n  margin-left: 0.5rem;\n}\n\n.base-box {\n  position: relative;\n  display: inline-block;\n  border: 1px solid #d1d5db;\n  border-radius: 0.5rem;\n  background-color: white;\n}\n\n.size-box {\n  width: 200px;\n  max-width: 400px;\n  min-width: 200px;\n}\n\n.min-w-24px {\n  min-width: 24px;\n}\n\n.font-semibold {\n  font-weight: 600;\n  }\n";

package/dist/styles/base/colors.d.ts

@@ -0,0 +1 @@
+export declare const colors: import("styled-components").FlattenSimpleInterpolation;

package/dist/styles/base/typography.d.ts

@@ -0,0 +1 @@
+export declare const typography: import("styled-components").FlattenSimpleInterpolation;

package/dist/styles/base/utils.d.ts

@@ -0,0 +1 @@
+export declare const utilities: import("styled-components").FlattenSimpleInterpolation;

package/dist/styles/global-styles.d.ts

@@ -0,0 +1 @@
+export declare const GlobalStyles: import("styled-components").GlobalStyleComponent<{}, import("styled-components").DefaultTheme>;

package/dist/styles/index.d.ts

@@ -0,0 +1 @@
+export declare const styles: import("styled-components").FlattenSimpleInterpolation;

package/dist/styles/legacy/button.d.ts

@@ -0,0 +1 @@
+export declare const buttonStyle: import("styled-components").FlattenSimpleInterpolation;