.catalog::-webkit-scrollbar,.catalog-1::-webkit-scrollbar {
    width: 0
}

.catalog-wrapper {
    min-width: 260px;
    width: 260px;
    background: #f7f8f9;
    max-height: calc(100vh - 10px);
    position: sticky;
    top: 64px;
}

.catalog-1 {
    height: calc(100vh - 10px);
    box-sizing: border-box;
    padding-bottom: 12px;
    display: flex;
    flex-direction: column;
    overflow-y: scroll;
}

.catalog-1 .title {
    margin: 30px 0 10px 20px;
    line-height: 24px;
    font-size: 16px;
    font-weight: 500;
    color: #0e1421;
}

.catalog {
    display: flex;
    flex-direction: column;
}

.catalog .sub-items{
    display:none;
}

.item {
    position: relative;
    margin: 0 10px;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
    min-height: 44px;
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    cursor: pointer;
}

.item:hover {
    background: rgb(131 121 242 / 10%);
}

.item .icon {
    min-width: 16px;
    margin-top: 14px;
    width: 16px;
    height: 16px;
    color: #8278f0;
}

.toolTip {
    position: relative;
}

.item .text {
    margin: 12px 10px 12px 6px;
    flex-grow: 1;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #0e1421;
    overflow: hidden;
    /*text-overflow: ellipsis;
    overflow-wrap: anywhere;*/
}

.item .indicator {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 4px;
    background: #F7F8F9;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.item:hover .indicator {
    background: #8278f0;
}

.link {
    text-decoration: none;
}

.item-selected {
    background: rgb(131 121 242 / 10%);
}
.item-selected .text {
    color: #8278f0;
    font-weight: 500
}
.item-selected .indicator {
    background: #8278f0;
}


/**/
.main {
    padding-top: 24px;
    display: flex;
    flex-direction: row;
    position: relative;
    max-width:1200px;
    margin:auto;
}

.main {
    font-family: Segoe UI Symbol;
}

.main .doc {
    font-size:16px;
    max-width: 900px;
    margin: 0 auto;
    flex-grow: 1;
    padding: 0px 10px 0 0;
    user-select: text;
    box-sizing: border-box;
    width: 0;
    word-break: break-all;
}

.main .doc .title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.5;
    color: #0e1421;
    word-break: normal;
    overflow-wrap: anywhere;
}

