:root{--text-color:#efefef;--text-color-2:#232323;--chat-color-1:#187ddb;--chat-border-color-1:#888;--chat-color-2:#333;--chat-border-color-2:#666;--primary-bg:#121212;--secondary-bg:#333;--ternary-bg:#fff;--danger-bg:rgb(187, 61, 61);--primary-border:#333;--secondary-border:#555}*{font-family:Helvetica,Arial,sans-serif;box-sizing:border-box;padding:0;margin:0;transition:all 0.2s ease-in-out;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--text-color)}.widget-btn{transition:none!important}.widget-btn:active{box-shadow:inset 0 3px 10px 3px var(--secondary-border)}input,select,option{color:#000}.options-menu *,.chat-box *,#dm-list *,#member-list *{transition:none}.options-menu,.sidebar-wrapper,.chat-box{user-select:none}[data-nick]{user-select:none;-webkit-user-select:none}html,body{height:100%}.visible{display:block!important;transform:scale(1)!important}.auto-login-permission-wrapper>*{display:inline}.login-area{height:100%;width:100%;background-color:var(--primary-bg);display:none}.login-area-inner,.login-area-inner form{height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.login-area-inner form>*{width:50%;padding:10px;margin:10px 0;transition:none;align-items:center}.login-area #join-btn{width:40%;text-align:left;background:#187ddb;padding:10px}.login-area #join-btn:active{filter:brightness(80%)}.login-area #join-btn.joining{pointer-events:none;filter:grayscale(100%)}.login-area #join-btn:before{content:"JOIN";display:inline-block;width:100%;text-align:center;margin:0;left:0;position:relative}.login-area #join-btn.joining:before{content:"JOINING...";width:80%}.login-area #join-btn.joining:after{content:"◠";font-weight:700;width:max-content!important;display:inline-block;width:100%;text-align:center;margin:0;left:0;position:relative;animation:rotate 1s linear infinite}@keyframes rotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}#error-box:not(:empty){display:block;background-color:#ca4242;border-radius:10px;text-align:center;width:80%}#error-box:not(:empty):before{content:"⚠️";padding-right:5px;font-size:20px}.rejoin-area{height:100%;width:100%;background-color:var(--primary-bg);display:none}.rejoin-area-inner{height:100%;width:100%;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:20px;flex-wrap:wrap;align-content:center}.rejoin-area-inner>*{flex-basis:25%;padding:10px;margin:10px 0;transition:none}.rejoin-area .widget-btn{text-align:center;background-color:var(--chat-color-1)}.rejoin-area #logout-btn{background-color:var(--danger-bg)}.rejoin-area #error-box{flex-basis:80%;flex-direction:row}.rejoin-area #rejoin-btn:active{filter:brightness(80%)}.rejoin-area #rejoin-btn.joining{pointer-events:none;filter:grayscale(100%)}.rejoin-area #rejoin-btn:before{content:"Retry";display:inline-block;width:100%;text-align:center;margin:0;left:0;position:relative}.rejoin-area #rejoin-btn.joining:before{content:"JOINING...";width:80%}.rejoin-area #rejoin-btn.joining:after{content:"◠";font-weight:700;width:max-content!important;display:inline-block;width:100%;text-align:center;margin:0;left:0;position:relative;animation:rotate 1s linear infinite}.chat-area{position:relative;display:none;width:100%;height:100%;overflow:hidden}.chat-box-wrapper{height:100%;display:none}.chat-header{background-color:var(--secondary-bg);text-align:center;border-bottom:1px solid var(--secondary-border)}.chat-header{font-size:0;padding:10px 10px 10px 10px;height:10%;line-height:60px}.chat-header>*{font-size:15px;display:inline-block;width:15%;vertical-align:middle;line-height:normal}.chat-header #chat-heading{width:70%}.chat-box#main .chat-header #chat-heading{width:55%}.chat-header>*:not(#chat-heading){color:var(--text-color-2);background-color:var(--ternary-bg);padding:10px 5px;border-radius:20px}.chat-header #dm-btn{position:relative;left:0%}.chat-header #dm-btn.unread:before{content:"•";position:absolute;display:block;color:red;font-size:25px;padding:0 10px;top:-8px;left:-10px}.chat-header #dm-close-btn{color:var(--text-color-2);border:1px solid #333;border-radius:50px;background-color:var(--ternary-bg);padding:3px 0;font-size:25px;text-align:center;font-weight:700}.chat-header #member-list-btn{right:5%}.chat-box{border:1px solid var(--primary-border);background-color:var(--primary-bg);width:100%;height:90%;display:none}.chat-box.visible{display:block}.chat-messages-box{overflow-y:scroll;overflow-x:hidden;padding:20px 20px 0 20px;width:100%;height:90%}.chat-message.notice{display:block;width:100%;border-bottom:1px solid var(--secondary-border);padding-bottom:10px;margin-bottom:10px}.chat-message:not(.notice){font-size:17px;position:relative;display:block;max-width:100%;width:max-content;padding:12px 20px 10px 15px;margin-bottom:14px;border-radius:20px;border:1px solid var(--chat-border-color-2);background-color:var(--chat-color-2);line-break:auto}.chat-message:not(.notice):not(.me):active{filter:brightness(200%)}.chat-message.me{color:var(--sent-chat-color);margin-left:auto;margin-right:0;background-color:var(--chat-color-1);border:1px solid var(--chat-border-color-1)!important;border:none}.chat-message.me:after{content:"";display:block;position:absolute;background:var(--chat-color-1)!important;right:-10px;bottom:1px;height:33px;width:22px;clip-path:polygon(0% 50%,0% 100%,100% 100%);border-bottom:1px solid var(--chat-border-color-1)}.chat-message[data-nick]:not(.me):before{content:attr(data-nick) ": ";font-weight:700}.chat-message[data-nick]:not(.me):not(.notice):after{content:"";display:block;position:absolute;left:-10px;background:var(--chat-color-2)!important;bottom:1px;height:33px;width:22px;clip-path:polygon(100% 50%,0% 100%,100% 100%);border-bottom:1px solid var(--chat-border-color-2)}.chat-message[data-nick]:not(.me):not(.notice):active:after{content:"";display:block;position:absolute;left:-10px;bottom:1;height:33px;width:19px;clip-path:polygon(100% 50%,0% 100%,100% 100%)}.chat-message #tag{color:var(--chat-color-1);font-weight:700}.chat-message-input-box{height:10%;bottom:0;background-color:var(--secondary-bg);width:100%;padding:10px;font-size:0;border-top:1px solid var(--secondary-border)}.chat-message-input-box>*{font-size:15px;display:inline-block;vertical-align:middle}.chat-message-input-box input{padding:20px;width:80%;border-radius:50px;border:1px solid var(--primary-border)}.chat-message-input-box #send-btn-box{width:20%;text-align:center}.chat-message-input-box #msg-send-btn{border:none;background-color:var(--chat-color-1);font-size:30px;padding:10px 15px;border-radius:50%}.sidebar-header{background-color:var(--primary-bg);font-size:0;padding:0 15px;height:8%}.sidebar-header>*{display:inline-block;font-size:20px}.sidebar-header h3{text-align:center;padding:20px 0;width:80%}.sidebar-header .sidebar-close-btn{color:var(--text-color-2);width:20%;border:1px solid var(--primary-border);border-radius:50px;background-color:var(--ternary-bg);font-size:25px;text-align:center}.sidebar-wrapper{position:absolute;top:0;height:100%;width:100%}#dm-sidebar{left:0;z-index:1;margin-left:-100%}#dm-box{height:100%;width:60%;margin-right:auto;background-color:var(--secondary-bg);border:#888;z-index:1;border:2px solid var(--secondary-border);border-width:2px 2px 0 0}#dm-sidebar.hash-nav-active{margin-left:0;opacity:1}#dm-box #dm-list{overflow-y:scroll;height:85%}#dm-box #dm-list:empty:after{content:"No messages yet 📭";display:block;width:max-content;margin:50% auto}#dm-box #dm-list-item:first-child{border-width:1px 0 1px 0}#dm-box #dm-list-item{position:relative;display:block;border:1px solid var(--secondary-border);border-width:0 0 1px 0;height:60px;line-height:60px}#dm-box #dm-list-item:active{background:var(--primary-bg)}#dm-box #dm-list-item #dm-remove-btn{padding-right:15px;font-size:20px;line-height:20px;pointer-events:all;display:inline-block;height:100%;vertical-align:middle;line-height:100%;line-height:60px;width:10%}#dm-box #dm-list-item #nick-name{pointer-events:none;display:inline-block;width:90%;padding-left:15px}#dm-box #dm-list-item.unread #nick-name:after{content:"•";font-size:20px;padding:0 10px;right:10px;display:inline-block;vertical-align:middle;line-height:20px}#dm-box .dm-list-footer{display:flex;flex-direction:column;width:100%;height:7%;padding:10px;background-color:var(--primary-bg)}#dm-box #clear-dms-btn{align-self:center;vertical-align:middle;padding:10px;border-radius:50px;width:max-content;color:var(--text-color-2);background-color:var(--ternary-bg)}#member-list-sidebar{right:0;z-index:2;margin-right:-100%}#member-list-header h3[data-count]:after{content:"(" attr(data-count) ")";padding-left:5px;display:inline-block;font-size:13px}#member-list-box{height:100%;overflow:scroll;width:60%;margin-left:auto;background-color:var(--secondary-bg);border:#888;border:2px solid var(--ternary-bg);border-width:2px 0 0 2px}#member-list-sidebar.hash-nav-active{margin-right:0%;opacity:1}#member-list-box #member-list{padding:15px 0;overflow:scroll;height:90%}#member-list-box #member-list:empty:after{content:"Loading members...";display:block;width:max-content;margin:50% auto}#member-list-box #member-list-item:before{content:"●";margin-right:10px}#member-list-box #member-list-item{display:block;padding:10px 20px}#member-list-box #member-list-item:active{background-color:var(--primary-bg)}#member-list-box div[data-heading]:before{content:attr(data-heading);font-size:17px;color:var(--text-color);font-weight:700;display:block;margin:10px 0;padding-left:15px}.options-menu{width:50%;background-color:var(--ternary-bg);margin:0 auto;border:2px solid var(--primary-border);position:absolute;border-radius:10px;z-index:999;display:none;overflow:hidden;transform:scale(.8)}.options-menu>*{color:var(--secondary-bg);padding:10px 25px;border-bottom:1px solid var(--secondary-border);display:block}.options-menu>*:active{color:var(--text-color);background-color:var(--secondary-bg)}.options-menu #options-for{font-size:14px;text-align:left;padding:10px}.options-menu #options-for:after,.options-menu #logged-in-as:after{content:attr(data-nick);padding-left:5px;display:inline-block;color:var(--text-color-2);font-weight:700;font-size:14px}.options-menu #block-btn:after{content:"Block";display:block}.options-menu #block-btn[data-blocked='true']:after{content:"Unblock";display:block}.options-menu#app-options{position:absolute;right:0;top:10%;z-index:1}#app-options #logged-in-as{pointer-events:none}.preferences-header{background-color:var(--secondary-bg);color:#efefef;text-align:center;border-bottom:1px solid var(--secondary-border)}.preferences-box{position:relative;display:none;width:100%;height:100%;overflow:hidden}.preferences-header{font-size:0;padding:10px 10px 10px 10px;height:10%;line-height:60px}.preferences-header>*{font-size:15px;display:inline-block;width:15%;vertical-align:middle;line-height:normal}.preferences-header #preferences-heading{width:70%}.preferences-header>*:not(#preferences-heading){color:var(--text-color-2);background-color:var(--ternary-bg);padding:10px 5px;border-radius:20px}.preferences-header #close-btn{color:var(--text-color-2);border:1px solid #333;border-radius:50px;background-color:var(--ternary-bg);padding:3px 0;font-size:25px;text-align:center;font-weight:700}.chat-header #member-list-btn{right:5%}.preferences-body{padding:20px;background-color:var(--primary-bg);height:90%}.preference-item{margin:10px 0;padding:10px;vertical-align:middle;border-bottom:1px solid var(--secondary-border)}.preference-item>*{display:inline-block;line-height:1;vertical-align:middle;max-width:60%}.preference-item .switch{padding-right:20px;max-width:40%}@media screen and (max-height:500px){.chat-message-input-box{height:19%}.chat-box{height:81%}.chat-header{height:20%}.chat-messages-box{height:80%}}@media screen and (min-width:800px){html{background-color:#888}body{width:800px;margin:auto}}.switch-wrapper{width:max-content;height:max-content;position:relative;overflow:hidden;transition:all 0.2s ease-in-out!important;display:inline}.switch{width:45px;height:25px;display:inline-block;border:1px solid #333;background-color:#ccc;border-radius:50px;position:relative;overflow:hidden}.switch:after{content:"";display:block;width:50%;height:95%;border-radius:50px;background-color:#333;box-shadow:inset 0 0 0 2px #ccc;position:absolute;top:0%;left:5%}.switch-wrapper input[type=checkbox]:checked+.switch{background-color:#2780e6}.switch-wrapper input[type=checkbox]:checked+.switch:after{content:"";display:block;width:50%;height:95%;border-radius:50px;background-color:#ccc;box-shadow:inset 0 0 0 2px #2780e6;position:absolute;top:0%;left:auto;right:0}.switch-wrapper input[type=checkbox]{position:absolute;top:0;left:0;transform:scaleX(5)scaleY(2);z-index:1;opacity:0}