.main-layout{background-color:var(--discord-dark-primary);width:100%;height:100vh;display:flex;position:relative;overflow:hidden}.mobile-nav{background-color:var(--discord-dark-primary);z-index:1000;border-bottom:1px solid var(--discord-border-color);justify-content:space-between;align-items:center;height:48px;padding:0 10px;display:none;position:fixed;top:0;left:0;right:0}.nav-title{color:#fff;text-align:center;flex:1;font-size:16px;font-weight:700}.nav-btn{color:#fff;cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;width:36px;height:36px;transition:background-color .2s;display:flex}.nav-btn:hover{background-color:rgba(255,255,255,.1)}.mobile-close{color:#fff;cursor:pointer;z-index:10;background:rgba(0,0,0,.3);border:none;border-radius:50%;width:30px;height:30px;font-size:20px;display:none;position:absolute;top:10px;right:10px}.channel-toggle{color:#fff;cursor:pointer;z-index:10;background:0 0;border:none;padding:5px;display:none;position:absolute;top:8px;right:10px}.sidebar{z-index:100;height:100%;transition:transform .3s ease-in-out,opacity .2s;position:fixed}.sidebar.server-list{background:var(--discord-dark-tertiary);z-index:200;width:72px;left:0}.sidebar.channel-list{background:var(--discord-dark-secondary);z-index:150;width:240px;left:72px}.sidebar.member-list{background:var(--discord-dark-secondary);border-left:1px solid var(--discord-border-color);z-index:100;width:240px;right:0}.chat-area{background:var(--discord-dark-primary);flex-direction:column;flex:1;height:100%;display:flex;position:fixed;left:312px;right:240px;overflow:hidden}.sidebar-overlay{z-index:90;background-color:rgba(0,0,0,.5);display:none;position:fixed;top:0;bottom:0;left:0;right:0}@media (max-width:1024px){.sidebar.member-list{transform:translate(100%)}.chat-area{right:0}.sidebar.member-list.active{transform:translate(0)}}@media (max-width:768px){.mobile-nav{z-index:1000;display:flex}.content-area{padding-top:48px}.sidebar{height:calc(100% - 48px);top:48px;transform:translate(-100%)}.sidebar.server-list{z-index:200;width:80px}.sidebar.channel-list{z-index:150;width:100%;max-width:300px;left:0}.sidebar.member-list{z-index:150;width:100%;max-width:300px;transform:translate(100%)}.sidebar.active{transform:translate(0)}.chat-area{z-index:50;height:calc(100% - 48px);top:48px;left:0;right:0}.sidebar-active .sidebar-overlay{display:block}.sidebar.active .mobile-close{justify-content:center;align-items:center;display:flex}.channel-toggle{display:block}}@media (max-width:480px){.sidebar.channel-list,.sidebar.member-list{width:85%}}@media (max-width:768px){.mobile-nav{display:flex}.sidebar{transform:translate(-100%)}.sidebar.member-list{transform:translate(100%)}.sidebar.show{transform:translate(0)!important}.chat-area{height:calc(100% - 48px);top:48px;left:0;right:0}.input-container{margin:0 8px 16px}}@media (min-width:769px) and (max-width:1024px){.sidebar.member-list{transform:translate(100%)}.sidebar.member-list.show{transform:translate(0)}.chat-area{right:0}}.sidebar-overlay{z-index:90;opacity:0;background:rgba(0,0,0,.5);transition:opacity .3s;display:none;position:fixed;top:0;bottom:0;left:0;right:0}.sidebar.show+.sidebar-overlay{opacity:1;display:block}