.LockScreen {
    opacity: 0;
    transition-property: opacity, backdrop-filter;
    transition-duration: 5s;
    z-index: 1000000000; /* DeprecatedPopover has z-index million. So we use here billion */
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    backdrop-filter: blur(10px);
}

.appIsLocked .LockScreen {
    opacity: 1;
}

.appIsLocked .Sidebar_content,
.appIsLocked .SearchBox_typeaheadContainer,
.appIsLocked .SearchBox_tagsContainer,
._ {
    display: none;
}

.appIsLocked #settings-modal .modal-body {
    opacity: 0;
}

.LockScreenSkeleton {
    display: none;
    filter: blur(5px);
    width: auto !important;
    max-width: var(--UserLayout_contentWidth) !important;
    flex-basis: var(--UserLayout_contentWidth) !important;
    flex-grow: 1;
    flex-shrink: 1;
    padding: 10px 15px 20px;
}

.LockScreenSkeleton * {
    cursor: auto;
}

.appIsLocked .LockScreenSkeleton {
    display: block;
}

.LockScreenSkeleton .placeholder {
    background: lightgray;
}