.main .doc .time {
    font-size: 14px;
    font-weight: 400;
    line-height: 28px;
    color: #758296;
    margin-right: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.main .doc .editor-content {
    border-radius: 0;
    border-top: 0;
    color: #000;
    background-color: #fff;
    flex-grow: 1;
    word-break: normal;
    overflow-wrap: break-word;
}
.main .doc .editor-content>* {
    box-sizing: border-box;
}
.main .doc .editor-content a {
    color: #8278f0;
    text-decoration: none !important;
}
.main .doc .editor-content h1, .main .doc .editor-content h2, .main .doc .editor-content h3, .main .doc .editor-content h4, .main .doc .editor-content h5, .main .doc .editor-content h6 {
    margin: 24px 0 0;
    font-weight: 700;
    line-height: 1.4;
    color: #262626;
}
.main .doc .editor-content h1 {
    font-size: 28px;
}

.editor-content h1,
.editor-content h2,
.editor-content h3,
.editor-content h4,
.editor-content h5,
.editor-content h6 {
    margin: 24px 0 0;
    font-weight: 700;
    line-height: 1.4;
    color: #262626
}
.editor-content h1 {
    font-size: 28px
}
.editor-content h2 {
    font-size: 24px
}
.editor-content h3 {
    font-size: 20px
}
.editor-content h4 {
    font-size: 18px
}
.editor-content h5 {
    font-size: 16px
}
.editor-content h6 {
    font-size: 14px
}
.editor-content p {
    margin: 16px 0 0;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.75;
    min-height: 28px;
    color: #333;
    white-space: normal
}
.editor-content p img.ProseMirror-separator {
    display: none !important
}
.editor-content p .ProseMirror-trailingBreak:not(:first-child) {
    height: 0;
    display: none
}
.editor-content p img.ProseMirror-separator+.ProseMirror-trailingBreak {
    display: inline
}
.editor-content mark {
    color: inherit;
    display: inline-block
}
.editor-content div[class*=language-] {
    border-radius: 8px;
    margin: 16px 0
}
.editor-content div[class*=language-] {
    position: relative;
    margin: 16px 0;
    background-color: #282c34;
    overflow-x: auto;
    transition: background-color .5s
}
.editor-content [class*=language-]>button.copy {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 3;
    display: block;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    width: 40px;
    height: 40px;
    background-color: #292d3e;
    opacity: 0;
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' height='20' width='20' stroke='rgba(128,128,128,1)' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2M9 5a2 2 0 0 0 2 2h2a2 2 0 0 0 2-2M9 5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2'/%3E%3C/svg%3E");
    background-position: 50%;
    background-size: 20px;
    background-repeat: no-repeat;
    transition: opacity .4s;
    border: none
}
.editor-content [class*=language-]:hover>button.copy,
.editor-content [class*=language-]>button.copy:focus {
    opacity: 1
}
.editor-content [class*=language-]>button.copy.copied,
.editor-content [class*=language-]>button.copy:hover.copied {
    border-radius: 0 4px 4px 0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' height='20' width='20' stroke='rgba(128,128,128,1)' stroke-width='2' viewBox='0 0 24 24'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M9 5H7a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V7a2 2 0 0 0-2-2h-2M9 5a2 2 0 0 0 2 2h2a2 2 0 0 0 2-2M9 5a2 2 0 0 1 2-2h2a2 2 0 0 1 2 2m-6 9 2 2 4-4'/%3E%3C/svg%3E")
}
.editor-content [class*=language-]>button.copy.copied:before,
.editor-content [class*=language-]>button.copy:hover.copied:before {
    position: relative;
    left: -70px;
    top: -1px;
    display: block;
    border-radius: 4px 0 0 4px;
    padding-top: 12px;
    width: 64px;
    height: 28px;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    background-color: #292d3e;
    color: #ebebeb99;
    white-space: nowrap;
    content: "Copied"
}
.editor-content [class*=language-]>span.lang {
    position: absolute;
    top: 10px;
    right: 12px;
    z-index: 2;
    font-size: 12px;
    font-weight: 500;
    color: #ebebeb61;
    transition: color .4s, opacity .4s
}
.editor-content [class*=language-]:hover>button.copy+span.lang,
.editor-content [class*=language-]>button.copy:focus+span.lang {
    opacity: 0
}
.editor-content div[class*=language-].line-numbers-mode {
    padding-left: 32px
}
.editor-content div[class*=language-].line-numbers-mode pre {
    padding-left: 16px
}
.editor-content div[class*=language-].line-numbers-mode pre:hover::-webkit-scrollbar-thumb {
    background: #D3D3D3;
    transition: all .3s;
    border-radius: 8px
}
.editor-content div[class*=language-].line-numbers-mode pre::-webkit-scrollbar {
    height: 8px
}
.editor-content [class*=language-] code {
    color: #f0f8ff
}
.editor-content [class*=language-] pre {
    position: relative;
    z-index: 1;
    margin: 0;
    padding: 16px;
    background: transparent;
    overflow-x: auto;
    line-height: 1.5;
    text-align: left;
    white-space: pre;
    word-spacing: normal;
    word-break: normal;
    word-wrap: normal;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
    -webkit-hyphens: none;
    -moz-hyphens: none;
    -ms-hyphens: none;
    hyphens: none
}
.editor-content .line-numbers-wrapper {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 3;
    border-right: 1px solid rgba(84, 84, 84, .4784313725);
    padding-top: 16px;
    width: 32px;
    text-align: center;
    line-height: 1.5;
    font-size: 16px;
    color: #ebebeb61;
    transition: border-color .5s, color .5s
}
.editor-content code {
    line-height: 1.5;
    font-family: source-code-pro, Menlo, Monaco, Consolas, Courier New, monospace
}
.editor-content p code,
.editor-content li>code,
.editor-content h1>code,
.editor-content h2>code,
.editor-content h3>code,
.editor-content h4>code,
.editor-content h5>code,
.editor-content h6>code,
.editor-content td>code,
.editor-content th>code {
    color: #262626;
    background-color: #eff0f0;
    line-height: 1.5;
    display: inline-block;
    padding: 0 4px;
    border-radius: 2px;
    font-family: source-code-pro, Menlo, Monaco, Consolas, Courier New, monospace
}
.editor-content p span {
    font-size: 16px
}
.editor-content hr {
    border-top-color: #dfe1e7;
    margin-top: 30px;
    margin-bottom: 30px
}
.editor-content table {
    margin: 16px 0 0;
    border: 1px solid #dfe2e5;
    border-collapse: collapse;
    font-size: 16px;
    table-layout: fixed;
    overflow: hidden
}
.editor-content table tbody tr {
    background: white
}
.editor-content table tbody tr:nth-child(2n+1) {
    background: white
}
.editor-content table tbody tr:nth-child(2n+1)>* {
    background-color: #f5f5f599
}
.editor-content table tbody tr:nth-child(2n+1)>th {
    background-color: rgba(var(--theme_main_color_rgb), .1)
}
.editor-content table tbody tr th {
    text-align: left;
    background-color: rgba(var(--theme_main_color_rgb), .1)
}
.editor-content table td,
.editor-content table th {
    border: 1px solid #dfe2e5;
    padding: 10px 16px;
    height: 44px;
    min-width: 60px;
    box-sizing: border-box;
    word-break: normal;
    overflow-wrap: anywhere;
    position: relative
}
.editor-content table td.selectedCell,
.editor-content table th.selectedCell {
    background-color: rgba(var(--theme_main_color_rgb), .4) !important
}
.editor-content table td>*,
.editor-content table th>* {
    margin-top: 6px
}
.editor-content table td>*:first-child,
.editor-content table th>*:first-child {
    margin-top: 0
}
.editor-content table td>*:last-child,
.editor-content table th>*:last-child {
    margin-bottom: 0
}
.editor-content table td div[class*=language-] {
    margin-top: -16px
}
.editor-content table td [class*=language-] code br {
    display: none
}
.editor-content table td div[class*=language-].line-numbers-mode pre+br {
    display: none
}
.editor-content .tableWrapper {
    margin: 16px 0 0;
    position: relative
}
.editor-content .tableWrapper table {
    margin-top: 0
}
.editor-content .tableWrapperInner {
    overflow-x: auto
}
.editor-content .table-left-shadow:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 32px;
    background: linear-gradient(to left, rgba(0, 0, 0, 0) 0px, rgba(9, 30, 66, .16) 140%), linear-gradient(to right, rgba(9, 30, 66, .12) 0px, rgba(0, 0, 0, 0) 1px);
    pointer-events: none
}
.editor-content .table-right-shadow:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 32px;
    background: linear-gradient(to right, rgba(0, 0, 0, 0) 0px, rgba(9, 30, 66, .16) 140%), linear-gradient(to left, rgba(9, 30, 66, .12) 0px, rgba(0, 0, 0, 0) 1px);
    pointer-events: none
}
.editor-content img {
    display: inline-block;
    float: none;
    margin: 0;
    max-width: 100%;
    height: auto;
/*    cursor: zoom-in;*/
}
.editor-content img[data-display=inline] {
    margin-left: 12px;
    margin-right: 12px;
    max-width: calc(100% - 24px)
}
.editor-content img[data-display=block] {
    display: block
}
.editor-content img[data-display=left] {
    float: left;
    margin-left: 0;
    margin-right: 12px;
    max-width: calc(100% - 12px)
}
.editor-content img[data-display=right] {
    float: right;
    margin-left: 12px;
    margin-right: 0;
    max-width: calc(100% - 12px)
}
.editor-content .image-view {
    display: inline-block;
    float: none;
    line-height: 0;
    margin: 0;
    max-width: 100%;
    user-select: none;
    vertical-align: baseline
}
.editor-content .image-view--inline {
    margin-left: 12px;
    margin-right: 12px
}
.editor-content .image-view--block {
    display: block
}
.editor-content .image-view--left {
    float: left;
    margin-left: 0;
    margin-right: 12px
}
.editor-content .image-view--right {
    float: right;
    margin-left: 12px;
    margin-right: 0
}
.editor-content .image-view__body-editable:hover {
    outline-color: #ffc83d
}
.editor-content .image-view__body-editable .image-view__body__image {
    cursor: pointer
}
.editor-content .image-view__body {
    clear: both;
    display: inline-block;
    max-width: 100%;
    outline-color: transparent;
    outline-style: solid;
    outline-width: 2px;
    transition: all .2s ease-in;
    position: relative
}
.editor-content .image-view__body--focused:hover,
.editor-content .image-view__body--resizing:hover {
    outline-color: transparent
}
.editor-content .image-view__body__placeholder {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1
}
.editor-content .image-view__body__image {
    cursor: default;
    margin: 0;
    min-width: 16px;
    min-height: 16px
}
.editor-content .image-resizer {
    border: 1px solid var(--theme_main_color);
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1
}
.editor-content .image-resizer__handler {
    background-color: var(--theme_main_color);
    border: 1px solid #fff;
    border-radius: 2px;
    box-sizing: border-box;
    display: block;
    height: 12px;
    position: absolute;
    width: 12px;
    z-index: 2
}
.editor-content .image-resizer__handler--tl {
    cursor: nw-resize;
    left: -6px;
    top: -6px
}
.editor-content .image-resizer__handler--tr {
    cursor: ne-resize;
    right: -6px;
    top: -6px
}
.editor-content .image-resizer__handler--bl {
    bottom: -6px;
    cursor: sw-resize;
    left: -6px
}
.editor-content .image-resizer__handler--br {
    bottom: -6px;
    cursor: se-resize;
    right: -6px
}
.editor-content .resize-cursor {
    cursor: ew-resize;
    cursor: col-resize
}
.editor-content .column-resize-handle {
    background-color: var(--theme_main_color);
    bottom: 0;
    pointer-events: none;
    position: absolute;
    right: -1px;
    top: 0;
    width: 2px;
    z-index: 20
}
.editor-content ul[data-type=taskList] {
    margin-left: 5px
}
.editor-content ul[data-type=taskList] .task-item-wrapper {
    display: flex
}
.editor-content ul[data-type=taskList] li[data-type=taskItem] {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    margin-bottom: 0;
    width: 100%
}
.editor-content ul[data-type=taskList] li[data-type=taskItem][data-text-align=right] {
    justify-content: flex-end !important
}
.editor-content ul[data-type=taskList] li[data-type=taskItem][data-text-align=center] {
    justify-content: center !important
}
.editor-content ul[data-type=taskList] li[data-type=taskItem][data-text-align=justify] {
    justify-content: space-between !important
}
.editor-content ul[data-type=taskList] li[data-type=taskItem] .todo-content {
    padding-left: 10px;
    width: 100%
}
.editor-content ul[data-type=taskList] li[data-type=taskItem] .todo-content>p {
    font-size: 16px
}
.editor-content ul[data-type=taskList] li[data-type=taskItem] .todo-content>p:last-of-type {
    margin-bottom: 0
}
.editor-content ul[data-type=taskList] li[data-type=taskItem][data-done=done]>.todo-content>p {
    color: var(--theme_main_color);
    text-decoration: line-through
}
.editor-content ul[data-type=taskList] li[data-type=taskItem] .task-height {
    height: 28px
}
.editor-content ul {
    padding: 0;
    margin: 16px 0 0 19px;
    user-select: text
}
.editor-content ul.contains-task-list {
    list-style: none;
    margin-left: 0
}
.editor-content ol {
    padding: 0;
    margin: 16px 0 0 19px;
    user-select: text
}
.editor-content li {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.75;
    color: #333;
    user-select: text
}
.editor-content li input {
    position: relative;
    top: 2px
}
.editor-content li p {
    margin: 0;
    color: #333
}
.editor-content ul ul,
.editor-content ul ol,
.editor-content ol ul,
.editor-content ol ol {
    margin-top: 0;
    margin-bottom: 0
}
.editor-content ul {
    list-style-type: disc
}
.editor-content ul ul {
    list-style-type: circle
}
.editor-content ul ul ul {
    list-style-type: square
}
.editor-content ol,
.editor-content ol li {
    list-style-type: decimal
}
.editor-content ol ol {
    list-style-type: lower-roman
}
.editor-content ol ol ol {
    list-style-type: lower-alpha
}
.editor-content blockquote {
    margin: 16px 0 0;
    padding: 10px 20px;
    background: rgba(var(--theme_main_color_rgb), .1);
    border-left: 4px solid var(--theme_main_color)
}
.editor-content blockquote p {
    margin: 0;
    color: #333
}
.editor-content blockquote>:last-child {
    margin-bottom: 0
}
.editor-content blockquote>:first-child {
    margin-top: 0
}
.editor-content .iframe-container-box {
    max-width: 100%;
    border: 1px solid transparent;
    margin-top: 16px
}
.editor-content .iframe-container-box .iframe-container {
    margin: 0;
    overflow: hidden;
    position: relative;
    padding-top: 56.25%
}
.editor-content .iframe-container-box .iframe-container-focused {
    border: 1px solid var(--theme_main_color)
}
.editor-content .iframe-container-box .iframe-container iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0
}
.editor-content .iframe-container-focused {
    border: 1px solid var(--theme_main_color);
    margin-top: 16px
}
.editor-content .iframe-container-focused .iframe-container {
    margin-top: 0 !important
}
.editor-content custom-block {
    display: block
}
.editor-content .custom-block {
    border: 1px solid transparent;
    border-radius: 8px;
    padding: 10px;
    line-height: 1.75;
    font-size: 14px;
    margin-top: 16px
}
.editor-content .custom-block>* {
    margin-top: 6px
}
.editor-content .custom-block>:last-child {
    margin-bottom: 0
}
.editor-content .custom-block>:first-child {
    margin-top: 0
}
.editor-content .tips {
    background-color: #f4f5f580;
    border: 1px solid transparent
}
.editor-content .info {
    background-color: #d9e8fc80;
    border: 1px solid transparent
}
.editor-content .warning {
    background-color: #f9efcd80;
    border: 1px solid transparent
}
.editor-content .success {
    background-color: #e8f7cf80;
    border: 1px solid transparent
}
.editor-content .danger {
    background-color: #fbe4e780;
    border: 1px solid transparent
}
.editor-content .color1 {
    background-color: #cef1f780;
    border: 1px solid transparent
}
.editor-content .color2 {
    background-color: #daf6ea80;
    border: 1px solid transparent
}
.editor-content .color3 {
    background-color: #fde6d380;
    border: 1px solid transparent
}
.editor-content .color4 {
    background-color: #fbdfef80;
    border: 1px solid transparent
}
.editor-content .color5 {
    background-color: #e6dcf980;
    border: 1px solid transparent
}
.editor-content .table-box {
    overflow-x: auto;
    padding-bottom: 10px
}
.editor-content a {
    color: var(--theme_link_color);
    text-decoration: none !important
}
.editor-content a:hover {
    text-decoration: underline
}
.editor-content .conflict-block {
    display: block;
    border: 1px solid transparent;
    border-radius: 8px 0 8px 8px;
    padding: 10px;
    line-height: 24px;
    font-size: 14px;
    margin-top: 26px;
    background-color: #fc4c1780;
    position: relative
}
.editor-content .conflict-block .operate-btn-line {
    position: absolute;
    top: -26px;
    right: -1px
}
.editor-content .conflict-block .operate-btn-line button {
    background-color: #fc4c1780;
    color: #fff;
    border: none;
    height: 25px;
    border-radius: 4px 4px 0 0;
    cursor: pointer
}
.editor-content .conflict-block>* {
    margin-top: 6px
}
.editor-content .conflict-block>:first-child {
    margin-top: 0
}
.editor-content .conflict-block>:last-child {
    margin-bottom: 0
}
.editor-content .file-block {
    margin: 16px 0 0;
    height: 60px;
    border: 1px solid #dee0e3;
    box-sizing: border-box;
    border-radius: 8px;
    padding: 8px 12px;
    max-width: 400px;
    display: flex;
    flex-direction: row;
    align-items: center
}
.editor-content .file-block:hover {
    border: 1px solid rgba(var(--theme_main_color_rgb), .6)
}
.editor-content .file-block * {
    pointer-events: none
}
.editor-content .file-block .file-icon {
    width: 36px;
    height: 36px
}
.editor-content .file-block .file-info {
    margin-left: 8px;
    display: flex;
    flex-direction: column;
    width: 0;
    flex-grow: 1
}
.editor-content .file-block .file-info .file-name {
    color: #1f2329;
    font-size: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}
.editor-content .file-block .file-info .file-size {
    margin-top: 4px;
    color: #646a73;
    font-size: 12px
}