.m-doc-view .doc-menu-header.is-fixed {position: relative; top: auto; width: calc(100% - 10px); margin-bottom: 12px;}
.m-doc-view .doc-menu {max-height: calc(100vh - 115px);}
.m-doc-view #pick-docDropmenuMenu {position: relative; top: auto; margin-bottom: 12px; background: var(--color-canvas);}

#docPanel {max-height: calc(100vh - 72px); scroll-padding-top: 56px; --doc-max-width: 1120; --doc-sidebar-width: 0px;}
#docEditor {margin: 0 -0.75em 0 -1em; padding-bottom: 8px;}
.doc-menu [data-type="mine"] + menu {max-height: calc(100vh - 296px); margin-right: -4px; margin-top: -4px}
.doc-menu [data-type="mine"] + menu::-webkit-scrollbar,
.doc-menu [data-type="mine"] + menu::-webkit-scrollbar-thumb,
.doc-menu [data-type="mine"] + menu::-webkit-scrollbar-track {visibility: hidden;}
.doc-menu [data-type="mine"] + menu:hover::-webkit-scrollbar,
.doc-menu [data-type="mine"] + menu:hover::-webkit-scrollbar-thumb,
.doc-menu [data-type="mine"] + menu:hover::-webkit-scrollbar-track {visibility: visible;}
#docBody {margin: 0 auto; max-width: calc(var(--doc-max-width) + var(--doc-sidebar-width));}

#docPanel.show-outline, #docPanel.show-history {--doc-sidebar-width: 300px;}
#docOutline, #docHistory, #docSidebar {display: none;}
.show-outline #docSidebar, .show-history #docSidebar,
.show-outline #docOutline, .show-history #docHistory {display: block;}
.show-history #outlineToggle,
.show-outline.show-history #docOutline {display: none;}
.show-history #hisTrigger {color: var(--color-primary-500)}
#docHistory .history-panel {padding: 0;}
#docHistory .panel-heading {padding-top: 0;}
.show-outline #outlineToggle > .icon {transform: rotate(180deg);}

@media (max-width: 1366px) {#docPanel {--doc-max-width: 760px}}
@media (max-width: 1920px) {#docPanel {--doc-max-width: 920px}}