*,::after,::before{box-sizing:border-box}body{margin:0;font-family:Noto,Tahoma,Geneva,Verdana,sans-serif;background-color:#232323;color:#fff}.header{width:calc(100% - 332px);height:58px;background-color:#232323;display:flex;align-items:center;justify-content:space-between;position:fixed;top:0;left:280px;padding:0 20px;z-index:1000}.header .header-left{width:280px;display:flex;justify-content:flex-start;margin-left:30px;margin-top:6px}.header .header-left img{max-height:58px;max-width:100%;object-fit:contain}.header .header-center-left{display:flex;flex-direction:column;justify-content:center;margin-left:20px;margin-top:6px}.header .header-center-left h5{margin:0;font-size:1.125rem;color:#fff}.header .header-center-left small{font-size:.75rem;color:#fff}.header .header-center-right{display:flex;flex-direction:column;justify-content:center;margin-left:auto;margin-right:20px;margin-top:6px}.header .header-center-right p{margin:0;font-size:.875rem;color:#fff}.header .header-right{display:flex;align-items:center;margin-top:6px}.header .header-right i{font-size:.75rem;color:#fff;margin-left:15px;cursor:pointer}.header .header-right i:hover{color:#565656;transition:color .3s ease}.sidebar-left{width:280px;height:100vh;background-color:#232323;position:fixed;top:0;left:0;display:flex;flex-direction:column;justify-content:flex-start;box-sizing:border-box;overflow:hidden}.sidebar-left .sidebar-logo{padding:20px 12px 4px;text-align:center}.sidebar-left .menu{list-style:none;padding:0;margin:0;width:100%}.sidebar-left .menu .menu-item{position:relative}.sidebar-left .menu .menu-item a{display:flex;align-items:center;padding:15px 7px 15px 15px;color:#fff;text-decoration:none;font-size:.8125rem;width:100%}.sidebar-left .menu .menu-item a i{margin-right:10px;font-size:.875rem}.sidebar-left .menu .menu-item a .menu-text{display:flex;flex-direction:column;width:100%}.sidebar-left .menu .menu-item a:hover{background-color:#303030;transition:background-color .3s ease}.sidebar-left .menu .menu-item a small.desc{display:block;font-size:.6875rem;color:#61dafb!important;margin-top:5px}.sidebar-left .menu .menu-item.has-submenu>a::after{content:"\f107";font-family:"Font Awesome 5 Free";font-weight:900;position:absolute;right:20px;font-size:.6875rem}.sidebar-left .menu .menu-item .submenu{list-style:none;padding:0;margin:0;padding-left:20px;max-height:0;overflow:hidden;opacity:0;transition:max-height .3s cubic-bezier(.25,.8,.25,1),opacity .4s ease-in-out 50ms}.sidebar-left .menu .menu-item .submenu .menu-item a{padding:12px;font-size:.75rem;width:100%}.sidebar-left .menu .menu-item .submenu .menu-item a:hover{background-color:#3d3d3d;transition:background-color .3s ease}.sidebar-left .menu .menu-item .submenu .menu-item .submenu{padding-left:20px}.sidebar-left .menu .menu-item.open>.submenu{max-height:500px;opacity:1}.sidebar-left .function-list{flex-grow:1;overflow-y:auto;padding:0 5px 10px 20px;color:#fff}.sidebar-left .function-list ul{list-style:none;padding:0;margin:0}.sidebar-left .function-list li{padding:5px 0;font-size:.75rem}.sidebar-left .function-list .fn-name{display:flex;align-items:center;padding-left:20px;position:relative;font-size:.75rem;cursor:pointer;margin-bottom:5px}.sidebar-left .function-list .fn-name.function::before{content:"ƒ";font-size:.875rem;color:#61dafb;position:absolute;left:0}.sidebar-left .function-list .fn-name.class::before{content:"\2318";font-size:.875rem;color:#f90;position:absolute;left:0}.sidebar-left .extra-icons{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding:10px}.sidebar-left .extra-icons i{font-size:.8125rem;color:#fff;text-align:center;cursor:pointer;padding:10px;background-color:#494949;border-radius:[object Object]}.sidebar-left .extra-icons i:hover{background-color:#1e1e1e;transition:background-color .3s ease}.sidebar-right{width:52px;height:100vh;background-color:#232323;position:fixed;top:68px;right:0;display:flex;flex-direction:column;align-items:center}.sidebar-right .icon{width:100%;display:flex;align-items:center;justify-content:center;background-color:#232323;cursor:pointer}.sidebar-right .icon img{width:52px;height:52px}.body-container{width:calc(100% - 280px - 52px);height:calc(100vh - 58px);margin-left:280px;margin-right:52px;margin-top:58px;display:flex;flex-direction:column;overflow:hidden}.main-content{flex-grow:1;overflow:auto;display:flex;flex-direction:column;margin-top:10px;padding-bottom:10px;box-sizing:border-box}.footer-system{background-color:#232323;overflow:auto;padding:20px 0 10px;box-sizing:border-box;transition:height .2s ease;min-height:250px}.footer-system .nav{display:flex;margin-bottom:10px;border-bottom:none;padding:0;margin:0}.footer-system .nav .nav-item{margin-right:10px;list-style:none}.footer-system .nav .nav-item .nav-link{padding:10px 15px;color:#61dafb;background-color:#282828;text-decoration:none;border-radius:[object Object];cursor:pointer;transition:background-color .3s ease;border-radius:20px}.footer-system .nav .nav-item .nav-link.active{background-color:#3d3d3d;color:#fff}.footer-system .nav .nav-item .nav-link:hover{background-color:#161616;color:#fff}.footer-system .tab-content{margin-top:24px}.footer-system .tab-content .tab-pane{display:none}.footer-system .tab-content .tab-pane.active{display:block}.divider{height:3px;background-color:#804d00;cursor:row-resize;z-index:1001}.code-editor{flex:1;border:1px solid #3d3d3d;margin-bottom:20px;overflow-y:auto;box-shadow:0 2px 4px rgba(0,0,0,.5)}.ace_editor{margin-bottom:0}