:root{--background-color: #f8f8f8;--background-color-2: #e8e8e8;--background-color-3: #d8d8d8;--border-color: #0c0c0c;--detail-panel-width: 200px;--padding: 1rem;--detail-panel-width: 240px;--side-bar-handle-width: 20px;--side-bar-mobile-width: 200px;--side-bar-width: 360px;--text-color: #010101;--topbar-height: 40px;--transition-duration: .4s;--transition-property: all;--transition-type: ease}:root.dark-mode{--background-color: #101010;--background-color-2: #181818;--background-color-3: #202020;--border-color: #444444;--text-color: #f0f0f0}html,body{border:0;height:100%;margin:0;padding:0}body{background-color:var(--background-color);color:var(--text-color);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif}.app-shell{display:flex;height:100%}.content{display:flex;flex-direction:column;margin-left:calc(var(--side-bar-width) + var(--side-bar-handle-width));transition:var(--transition-property) var(--transition-duration) var(--transition-type);width:100%}.content.is-mobile{display:flex;margin-left:0}.content.side-bar-collapsed{margin-left:var(--side-bar-handle-width)}.content.side-bar-collapsed.is-mobile{margin-left:0}.top-bar{align-items:center;background-color:var(--background-color-3);border-bottom:1px solid var(--border-color);color:var(--text-color);display:flex;height:var(--topbar-height);padding:var(--padding);position:fixed;transition:var(--transition-property) var(--transition-duration) var(--transition-type);width:calc(100% - (var(--side-bar-width) + var(--padding) + var(--padding) + var(--side-bar-handle-width)));z-index:900}.top-bar.top-bar-mobile{border-top:0;height:var(--topbar-height);position:fixed;top:0;width:calc(100% - (var(--padding) + var(--padding)))}.top-bar.side-bar-collapsed{width:calc(100% - (var(--padding) + var(--padding)) - var(--side-bar-handle-width))}.top-bar.top-bar-mobile.side-bar-collapsed{width:calc(100% - (var(--padding) + var(--padding)))}.top-bar-title{flex-grow:1}.side-bar{background-color:var(--background-color-2);border-right:1px solid var(--border-color);color:var(--text-color);overflow-y:auto;position:fixed;transition:var(--transition-property) var(--transition-duration) var(--transition-type);width:var(--side-bar-width);z-index:1000;transform:translate(0)}@media(min-width:768px){.side-bar-desktop{bottom:0;top:0}}@media(max-width:768px){.side-bar-mobile{border-top:1px solid var(--border-color);bottom:0;height:var(--side-bar-mobile-width);left:0;transform:translateY(0);width:100%}}.side-bar.side-bar-collapsed{border-right-width:0;transform:translate(-100%)}@media(max-width:768px){.side-bar.side-bar-collapsed{height:calc(var(--topbar-height) + var(--padding) + var(--padding));overflow:hidden;transform:translateY(calc(var(--topbar-height) + var(--padding) + var(--padding)) * -1);width:auto}}.side-bar-header{align-items:center;background-color:var(--background-color-3);border-bottom:1px solid var(--border-color);color:var(--text-color);display:flex;height:var(--topbar-height);padding:var(--padding);position:sticky;top:0}button.side-bar-header{border:0;height:calc(var(--topbar-height) + var(--padding) + var(--padding));padding:var(--padding);width:100%}.side-bar-content{padding:var(--padding)}.side-bar-handle{background-color:var(--background-color-3);border-left:1px solid var(--border-color);border-right:1px solid var(--border-color);height:100%;position:fixed;left:var(--side-bar-width);transition:var(--transition-property) var(--transition-duration) var(--transition-type);z-index:1000}.side-bar-handle button{border:0;height:100%;width:var(--side-bar-handle-width)}.side-bar-handle-collapsed{border-left-width:0;left:0;position:fixed}.side-bar-handle-mobile{display:none}.detail-panel{background-color:var(--background-color-2);border-left:1px solid var(--border-color);border-left-width:0;color:var(--text-color);height:calc(100% - ((2 * var(--topbar-height)) + (1.5 * var(--padding))));margin-right:calc((var(--padding) + var(--padding)) * -1);overflow:auto;padding:var(--padding);position:fixed;right:0;transition:var(--transition-property) var(--transition-duration) var(--transition-type);width:var(--detail-panel-width);transform:translate(100%)}.detail-panel.detail-panel-mobile{height:calc(100% - ((3 * var(--topbar-height)) + (3.5 * var(--padding))))}.detail-panel.detail-panel-visible{border-left-width:1px;right:calc(var(--padding) + var(--padding));width:var(--detail-panel-width);transform:translate(0)}.main-container{display:flex;flex:1;flex-direction:row;margin-top:calc(var(--topbar-height) + var(--padding) + var(--padding));overflow-x:hidden;overflow-y:auto}.main-container-mobile{margin-bottom:calc(var(--topbar-height) + var(--padding) + var(--padding));padding-bottom:calc(var(--padding) * 2)}.main-content{height:100%;padding:var(--padding);transition:var(--transition-property) var(--transition-duration) var(--transition-type)}.main-content-mobile{height:100%}.main-content.detail-view,.main-content.mail-view{opacity:1}.content-container{padding-bottom:var(--padding)}