.page-header{height:72px;display:flex;flex-direction:column;background-color:var(--background-2)}.page-header .top-section{padding:0 24px;height:42px;width:100%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border-color)}.page-header .top-section .header-right{display:flex}.page-header .top-section .header-right .icons{display:flex;align-items:center}.page-header .top-section .header-right .icons .icon-item{margin-right:11px;cursor:pointer;color:var(--text-color-1)}.page-header .top-section .header-right .buttons{height:28px;display:flex;position:relative;padding-left:10px}.page-header .top-section .header-right .buttons:before{content:"";width:1px;height:14px;background-color:var(--border-color);position:absolute;top:50%;transform:translateY(-50%);left:0}.page-header .top-section .header-right .buttons button{font-size:1.2rem;line-height:22px;display:flex;align-items:center;text-align:center;border-radius:3px;height:100%}.page-header .top-section .header-right .buttons .btn-register{padding:0 12px;color:var(--white);background-color:var(--btn-fill-bg-color);margin-right:8px}.page-header .top-section .header-right .buttons .btn-login{padding:0 24px;background-color:var(--white);color:var(--blue);border:1px solid var(--blue)}.page-header .bottom-section{padding:0 24px;width:100%;height:30px}.modal-dialog.invite-open-account-modal{min-width:345px}.modal-dialog.invite-open-account-modal .modal-body{padding:0 16px 24px}.invite-open-account{display:grid;grid-gap:24px;gap:24px}.invite-open-account .invite-heading{font-size:1.3rem;font-weight:600;line-height:16px;text-align:center;color:var(--text-color-1)}.invite-open-account .invite-content .invite-desc{margin-bottom:16px;text-align:justify}.invite-open-account .invite-content *{font-size:1.1rem;line-height:16px;font-weight:400;text-align:center;color:var(--text-color-2)}.invite-open-account .invite-action{text-align:center}.invite-open-account .invite-action button{line-height:16px;padding:5px 17px;border:none;font-size:1.1rem}.invite-open-account .invite-action .btn-invite-copy-code{color:var(--text-color-1)}.invite-open-account .invite-action .btn-invite-copy-link{margin-top:0}.mdi-header{width:calc(100% - 4px);height:var(--height-top-bar);display:flex;align-items:center;background-color:var(--mdi-header-bg-color);padding:4px 16px;position:relative;z-index:41;border-radius:500px;margin:2px}.mdi-header.menu-toggle:before{left:0}.mdi-header.menu-toggle:after,.mdi-header.menu-toggle:before{content:"";position:absolute;bottom:0;background:var(--mdi-header-bg-color);width:14px;height:16px}.mdi-header.menu-toggle:after{right:0}.mdi-header .modal-backdrop.modal-backdrop-menu{background:transparent}.mdi-header .project-name{font-weight:500;font-size:1.2rem;color:var(--project-name-color);margin-left:8px}.mdi-header .fade-enter-active,.mdi-header .fade-leave-active{transition:all .5s;transform:translateX(0)}.mdi-header .fade-enter,.mdi-header .fade-leave-to{opacity:0;transform:translateX(100%)}.mdi-header .header-drop-list{min-width:500px}.mdi-header .header-drop-list,.mdi-header .header-drop-list .drag-favorites{display:flex;align-items:center}.mdi-header .header-drop-list .dnd-drag{background:var(--mdi-header-bg-color);border-radius:4px}.mdi-header .header-drop-list .drag-favorites .favorites-screen .screen .widgets-setting svg,.mdi-header .header-drop-list .drag-favorites .favorites-screen .screen img,.mdi-header .header-drop-list .drag-favorites svg,.mdi-header .header-drop-list .menu-icon svg{width:var(--icon-top-bar-wh);height:var(--icon-top-bar-wh)}.mdi-header .right{margin-left:auto}.mdi-header .right,.mdi-header .right .tools{display:flex;align-items:center}.mdi-header .right .tools svg.tool-item{width:var(--icon-top-bar-wh);height:var(--icon-top-bar-wh);color:var(--mdi-header-icon-color);cursor:pointer}.mdi-header .right .tools svg.tool-item:focus{outline:none}.mdi-header .right .tools .tool-item{margin:0 10px}.mdi-header .right .tools .tool-item svg{width:var(--icon-top-bar-wh);height:var(--icon-top-bar-wh);color:var(--mdi-header-icon-color);cursor:pointer}.mdi-header .right .btn-login{border-radius:3px;background-color:var(--purple-pr);color:var(--btn-fill-color);padding:0 10px;justify-content:center;font-size:1.2rem;height:20px}.mdi-header .right .btn-login,.mdi-header .right .user-info{cursor:pointer;display:flex;align-items:center;margin-left:8px}.mdi-header .right .user-info{position:relative;color:var(--text-color-1)}.mdi-header .right .user-info .name{margin-right:10px;font-weight:500;font-size:1.2rem}.mdi-header .right .user-info .avatar{width:24px;height:24px;border-radius:50%;cursor:pointer}.mdi-header .right .user-info .user-dropdown{position:absolute;top:calc(100% + 5px);right:0;background-color:var(--background-modal);z-index:2;border-radius:4px;display:none}.mdi-header .right .user-info .user-dropdown:before{position:absolute;background-color:transparent;content:"";width:100%;height:10px;left:0;bottom:100%}.mdi-header .right .user-info .user-dropdown .user-item{font-size:1.2rem;color:var(--color-1);padding:10px 20px;z-index:10;cursor:pointer}.mdi-header .right .user-info .user-dropdown .user-item:hover{opacity:.8}.mdi-header .right .user-info:hover .user-dropdown{display:block}.mdi-header .logo{display:flex;align-items:center}.mdi-header .logo svg{width:68px;height:16px}.mdi-header .layout-icon,.mdi-header .menu-icon{margin-left:40px;display:flex;align-items:center;cursor:pointer;height:100%;color:var(--mdi-layout-icon-color)}.mdi-header .layout-icon:hover,.mdi-header .menu-icon:hover{color:var(--blue-1)}.mdi-header .layout-icon.active,.mdi-header .menu-icon.active{color:var(--purple-pr);position:relative}.mdi-header .layout-icon.active:before,.mdi-header .menu-icon.active:before{position:absolute;top:calc(100% - 6px);right:2px;width:5px;height:5px;border-left:7px solid transparent;border-bottom:8px solid var(--purple-pr);border-right:7px solid transparent;border-top:8px solid transparent;display:block;content:""}.mdi-header .menu-icon{margin-left:0;padding-left:30px}.mdi-header .menu-icon svg{cursor:pointer;outline:none}.mdi-header .layout-icon{margin-right:10px}.mdi-header .favorites-screen{display:flex;align-items:center;justify-content:space-around;border-radius:4px;height:100%}.mdi-header .favorites-screen .screen{height:100%;display:flex;align-items:center;cursor:pointer;margin:0 12px;position:relative;color:var(--color-1)}.mdi-header .favorites-screen .screen:hover{color:var(--blue-1)}.mdi-header .favorites-screen .screen.active{color:var(--blue-2)}.mdi-header .favorites-screen .screen.has-border:after{position:absolute;top:50%;left:-10px;height:60%;width:.5px;content:"";transform:translateY(-50%);background-color:#4a5568;cursor:auto}.mdi-header .favorites-screen .screen svg{color:var(--mdi-header-icon-color);width:16px;height:16px}.mdi-header .screens-groups{display:flex;align-items:center}.mdi-header .screens-groups .screen-group{margin-right:10px;width:20px;height:20px;cursor:pointer;display:flex;align-items:center;justify-content:center;border-radius:3px;border:1px solid var(--border-color)}.mdi-header .screens-groups .screen-group.active{background-color:var(--btn-fill-bg-color)}.setting-modal{width:640px;max-width:100vw}.setting-modal .modal-content{transition:all .3s,background 0s}.setting-modal .modal-content .modal-header{padding:0!important;z-index:1}.setting-modal .modal-content .modal-header .modal-title{display:flex;align-items:center;color:var(--text-color-1)}.setting-modal .modal-content .modal-header .modal-title .head-title,.setting-modal .modal-content .modal-header .modal-title .text{font-size:1.6rem;font-weight:600;line-height:20px;padding:16px 0 16px 16px;width:180px;background-color:var(--bg-setting-left-bar);border-top-left-radius:8px}.setting-modal .modal-content .modal-header .close{padding:10px;margin:auto 6px auto auto}.setting-modal .modal-content .modal-header .head-title{font-size:1.6rem}.setting-modal .modal-content .modal-body{padding:0;z-index:2}