:root{--background-primary:#313338;--background-secondary:#2b2d31;--background-tertiary:#1e1f22;--background-accent:#35373c;--text-normal:#dbdee1;--text-muted:#949ba4;--text-link:#00aff4;--brand-experiment:#5865f2;--status-online:#23a55a;--status-idle:#f0b232;--status-dnd:#f23f43;}
body{font-family:sans-serif;margin:0;padding:0;background:var(--background-tertiary);color:var(--text-normal);display:flex;height:100vh;overflow:hidden;user-select:none;}
button,input,textarea,select{font-family:inherit;}
.guilds-sidebar{width:72px;background:var(--background-tertiary);display:flex;flex-direction:column;align-items:center;padding-top:12px;gap:8px;flex-shrink:0;overflow-y:auto;}
.guild-icon-wrapper{position:relative;width:48px;height:48px;cursor:pointer;margin-bottom:4px;}
.guild-icon{width:48px;height:48px;border-radius:50%;background:var(--background-secondary);display:flex;align-items:center;justify-content:center;color:#fff;font-weight:600;transition:border-radius 0.2s,background-color 0.2s;background-size:cover;background-position:center;font-size:14px;text-align:center;}
.guild-icon-wrapper:hover .guild-icon,.guild-icon-wrapper.active .guild-icon{border-radius:16px;background-color:var(--brand-experiment);}
.guild-indicator{position:absolute;left:-12px;top:18px;width:4px;height:12px;background:#fff;border-radius:0 4px 4px 0;transition:height 0.2s,top 0.2s;}
.guild-icon-wrapper:hover .guild-indicator{height:20px;top:14px;}
.guild-icon-wrapper.active .guild-indicator{height:40px;top:4px;}
.channels-sidebar{width:240px;background:var(--background-secondary);display:flex;flex-direction:column;flex-shrink:0;}
.server-header{height:48px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(0,0,0,0.2);color:#fff;font-weight:bold;box-shadow:0 1px 2px rgba(0,0,0,0.1);cursor:pointer;}
.channels-scroll{flex-grow:1;overflow-y:auto;padding:8px 0;}
.category-wrapper{margin-top:12px;}
.category-header{padding:0 8px 0 16px;display:flex;align-items:center;font-size:12px;font-weight:bold;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.5px;}
.channel-row{height:34px;margin:2px 8px;padding:0 8px;display:flex;align-items:center;border-radius:4px;color:var(--text-muted);cursor:pointer;gap:6px;font-size:14px;}
.channel-row:hover{background:rgba(255,255,255,0.05);color:var(--text-normal);}
.channel-row.active{background:rgba(255,255,255,0.1);color:#fff;}
.channel-icon{color:var(--text-muted);font-weight:bold;width:16px;}
.user-panel{height:52px;background:#232428;display:flex;align-items:center;padding:0 8px;gap:8px;}
.user-info{display:flex;align-items:center;gap:8px;flex-grow:1;min-width:0;}
.user-avatar-wrapper{position:relative;width:32px;height:32px;}
.user-avatar{width:32px;height:32px;border-radius:50%;background:var(--brand-experiment);background-size:cover;}
.center-chat-area{flex-grow:1;display:flex;flex-direction:column;background:var(--background-primary);position:relative;}
.chat-header{height:48px;padding:0 16px;display:flex;align-items:center;background:var(--background-primary);border-bottom:1px solid rgba(0,0,0,0.2);box-shadow:0 1px 2px rgba(0,0,0,0.1);z-index:10;gap:8px;}
.chat-header-title{color:#fff;font-weight:bold;font-size:16px;}
.chat-header-separator{width:1px;height:16px;background:var(--background-accent);}
.chat-header-topic{font-size:14px;color:var(--text-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.messages-container{flex-grow:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:12px;}
.msg-wrapper{display:flex;align-items:flex-start;padding:4px 16px;border-radius:4px;transition:background 0.1s;}
.msg-wrapper:hover{background:rgba(255,255,255,0.02);}
.reply-context{display:flex;align-items:center;font-size:13px;color:var(--text-muted);margin-left:56px;margin-bottom:4px;position:relative;}
.reply-context::before{content:'';position:absolute;left:-16px;top:50%;width:12px;height:8px;border-left:2px solid #4e5058;border-top:2px solid #4e5058;border-top-left-radius:4px;transform:translateY(-25%);}
.reply-avatar{width:16px;height:16px;border-radius:50%;margin-right:4px;}
.reply-author{font-weight:600;margin-right:4px;color:#f2f3f5;}
.reply-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-style:italic;}
.msg-avatar{width:40px;height:40px;border-radius:50%;margin-right:16px;background-size:cover;background-position:center;background-color:var(--brand-experiment);flex-shrink:0;}
.msg-content-box{flex-grow:1;min-width:0;}
.msg-meta{display:flex;align-items:baseline;margin-bottom:4px;}
.msg-user{font-weight:600;color:#fff;margin-right:8px;font-size:14px;}
.msg-bot-tag{background:var(--brand-experiment);color:#fff;font-size:10px;font-weight:700;padding:1px 4px;border-radius:3px;margin-right:8px;}
.msg-timestamp{color:var(--text-muted);font-size:12px;}
.msg-text-content{font-size:15px;line-height:1.375rem;color:#dbdee1;white-space:pre-wrap;word-break:break-word;}
.members-sidebar{width:240px;background:var(--background-secondary);display:flex;flex-direction:column;flex-shrink:0;padding:16px 8px;box-sizing:border-box;overflow-y:auto;}
.member-group-title{font-size:12px;font-weight:bold;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.5px;padding:8px 8px 4px 8px;}
.member-item-row{display:flex;align-items:center;padding:6px 8px;border-radius:4px;gap:12px;}
.member-avatar{width:32px;height:32px;border-radius:50%;background-size:cover;background-position:center;}
.member-display-name{font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.chat-bottom-form-area{padding:0 16px 24px 16px;background:var(--background-primary);position:relative;}
.input-chat-box-container{background:#383a40;border-radius:8px;display:flex;flex-direction:column;padding:10px 16px;position:relative;}
.input-chat-box-container textarea{background:none;border:none;padding:0;margin:0;resize:none;max-height:120px;font-size:15px;outline:none;width:100%;color:#dbdee1;font-family:inherit;}
.autocomplete__13533{position:absolute;bottom:100%;left:0;width:100%;background:#2b2d31;border-radius:8px;box-shadow:0 -2px 10px rgba(0,0,0,0.3);z-index:1000;margin-bottom:8px;overflow:hidden;}
.autocompleteInner__13533{padding:8px 0;}
.contentTitle__13533{padding:8px 16px;font-size:12px;font-weight:bold;color:var(--text-muted);text-transform:uppercase;}
.autocompleteRow__13533{display:flex;align-items:center;padding:8px 16px;cursor:pointer;gap:12px;}
.autocompleteRow__13533:hover,.autocompleteRow__13533.active{background:#35373c;}
.autocompleteRowHeading__13533{font-weight:600;color:#fff;}
.settings-drawer{position:fixed;top:0;right:-360px;width:360px;height:100%;background:var(--background-secondary);box-shadow:-4px 0 10px rgba(0,0,0,0.3);z-index:2000;transition:right 0.3s ease;display:flex;flex-direction:column;}
.settings-drawer.open{right:0;}
.drawer-header{padding:16px;font-weight:bold;color:#fff;border-bottom:1px solid rgba(0,0,0,0.2);display:flex;justify-content:space-between;align-items:center;height:48px;box-sizing:border-box;}
.drawer-content{padding:16px;overflow-y:auto;flex-grow:1;display:flex;flex-direction:column;gap:16px;}
.layerContainer__59d0d{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:9999;pointer-events:none;}
.menu_c1e9c4{position:absolute;background:#111214;border-radius:4px;padding:6px;min-width:188px;box-shadow:0 4px 10px rgba(0,0,0,0.5);pointer-events:auto;}
.item_c1e9c4{display:flex;align-items:center;justify-content:space-between;padding:8px 10px;font-size:14px;color:#b5bac1;border-radius:2px;cursor:pointer;}
.item_c1e9c4:hover{background:var(--brand-experiment);color:#fff;}
.item_c1e9c4.colorDanger_c1e9c4{color:#fa777c;}
.item_c1e9c4.colorDanger_c1e9c4:hover{background:#da373c;color:#fff;}
.hidden{display:none !important;}
.active-reply-banner{background:#2b2d31;padding:8px 12px;border-radius:8px 8px 0 0;font-size:13px;display:flex;justify-content:space-between;align-items:center;color:#b5bac1;border-bottom:1px solid rgba(0,0,0,0.2);}
.cancel-reply-btn{background:none;border:none;color:#f23f43;cursor:pointer;font-weight:bold;}

/* Discord Channels List Styles */
.content_d125d2 {
  list-style: none;
  padding: 0;
  margin: 0;
}
.containerDefault_c69b6d {
  position: relative;
  margin: 2px 0;
}
.wrapper__2ea32 {
  padding: 0 8px;
}
.link__2ea32 {
  display: flex;
  align-items: center;
  text-decoration: none;
  color: var(--text-muted);
  border-radius: 4px;
  height: 34px;
  padding: 0 8px;
}
.link__2ea32:hover {
  background-color: rgba(255, 255, 255, 0.05);
  color: var(--text-normal);
}
.selectedChannel_c69b6d .link__2ea32,
.modeSelected__2ea32 .link__2ea32 {
  background-color: rgba(255, 255, 255, 0.1);
  color: #fff;
}
.linkTop__2ea32 {
  display: flex;
  align-items: center;
  width: 100%;
}
.iconContainer__2ea32 {
  margin-right: 6px;
  display: flex;
  align-items: center;
}
.icon__2ea32 {
  width: 20px;
  height: 20px;
  color: var(--text-muted);
}
.selectedChannel_c69b6d .icon__2ea32,
.modeSelected__2ea32 .icon__2ea32 {
  color: #fff;
}
.name__2ea32 {
  font-size: 14px;
  font-weight: 500;
  flex-grow: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.children__2ea32 {
  display: none;
  align-items: center;
  gap: 4px;
}
.link__2ea32:hover .children__2ea32 {
  display: flex;
}
.iconItem_c69b6d {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16px;
  height: 16px;
  color: var(--text-muted);
  cursor: pointer;
}
.iconItem_c69b6d:hover {
  color: var(--text-normal);
}
.actionIcon_c69b6d {
  width: 16px;
  height: 16px;
}
.sectionDivider__629e4 {
  height: 1px;
  background-color: rgba(255, 255, 255, 0.08);
  margin: 8px 8px;
}

/* Vencord style membercount widget */
.vc-membercount-widget {
  padding: 8px 12px;
  margin-bottom: 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  display: flex;
  gap: 16px;
  font-size: 13px;
  color: var(--text-normal);
  align-items: center;
}
.vc-membercount-container {
  display: flex;
  align-items: center;
  gap: 4px;
}
.vc-membercount-online-count {
  width: 10px;
  height: 10px;
  color: var(--status-online);
}
.vc-membercount-total-count {
  width: 10px;
  height: 10px;
  color: var(--text-muted);
}
.vc-membercount-voice-icon {
  width: 12px;
  height: 12px;
  color: var(--text-muted);
}
.vc-membercount-value {
  font-weight: 600;
}

/* Discord-like Custom Audio Player */
.wrapperAudio_cf09d8 {
  background-color: var(--background-secondary);
  border: 1px solid var(--background-tertiary);
  border-radius: 8px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  max-width: 400px;
  box-sizing: border-box;
}

.audioMetadata_cf09d8 {
  display: flex;
  align-items: center;
  gap: 12px;
}

.audioFileIcon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.metadataContent_cf09d8 {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.metadataDownload_cf09d8 {
  color: var(--text-link);
  text-decoration: none;
  font-weight: 600;
  font-size: 14px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.metadataDownload_cf09d8:hover {
  text-decoration: underline;
}

.metadataSize_cf09d8 {
  color: var(--text-muted);
  font-size: 12px;
}

.audioControls_cf09d8 {
  background-color: #111214;
  border-radius: 20px;
  padding: 4px 12px;
  display: flex;
  align-items: center;
  gap: 8px;
  height: 32px;
  box-sizing: border-box;
}

.videoButton_cf09d8 {
  cursor: pointer;
  color: var(--text-normal);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  transition: color 0.2s;
  flex-shrink: 0;
}

.videoButton_cf09d8:hover {
  color: #fff;
}

.videoButton_cf09d8 svg {
  display: block;
}

.durationTimeWrapper_cf09d8 {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 12px;
  color: var(--text-normal);
  min-width: 70px;
  justify-content: center;
  font-family: Consolas, Monaco, monospace;
  user-select: none;
  flex-shrink: 0;
}

.durationTimeSeparator_cf09d8 {
  color: var(--text-muted);
}

.horizontal_b26b79 {
  flex-grow: 1;
  display: flex;
  align-items: center;
  margin: 0 4px;
  position: relative;
  min-width: 50px;
}

.mediaBarInteraction_b26b79 {
  width: 100%;
  height: 12px;
  display: flex;
  align-items: center;
  cursor: pointer;
  position: relative;
}

.mediaBarWrapper_b26b79 {
  position: relative;
  width: 100%;
  height: 4px;
  background-color: #4e5058;
  border-radius: 2px;
}

.mediaBarWrapper_b26b79.fakeEdges_b26b79 {
  overflow: visible;
}

.buffer_b26b79 {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.1);
  border-radius: 2px;
  pointer-events: none;
}

.mediaBarPreview_b26b79 {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.15);
  border-radius: 2px;
  pointer-events: none;
}

.mediaBarProgress_b26b79 {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  background-color: var(--brand-experiment);
  border-radius: 2px;
  pointer-events: none;
}

.mediaBarGrabber_b26b79 {
  position: absolute;
  right: -4px;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background-color: #fff;
  opacity: 0;
  transition: opacity 0.1s;
  pointer-events: none;
}

.mediaBarInteraction_b26b79:hover .mediaBarGrabber_b26b79 {
  opacity: 1;
}

.bubble_b26b79 {
  position: absolute;
  bottom: 18px;
  transform: translateX(-50%);
  background-color: #111214;
  color: #fff;
  font-size: 10px;
  padding: 2px 6px;
  border-radius: 3px;
  pointer-events: none;
  font-family: monospace;
  box-shadow: 0 2px 5px rgba(0,0,0,0.5);
  white-space: nowrap;
  z-index: 100;
}

.flex_abf706 {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.container__2d263 {
  position: relative;
  display: flex;
  align-items: center;
}

.volumeButton__2d263 {
  cursor: pointer;
  color: var(--text-normal);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  transition: color 0.2s;
  flex-shrink: 0;
}

.volumeButton__2d263:hover {
  color: #fff;
}

.volumeButtonSlider__2d263 {
  position: absolute;
  bottom: 28px;
  left: 50%;
  transform: translateX(-50%);
  width: 24px;
  height: 80px;
  background-color: #111214;
  border-radius: 4px;
  padding: 8px 0;
  display: none;
  justify-content: center;
  align-items: center;
  box-shadow: 0 4px 10px rgba(0,0,0,0.5);
  z-index: 10;
  box-sizing: border-box;
}

.container__2d263:hover .volumeButtonSlider__2d263,
.volumeButtonSlider__2d263:hover {
  display: flex;
}

.mediaBar__2d263.vertical_b26b79 {
  height: 64px;
  width: 12px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  position: relative;
}

.mediaBarWrapperVolume_b26b79 {
  width: 4px;
  height: 100%;
  background-color: #4e5058;
  position: relative;
  border-radius: 2px;
}

.mediaBarWrapperVolume_b26b79 .mediaBarProgress_b26b79 {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  background-color: var(--brand-experiment);
  border-radius: 2px;
}

.mediaBarWrapperVolume_b26b79 .mediaBarGrabber_b26b79 {
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 8px;
  height: 8px;
  background-color: #fff;
  border-radius: 50%;
}

/* Scrollbars - Only show on hover/movement */
.guilds-sidebar,
.channels-scroll,
.messages-container,
.members-sidebar,
.drawer-content {
  scrollbar-width: none; /* Hide scrollbars by default in Firefox */
}

.guilds-sidebar:hover,
.channels-scroll:hover,
.messages-container:hover,
.members-sidebar:hover,
.drawer-content:hover {
  scrollbar-width: thin; /* Show thin scrollbar on hover in Firefox */
  scrollbar-color: rgba(255, 255, 255, 0.2) transparent;
}

/* Webkit Scrollbars (Chrome, Safari, Edge, Opera) */
.guilds-sidebar::-webkit-scrollbar,
.channels-scroll::-webkit-scrollbar,
.messages-container::-webkit-scrollbar,
.members-sidebar::-webkit-scrollbar,
.drawer-content::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.guilds-sidebar::-webkit-scrollbar-track,
.channels-scroll::-webkit-scrollbar-track,
.messages-container::-webkit-scrollbar-track,
.members-sidebar::-webkit-scrollbar-track,
.drawer-content::-webkit-scrollbar-track {
  background: transparent;
}

.guilds-sidebar::-webkit-scrollbar-thumb,
.channels-scroll::-webkit-scrollbar-thumb,
.messages-container::-webkit-scrollbar-thumb,
.members-sidebar::-webkit-scrollbar-thumb,
.drawer-content::-webkit-scrollbar-thumb {
  background: transparent; /* Invisible by default */
  border-radius: 3px;
  transition: background-color 0.2s ease;
}

.guilds-sidebar:hover::-webkit-scrollbar-thumb,
.channels-scroll:hover::-webkit-scrollbar-thumb,
.messages-container:hover::-webkit-scrollbar-thumb,
.members-sidebar:hover::-webkit-scrollbar-thumb,
.drawer-content:hover::-webkit-scrollbar-thumb {
  background-color: rgba(255, 255, 255, 0.2); /* Show on hover */
}

.guilds-sidebar::-webkit-scrollbar-thumb:hover,
.channels-scroll::-webkit-scrollbar-thumb:hover,
.messages-container::-webkit-scrollbar-thumb:hover,
.members-sidebar::-webkit-scrollbar-thumb:hover,
.drawer-content::-webkit-scrollbar-thumb:hover {
  background-color: rgba(255, 255, 255, 0.35); /* Darker on thumb hover */
}