@import"https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Lexend:wght@100..900&family=Noto+Sans:ital,wght@0,100..900;1,100..900&display=swap";:root{--back: #090a0b;--prim: #1a1d28;--seco: #313f4e;--tert: #4f617d;--text: #b3cbf9;--accent: #ff00ff;--back-dark: color-mix(var(--back) 50%, #000);--back-lightish: color-mix(var(--back) 90%, var(--prim));--back-light: color-mix(var(--back) 75%, var(--prim));--back-lighter: color-mix(var(--back) 50%, var(--prim));--prim-light: color-mix(var(--prim) 50%, var(--seco));--prim-lighter: color-mix(var(--prim) 25%, var(--seco));--link: rgb(142, 111, 255);--link-visited: rgb(231, 137, 243);--text-size-normal: 15px;--text-size-emoji-picker: calc(var(--text-size-normal) + 2px);--text-size-user: calc(var(--text-size-normal) + 1px);--text-size-user-panel: calc(var(--text-size-normal) + 2px);--md-alert-note: #418dff;--md-alert-tip: #45d158;--md-alert-important: #ad83f7;--md-alert-warning: #eeb232;--md-alert-caution: #f55951;font-size:var(--text-size-normal)}a{color:var(--link)}a:visited{color:var(--link-visited)}icon{display:flex;color:var(--text)}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-thumb{background:var(--prim);border-radius:4px;border:2px solid var(--back)}::-webkit-scrollbar-thumb:hover{background:var(--seco)}::-webkit-scrollbar-corner{background:var(--prim);border-radius:4px;border:2px solid var(--back)}html{overflow:hidden}body{background-color:var(--back);color:var(--text);font-family:Noto Sans;margin:0}div.popup{min-width:300px;min-height:300px;background-color:var(--back-lighter);border:1px solid var(--prim-light);border-radius:10px}div.popup>header{height:30px;display:flex;justify-content:center;align-items:center;border-bottom:1px solid var(--prim-light)}div.popup>div{padding:0 10px}.emoji-container{display:flex}.emoji-container .emoji{width:20px}#app{max-width:100vw;height:100vh;display:flex}#auth{position:absolute;inset:0;display:flex}#auth>iframe{position:absolute;width:100vw;height:100vh;inset:0}#server-list{width:60px;display:flex;flex-direction:column;-webkit-user-select:none;user-select:none;background-color:var(--back-lighter);border-right:1px solid var(--prim)}#server-list>div{position:relative;margin:7.5px 7.5px 0;max-height:50px;display:flex;align-items:center;cursor:pointer;border-radius:5px}#server-list>div>img{border-radius:10px;width:45px}#server-list div:before{content:"";position:absolute;left:-7.5px;width:3px;height:0px;border-radius:0 3px 3px 0;background-color:#fff0;cursor:initial;transition:height .2s,background-color .2s}#server-list div.unread:before{height:10px;background-color:var(--seco)}#server-list div.selected:before{height:30px;background-color:var(--tert)}#layout-column{width:250px;display:flex;flex-direction:column;background-color:var(--back-light);border-right:1px solid var(--prim)}#channel-list{flex:1;display:flex;flex-direction:column;min-width:200px;padding-top:5px;-webkit-user-select:none;user-select:none}#channel-list>p.not-logged-in,#channel-list>p.not-selected-server{margin:0;width:100%;text-align:center;color:var(--seco)}#channel-list>button{position:relative;display:flex;align-items:center;padding:5px;margin:1px 2.5px 1px 10px;border:none;border-radius:5px;background-color:transparent;color:color-mix(var(--tert),var(--text));cursor:pointer}#channel-list>button>icon{display:inline-flex;margin-right:10px}#channel-list>button>span{font-size:var(--text-size-normal);text-wrap-mode:nowrap;margin-bottom:2px}#channel-list>button:hover{background-color:var(--prim)}#channel-list>button.voice>icon{padding:0 2px}#channel-list>button.voice>icon>svg{width:20px}#channel-list>button:before{content:"";position:absolute;left:-10px;width:3px;height:0px;border-radius:0 3px 3px 0;background-color:#fff0;cursor:initial;transition:height .15s,background-color .1s}#channel-list>button.unread:before{height:5px;background-color:var(--seco)}#channel-list>button.selected:before{height:25px;background-color:var(--tert)}#channel-list>hr{display:flex;margin:10px;height:2px;background-color:var(--prim);border:none}#channel-list:has(>p){align-items:center;justify-content:center;padding:0}#user-panel{height:60px;display:flex;align-items:center;justify-content:left;-webkit-user-select:none;user-select:none;border-top:1px solid var(--prim)}#user-panel>p.not-logged-in{margin:0;width:100%;text-align:center;color:var(--seco)}#user-panel>img{margin-left:10px;height:40px;border-radius:100%}#user-panel>span.name{margin-left:10px;font-size:var(--text-size-user-panel)}#content{flex:1;display:flex;flex-direction:column}#messages{flex:1;max-width:calc(100vw - 510px);padding:5px 5px 0;display:flex;flex-direction:column;overflow-x:hidden;overflow-y:auto}#messages>p.not-logged-in,#messages>p.not-selected-server,#messages>p.not-selected-channel{margin:0;width:100%;text-align:center;color:var(--seco)}#messages>:first-child{margin-top:auto}#messages:has(>p){align-items:center;justify-content:center}#reply-bar{margin:10px 10px -20px;padding:10px 10px 20px;height:22px;display:flex;background-color:var(--back-lightish);border-radius:10px 10px 0 0;border:1px solid var(--prim);-webkit-user-select:none;user-select:none;transition:padding .2s,margin-bottom .2s,height .2s,background-color .2s}#reply-bar>span{margin-left:5px}#reply-bar>button{margin-left:auto;padding:0;border:none;background-color:transparent}#reply-bar:empty{background-color:transparent;border:none;padding-top:0;padding-bottom:0;margin-bottom:-10px;height:0px}body:has(#reply-bar:not(:empty)) #message-bar{border-radius:0 0 10px 10px}#emoji-bar{margin:10px 10px -20px;padding-bottom:10px;min-height:22px;background-color:var(--back-lightish);border-radius:10px 10px 0 0;border:1px solid var(--prim);-webkit-user-select:none;user-select:none;transition:padding .2s,margin-bottom .2s,height .2s,background-color .2s}#emoji-bar>div{padding:5px;max-height:250px;overflow-y:auto;display:flex;flex-direction:column}#emoji-bar>div>button{display:flex;align-items:center;gap:10px;padding:7.5px;flex:1;background-color:transparent;border:none;border-radius:5px;color:var(--text);font-size:var(--text-size-emoji-picker);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .1s}#emoji-bar>div>button>.emoji-container>.emoji{width:25px}#emoji-bar>div>button>span:not(.emoji-container){padding-bottom:1px}#emoji-bar>div>button.selected{background-color:var(--back-lighter)}#emoji-bar:empty{background-color:transparent;border:none;padding-top:0;padding-bottom:0;margin-bottom:-30px;height:0px}body:has(#emoji-bar:not(:empty)) #message-bar{border-radius:0 0 10px 10px}#message-bar{min-height:44px;margin:10px;display:flex;background-color:var(--back-light);border-radius:10px;border:1px solid var(--prim);transition:border-radius .2s}#message-bar>textarea{padding:12px;border:none;outline:none;background-color:unset;color:var(--text);font-family:Noto Sans;resize:none;overflow:hidden;box-sizing:border-box;flex:1}#message-bar>p.not-logged-in,#message-bar>p.not-selected-server,#message-bar>p.not-selected-channel{margin:0;width:100%;text-align:center;color:var(--seco)}#message-bar>#message-bar-send{width:40px;display:flex;justify-content:center;align-items:center;border:none;border-left:1px solid var(--prim);border-radius:0 10px 10px 0;outline:none;background-color:var(--back-light);cursor:pointer;transition:background-color .1s}#message-bar>#message-bar-send>icon{color:var(--text);width:20px}#message-bar>#message-bar-send:hover{background-color:var(--prim)}#message-bar:has(>p){align-items:center;justify-content:center}#user-list{width:225px;display:flex;flex-direction:column;padding:0 10px;background-color:var(--back-light);border-left:1px solid var(--prim);overflow-x:hidden;overflow-y:auto}#user-list>p.not-logged-in,#user-list>p.not-selected-server{margin:0;width:100%;text-align:center;color:var(--seco)}#user-list>div>h4{margin:0 0 5px 5px;-webkit-user-select:none;user-select:none}#user-list>div>div{display:flex;flex-direction:column}#user-list:has(>p){align-items:center;justify-content:center}@media(max-width:1200px){#messages{flex:1;max-width:calc(100vw - 310px)}#user-list{display:none}}.message{padding:5px;margin-bottom:5px;background-color:transparent;transition:background-color .1s ease-out}.message>.reply{display:flex;align-items:center;gap:5px;padding-left:16px;padding-bottom:10px}.message>.reply>icon{margin-top:5px;margin-bottom:-3px;color:var(--tert)}.message>.reply>img{-webkit-user-select:none;user-select:none;width:20px;border-radius:100%}.message>.reply>.user{font-weight:700;font-size:var(--text-size-user);-webkit-user-select:none;user-select:none}.message>.reply>.content{max-width:400px;text-wrap-mode:nowrap;text-overflow:ellipsis;overflow:hidden}.message>.container{position:relative;display:flex}.message>.container>.pfp{position:absolute;min-width:40px;-webkit-user-select:none;user-select:none}.message>.container>.pfp>img{width:40px;border-radius:100%}.message>.container>.column{margin-left:50px}.message>.container>.column>.user{margin-top:-2px;margin-bottom:1px;font-weight:700;-webkit-user-select:none;user-select:none}.message>.container>.column>.content{white-space:pre;text-wrap:wrap;-webkit-user-select:text;user-select:text}.message>.container>.column>.content>.spotify-embed{margin-top:5px;display:flex}.message>.container>.column>.content.emoji-only{padding-top:3px}.message>.container>.column>.content.emoji-only>p>.emoji-container>.emoji{width:50px}.message:hover{background-color:var(--back-lighter)}.message.connected{margin-top:-5px}.message.connected>.container>.pfp>*{display:none}.message.connected>.container>.column>.user{display:none}.message:last-child{margin-bottom:0}.md{display:flex;flex-direction:column}.md>p{margin:0;display:inline-flex;align-items:center}.md>p>bold{font-weight:700}.md>p>italic{font-style:italic}.md>p>strikethrough{text-decoration:line-through}.md>p>div>img,.md>p>div>video{max-width:500px;max-height:250px;margin:5px 0 5px -2px;border:1px solid var(--prim);border-radius:10px;cursor:pointer}.md>p>.emoji{margin-bottom:-5px}.md>p>.link{display:inline}.md>p>.channel-link,.md>p>.ping{background-color:var(--prim);border:1px solid var(--prim-light);border-radius:5px;padding:0 2px;margin:2px 0;font-size:var(--text-size-normal);display:flex}.md>p:last-child{margin-bottom:0}.md .code-block,.md .code-block-inline{background-color:var(--prim);border:1px solid var(--prim-light);border-radius:10px}.md .code-block-inline{margin:2.5px;padding:4px 6px}.md .code-block{position:relative;margin:5px 0}.md .code-block>.code-content{-webkit-user-select:text;user-select:text}.md .code-block>.topbar{position:relative;height:30px;display:flex;border-bottom:1px solid var(--prim-light)}.md .code-block>.topbar>span{flex:1;padding-left:5px;align-content:center;font-size:var(--text-size-normal);-webkit-user-select:none;user-select:none}.md .code-block>.topbar>button{width:30px;display:flex;align-items:center;justify-content:center;padding:0;border:none;background-color:transparent;cursor:pointer}.md .code-block>.topbar>button>icon{width:18px}.md .code-block>.topbar>button.copy>icon{padding-left:2px}.md>.alert{margin-top:10px;margin-bottom:10px;padding-left:15px;padding-top:5px;padding-bottom:10px;border-left:3px solid var(--prim)}.md>.alert>.header{display:flex;align-items:center;margin-bottom:10px}.md>.alert>.header>icon{margin-right:7px;width:22px}.md>.alert>.header>p{margin:0;font-weight:600}.md>.alert-note{border-color:var(--md-alert-note)}.md>.alert-note .header,.md>.alert-note .header>icon{color:var(--md-alert-note)}.md>.alert-tip{border-color:var(--md-alert-tip)}.md>.alert-tip .header,.md>.alert-tip .header>icon{color:var(--md-alert-tip)}.md>.alert-important{border-color:var(--md-alert-important)}.md>.alert-important .header,.md>.alert-important .header>icon{color:var(--md-alert-important)}.md>.alert-warning{border-color:var(--md-alert-warning)}.md>.alert-warning .header,.md>.alert-warning .header>icon{color:var(--md-alert-warning)}.md>.alert-caution{border-color:var(--md-alert-caution)}.md>.alert-caution .header,.md>.alert-caution .header>icon{color:var(--md-alert-caution)}.md blockquote{margin:0 0 10px;padding-left:40px;border-left:2px solid var(--prim)}.code-content{padding:10px 10px 10px 12.5px}.code-content>div{min-height:15px}.code-content .code_token{white-space:pre;color:#f700ff;font-family:jetbrains mono}.code-content .code_token_word{color:#fff}.code-content .code_token_keyword{color:#fb6c48}.code-content .code_token_constant{color:#df4559}.code-content .code_token_operator{color:#e37f27}.code-content .code_token_variable{color:#9cc5e3}.code-content .code_token_type{color:#68d087}.code-content .code_token_function{color:#559cd7}.code-content .code_token_punctuation{color:#cecece}.code-content .code_token_bracket{color:#ffe629}.code-content .code_token_string{color:#56ca86}.code-content .code_token_comment{color:#9555b3;font-style:italic}.code-content .code_token_decorator{color:#96fff3}.code-content .code_token_property_holder{color:#b5d5ff}.code-content .code_token_escape{color:#fb6c48;font-style:italic}.code-content .code_token_subst{color:#9cc5e3}.code-content .code_token_regexp{color:#56ca86}.code-content .code_token_symbol{color:#df4559}.code-content .code_token_property{color:#b5d5ff}.code-content .code_token_meta{color:#cecece;font-style:italic}.code-content .code_token_title{color:#559cd7;font-weight:700}.code-content .code_token_tag{color:#68d087}.code-content .code_token_attribute{color:#559cd7}#popup-container{position:absolute;display:flex;align-items:center;justify-content:center}#popup-container:empty{display:none}#popup-container.cover{inset:0;background-color:color-mix(in srgb,var(--back-dark) 50%,transparent)}#image-popup{position:absolute;inset:0;opacity:0;display:flex;align-items:center;justify-content:center;transition:opacity .2s}#image-popup>img{max-width:50vw;max-height:50vh;object-fit:contain;cursor:pointer;transition:transform .2s ease-in-out}#image-popup.open{opacity:100%}#user-popup{display:flex;flex-direction:column;align-items:center;justify-content:center;height:500px;background-color:var(--prim);border:1px solid var(--prim-light);border-radius:15px}#user-popup>.top{position:relative;width:300px}#user-popup>.top>header{height:100px;border-radius:15px 15px 0 0;background:linear-gradient(20deg,color-mix(var(--accent) 50%,var(--seco) 50%),var(--accent) 100%)}#user-popup>.top>img{position:absolute;bottom:-37.5px;left:25px;width:75px;border-radius:100%;outline:5px solid var(--prim)}#user-popup>.body{width:100%;box-sizing:border-box;height:400px;padding:50px 10px 10px;flex:1}#user-popup>.body>h2{margin:0 0 0 20px}#right-click{position:fixed;left:0;top:0;background-color:var(--prim);border:1px solid var(--prim-light);border-radius:0 15px 15px;overflow-x:hidden;overflow-y:auto;display:flex;flex-direction:column}#right-click>button{border:none;background-color:transparent;display:flex;gap:7.5px;padding:10px;font-size:15px;color:var(--text);font-family:Noto Sans;text-wrap:nowrap;cursor:pointer;transition:background-color .1s}#right-click>button>icon{width:20px;height:20px}#right-click>button:not(:last-child){border-bottom:1px solid var(--prim-light)}#right-click>button:hover{background-color:var(--prim-light)}#right-click>hr{width:100%;margin:0;border:none;border-top:2px solid var(--seco)}.user-component{display:flex;align-items:center;gap:10px;padding:5px;-webkit-user-select:none;user-select:none;cursor:pointer;transition:background-color .05s}.user-component>img{width:30px;border-radius:100%}.user-component:hover{background-color:var(--prim);border-radius:5px}