/* =========================================================================
   NEXUS — Uygulama kabuğu (server rail / kanal / sohbet / üyeler)
   ========================================================================= */

.app-shell {
  display: grid;
  grid-template-columns: 76px 240px 1fr 220px;
  height: 100vh;
  overflow: hidden;
}

/* ---- Sunucu rayı — Discord'un sol pilli daire dilinden bilinçli olarak
        ayrışan: squircle ikonlar + sağda parlayan gradyan çubuk ---------- */
.server-rail {
  background: var(--bg-deepest);
  border-right: 1px solid var(--border-subtle);
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: var(--space-4) 0;
  gap: var(--space-2);
  overflow-y: auto;
}
.server-rail-scroll {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  width: 100%;
}
.rail-item {
  position: relative;
  width: 48px; height: 48px;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer;
}
.rail-item .bubble {
  width: 48px; height: 48px;
  border-radius: var(--radius-squircle);
  background: var(--bg-elevated);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: 16px;
  color: var(--text-secondary);
  transition: border-radius .2s ease, background .2s ease, color .2s ease, transform .15s ease;
}
.rail-item .bubble img { width: 100%; height: 100%; object-fit: cover; }
.rail-item:hover .bubble { border-radius: var(--radius-md); background: var(--brand-gradient); color: var(--text-on-brand); transform: translateY(-1px); }
.rail-item.active .bubble { border-radius: var(--radius-md); background: var(--brand-gradient); color: var(--text-on-brand); box-shadow: var(--glow-brand); }
.rail-item .indicator {
  position: absolute; right: -12px; top: 50%; transform: translateY(-50%);
  width: 4px; height: 8px; border-radius: 4px 0 0 4px;
  background: var(--brand-gradient);
  opacity: 0; transition: opacity .15s ease, height .15s ease;
}
.rail-item:hover .indicator, .rail-item.active .indicator { opacity: 1; height: 26px; }
.rail-item .badge {
  position: absolute; bottom: -4px; right: -4px;
  background: var(--status-dnd); color: #1a0508;
  font-size: 10px; font-weight: 800;
  min-width: 17px; height: 17px; border-radius: 999px;
  display: flex; align-items: center; justify-content: center;
  padding: 0 3px; border: 2px solid var(--bg-deepest);
}
.rail-divider {
  width: 28px; height: 2px; background: var(--border-strong); border-radius: 2px; margin: 4px 0;
}
.rail-item.action .bubble { color: var(--status-online); border: 1px dashed var(--border-strong); background: transparent; }
.rail-item.action:hover .bubble { background: var(--brand-gradient); color: var(--text-on-brand); border-style: solid; border-color: transparent; }
.rail-item.dm .bubble { color: var(--pulse); }

/* ---- Kanal kenar çubuğu ------------------------------------------------ */
.channel-sidebar {
  background: var(--bg-base);
  display: flex;
  flex-direction: column;
  min-width: 0;
  border-right: 1px solid var(--border-subtle);
}
.server-header {
  height: 56px;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 var(--space-4);
  border-bottom: 1px solid var(--border-subtle);
  box-shadow: 0 1px 0 rgba(0,0,0,.15);
  cursor: pointer;
  flex-shrink: 0;
}
.server-header h3 {
  font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.channel-list-scroll { flex: 1; overflow-y: auto; padding: var(--space-3) var(--space-2); }
.channel-category {
  display: flex; align-items: center; justify-content: space-between;
  padding: var(--space-3) var(--space-2) var(--space-1);
  color: var(--text-muted);
  font-size: 11px; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase;
  cursor: pointer;
}
.channel-category:hover { color: var(--text-secondary); }
.channel-item {
  display: flex; align-items: center; gap: var(--space-2);
  padding: 7px var(--space-2);
  border-radius: var(--radius-sm);
  color: var(--text-secondary);
  font-size: 14.5px; font-weight: 500;
  cursor: pointer;
  margin-bottom: 1px;
  position: relative;
  border-left: 2px solid transparent;
}
.channel-item:hover { background: var(--bg-hover); color: var(--text-primary); }
.channel-item.active { background: var(--bg-active); color: var(--text-primary); border-left-color: var(--brand); }
.channel-item .ch-icon { color: var(--text-muted); flex-shrink: 0; }
.channel-item .ch-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.channel-item .unread-badge {
  background: var(--brand-gradient); color: var(--text-on-brand); font-size: 10px; font-weight: 800;
  border-radius: 999px; min-width: 16px; height: 16px; display: flex; align-items: center; justify-content: center; padding: 0 4px;
}
.channel-item .ch-manage { opacity: 0; }
.channel-item:hover .ch-manage { opacity: 1; }
.voice-participants { padding-left: 30px; margin-bottom: var(--space-2); }
.voice-participant { display: flex; align-items: center; gap: 8px; padding: 3px 0; font-size: 13px; color: var(--text-muted); }
.voice-participant img { width: 20px; height: 20px; border-radius: var(--radius-squircle); }

/* ---- Kullanıcı alt çubuğu (server-sidebar altı) ----------------------- */
.user-bar {
  height: 62px;
  background: var(--bg-elevated);
  display: flex; align-items: center; gap: var(--space-2);
  padding: 0 var(--space-3);
  flex-shrink: 0;
  border-top: 1px solid var(--border-subtle);
}
.user-bar .who { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 1; cursor: pointer; }
.user-bar .who .names { min-width: 0; }
.user-bar .who .name { font-size: 13.5px; font-weight: 700; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-bar .who .tag { font-size: 11.5px; color: var(--text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.user-bar .controls { display: flex; gap: 2px; }

/* ---- Sohbet alanı ------------------------------------------------------ */
.chat-panel { display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; position: relative; background: var(--bg-elevated); }
.chat-header {
  height: 56px; flex-shrink: 0;
  display: flex; align-items: center; gap: var(--space-2);
  padding: 0 var(--space-4);
  border-bottom: 1px solid var(--border-subtle);
  box-shadow: 0 1px 0 rgba(0,0,0,.15);
}
.chat-header .ch-title { font-size: 15px; font-weight: 700; display: flex; align-items: center; gap: 8px; }
.chat-header .ch-topic {
  color: var(--text-muted); font-size: 13px; padding-left: var(--space-3); border-left: 1px solid var(--border-subtle);
  margin-left: var(--space-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.chat-header .spacer { flex: 1; }
.chat-header .actions { display: flex; gap: var(--space-1); align-items: center; }
.search-box {
  background: var(--bg-deepest); border-radius: var(--radius-sm); padding: 6px 10px;
  font-size: 13px; color: var(--text-muted); width: 160px; border: 1px solid transparent;
}
.search-box:focus-within { border-color: var(--brand); }
.search-box input { background: none; border: none; color: var(--text-primary); outline: none; width: 100%; font-size: 13px; }

.message-scroll { flex: 1 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scroll-behavior: smooth; padding: var(--space-4) 0; display: flex; flex-direction: column; }
.message-scroll .load-more { text-align: center; padding: var(--space-3); }

.message-group { padding: 4px var(--space-5); display: flex; gap: var(--space-3); position: relative; }
.message-group:hover { background: rgba(255,255,255,0.015); }
.message-group .avatar { width: 40px; height: 40px; margin-top: 2px; cursor: pointer; }
.message-group .body { flex: 1; min-width: 0; }
.message-group .meta { display: flex; align-items: baseline; gap: 8px; margin-bottom: 2px; }
.message-group .author { font-weight: 600; font-size: 15px; cursor: pointer; }
.message-group .author:hover { text-decoration: underline; }
.message-group .time { font-size: 11.5px; color: var(--text-muted); }
.message-group .edited-tag { font-size: 10.5px; color: var(--text-muted); }
.message-line { display: flex; gap: var(--space-3); padding: 1px var(--space-5); position: relative; }
.message-line:hover { background: rgba(255,255,255,0.015); }
.message-line .time-gutter { width: 40px; flex-shrink: 0; font-size: 10.5px; color: var(--text-muted); opacity: 0; text-align: right; padding-top: 3px; }
.message-line:hover .time-gutter { opacity: 1; }
.msg-content { color: var(--text-primary); font-size: 15px; line-height: 1.5; white-space: pre-wrap; overflow-wrap: anywhere; }
.msg-content:empty { display: none; }
.msg-content .mention { background: var(--brand-soft); color: var(--brand-hover); border-radius: 4px; padding: 0 3px; font-weight: 600; }

.msg-actions {
  position: absolute; top: -14px; right: var(--space-5);
  background: var(--bg-base); border: 1px solid var(--border-subtle);
  border-radius: var(--radius-sm); display: none; box-shadow: var(--shadow-panel);
}
.message-group:hover .msg-actions, .message-line:hover .msg-actions { display: flex; }
.msg-actions button { padding: 6px 8px; }

.reply-preview {
  display: flex; align-items: center; gap: 6px; color: var(--text-muted); font-size: 12.5px; margin-bottom: 3px; padding-left: var(--space-1);
}
.reply-preview .reply-author { color: var(--text-secondary); font-weight: 600; }

.attachments-grid { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.att-image { max-width: 320px; max-height: 320px; border-radius: var(--radius-md); cursor: pointer; display: block; }
.att-file {
  display: flex; align-items: center; gap: 10px;
  background: var(--bg-base); border: 1px solid var(--border-subtle);
  border-radius: var(--radius-md); padding: 10px 14px; max-width: 320px;
}
.att-file .name { font-size: 13.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.att-file .size { font-size: 11.5px; color: var(--text-muted); }

.reactions-row { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.reaction-chip {
  display: flex; align-items: center; gap: 5px;
  background: var(--bg-base); border: 1px solid var(--border-subtle);
  border-radius: var(--radius-full); padding: 3px 9px; font-size: 12.5px; cursor: pointer;
  transition: border-color .12s ease, background-color .12s ease;
}
.reaction-chip.reacted { border-color: var(--brand); background: var(--brand-soft); }
.reaction-chip:hover { border-color: var(--brand); }
.reaction-add-btn {
  display: flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: var(--radius-full);
  background: var(--bg-base); border: 1px solid var(--border-subtle); color: var(--text-muted); cursor: pointer;
}

.typing-indicator { padding: 0 var(--space-5); height: 22px; font-size: 12.5px; color: var(--text-muted); display: flex; align-items: center; gap: 6px; }

.composer-wrap { padding: 0 var(--space-5) var(--space-5); flex-shrink: 0; position: relative; z-index: 5; background: var(--bg-elevated); }
.chat-scroll-bottom {
  position: absolute; right: calc(var(--space-5) + 8px); top: -48px;
  width: 38px; height: 38px; border-radius: 50%;
  border: 1px solid var(--border-strong); background: var(--bg-base); color: var(--brand);
  display: grid; place-items: center; cursor: pointer; z-index: 8;
  box-shadow: 0 8px 24px rgba(0,0,0,.28);
  opacity: 0; visibility: hidden; transform: translateY(8px) scale(.92);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease, visibility .18s ease, background .15s ease;
}
.chat-scroll-bottom.visible { opacity: 1; visibility: visible; transform: translateY(0) scale(1); pointer-events: auto; }
.chat-scroll-bottom:hover { background: var(--brand-soft); transform: translateY(-2px) scale(1.03); }
.chat-scroll-bottom i { font-size: 13px; }

.composer {
  background: var(--bg-base); border-radius: var(--radius-md);
  display: flex; align-items: flex-end; gap: 6px; padding: 10px 12px;
  border: 1px solid transparent;
}
.composer:focus-within { border-color: var(--border-strong); }
.composer textarea {
  flex: 1; background: none; border: none; color: var(--text-primary);
  resize: none; font-size: 15px; font-family: var(--font-body); line-height: 1.5;
  max-height: 200px; outline: none; padding: 6px 4px;
}
.composer textarea::placeholder { color: var(--text-muted); }
.composer .composer-actions { display: flex; gap: 2px; }
.mobile-more-btn { display: none; }
.pending-attachments { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.pending-att { position: relative; background: var(--bg-base); border-radius: var(--radius-sm); padding: 6px 10px; font-size: 12.5px; display: flex; align-items: center; gap: 6px; border: 1px solid var(--border-subtle); }
.pending-att button { background: none; border: none; color: var(--text-muted); cursor: pointer; }

.reply-bar {
  display: flex; align-items: center; justify-content: space-between;
  background: var(--bg-base); border-radius: var(--radius-sm) var(--radius-sm) 0 0;
  padding: 8px 14px; font-size: 12.5px; color: var(--text-secondary); margin-bottom: -1px;
}

.date-divider { display: flex; align-items: center; gap: 12px; padding: var(--space-4) var(--space-5) var(--space-2); color: var(--text-muted); font-size: 12px; font-weight: 600; }
.date-divider::before, .date-divider::after { content: ''; flex: 1; height: 1px; background: var(--border-subtle); }

/* ---- Üye listesi -------------------------------------------------------- */
.member-panel {
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-base) 96%, var(--brand) 4%),
      var(--bg-base)
    );
  overflow-y: auto;
  overflow-x: hidden;
  padding: 0 10px 18px;
  border-left: 1px solid var(--border-subtle);
}

.member-panel::-webkit-scrollbar {
  width: 5px;
}

.member-panel::-webkit-scrollbar-track {
  background: transparent;
}

.member-panel::-webkit-scrollbar-thumb {
  background: var(--border-strong);
  border-radius: 20px;
}

.member-panel-top {
  position: sticky;
  top: 0;
  z-index: 5;
  padding: 17px 4px 12px;
  background:
    linear-gradient(
      180deg,
      var(--bg-base) 76%,
      color-mix(in srgb, var(--bg-base) 0%, transparent)
    );
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.member-panel-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 5px 11px;
}

.member-panel-title-left {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 7px;
}

.member-panel-title-main {
  color: var(--text-primary);
  font-size: 14px;
  font-weight: 750;
  letter-spacing: -.01em;
}

.member-panel-count {
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--bg-elevated-2);
  border: 1px solid var(--border-subtle);
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 700;
}

.member-online-count {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--text-muted);
  font-size: 10.5px;
  font-weight: 600;
  white-space: nowrap;
}

.member-online-indicator {
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: var(--status-online);
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--status-online) 12%, transparent);
}

.member-search-wrap {
  position: relative;
  display: flex;
  align-items: center;
}

.member-search-wrap > i {
  position: absolute;
  left: 11px;
  z-index: 1;
  color: var(--text-muted);
  font-size: 11px;
  pointer-events: none;
}

.member-search {
  width: 100%;
  height: 34px;
  border: 1px solid var(--border-subtle);
  border-radius: 9px;
  outline: none;
  background: var(--bg-deepest);
  color: var(--text-primary);
  padding: 0 11px 0 31px;
  font: inherit;
  font-size: 12px;
  transition:
    border-color .15s ease,
    background .15s ease,
    box-shadow .15s ease;
}

.member-search::placeholder {
  color: var(--text-muted);
}

.member-search:focus {
  border-color: color-mix(in srgb, var(--brand) 55%, var(--border-subtle));
  background: var(--bg-elevated-2);
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--brand) 10%, transparent);
}

.member-list-content {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.member-group {
  min-width: 0;
}

.member-role-heading {
  --member-role-color: var(--text-muted);
  min-height: 27px;
  padding: 4px 7px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  color: var(--text-muted);
  font-size: 10.5px;
  font-weight: 750;
  text-transform: uppercase;
  letter-spacing: .055em;
}

.member-role-title {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 7px;
}

.member-role-title > span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.member-role-dot {
  width: 7px;
  height: 7px;
  flex: 0 0 7px;
  border-radius: 50%;
  background: var(--member-role-color);
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--member-role-color) 12%, transparent);
}

.member-role-count {
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 650;
}

.member-group-users {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.member-row {
  position: relative;
  min-width: 0;
  min-height: 46px;
  padding: 5px 7px;
  display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid transparent;
  border-radius: 9px;
  cursor: pointer;
  transition:
    background .14s ease,
    border-color .14s ease,
    transform .14s ease,
    opacity .14s ease;
}

.member-row:hover {
  background: var(--bg-hover);
  border-color: var(--border-subtle);
}

.member-row:active {
  transform: scale(.985);
}

.member-avatar-wrap {
  position: relative;
  width: 36px;
  height: 36px;
  flex: 0 0 36px;
}

.member-row .avatar {
  display: block;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  object-fit: cover;
  background: var(--bg-elevated-2);
}

.member-status {
  position: absolute;
  right: -2px;
  bottom: -2px;
  width: 14px;
  height: 14px;
  padding: 3px;
  border-radius: 50%;
  background: var(--bg-base);
}

.member-status > span {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: inherit;
  background: var(--status-offline);
}

.member-status.online > span {
  background: var(--status-online);
}

.member-status.idle > span {
  background: var(--status-idle);
}

.member-status.dnd > span {
  background: var(--status-dnd);
}

.member-status.offline > span {
  background: var(--status-offline);
}

/* Üye listesinde canlı yazıyor göstergesi -------------------------------- */
.member-status {
  transition: opacity .16s ease, transform .16s ease;
}

.member-typing-indicator {
  position: absolute;
  right: -7px;
  bottom: -2px;
  z-index: 3;
  width: 27px;
  height: 17px;
  padding: 0 5px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 2.5px;
  border: 3px solid var(--bg-base);
  border-radius: 999px;
  background: #20242c;
  box-shadow: 0 3px 10px rgba(0, 0, 0, .28);
  opacity: 0;
  transform: translateY(2px) scale(.72);
  transform-origin: 80% 80%;
  pointer-events: none;
  transition: opacity .15s ease, transform .18s cubic-bezier(.2,.8,.2,1);
}

.member-typing-indicator i {
  display: block;
  width: 3.5px;
  height: 3.5px;
  flex: 0 0 3.5px;
  border-radius: 50%;
  background: #f2f3f5;
  opacity: .55;
  transform: translateY(0);
}

.member-row.is-typing .member-status {
  opacity: 0;
  transform: scale(.65);
}

.member-row.is-typing .member-typing-indicator {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.member-row.is-typing .member-typing-indicator i {
  animation: nexus-member-typing-dot .9s ease-in-out infinite;
}

.member-row.is-typing .member-typing-indicator i:nth-child(2) {
  animation-delay: .12s;
}

.member-row.is-typing .member-typing-indicator i:nth-child(3) {
  animation-delay: .24s;
}

@keyframes nexus-member-typing-dot {
  0%, 60%, 100% {
    opacity: .42;
    transform: translateY(0) scale(.92);
  }
  30% {
    opacity: 1;
    transform: translateY(-2.5px) scale(1.08);
  }
}

@media (prefers-reduced-motion: reduce) {
  .member-row.is-typing .member-typing-indicator i {
    animation: none;
    opacity: 1;
  }
}

.member-info {
  flex: 1;
  min-width: 0;
}

.member-name-line {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 5px;
}

.member-row .m-name {
  --member-name-color: var(--text-secondary);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--member-name-color);
  font-size: 13.5px;
  font-weight: 620;
  line-height: 1.3;
}

.member-row:hover .m-name {
  filter: brightness(1.08);
}

.member-row .m-name.owner {
  color: var(--member-name-color);
}

.member-owner-crown {
  flex: 0 0 auto;
  color: #f0b232;
  font-size: 9px;
  filter: drop-shadow(0 1px 3px rgba(240, 178, 50, .25));
}

.member-subtitle {
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--text-muted);
  font-size: 10.5px;
  line-height: 1.25;
}

.member-row.offline {
  opacity: .47;
}

.member-row.offline:hover {
  opacity: .72;
}

.member-offline-group {
  margin-top: 2px;
}

html[data-theme="light"] .member-panel {
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--bg-base) 97%, var(--brand) 3%),
      var(--bg-base)
    );
}

/* ---- Ana içerik (DM listesi & ana ekran) -------------------------------- */
.home-list { padding: var(--space-3) var(--space-2); flex: 1; overflow-y: auto; }
.home-item { display: flex; align-items: center; gap: 10px; padding: 8px var(--space-2); border-radius: var(--radius-sm); cursor: pointer; color: var(--text-secondary); position: relative; }
.home-item:hover, .home-item.active { background: var(--bg-hover); color: var(--text-primary); }
.home-item .name { font-size: 14.5px; font-weight: 500; flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.home-item .preview { font-size: 12px; color: var(--text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.section-label { padding: var(--space-3) var(--space-3) var(--space-1); font-size: 11px; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: .05em; }
.nav-link { display: flex; align-items: center; gap: 10px; padding: 9px var(--space-3); border-radius: var(--radius-sm); color: var(--text-secondary); cursor: pointer; font-weight: 600; font-size: 14.5px; }
.nav-link:hover, .nav-link.active { background: var(--bg-hover); color: var(--text-primary); }

.friends-toolbar { display: flex; align-items: center; gap: var(--space-4); padding: var(--space-4) var(--space-5); border-bottom: 1px solid var(--border-subtle); }
.friends-tab { color: var(--text-secondary); font-weight: 600; font-size: 14.5px; cursor: pointer; padding: 6px 4px; border-bottom: 2px solid transparent; }
.friends-tab.active { color: var(--text-primary); border-color: var(--brand); }
.friend-row { display: flex; align-items: center; gap: 12px; padding: 10px var(--space-5); border-bottom: 1px solid var(--border-subtle); }
.friend-row .info { flex: 1; min-width: 0; }
.friend-row .fname { font-weight: 600; }
.friend-row .fstatus { font-size: 12.5px; color: var(--text-muted); }
.friend-row .actions { display: flex; gap: 6px; }

/* ---- Profil kartı popup -------------------------------------------------- */
.profile-card { width: 100%; max-width: 340px; border-radius: var(--radius-lg); overflow: hidden; background: var(--bg-elevated); border: 1px solid var(--border-subtle); }
.profile-banner { height: 90px; background: var(--brand-gradient); background-size: cover; background-position: center; }
.profile-card-body { padding: 0 var(--space-4) var(--space-4); position: relative; }
.profile-card-body .avatar { width: 80px; height: 80px; border: 5px solid var(--bg-elevated); margin-top: -40px; }
.profile-card-body h3 { margin-top: var(--space-2); }
.profile-card-body .username-tag { color: var(--text-muted); font-size: 13px; margin-bottom: var(--space-3); }
.profile-section { background: var(--bg-deepest); border-radius: var(--radius-md); padding: var(--space-3); margin-top: var(--space-3); }
.profile-section h6 { font-size: 11px; text-transform: uppercase; color: var(--text-muted); margin-bottom: 6px; letter-spacing: .05em; }
.profile-section p { font-size: 13.5px; color: var(--text-secondary); }
.profile-actions { display: flex; gap: 8px; margin-top: var(--space-3); }

/* ---- Bildirim panosu ---------------------------------------------------- */
.notif-panel { position: absolute; top: 60px; right: 20px; width: 360px; max-height: 480px; overflow-y: auto; background: var(--bg-elevated); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); box-shadow: var(--shadow-panel); z-index: 500; }
.notif-item { display: flex; gap: 10px; padding: 12px var(--space-4); border-bottom: 1px solid var(--border-subtle); cursor: pointer; }
.notif-item:hover { background: var(--bg-hover); }
.notif-item.unread { background: rgba(40,199,111,0.06); }
.notif-item .text { font-size: 13.5px; color: var(--text-secondary); }
.notif-item .text b { color: var(--text-primary); }
.notif-item .time { font-size: 11.5px; color: var(--text-muted); margin-top: 2px; }

/* ---- Ses kanalı görünümü -------------------------------------------------- */
.voice-stage { flex: 1; display: flex; flex-wrap: wrap; align-content: center; justify-content: center; gap: var(--space-5); padding: var(--space-6); }
.voice-tile { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.voice-tile .avatar { width: 84px; height: 84px; }
.voice-tile.speaking .avatar { box-shadow: 0 0 0 3px var(--pulse); }
.voice-tile .vname { font-weight: 600; font-size: 14px; }
.voice-controls { display: flex; justify-content: center; gap: var(--space-3); padding: var(--space-5); }
.voice-controls .icon-btn { width: 48px; height: 48px; border-radius: 50%; background: var(--bg-base); }
.voice-controls .icon-btn.danger { background: var(--status-dnd); color: #fff; }
.voice-controls .icon-btn.off { background: var(--status-dnd); color: #fff; }

/* ---- Emoji seçici -------------------------------------------------------- */
.emoji-picker { position: absolute; bottom: 60px; right: var(--space-5); width: 300px; max-height: 320px; overflow-y: auto; background: var(--bg-elevated); border: 1px solid var(--border-subtle); border-radius: var(--radius-lg); box-shadow: var(--shadow-panel); padding: var(--space-3); z-index: 400; }
.emoji-grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 4px; }
.emoji-grid button { font-size: 20px; background: none; border: none; cursor: pointer; border-radius: var(--radius-sm); padding: 4px; }
.emoji-grid button:hover { background: var(--bg-hover); }

.mobile-toggle { display: none; }

/* ---- Sunucu hover etiketi + doğrulanmış rozeti ------------------------- */
.server-hover-tooltip {
  position: absolute;
  left: 60px;
  top: 50%;
  transform: translateY(-50%) translateX(-4px);
  display: flex;
  align-items: center;
  gap: 6px;
  max-width: 240px;
  padding: 8px 10px;
  border-radius: var(--radius-sm);
  background: var(--bg-elevated-2);
  border: 1px solid var(--border-strong);
  box-shadow: var(--shadow-panel);
  color: var(--text-primary);
  font-size: 13px;
  font-weight: 700;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .12s ease, transform .12s ease, visibility .12s ease;
  z-index: 1500;
}
.server-hover-tooltip::before {
  content: '';
  position: absolute;
  left: -5px;
  top: 50%;
  width: 8px;
  height: 8px;
  transform: translateY(-50%) rotate(45deg);
  background: var(--bg-elevated-2);
  border-left: 1px solid var(--border-strong);
  border-bottom: 1px solid var(--border-strong);
}
.rail-item:hover .server-hover-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%) translateX(0);
}
.rail-verified-badge {
  position: absolute;
  right: -5px;
  bottom: -3px;
  width: 18px;
  height: 18px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--bg-deepest);
  color: var(--pulse);
  font-size: 13px;
  filter: drop-shadow(0 0 5px rgba(33, 230, 176, .35));
}

/* ---- Kanal ayar düğmesi ------------------------------------------------ */
.channel-manage-btn {
  width: 26px;
  height: 26px;
  display: inline-grid;
  place-items: center;
  border: 0;
  border-radius: var(--radius-sm);
  background: transparent;
  color: var(--text-muted);
  opacity: 0;
  cursor: pointer;
  transition: opacity .12s ease, color .12s ease, background .12s ease;
}
.channel-item:hover .channel-manage-btn,
.channel-manage-btn:focus-visible { opacity: 1; }
.channel-manage-btn:hover { background: var(--bg-active); color: var(--text-primary); }
.global-server-hover-tooltip {
  position: fixed;
  transform: translateY(-50%) translateX(-4px);
  z-index: 5000;
}
.global-server-hover-tooltip.visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(-50%) translateX(0);
}


/* ---- Sade uygulama görünümü ------------------------------------------- */
.server-rail { padding-top: 12px; }
.rail-item .bubble {
  border-radius: var(--radius-md);
  transition: background .12s ease, color .12s ease, border-color .12s ease;
}
.rail-item:hover .bubble,
.rail-item.active .bubble {
  border-radius: var(--radius-md);
  background: var(--brand);
  color: var(--text-on-brand);
  transform: none;
  box-shadow: none;
}
.rail-item .indicator { background: var(--brand); width: 3px; }
.rail-item.action:hover .bubble { background: var(--brand); }
.channel-sidebar,
.member-panel { background: var(--bg-base); }
.server-header,
.chat-header { box-shadow: none; }
.channel-item { border-left-width: 0; }
.channel-item.active { box-shadow: inset 3px 0 0 var(--brand); }
.user-bar { background: var(--bg-base); }
.chat-panel { background: var(--bg-elevated); }
.message-group:hover,
.message-line:hover { background: rgba(255,255,255,.025); }
html[data-theme="light"] .message-group:hover,
html[data-theme="light"] .message-line:hover { background: rgba(17,24,39,.035); }
.channel-item .unread-badge { background: var(--brand); color: #fff; }
.profile-banner { background: var(--brand); }
.notif-item.unread { background: var(--brand-soft); }
.server-hover-tooltip { box-shadow: var(--shadow-panel); }
.rail-verified-badge { filter: none; }

/* ---- Kategori yönetimi -------------------------------------------------- */
.channel-category-label {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.channel-category-actions {
  display: flex;
  align-items: center;
  gap: 2px;
  opacity: 0;
  transition: opacity 120ms ease;
}
.channel-category:hover .channel-category-actions,
.channel-category:focus-within .channel-category-actions { opacity: 1; }
.category-action-btn {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: var(--text-muted);
  border-radius: var(--radius-sm);
  cursor: pointer;
}
.category-action-btn:hover { background: var(--bg-hover); color: var(--text-primary); }
.channel-category .category-chevron { transition: transform 140ms ease; }
.channel-category.collapsed .category-chevron { transform: rotate(-90deg); }
/* Full platform upgrade */
.channel-unread-badge,.server-unread-badge{margin-left:auto;min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--danger);color:#fff;font-size:10px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;line-height:1}.server-unread-badge{position:absolute;right:-4px;bottom:-2px;z-index:4;border:2px solid var(--bg-primary);height:19px;min-width:19px}.chat-header-tools{margin-left:auto;display:flex;gap:4px}.platform-card{padding:12px;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-secondary);margin-bottom:10px}.platform-card-head{display:flex;align-items:center;gap:9px}.platform-card-head div{display:flex;flex-direction:column}.platform-card-head small{color:var(--text-muted);font-size:11px}.platform-message{padding:10px 0;white-space:pre-wrap}.discover-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}.discover-card{display:flex;gap:12px;padding:14px;border:1px solid var(--border-subtle);background:var(--bg-secondary);border-radius:12px}.discover-card>img{width:48px;height:48px;border-radius:12px;object-fit:cover}.discover-card p{font-size:12px;color:var(--text-muted);margin:5px 0}.discover-card small{font-size:11px;color:var(--text-muted)}@media(max-width:720px){.discover-grid{grid-template-columns:1fr}}
.emoji-admin-grid{display:flex;flex-wrap:wrap;gap:10px}.emoji-admin-card{display:flex;align-items:center;gap:8px;padding:9px 11px;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-secondary)}.emoji-admin-card img{width:32px;height:32px;object-fit:contain}.audit-list{max-height:360px;overflow:auto}
.dragging{opacity:.45}.channel-item[draggable="true"],.channel-category[draggable="true"],.role-list-item[draggable="true"]{cursor:grab}.channel-item[draggable="true"]:active,.channel-category[draggable="true"]:active,.role-list-item[draggable="true"]:active{cursor:grabbing}
.voice-video{width:100%;max-width:360px;aspect-ratio:16/9;object-fit:cover;border-radius:10px;background:#000}.voice-tile:has(.voice-video){min-width:280px}
.asset-admin-columns{display:grid;grid-template-columns:1fr 1fr;gap:28px}.emoji-admin-card{position:relative}.emoji-admin-card .danger-icon{position:absolute;top:4px;right:4px;color:var(--danger)}@media(max-width:760px){.asset-admin-columns{grid-template-columns:1fr}}
.reply-preview{display:flex;align-items:center;gap:7px;max-width:100%;border:0;background:transparent;color:var(--text-muted);padding:0 0 4px;cursor:pointer;font:inherit}.reply-preview span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.reply-preview strong{color:var(--text-secondary);white-space:nowrap}.bot-tag{display:inline-flex;align-items:center;gap:4px;height:18px;padding:0 6px;margin-left:5px;border-radius:5px;border:1px solid color-mix(in srgb,var(--brand) 40%,transparent);background:color-mix(in srgb,var(--brand) 16%,transparent);color:var(--brand);font-size:9px;font-weight:900;letter-spacing:.045em;line-height:1;cursor:help}.bot-tag i{font-size:9px}.bot-tag.webhook{color:var(--text-secondary);border-color:var(--border-strong);background:var(--bg-elevated-2)}.message-flash{animation:nexus-message-flash 1.2s ease}@keyframes nexus-message-flash{0%,100%{background:transparent}25%,70%{background:color-mix(in srgb,var(--accent) 14%,transparent)}}
.search-filter-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.search-message-result{width:100%;display:flex;gap:10px;text-align:left;border:0;background:transparent;color:var(--text-primary);padding:10px;border-radius:8px;cursor:pointer}.search-message-result:hover{background:var(--bg-tertiary)}.search-message-result .info{min-width:0;display:flex;flex-direction:column;gap:2px}.search-message-result .fname{font-weight:700}.search-message-result .fname small,.search-message-result small{color:var(--text-muted);font-weight:400}.search-message-result .fstatus{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text-secondary)}@media(max-width:640px){.search-filter-grid{grid-template-columns:1fr}}
.discover-card{display:flex;align-items:center;gap:12px}.discover-card-main{min-width:0;flex:1}
.voice-participant{display:flex;align-items:center;gap:6px}.voice-participant>span{min-width:0;overflow:hidden;text-overflow:ellipsis}.voice-volume{width:58px;margin-left:auto;accent-color:var(--accent)}

/* Mention autocomplete + NEXUS+ profile */
.mention-suggestions{position:absolute;left:14px;right:14px;bottom:100%;margin-bottom:8px;max-height:300px;overflow:auto;display:flex;flex-direction:column;gap:6px;padding:8px;background:#11161d!important;border:1px solid #2a313d;border-radius:12px;box-shadow:0 18px 40px rgba(0,0,0,.55);z-index:1200;overscroll-behavior:contain;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;isolation:isolate;opacity:1!important}.mention-suggestions-title{position:sticky;top:-8px;z-index:2;padding:9px 11px 8px;margin:-8px -8px 2px;background:#11161d!important;border-bottom:1px solid #252c37;color:#8f98a7;font-size:10px;font-weight:900;letter-spacing:.08em}.mention-suggestion{width:100%;min-height:52px;display:flex;align-items:center;gap:10px;border:1px solid #232a34;background:#181e27!important;color:#f4f7fb;border-radius:10px;padding:9px 10px;text-align:left;cursor:pointer;line-height:1.2;opacity:1!important}.mention-suggestion:hover,.mention-suggestion.active{background:#242d38!important;border-color:#344152}.mention-suggestion .avatar{width:30px;height:30px;border-radius:50%;object-fit:cover;flex:0 0 auto}.mention-suggestion>i,.mention-suggestion>.role-color-dot{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto}.mention-suggestion>i{background:#202733;color:#b4bfce;font-size:13px}.mention-suggestion>.role-color-dot{box-shadow:inset 0 0 0 2px rgba(255,255,255,.08)}.mention-suggestion>span{min-width:0;flex:1;display:flex;flex-direction:column;gap:2px}.mention-suggestion>span strong,.mention-suggestion>span small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mention-suggestion>span strong{font-size:13px;font-weight:700;color:#f4f7fb}.mention-suggestion>span small{margin-left:0;font-size:11px;color:#97a2b0}.command-suggestions .mention-suggestion>.verified-tick{margin-left:6px;flex:0 0 auto}.mention,.role-mention{display:inline-flex;align-items:center;border-radius:4px;padding:0 3px;background:color-mix(in srgb,var(--brand) 16%,transparent);color:var(--brand);font-weight:650}.role-mention{background:color-mix(in srgb,var(--mention-role,var(--brand)) 15%,transparent);color:var(--mention-role,var(--brand))}.nexus-plus-callout{display:flex;gap:10px;align-items:center;padding:12px;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-secondary);margin-bottom:16px}.nexus-plus-callout strong{color:var(--brand)}.nexus-plus-callout span{font-size:12px;color:var(--text-muted)}.profile-card{border-top:3px solid var(--profile-accent,var(--brand))}.profile-card .profile-banner:not([style*="background-image"]){background:var(--profile-accent,var(--brand))}

/* ---- Ayrı Keşfet görünümü --------------------------------------------- */
.app-shell.discover-mode { grid-template-columns: 76px 240px minmax(0, 1fr) 0; }
.app-shell.discover-mode .member-panel { display: none; }

.discover-sidebar-header {
  min-height: 76px;
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 14px 15px;
  border-bottom: 1px solid var(--border-subtle);
}
.discover-sidebar-icon {
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  background: var(--bg-elevated);
  color: var(--brand);
  border: 1px solid var(--border-subtle);
  flex: 0 0 auto;
}
.discover-sidebar-header strong { display: block; font-size: 15px; color: var(--text-primary); }
.discover-sidebar-header small { display: block; margin-top: 2px; font-size: 11px; color: var(--text-muted); }
.discover-sidebar-nav { padding: 14px 9px; overflow-y: auto; }
.discover-sidebar-label { padding: 0 9px 8px; color: var(--text-muted); font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.discover-nav-item {
  width: 100%;
  min-height: 39px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--text-secondary);
  text-align: left;
  cursor: pointer;
  font: inherit;
  font-size: 13.5px;
}
.discover-nav-item i { width: 18px; text-align: center; color: var(--text-muted); }
.discover-nav-item:hover { background: var(--bg-hover); color: var(--text-primary); }
.discover-nav-item.active { background: var(--bg-active); color: var(--text-primary); font-weight: 700; }
.discover-nav-item.active i { color: var(--brand); }

.discover-page { height: 100%; overflow-y: auto; background: var(--bg-elevated); }
.discover-page-header {
  padding: 42px clamp(22px, 4vw, 56px) 26px;
  border-bottom: 1px solid var(--border-subtle);
  background: var(--bg-elevated);
}
.discover-page-title-wrap { max-width: 760px; }
.discover-page-kicker { display: inline-flex; align-items: center; gap: 7px; color: var(--brand); font-size: 11px; font-weight: 850; letter-spacing: .09em; }
.discover-page-header h1 { margin: 9px 0 7px; font-size: clamp(27px, 4vw, 40px); line-height: 1.08; color: var(--text-primary); }
.discover-page-header p { margin: 0; max-width: 620px; color: var(--text-muted); font-size: 14px; }
.discover-search-wrap {
  max-width: 680px;
  height: 46px;
  margin-top: 24px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 14px;
  border: 1px solid var(--border-subtle);
  border-radius: 10px;
  background: var(--bg-base);
}
.discover-search-wrap:focus-within { border-color: var(--brand); }
.discover-search-wrap i { color: var(--text-muted); }
.discover-search-wrap input { width: 100%; border: 0; outline: 0; background: transparent; color: var(--text-primary); font: inherit; font-size: 14px; }
.discover-search-wrap input::placeholder { color: var(--text-muted); }

.discover-toolbar {
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px clamp(22px, 4vw, 56px);
  border-bottom: 1px solid var(--border-subtle);
}
.discover-filter-status { color: var(--text-muted); font-size: 12px; }
.discover-filter-status i { color: var(--status-online); margin-right: 5px; }

.discover-page-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 16px;
  padding: 24px clamp(22px, 4vw, 56px) 48px;
  align-items: stretch;
}
.discover-server-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--border-subtle);
  border-radius: 12px;
  background: var(--bg-base);
  transition: transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}
.discover-server-card:hover { transform: translateY(-2px); border-color: var(--border-strong); box-shadow: 0 10px 30px rgba(0,0,0,.13); }
.discover-server-banner {
  height: 86px;
  background: linear-gradient(135deg, var(--bg-deepest), var(--bg-elevated));
  background-size: cover;
  background-position: center;
  border-bottom: 1px solid var(--border-subtle);
}
.discover-server-body { position: relative; padding: 38px 16px 16px; }
.discover-server-icon {
  position: absolute;
  top: -29px;
  left: 16px;
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: 13px;
  background: var(--bg-base);
  border: 4px solid var(--bg-base);
}
.discover-server-name-row { display: flex; align-items: center; gap: 7px; min-width: 0; }
.discover-server-name-row h3 { margin: 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 16px; color: var(--text-primary); }
.discover-verified { color: var(--brand); flex: 0 0 auto; }
.discover-verified-label { margin-top: 5px; color: var(--brand); font-size: 10.5px; font-weight: 700; }
.discover-server-body > p { min-height: 39px; margin: 10px 0 12px; color: var(--text-muted); font-size: 12.5px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.discover-server-meta { display: flex; flex-wrap: wrap; gap: 8px 12px; margin-bottom: 14px; color: var(--text-muted); font-size: 11px; }
.discover-server-meta span { display: inline-flex; align-items: center; gap: 5px; }
.discover-loading, .discover-empty { grid-column: 1 / -1; min-height: 270px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 10px; text-align: center; color: var(--text-muted); }
.discover-empty > i { font-size: 30px; color: var(--text-muted); }
.discover-empty h3 { margin: 0; color: var(--text-primary); }
.discover-empty p { margin: 0; max-width: 420px; font-size: 13px; }

@media (max-width: 760px) {
  .app-shell.discover-mode { grid-template-columns: 1fr; }
  .discover-page-header { padding-top: 28px; }
  .discover-page-grid { grid-template-columns: 1fr; }
  .discover-toolbar { align-items: flex-start; }
}

/* ========================================================================
   NEXUS+ / Developer Portal
   ======================================================================== */
.home-nav-badge {
  margin-left: auto;
  padding: 2px 6px;
  border-radius: 999px;
  background: var(--brand-soft);
  color: var(--brand);
  font-size: 9px;
  font-weight: 850;
  letter-spacing: .05em;
}

.plus-page, .developer-page { height: 100%; overflow-y: auto; background: var(--bg-elevated); }
.plus-hero, .developer-header {
  padding: 42px clamp(22px,4vw,56px) 30px;
  border-bottom: 1px solid var(--border-subtle);
  background: var(--bg-elevated);
}
.plus-kicker, .developer-kicker {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--brand); font-size: 11px; font-weight: 850; letter-spacing: .1em;
}
.plus-hero h1, .developer-header h1 { margin: 8px 0 9px; font-size: clamp(28px,4vw,42px); line-height: 1.06; }
.plus-hero > p, .developer-header p { max-width: 720px; color: var(--text-muted); font-size: 14px; }
.plus-status {
  max-width: 720px; margin-top: 22px; padding: 14px 16px; display: flex; gap: 12px; align-items: center;
  border: 1px solid var(--border-subtle); border-radius: 10px; background: var(--bg-base);
}
.plus-status > i { color: var(--text-muted); font-size: 18px; }
.plus-status.active { border-color: color-mix(in srgb, var(--status-online) 45%, transparent); }
.plus-status.active > i { color: var(--status-online); }
.plus-status strong, .plus-status span { display:block; }
.plus-status span { margin-top: 2px; color: var(--text-muted); font-size: 12px; }
.plus-actions { margin-top: 18px; display:flex; gap:10px; flex-wrap:wrap; }
.plus-content { padding: 28px clamp(22px,4vw,56px) 50px; }
.plus-section-head span { color: var(--text-muted); font-size:10px; font-weight:800; letter-spacing:.08em; }
.plus-section-head h2 { margin-top:4px; font-size:20px; }
.plus-feature-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:12px; margin-top:16px; }
.plus-feature-card {
  position:relative; display:flex; gap:12px; min-height:112px; padding:16px;
  border:1px solid var(--border-subtle); border-radius:10px; background:var(--bg-base);
}
.plus-feature-card.active { border-color:var(--border-strong); }
.plus-feature-icon { width:38px; height:38px; flex:0 0 auto; display:grid; place-items:center; border-radius:9px; background:var(--brand-soft); color:var(--brand); }
.plus-feature-card strong { display:block; font-size:14px; }
.plus-feature-card p { margin-top:5px; color:var(--text-muted); font-size:12px; line-height:1.45; }
.plus-feature-check { position:absolute; right:12px; top:12px; color:var(--status-online); font-size:11px; }
.plus-note { margin-top:18px; display:flex; gap:12px; padding:15px; border:1px solid var(--border-subtle); border-radius:10px; background:var(--bg-base); }
.plus-note > i { color:var(--brand); margin-top:3px; }.plus-note strong{font-size:13px}.plus-note p{margin-top:3px;color:var(--text-muted);font-size:12px}

.developer-header { display:flex; justify-content:space-between; align-items:flex-end; gap:24px; }
.developer-header > div { max-width:760px; }
.developer-toolbar { min-height:54px; padding:10px clamp(22px,4vw,56px); display:flex; justify-content:space-between; align-items:center; gap:12px; border-bottom:1px solid var(--border-subtle); color:var(--text-muted); font-size:12px; }
.developer-toolbar span { display:flex; gap:7px; align-items:center; }.developer-toolbar span i{color:var(--status-online)}
.developer-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:14px; padding:24px clamp(22px,4vw,56px) 48px; }
.developer-app-card { padding:16px; border:1px solid var(--border-subtle); border-radius:10px; background:var(--bg-base); min-width:0; }
.developer-app-top { display:flex; align-items:center; gap:10px; }.developer-app-top .avatar{width:42px;height:42px}.developer-app-title{min-width:0;flex:1}.developer-app-title strong,.developer-app-title span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.developer-app-title strong{font-size:14px}.developer-app-title span{font-size:11px;color:var(--text-muted);margin-top:2px}
.developer-state { padding:3px 7px; border-radius:999px; font-size:9px; font-weight:800; background:rgba(255,84,112,.1); color:var(--status-dnd); }.developer-state.on{background:rgba(47,224,138,.1);color:var(--status-online)}
.developer-app-card > p { min-height:36px; margin:13px 0; color:var(--text-muted); font-size:12px; line-height:1.45; }
.developer-meta { display:flex; flex-direction:column; gap:5px; color:var(--text-muted); font-size:10.5px; }.developer-meta span{display:flex;gap:6px;align-items:center;overflow:hidden;text-overflow:ellipsis}.developer-meta i{width:12px;color:var(--text-secondary)}
.developer-card-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:15px; }
.developer-empty { grid-column:1/-1; min-height:320px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:9px; color:var(--text-muted); }.developer-empty>i{font-size:34px}.developer-empty h3{color:var(--text-primary)}.developer-empty p{font-size:13px;margin-bottom:8px}
.developer-loading { min-height:400px; display:grid; place-items:center; }
.developer-modal-tabs { display:flex; gap:4px; padding:0 18px; border-bottom:1px solid var(--border-subtle); }
.copy-field { min-height:42px; display:flex; align-items:center; gap:8px; padding:6px 8px 6px 12px; border:1px solid var(--border-subtle); border-radius:8px; background:var(--bg-deepest); }
.copy-field code { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-secondary); font-size:11px; }.token-field code{user-select:all;color:var(--text-primary)}
.token-warning { display:flex; gap:11px; padding:13px; margin-bottom:18px; border:1px solid rgba(255,194,75,.25); background:rgba(255,194,75,.07); border-radius:9px; }.token-warning>i{color:var(--status-idle);margin-top:2px}.token-warning strong,.token-warning span{display:block}.token-warning span{margin-top:3px;color:var(--text-muted);font-size:11px}.token-warning.safe{border-color:var(--border-subtle);background:var(--bg-base)}.token-warning.safe>i{color:var(--brand)}
.bot-permission-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:10px 0 18px; }
.bot-permission-choice { display:flex; gap:9px; align-items:center; padding:10px; border:1px solid var(--border-subtle); border-radius:8px; cursor:pointer; background:var(--bg-base); }.bot-permission-choice input{accent-color:var(--brand)}.bot-permission-choice strong,.bot-permission-choice small{display:block}.bot-permission-choice strong{font-size:12px}.bot-permission-choice small{color:var(--text-muted);font-size:9px;margin-top:2px}
.modal-inline-actions { display:flex; justify-content:space-between; gap:10px; margin-top:18px; }.developer-install-list{display:flex;flex-direction:column;gap:8px}

@media (max-width:760px){
  .developer-header{align-items:flex-start;flex-direction:column}.developer-header .btn{width:100%}.developer-grid{grid-template-columns:1fr}.developer-toolbar{align-items:flex-start;flex-direction:column}.bot-permission-grid{grid-template-columns:1fr}.plus-feature-grid{grid-template-columns:1fr}.modal-inline-actions{flex-direction:column-reverse}.modal-inline-actions .btn{width:100%}
}

/* =====================================================================
   NEXUS Developer Portal v2
   ===================================================================== */
.developer-v2-page{height:100%;min-height:0;overflow:auto;background:var(--bg-base);color:var(--text-primary)}
.dev-topbar{height:64px;position:sticky;top:0;z-index:12;display:flex;align-items:center;gap:18px;padding:0 24px;border-bottom:1px solid var(--border-subtle);background:color-mix(in srgb,var(--bg-base) 94%,transparent);backdrop-filter:blur(14px)}
.dev-brand,.dev-app-mini{display:flex;align-items:center;gap:10px;min-width:0}.dev-logo{width:34px;height:34px;border-radius:9px;display:grid;place-items:center;background:var(--brand);color:#fff}.dev-brand strong,.dev-brand span,.dev-app-mini strong,.dev-app-mini span{display:block}.dev-brand span,.dev-app-mini span{font-size:10.5px;color:var(--text-muted)}.dev-app-mini{margin-left:auto}.dev-app-mini img{width:34px;height:34px;border-radius:9px;object-fit:cover}.dev-app-mini>div{max-width:220px}.dev-app-mini strong,.dev-app-mini span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dev-top-actions{display:flex;gap:8px;margin-left:auto}.dev-app-mini+.dev-top-actions{margin-left:0}
.dev-landing{padding:42px clamp(22px,5vw,70px) 70px;max-width:1480px;margin:0 auto}.dev-landing-head{margin-bottom:22px}.dev-landing-head h1{font-size:34px;margin:7px 0 8px}.dev-landing-head p{color:var(--text-muted);max-width:700px}.dev-v2-card{cursor:pointer;transition:transform .14s ease,border-color .14s ease,background .14s ease}.dev-v2-card:hover{transform:translateY(-2px);border-color:var(--border-strong);background:var(--bg-elevated-2)}.dev-card-stats{display:flex;gap:13px;flex-wrap:wrap;font-size:10.5px;color:var(--text-muted);padding-top:10px;border-top:1px solid var(--border-subtle)}.dev-card-stats b{color:var(--text-primary)}
.dev-app-shell{overflow:hidden}.dev-workspace{height:calc(100% - 64px);display:grid;grid-template-columns:230px minmax(0,1fr)}.dev-sidebar{overflow-y:auto;padding:20px 12px;border-right:1px solid var(--border-subtle);background:var(--bg-secondary)}.dev-nav-item{width:100%;height:38px;border:0;border-radius:7px;background:none;color:var(--text-secondary);display:flex;align-items:center;gap:10px;padding:0 11px;cursor:pointer;font:inherit;font-size:12.5px;text-align:left}.dev-nav-item i{width:16px;text-align:center;color:var(--text-muted)}.dev-nav-item:hover{background:var(--bg-hover);color:var(--text-primary)}.dev-nav-item.active{background:var(--brand-soft);color:var(--text-primary)}.dev-nav-item.active i{color:var(--brand)}
.dev-content{overflow-y:auto;padding:36px clamp(24px,5vw,70px) 80px}.dev-content>*{max-width:980px}.dev-section-head{padding-bottom:20px;border-bottom:1px solid var(--border-subtle);margin-bottom:20px}.dev-section-head h2{font-size:26px;margin:0 0 6px}.dev-section-head p{font-size:13px;color:var(--text-muted);line-height:1.5}.dev-card{border:1px solid var(--border-subtle);background:var(--bg-elevated);border-radius:10px;padding:20px;margin-bottom:16px}.dev-card h3{font-size:14px;margin:0 0 7px}.dev-card>p{margin:0 0 15px}.dev-divider{height:1px;background:var(--border-subtle);margin:18px 0}.dev-savebar{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin-top:18px}.dev-savebar .field-error{margin-right:auto}.dev-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.dev-app-profile-edit{display:flex;gap:20px;align-items:flex-start}.dev-avatar-edit{width:122px;display:flex;flex-direction:column;gap:9px}.dev-avatar-edit img{width:96px;height:96px;border-radius:16px;object-fit:cover;border:1px solid var(--border-subtle)}.dev-grow{flex:1;min-width:0}.dev-setting-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;padding:13px 0;border-bottom:1px solid var(--border-subtle)}.dev-setting-row:last-child{border-bottom:0}.dev-setting-row>div:first-child>strong,.dev-setting-row>div:first-child>span{display:block}.dev-setting-row>div:first-child>strong{font-size:12.5px}.dev-setting-row>div:first-child>span{font-size:11px;color:var(--text-muted);margin-top:3px;line-height:1.35}.dev-bot-identity{display:flex;gap:12px;align-items:center;margin-bottom:14px}.dev-bot-identity img{width:52px;height:52px;border-radius:13px;object-fit:cover}.dev-bot-identity strong,.dev-bot-identity span{display:block}.dev-bot-identity span{font-size:11px;color:var(--text-muted);margin-top:3px}.dev-intent-list{margin-top:12px}.dev-scope-list{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 18px}.dev-inline-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:14px}.dev-inline-head h3{margin:0}.dev-count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:20px;border-radius:999px;background:var(--bg-elevated-2);font-size:10px;color:var(--text-muted)}.dev-command-list{display:flex;flex-direction:column;border:1px solid var(--border-subtle);border-radius:8px;overflow:hidden}.dev-command-row{display:grid;grid-template-columns:28px minmax(0,1fr) auto 16px;gap:10px;align-items:center;border:0;border-bottom:1px solid var(--border-subtle);background:var(--bg-base);color:var(--text-primary);padding:11px 12px;cursor:pointer;text-align:left}.dev-command-row:last-child{border-bottom:0}.dev-command-row:hover{background:var(--bg-hover)}.dev-command-row>div:nth-child(2) strong,.dev-command-row>div:nth-child(2) span{display:block}.dev-command-row>div:nth-child(2) span{font-size:11px;color:var(--text-muted);margin-top:2px}.dev-command-slash{width:28px;height:28px;border-radius:7px;display:grid;place-items:center;background:var(--brand-soft);color:var(--brand);font-weight:900}.dev-command-meta{font-size:10px;color:var(--text-muted)}.dev-code{padding:14px;border:1px solid var(--border-subtle);border-radius:8px;background:var(--bg-base);font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px;line-height:1.55;overflow:auto;color:var(--text-secondary)}.dev-mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px}.input-prefix{display:flex;align-items:center;background:var(--bg-input);border:1px solid var(--border-subtle);border-radius:8px;overflow:hidden}.input-prefix>span{padding-left:12px;color:var(--brand);font-weight:800}.input-prefix .input{border:0;background:transparent}.dev-server-row{display:flex;align-items:center;gap:10px}.dev-server-row strong,.dev-server-row span{display:block}.dev-server-row span{font-size:10.5px;color:var(--text-muted);margin-top:2px}.dev-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:16px}.dev-stat{border:1px solid var(--border-subtle);background:var(--bg-elevated);border-radius:10px;padding:16px}.dev-stat span,.dev-stat strong,.dev-stat small{display:block}.dev-stat span{font-size:10.5px;color:var(--text-muted)}.dev-stat strong{font-size:25px;margin:8px 0 4px}.dev-stat small{font-size:10px;color:var(--text-muted)}.dev-route-table{border:1px solid var(--border-subtle);border-radius:8px;overflow:hidden}.dev-route-head,.dev-route-row{display:grid;grid-template-columns:minmax(0,1fr) 80px 80px 70px;gap:10px;padding:9px 11px;align-items:center}.dev-route-head{background:var(--bg-elevated-2);font-size:10px;color:var(--text-muted);text-transform:uppercase;font-weight:800}.dev-route-row{border-top:1px solid var(--border-subtle);font-size:11px}.dev-route-row code{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dev-directory-preview{display:flex;gap:16px;align-items:flex-start;padding:16px;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-base)}.dev-directory-preview>img{width:74px;height:74px;border-radius:16px;object-fit:cover}.dev-directory-preview h3{margin:2px 0 6px}.dev-directory-preview p{color:var(--text-muted);font-size:12px;margin:0}.dev-tag-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}.dev-tag-row span{padding:3px 7px;border:1px solid var(--border-subtle);border-radius:999px;font-size:9.5px;color:var(--text-muted)}.dev-verification-state{display:flex;justify-content:space-between;align-items:center;margin-top:14px}.dev-empty-mini{padding:28px 14px;text-align:center;color:var(--text-muted);font-size:12px}.danger-zone{border-color:color-mix(in srgb,var(--status-dnd) 40%,var(--border-subtle))}.danger-zone h3{color:var(--status-dnd)}
@media(max-width:900px){.dev-workspace{grid-template-columns:64px minmax(0,1fr)}.dev-sidebar{padding:12px 8px}.dev-nav-item{justify-content:center}.dev-nav-item span{display:none}.dev-content{padding:24px 18px 70px}.dev-stat-grid{grid-template-columns:1fr 1fr}.dev-form-grid{grid-template-columns:1fr}.dev-top-actions a:first-child{display:none}}
@media(max-width:640px){.dev-topbar{padding:0 12px}.dev-brand span,.dev-app-mini{display:none}.dev-top-actions .btn{font-size:0}.dev-top-actions .btn i{font-size:12px;margin:0}.dev-workspace{grid-template-columns:1fr}.dev-sidebar{display:flex;overflow-x:auto;border-right:0;border-bottom:1px solid var(--border-subtle);padding:8px;position:sticky;top:64px;z-index:8}.dev-nav-item{width:auto;min-width:38px}.dev-workspace{height:calc(100% - 64px);display:flex;flex-direction:column}.dev-content{flex:1}.dev-stat-grid{grid-template-columns:1fr}.dev-app-profile-edit{flex-direction:column}.dev-route-head,.dev-route-row{grid-template-columns:minmax(0,1fr) 52px}.dev-route-head span:nth-child(n+3),.dev-route-row span:nth-child(n+3){display:none}}
/* Developer Portal v2 — scoped API keys */
.dev-api-key-list{display:flex;flex-direction:column;gap:8px}.dev-scope-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.dev-scope-chip{display:flex;flex-direction:column;gap:4px;padding:10px 12px;border:1px solid var(--border-subtle);border-radius:8px;background:var(--bg-secondary)}.dev-scope-chip code{font-size:12px;color:var(--text-primary)}.dev-scope-chip span{font-size:11px;color:var(--text-muted)}.permission-check span small{display:block;margin-top:2px;color:var(--text-muted);font-weight:400}@media(max-width:720px){.dev-scope-grid{grid-template-columns:1fr}}

.dev-team-list{display:flex;flex-direction:column;gap:8px}.dev-team-list .settings-list-row{border:1px solid var(--border-subtle);border-radius:8px;background:var(--bg-base)}

/* =====================================================================
   NEXUS Developer Portal v2.3 — scrolling + workspace UX
   ===================================================================== */
.chat-panel.developer-panel-active{
  min-height:0;
  overflow:hidden;
}
.developer-panel-active>.developer-v2-page{
  width:100%;
  height:100%;
  min-height:0;
}
.dev-landing-shell{
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.dev-app-shell{
  display:flex;
  flex-direction:column;
  min-height:0;
  overflow:hidden!important;
}
.dev-app-shell>.dev-topbar{
  flex:0 0 64px;
}
.dev-workspace{
  flex:1 1 auto;
  height:auto;
  min-height:0;
  min-width:0;
  overflow:hidden;
  position:relative;
}
.dev-sidebar{
  min-height:0;
  min-width:0;
  max-height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.dev-content{
  min-height:0;
  min-width:0;
  height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
  padding-bottom:120px;
}
.dev-content:focus{outline:none}
.dev-content>*{width:100%;max-width:980px}
.dev-sidebar::-webkit-scrollbar,.dev-content::-webkit-scrollbar,.dev-landing-shell::-webkit-scrollbar{width:10px;height:10px}
.dev-sidebar::-webkit-scrollbar-thumb,.dev-content::-webkit-scrollbar-thumb,.dev-landing-shell::-webkit-scrollbar-thumb{background:var(--border-strong);border:3px solid transparent;background-clip:padding-box;border-radius:999px}
.dev-sidebar::-webkit-scrollbar-track,.dev-content::-webkit-scrollbar-track,.dev-landing-shell::-webkit-scrollbar-track{background:transparent}

.dev-nav-group{padding:0 0 13px;margin-bottom:9px;border-bottom:1px solid var(--border-subtle)}
.dev-nav-group:last-child{border-bottom:0;margin-bottom:0}
.dev-nav-label{padding:4px 11px 7px;color:var(--text-muted);font-size:9px;font-weight:900;letter-spacing:.11em;user-select:none}
.dev-nav-item{margin:1px 0}
.dev-nav-item.active{box-shadow:inset 2px 0 0 var(--brand)}

.dev-app-health{display:inline-flex;align-items:center;gap:6px;flex:0 0 auto;padding:5px 8px;border:1px solid var(--border-subtle);border-radius:999px;font-size:9.5px;font-weight:800;color:var(--text-muted)}
.dev-app-health i{font-size:7px}
.dev-app-health.online{color:var(--status-online);border-color:color-mix(in srgb,var(--status-online) 30%,var(--border-subtle))}
.dev-app-health.offline{color:var(--text-muted)}

.dev-overview-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0 0 18px}
.dev-overview-stats>div{padding:15px 16px;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-elevated)}
.dev-overview-stats span,.dev-overview-stats strong{display:block}
.dev-overview-stats span{font-size:10px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.06em;font-weight:800}
.dev-overview-stats strong{font-size:24px;margin-top:5px}
.dev-landing-tools{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 0 14px}
.dev-search-box{height:40px;max-width:520px;flex:1;display:flex;align-items:center;gap:9px;padding:0 12px;border:1px solid var(--border-subtle);border-radius:9px;background:var(--bg-elevated)}
.dev-search-box:focus-within{border-color:var(--brand);box-shadow:0 0 0 2px var(--brand-soft)}
.dev-search-box i{color:var(--text-muted);font-size:12px}
.dev-search-box input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--text-primary);font:inherit;font-size:12.5px}
.dev-search-box input::placeholder{color:var(--text-muted)}
.dev-landing .developer-grid{padding:0 0 20px}
.dev-search-empty{padding:58px 20px;text-align:center;color:var(--text-muted);border:1px dashed var(--border-strong);border-radius:10px}
.dev-search-empty i,.dev-search-empty strong,.dev-search-empty span{display:block}
.dev-search-empty i{font-size:26px;margin-bottom:10px}
.dev-search-empty strong{color:var(--text-primary);font-size:13px}
.dev-search-empty span{font-size:11px;margin-top:4px}

.developer-tab-loading{min-height:280px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--text-muted);font-size:11px}
.dev-scroll-top{position:absolute;right:22px;bottom:22px;z-index:9;width:38px;height:38px;border:1px solid var(--border-strong);border-radius:10px;background:var(--bg-elevated);color:var(--text-primary);box-shadow:var(--shadow-panel);display:grid;place-items:center;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .14s ease,transform .14s ease,visibility .14s ease}
.dev-scroll-top:hover{background:var(--bg-hover)}
.dev-scroll-top.visible{opacity:1;visibility:visible;transform:translateY(0)}

@media(max-width:900px){
  .dev-nav-label{display:none}
  .dev-nav-group{padding-bottom:8px;margin-bottom:7px}
  .dev-overview-stats{grid-template-columns:1fr 1fr}
  .dev-app-health{display:none}
}
@media(max-width:640px){
  .dev-app-shell>.dev-topbar{flex-basis:56px;height:56px;min-height:56px}
  .dev-workspace{height:auto!important;min-height:0!important;display:flex!important;flex-direction:column!important;overflow:hidden}
  .dev-sidebar{position:static!important;top:auto!important;flex:0 0 auto;display:flex;align-items:center;gap:4px;width:100%;max-height:none;overflow-x:auto;overflow-y:hidden;padding:7px 8px;scrollbar-width:thin}
  .dev-nav-group{display:flex;align-items:center;gap:4px;flex:0 0 auto;padding:0;margin:0;border:0}
  .dev-nav-item{flex:0 0 auto;width:auto!important;min-width:38px;margin:0}
  .dev-content{flex:1 1 auto;height:auto;min-height:0;padding:20px 14px 100px}
  .dev-scroll-top{right:14px;bottom:14px}
  .dev-overview-stats{grid-template-columns:1fr 1fr}
  .dev-landing-tools{align-items:stretch;flex-direction:column}
  .dev-search-box{max-width:none;width:100%}
  .dev-landing{padding:28px 16px 60px}
}
@media(max-width:420px){
  .dev-overview-stats{grid-template-columns:1fr}
  .dev-overview-stats>div{display:flex;align-items:center;justify-content:space-between}
  .dev-overview-stats strong{margin:0;font-size:20px}
}


/* =====================================================================
   NEXUS+ v2.3.1 — reliable viewport scrolling
   ===================================================================== */
.chat-panel.plus-panel-active{
  min-height:0;
  min-width:0;
  overflow:hidden;
}
.plus-panel-active>.plus-page{
  flex:1 1 auto;
  width:100%;
  height:100%;
  min-height:0;
  min-width:0;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
}
.plus-panel-active>.plus-page::-webkit-scrollbar{width:10px;height:10px}
.plus-panel-active>.plus-page::-webkit-scrollbar-thumb{
  background:var(--border-strong);
  border:3px solid transparent;
  background-clip:padding-box;
  border-radius:999px;
}
.plus-panel-active>.plus-page::-webkit-scrollbar-track{background:transparent}
.plus-panel-active .plus-content{padding-bottom:max(72px,env(safe-area-inset-bottom))}

@media(max-width:760px){
  .plus-panel-active>.plus-page{height:100dvh;max-height:100dvh}
  .plus-panel-active .plus-hero{padding-top:28px}
  .plus-panel-active .plus-content{padding-bottom:max(96px,env(safe-area-inset-bottom))}
}

/* =========================================================================
   NEXUS — Professional Profile Surface
   ========================================================================= */
.profile-backdrop{
  position:fixed;inset:0;z-index:1900;display:grid;place-items:center;padding:24px;
  background:rgba(5,5,4,.62);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
  opacity:0;transition:opacity .12s ease;
}
.profile-backdrop.visible{opacity:1}
.profile-card.profile-card-pro{
  width:min(560px,calc(100vw - 32px));max-width:none;max-height:min(780px,calc(100dvh - 36px));
  display:flex;flex-direction:column;overflow:hidden;border-radius:18px;
  background:var(--bg-elevated);border:1px solid var(--border-strong);border-top:0;
  box-shadow:0 24px 80px rgba(0,0,0,.52);transform:translateY(8px) scale(.985);
  transition:transform .14s ease;isolation:isolate;
}
.profile-backdrop.visible .profile-card-pro{transform:translateY(0) scale(1)}
.profile-card-pro .profile-banner{
  position:relative;flex:0 0 248px;height:248px;background:var(--profile-accent,var(--brand));
  background-size:cover;background-position:center;border:0;display:flex;align-items:flex-end;
}
.profile-card-pro .profile-banner::before{
  content:"";position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(0,0,0,.08) 0%,rgba(0,0,0,.18) 45%,rgba(8,10,14,.74) 100%),
  radial-gradient(circle at 18% 12%,color-mix(in srgb,var(--profile-accent,var(--brand)) 55%,transparent),transparent 52%);
  pointer-events:none;
}
.profile-banner-wash{position:absolute;inset:auto 0 0;height:112px;background:linear-gradient(180deg,transparent,rgba(8,10,14,.88));pointer-events:none}
.profile-close-btn{
  position:absolute;right:14px;top:14px;width:34px;height:34px;border:1px solid rgba(255,255,255,.12);border-radius:10px;
  display:grid;place-items:center;color:#fff;background:rgba(10,10,9,.42);backdrop-filter:blur(8px);cursor:pointer;transition:background .12s ease,transform .12s ease;z-index:3;
}
.profile-close-btn:hover{background:rgba(10,10,9,.66);transform:scale(1.04)}
.profile-hero-overlay{position:relative;z-index:2;width:100%;padding:0 24px 22px}
.profile-card-pro .profile-pro-body{padding:18px 24px 24px;overflow-y:auto;overscroll-behavior:contain;min-height:0}
.profile-top-row{min-height:68px;display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:18px;position:relative}
.profile-top-row-hero{align-items:flex-end;min-height:auto;gap:18px;row-gap:12px}
/* Rozetler/ isim asla sıfır genişliğe sıkışmasın: avatar+isim bloğu en az
   240px talep eder; sağdaki butonlar (Mesaj/Arkadaşınız/Profili Düzenle)
   sığmazsa profile-top-row'un flex-wrap'i sayesinde alta düşer, isim ve
   rozetlerin alanını asla çalmaz. Bu davranış hem PC hem telefon için aynıdır. */
.profile-hero-main{display:flex;flex-direction:row;flex-wrap:nowrap;align-items:flex-end;gap:16px;min-width:0;width:100%;flex:1 1 240px}
.profile-avatar-shell{position:relative;width:118px;height:118px;flex:0 0 auto;border-radius:31%;padding:5px;background:rgba(14,17,22,.88);box-shadow:0 10px 28px rgba(0,0,0,.36);backdrop-filter:blur(10px)}
.profile-avatar-shell-hero{margin-top:0}
.profile-avatar{width:100%;height:100%;object-fit:cover;border-radius:28%;display:block;background:var(--bg-hover)}
.profile-status-ring{
  position:absolute;right:3px;bottom:5px;width:27px;height:27px;border-radius:50%;display:grid;place-items:center;background:rgba(14,17,22,.92);box-shadow:0 2px 9px rgba(0,0,0,.35)
}
.profile-status-ring i{display:block;width:17px;height:17px;border-radius:50%;background:var(--status-offline)}
.profile-status-ring.online i{background:var(--status-online)}.profile-status-ring.idle i{background:var(--status-idle)}.profile-status-ring.dnd i{background:var(--status-dnd)}.profile-status-ring.offline i{background:var(--status-offline)}
.profile-actions-pro{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-width:0;flex-wrap:wrap}
/* Butonlar kendi doğal genişliğini korusun (küçültülmeye çalışılmasın);
   sığmadığında profile-top-row'un flex-wrap'i sayesinde alta düşer. */
.profile-actions-hero{padding-top:0;align-self:flex-start;flex:0 0 auto;margin-left:auto}
.profile-action-main{height:38px;padding:0 15px;font-size:12.5px}
.profile-more-btn{width:38px;height:38px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:rgba(15,18,25,.6);color:#f2f4f7;cursor:pointer;display:grid;place-items:center;backdrop-filter:blur(10px)}
.profile-more-btn:hover{background:rgba(20,24,30,.85);color:#fff}
.profile-identity-block{padding-top:3px}
.profile-identity-hero{padding-top:0;min-width:140px;width:100%;flex:1 1 0%;color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.3)}
.profile-name-line{display:flex;align-items:center;gap:9px;min-width:0}
.profile-name-line h2{font-size:28px;line-height:1.18;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.profile-identity-marks{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.profile-identity-tag{height:20px;display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:0 7px;border-radius:6px;font-size:9px;font-weight:850;letter-spacing:.055em;border:1px solid var(--border-strong);background:var(--bg-elevated-2);color:var(--text-secondary)}
.profile-identity-tag.admin{width:21px;padding:0;color:var(--brand);background:var(--brand-soft);border-color:color-mix(in srgb,var(--brand) 30%,transparent)}
.profile-identity-tag.bot{height:25px;gap:5px;padding:0 10px;border-radius:7px;font-size:11px;font-weight:900;letter-spacing:.055em;color:var(--brand);background:color-mix(in srgb,var(--brand) 16%,transparent);border-color:color-mix(in srgb,var(--brand) 42%,transparent)}.profile-identity-tag.bot i{font-size:11px}
.profile-plus-mark{font-size:19px;line-height:1;filter:drop-shadow(0 2px 8px color-mix(in srgb,var(--profile-accent,var(--brand)) 38%,transparent))}
.profile-handle-row{display:flex;align-items:center;gap:7px;color:rgba(255,255,255,.78);font-size:12.5px;margin-top:5px}
.profile-handle-dot{opacity:.48}.profile-live-status{font-weight:650}.profile-live-status.online{color:var(--status-online)}.profile-live-status.idle{color:var(--status-idle)}.profile-live-status.dnd{color:var(--status-dnd)}
.profile-badges-pro{margin:14px 0 0;gap:6px;padding:7px 8px;background:rgba(15,18,24,.46);border-color:rgba(255,255,255,.08)}.profile-badges-pro .badge-chip.badge-icon-only{width:30px;height:30px;min-width:30px;border-radius:11px;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.10)}.profile-badges-pro .badge-chip.badge-icon-only:hover{background:rgba(255,255,255,.14)}.profile-badges-pro .badge-emoji{font-size:17px!important;filter:drop-shadow(0 2px 10px rgba(0,0,0,.35))}.profile-badges-pro .badge-image{width:22px!important;height:22px!important;filter:drop-shadow(0 2px 10px rgba(0,0,0,.35))}
.profile-custom-status{margin-top:15px;display:flex;align-items:flex-start;gap:8px;padding:11px 13px;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-base);font-size:12.5px;color:var(--text-secondary);line-height:1.5}
.profile-status-quote{font-family:Georgia,serif;font-size:24px;line-height:16px;color:var(--profile-accent,var(--brand));opacity:.9}
.profile-quick-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:15px}
.profile-quick-stats>div{min-width:0;padding:11px 12px;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-base)}
.profile-quick-stats strong,.profile-quick-stats span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.profile-quick-stats strong{font-family:var(--font-display);font-size:14px}.profile-quick-stats span{margin-top:2px;font-size:10px;color:var(--text-muted)}
.profile-tabs{display:flex;gap:4px;margin-top:18px;border-bottom:1px solid var(--border-subtle)}
.profile-tab{position:relative;border:0;background:transparent;color:var(--text-muted);font-size:11.5px;font-weight:750;padding:10px 12px;cursor:pointer}
.profile-tab:hover{color:var(--text-primary)}.profile-tab.active{color:var(--text-primary)}
.profile-tab.active::after{content:"";position:absolute;left:10px;right:10px;bottom:-1px;height:2px;border-radius:2px 2px 0 0;background:var(--profile-accent,var(--brand))}
.profile-tab>span{display:inline-flex;align-items:center;justify-content:center;min-width:18px;height:18px;padding:0 5px;margin-left:4px;border-radius:999px;background:var(--bg-elevated-2);font-size:9px;color:var(--text-muted)}
.profile-tab-content{padding-top:14px}.profile-tab-content [hidden]{display:none!important}
.profile-overview-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.profile-info-card{min-width:0;padding:14px;border:1px solid var(--border-subtle);border-radius:11px;background:var(--bg-base)}
.profile-about-card,.profile-server-context-card{grid-column:1/-1}
.profile-section-title{display:flex;align-items:center;gap:7px;margin-bottom:9px;color:var(--text-muted);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.055em}
.profile-section-title i{color:var(--profile-accent,var(--brand))}
.profile-about-text{font-size:12.5px;line-height:1.65;color:var(--text-secondary);white-space:pre-wrap;word-break:break-word}.profile-about-text.muted{color:var(--text-muted)}
.profile-activity-row{display:flex;align-items:center;gap:8px}.profile-activity-row strong{font-size:12.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.profile-activity-pulse{width:8px;height:8px;border-radius:50%;background:var(--status-online);box-shadow:0 0 0 4px color-mix(in srgb,var(--status-online) 12%,transparent);flex:0 0 auto}
.profile-meta-list{display:flex;flex-direction:column;gap:8px}.profile-meta-list>div{display:flex;align-items:center;justify-content:space-between;gap:14px;font-size:11.5px}.profile-meta-list span{color:var(--text-muted)}.profile-meta-list strong{font-weight:700;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-meta-list strong i{color:#f2b84b;margin-right:4px}
.profile-role-list{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;padding-top:12px;border-top:1px solid var(--border-subtle)}
.profile-role{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 8px;border-radius:7px;border:1px solid color-mix(in srgb,var(--role-color) 26%,var(--border-subtle));background:color-mix(in srgb,var(--role-color) 8%,var(--bg-elevated-2));font-size:10.5px;color:var(--text-secondary)}
.profile-role i{width:7px;height:7px;border-radius:50%;background:var(--role-color);box-shadow:0 0 0 2px color-mix(in srgb,var(--role-color) 13%,transparent)}
.profile-empty-inline{margin-top:11px;padding-top:10px;border-top:1px solid var(--border-subtle);font-size:10.5px;color:var(--text-muted)}
.profile-mutual-list{display:flex;flex-direction:column;gap:6px}
.profile-mutual-server{width:100%;display:flex;align-items:center;gap:11px;padding:9px;border:1px solid transparent;border-radius:10px;background:transparent;color:var(--text-primary);text-align:left;cursor:pointer}
.profile-mutual-server:hover{background:var(--bg-base);border-color:var(--border-subtle)}
.profile-mutual-icon{width:42px;height:42px;display:grid;place-items:center;overflow:hidden;flex:0 0 auto;border-radius:12px;background:var(--bg-elevated-2);font-size:12px;font-weight:800;color:var(--text-secondary)}
.profile-mutual-icon img{width:100%;height:100%;object-fit:cover}.profile-mutual-copy{min-width:0;flex:1}.profile-mutual-copy strong,.profile-mutual-copy small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.profile-mutual-copy strong{font-size:12.5px}.profile-mutual-copy small{margin-top:2px;font-size:10px;color:var(--text-muted)}.profile-mutual-arrow{font-size:10px;color:var(--text-muted);margin-right:4px}
.profile-tab-empty{min-height:170px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--text-muted);gap:5px}.profile-tab-empty>i{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:var(--bg-base);color:var(--profile-accent,var(--brand));font-size:16px;margin-bottom:4px}.profile-tab-empty strong{font-size:12.5px;color:var(--text-secondary)}.profile-tab-empty span{font-size:10.5px;max-width:260px}

.profile-identity-hero .profile-identity-tag{background:rgba(15,18,24,.48);border-color:rgba(255,255,255,.12);color:#f1f4f6;backdrop-filter:blur(8px)}.profile-identity-hero .profile-identity-tag.bot{background:rgba(40,199,111,.20);border-color:rgba(40,199,111,.48);color:#7ef0af;box-shadow:0 2px 10px rgba(40,199,111,.10)}
.profile-identity-hero .profile-identity-tag.admin{background:color-mix(in srgb,var(--brand) 34%,rgba(15,18,24,.4));border-color:color-mix(in srgb,var(--brand) 42%,transparent);color:#fff}
.profile-identity-hero .profile-plus-mark{filter:drop-shadow(0 2px 10px rgba(0,0,0,.36))}
.profile-identity-hero .profile-live-status.online{color:#85f4b3}.profile-identity-hero .profile-live-status.idle{color:#ffd978}.profile-identity-hero .profile-live-status.dnd{color:#ff8d98}.profile-identity-hero .profile-live-status.offline{color:rgba(255,255,255,.64)}
@media(max-width:620px){
  .profile-backdrop{padding:0;align-items:end}
  .profile-card.profile-card-pro{width:100%;max-height:92dvh;border-radius:18px 18px 0 0;border-left:0;border-right:0;border-bottom:0}
  .profile-card-pro .profile-banner{flex-basis:200px;height:200px}
  .profile-card-pro .profile-pro-body{padding:16px 16px 20px}
  .profile-hero-overlay{padding:0 16px 16px}
  .profile-top-row,.profile-top-row-hero{min-height:auto;flex-direction:column;align-items:flex-start}
  .profile-hero-main{width:100%;align-items:flex-end;gap:12px}
  .profile-avatar-shell{width:96px;height:96px}
  .profile-actions-pro,.profile-actions-hero{width:100%;padding-top:0;gap:6px;justify-content:flex-start}.profile-actions-pro .profile-action-main{font-size:0;width:38px;padding:0}.profile-actions-pro .profile-action-main i{font-size:12px}
  .profile-name-line h2{font-size:20px}.profile-quick-stats{grid-template-columns:1fr 1fr}.profile-quick-stats>div:last-child{display:none}
  .profile-overview-grid{grid-template-columns:1fr}.profile-info-card,.profile-about-card,.profile-server-context-card{grid-column:auto}
  .profile-tab{padding-left:8px;padding-right:8px}.profile-close-btn{right:11px;top:11px}
}


/* ---- Gizlenebilir sunucu/topluluk rayı ---------------------------------
   Masaüstünde en soldaki sunucu sütunu tamamen kapanabilir. Kanal paneli
   otomatik olarak sola yaslanır ve içerik alanı boşalan genişliği kullanır. */
@media (min-width: 761px) {
  .app-shell {
    transition: grid-template-columns 180ms ease;
  }

  .server-rail-toggle {
    position: fixed;
    left: 64px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 710;
    width: 24px;
    height: 42px;
    border: 1px solid var(--border-subtle);
    border-radius: 8px;
    background: var(--bg-elevated);
    color: var(--text-muted);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: .72;
    box-shadow: var(--shadow-sm);
    transition: left 180ms ease, opacity 120ms ease, background 120ms ease, color 120ms ease;
  }
  .server-rail-toggle:hover,
  .server-rail-toggle:focus-visible {
    opacity: 1;
    color: var(--text-primary);
    background: var(--bg-hover);
    outline: none;
  }
  .server-rail-toggle i {
    font-size: 10px;
    transition: transform 180ms ease;
  }

  .app-shell.server-rail-collapsed {
    grid-template-columns: 0 240px minmax(0, 1fr) 220px;
  }
  .app-shell.server-rail-collapsed .server-rail {
    width: 0;
    min-width: 0;
    padding-left: 0;
    padding-right: 0;
    border-right-width: 0;
    opacity: 0;
    pointer-events: none;
    overflow: hidden;
  }
  .app-shell.server-rail-collapsed .server-rail-toggle {
    left: 5px;
  }
  .app-shell.server-rail-collapsed .server-rail-toggle i {
    transform: rotate(180deg);
  }

  .app-shell.discover-mode.server-rail-collapsed {
    grid-template-columns: 0 240px minmax(0, 1fr) 0;
  }
}


/* ---- BOT badge özel hover tooltip -------------------------------------- */
.bot-hover-tooltip{position:relative;overflow:visible;cursor:default}
.bot-hover-tooltip::after{
  content:attr(data-bot-tooltip);
  position:absolute;
  left:50%;
  bottom:calc(100% + 9px);
  transform:translateX(-50%) translateY(4px);
  padding:7px 10px;
  border-radius:7px;
  background:#0f1115;
  color:#f5f7fa;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 8px 22px rgba(0,0,0,.34);
  font-size:11px;
  font-weight:800;
  letter-spacing:0;
  line-height:1;
  white-space:nowrap;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  z-index:9999;
  transition:opacity .12s ease,transform .12s ease,visibility .12s ease;
}
.bot-hover-tooltip::before{
  content:"";
  position:absolute;
  left:50%;
  bottom:calc(100% + 5px);
  width:8px;
  height:8px;
  background:#0f1115;
  border-right:1px solid rgba(255,255,255,.08);
  border-bottom:1px solid rgba(255,255,255,.08);
  transform:translateX(-50%) rotate(45deg) translateY(4px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  z-index:9998;
  transition:opacity .12s ease,transform .12s ease,visibility .12s ease;
}
.bot-hover-tooltip:hover::after,
.bot-hover-tooltip:hover::before,
.bot-hover-tooltip:focus-visible::after,
.bot-hover-tooltip:focus-visible::before{opacity:1;visibility:visible}
.bot-hover-tooltip:hover::after,
.bot-hover-tooltip:focus-visible::after{transform:translateX(-50%) translateY(0)}
.bot-hover-tooltip:hover::before,
.bot-hover-tooltip:focus-visible::before{transform:translateX(-50%) rotate(45deg) translateY(0)}

/* ==========================================================================
   NEXUS v5 — gelişmiş sohbet / profil / favori / tanılama yardımcıları
   ========================================================================== */
.dm-message-receipt{margin-top:3px;font-size:9.5px;color:var(--text-muted);display:flex;align-items:center;gap:4px}.dm-message-receipt.delivered{color:var(--text-secondary)}.dm-message-receipt.read{color:var(--brand)}
.upload-progress{display:grid;grid-template-columns:minmax(80px,1fr) auto 28px;align-items:center;gap:9px;padding:7px 10px;margin:0 0 7px;border:1px solid var(--border-subtle);border-radius:9px;background:var(--bg-elevated)}.upload-progress-track{height:5px;border-radius:999px;overflow:hidden;background:var(--bg-deepest)}.upload-progress-bar{height:100%;background:var(--brand);transition:width .12s linear}.upload-progress span{font-size:10px;color:var(--text-secondary);white-space:nowrap}.upload-cancel{width:26px;height:26px;border:0;border-radius:7px;background:transparent;color:var(--text-muted);cursor:pointer}.upload-cancel:hover{background:var(--bg-hover);color:var(--status-dnd)}
.composer-wrap.drag-active{outline:2px dashed color-mix(in srgb,var(--brand) 65%,transparent);outline-offset:-6px;background:color-mix(in srgb,var(--brand) 5%,transparent)}
.pending-att{min-width:0}.pending-att>img{width:38px;height:38px;object-fit:cover;border-radius:7px}.pending-att>i{width:38px;height:38px;display:grid;place-items:center;border-radius:7px;background:var(--bg-hover);color:var(--brand)}.pending-att>span{min-width:0;display:flex;flex-direction:column}.pending-att>span strong,.pending-att>span small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pending-att>span small{font-size:9px;color:var(--text-muted)}
.dm-browser-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:12px}.dm-browser-results{display:flex;flex-direction:column;gap:6px;max-height:440px;overflow:auto}.dm-browser-message,.dm-browser-file{width:100%;display:flex;align-items:center;gap:10px;padding:10px;border:1px solid var(--border-subtle);border-radius:9px;background:var(--bg-base);color:var(--text-primary);text-align:left;text-decoration:none;cursor:pointer}.dm-browser-message{display:block}.dm-browser-message:hover,.dm-browser-file:hover{background:var(--bg-hover);border-color:var(--border-strong)}.dm-browser-message>span{display:flex;align-items:center;justify-content:space-between;gap:10px}.dm-browser-message p{margin:5px 0 0;color:var(--text-secondary);font-size:12px;line-height:1.45}.dm-browser-message small,.dm-browser-file small{font-size:9.5px;color:var(--text-muted)}.dm-browser-file>img,.dm-browser-file>i{width:46px;height:46px;flex:0 0 auto;border-radius:9px}.dm-browser-file>img{object-fit:cover}.dm-browser-file>i{display:grid;place-items:center;background:var(--bg-hover);color:var(--brand);font-size:17px}.dm-browser-file>span{min-width:0;display:flex;flex-direction:column;gap:3px}.dm-browser-file strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px}
.profile-theme-forest{--profile-accent:#28c76f}.profile-theme-forest .profile-banner:not(.has-image){background:linear-gradient(145deg,#123322,#10251b)}.profile-theme-midnight{--profile-accent:#5c8dff}.profile-theme-midnight .profile-banner:not(.has-image){background:linear-gradient(145deg,#151b36,#111522)}.profile-theme-glass .profile-pro-body{background:color-mix(in srgb,var(--bg-elevated) 82%,transparent);backdrop-filter:blur(18px)}
.profile-bot-tags{display:flex;flex-wrap:wrap;gap:5px;margin:12px 0}.profile-bot-tags span{padding:4px 7px;border-radius:6px;background:var(--brand-soft);color:var(--brand);font-size:9.5px;font-weight:750}.profile-bot-changelog{margin-top:12px;padding:10px;border:1px solid var(--border-subtle);border-radius:8px;background:var(--bg-elevated-2)}.profile-bot-changelog strong{font-size:10px;text-transform:uppercase;letter-spacing:.04em}.profile-bot-changelog p{margin:6px 0 0;color:var(--text-secondary);font-size:11px;white-space:pre-wrap}.profile-bot-links{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.profile-bot-links a{display:inline-flex;align-items:center;gap:5px;padding:5px 7px;border-radius:6px;background:var(--bg-elevated-2);color:var(--text-secondary);font-size:10px;text-decoration:none}.profile-bot-links a:hover{color:var(--brand)}
.rail-favorite-badge{position:absolute;left:-2px;top:-2px;width:14px;height:14px;display:grid;place-items:center;border-radius:50%;background:var(--bg-deepest);color:#ffd35a;font-size:7px;z-index:3}.rail-item.favorite .bubble{box-shadow:0 0 0 1px color-mix(in srgb,#ffd35a 42%,transparent)}
.notif-filter-row{display:flex;gap:4px;margin-top:7px}.notif-filter{border:0;background:transparent;color:var(--text-muted);font-size:9.5px;font-weight:750;padding:3px 6px;border-radius:5px;cursor:pointer}.notif-filter:hover{background:var(--bg-hover);color:var(--text-primary)}.notif-filter.active{background:var(--brand-soft);color:var(--brand)}
.voice-volume-control{width:70px;accent-color:var(--brand)}
@media(max-width:640px){.upload-progress{grid-template-columns:1fr auto}.upload-progress span{display:none}.dm-browser-tabs{overflow-x:auto;flex-wrap:nowrap}.dm-browser-tabs .btn{white-space:nowrap}}


/* NEXUS v5 — Sahne kanalı */
.voice-stage.is-stage-channel{align-content:flex-start;justify-content:flex-start;min-height:220px;padding-bottom:16px}
.stage-role-pill{display:inline-flex;align-items:center;gap:7px;margin-left:auto;padding:5px 9px;border:1px solid var(--border-subtle);border-radius:999px;background:var(--bg-base);color:var(--text-secondary);font-size:10.5px;font-weight:750}
.stage-role-dot{width:7px;height:7px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.stage-roster{border-top:1px solid var(--border-subtle);background:var(--bg-base);padding:14px 18px;max-height:290px;overflow:auto}
.stage-roster-group+ .stage-roster-group{margin-top:15px}.stage-roster-group h4{margin:0 0 7px;color:var(--text-muted);font-size:9.5px;letter-spacing:.07em}
.stage-person{display:flex;align-items:center;gap:10px;min-height:46px;padding:6px 7px;border-radius:8px}.stage-person:hover{background:var(--bg-hover)}.stage-person .avatar{width:34px;height:34px}
.stage-person-copy{min-width:0;flex:1}.stage-person-copy strong,.stage-person-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stage-person-copy strong{font-size:12px}.stage-person-copy span{margin-top:2px;color:var(--text-muted);font-size:9.5px}
.stage-person.speaker .stage-person-copy span{color:var(--brand)}.stage-person.requested .stage-person-copy span{color:var(--status-idle)}
.stage-roster-empty{padding:16px;color:var(--text-muted);font-size:11px;text-align:center}.stage-request-btn{height:44px;padding:0 15px;border-radius:999px}.voice-controls .icon-btn.stage-locked{opacity:.42;cursor:not-allowed}
@media(max-width:720px){.stage-roster{max-height:220px;padding:12px}.stage-person{flex-wrap:wrap}.stage-person .btn{margin-left:44px}.stage-role-pill{display:none}}

/* NEXUS Voice — Discord benzeri ekran paylaşımı odak düzeni */
.voice-stage{
  position:relative;
  min-width:0;
  min-height:0;
  overflow:hidden;
}
.voice-participant-grid{
  flex:1 1 auto;
  min-width:0;
  min-height:0;
  display:flex;
  flex-wrap:wrap;
  align-content:center;
  justify-content:center;
  gap:var(--space-5);
  transition:flex-basis .22s ease,background-color .22s ease,border-color .22s ease,padding .22s ease;
}
.voice-screen-panel[hidden]{display:none!important}
.voice-screen-panel{
  min-width:0;
  min-height:0;
  overflow:hidden;
  border:1px solid var(--border-subtle);
  border-radius:14px;
  background:#08090b;
  box-shadow:var(--shadow-panel);
  animation:nexus-screen-panel-in .22s ease both;
}
.voice-screen-head{
  height:42px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 13px;
  color:var(--text-secondary);
  background:var(--bg-elevated);
  border-bottom:1px solid var(--border-subtle);
  font-size:11.5px;
}
.voice-screen-head i{color:var(--brand)}
.voice-screen-head strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.voice-screen-canvas{
  height:calc(100% - 42px);
  min-height:0;
  display:grid;
  place-items:center;
  background:#050607;
}
.voice-screen-canvas video{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  background:#050607;
}
.voice-stage.screen-share-active{
  flex-wrap:nowrap;
  align-content:stretch;
  align-items:stretch;
  justify-content:stretch;
  gap:12px;
  padding:16px;
}
.voice-stage.screen-share-active .voice-participant-grid{
  flex:0 0 calc(50% - 6px);
  padding:16px;
  border:1px solid var(--border-subtle);
  border-radius:14px;
  background:var(--bg-base);
  overflow:auto;
}
.voice-stage.screen-share-active .voice-screen-panel{
  display:flex;
  flex:0 0 calc(50% - 6px);
  flex-direction:column;
}
.voice-stage.screen-share-active .voice-self-tile{
  min-width:min(320px,100%);
  min-height:240px;
  justify-content:center;
  padding:22px;
  border-radius:14px;
  background:var(--bg-elevated);
}
.voice-stage.screen-share-active .voice-self-tile>.avatar{
  width:116px;
  height:116px;
}
.voice-stage.screen-share-active .voice-self-tile>.voice-video{
  width:100%;
  max-width:none;
}
@keyframes nexus-screen-panel-in{
  from{opacity:0;transform:translateX(10px) scale(.99)}
  to{opacity:1;transform:none}
}
@media (max-width:900px){
  .voice-stage.screen-share-active{
    flex-direction:column;
  }
  .voice-stage.screen-share-active .voice-participant-grid{
    flex:0 0 38%;
    width:100%;
    padding:10px;
  }
  .voice-stage.screen-share-active .voice-screen-panel{
    flex:1 1 62%;
    width:100%;
  }
  .voice-stage.screen-share-active .voice-self-tile{
    min-height:130px;
    min-width:min(240px,100%);
    padding:12px;
  }
  .voice-stage.screen-share-active .voice-self-tile>.avatar{
    width:72px;
    height:72px;
  }
}


/* NEXUS Pulse */
.pulse-wallet{margin:16px 0 14px;padding:16px;display:flex;align-items:center;justify-content:space-between;gap:16px;border:1px solid var(--border-subtle);border-radius:12px;background:var(--bg-base)}
.pulse-wallet.active{border-color:color-mix(in srgb,var(--brand) 36%,var(--border-subtle));background:color-mix(in srgb,var(--brand) 5%,var(--bg-base))}
.pulse-wallet-main{display:flex;align-items:center;gap:12px;min-width:0}.pulse-wallet-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:12px;background:var(--brand-soft);color:var(--brand);font-size:18px}.pulse-wallet-main strong,.pulse-wallet-main span{display:block}.pulse-wallet-main strong{font-size:14px}.pulse-wallet-main span{margin-top:3px;color:var(--text-muted);font-size:11px}
.pulse-slot-row{display:flex;gap:7px}.pulse-slot{width:34px;height:34px;display:grid;place-items:center;border:1px dashed var(--border-strong);border-radius:10px;color:var(--text-muted);background:var(--bg-deepest)}.pulse-slot.used{border-style:solid;border-color:color-mix(in srgb,var(--brand) 48%,transparent);background:var(--brand-soft);color:var(--brand)}.pulse-slot.cooldown{border-style:solid;color:var(--status-idle);background:color-mix(in srgb,var(--status-idle) 9%,var(--bg-deepest))}
.pulse-allocations{margin-bottom:28px}.pulse-allocations>h3{font-size:13px;margin:0 0 9px}.pulse-allocation-card{width:100%;min-height:58px;margin-bottom:7px;padding:9px 12px;display:flex;align-items:center;gap:11px;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-base);color:var(--text-primary);text-align:left;cursor:pointer}.pulse-allocation-card:hover{background:var(--bg-hover);border-color:var(--border-strong)}.pulse-allocation-card>div{min-width:0;flex:1}.pulse-allocation-card strong,.pulse-allocation-card span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pulse-allocation-card strong{font-size:12.5px}.pulse-allocation-card span{margin-top:3px;color:var(--text-muted);font-size:10.5px}.pulse-allocation-card>i{color:var(--text-muted);font-size:10px}.pulse-server-icon{width:38px;height:38px;border-radius:11px;object-fit:cover;background:var(--bg-elevated-2)}
.pulse-empty{min-height:70px;padding:14px;display:flex;align-items:center;gap:11px;border:1px dashed var(--border-strong);border-radius:10px;color:var(--text-muted);font-size:11px}.pulse-empty>i{color:var(--brand)}.pulse-cooldowns{margin-top:10px;padding:11px 13px;border:1px solid color-mix(in srgb,var(--status-idle) 22%,var(--border-subtle));border-radius:9px;background:color-mix(in srgb,var(--status-idle) 5%,var(--bg-base))}.pulse-cooldowns strong,.pulse-cooldowns span{display:block}.pulse-cooldowns strong{font-size:11px;color:var(--status-idle)}.pulse-cooldowns span{margin-top:4px;color:var(--text-muted);font-size:10.5px}.plus-benefits-head{margin-top:30px}
.pulse-modal-body{display:flex;flex-direction:column;gap:14px}.pulse-server-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.pulse-server-summary>div{padding:13px;border:1px solid var(--border-subtle);border-radius:9px;background:var(--bg-base)}.pulse-server-summary span,.pulse-server-summary strong{display:block}.pulse-server-summary span{color:var(--text-muted);font-size:10px}.pulse-server-summary strong{margin-top:3px;font-size:17px}.pulse-progress{padding:13px;border:1px solid var(--border-subtle);border-radius:9px;background:var(--bg-base)}.pulse-progress>div:first-child{display:flex;justify-content:space-between;gap:10px;font-size:11px}.pulse-progress>div:first-child span{color:var(--text-muted)}.pulse-progress-track{height:7px;margin-top:10px;overflow:hidden;border-radius:999px;background:var(--bg-deepest)}.pulse-progress-track i{display:block;height:100%;border-radius:inherit;background:var(--brand)}.pulse-max-level{padding:12px;border:1px solid color-mix(in srgb,var(--brand) 32%,transparent);border-radius:9px;background:var(--brand-soft);color:var(--brand);font-size:11px}.pulse-max-level i{margin-right:6px}.pulse-action-card{padding:14px;display:flex;align-items:center;justify-content:space-between;gap:14px;border:1px solid color-mix(in srgb,var(--brand) 28%,var(--border-subtle));border-radius:10px;background:color-mix(in srgb,var(--brand) 5%,var(--bg-base))}.pulse-action-card>div{min-width:0}.pulse-action-card strong,.pulse-action-card span{display:block}.pulse-action-card strong{font-size:12.5px}.pulse-action-card span{margin-top:4px;color:var(--text-muted);font-size:10.5px;line-height:1.45}.pulse-plus-required{padding:14px;display:flex;align-items:center;gap:11px;border:1px solid var(--border-subtle);border-radius:10px;background:var(--bg-base)}.pulse-plus-required>i{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;background:var(--brand-soft);color:var(--brand)}.pulse-plus-required strong,.pulse-plus-required span{display:block}.pulse-plus-required strong{font-size:12px}.pulse-plus-required span{margin-top:3px;color:var(--text-muted);font-size:10.5px}.pulse-my-server h4,.pulse-levels h4{margin:0 0 8px;font-size:11px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}.pulse-allocation-row{min-height:44px;padding:7px 9px;display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:10px;border-bottom:1px solid var(--border-subtle)}.pulse-allocation-row span{font-size:11.5px;font-weight:700}.pulse-allocation-row span i{color:var(--brand);margin-right:6px}.pulse-allocation-row small{color:var(--text-muted);font-size:9.5px}.pulse-my-server>p{margin-top:7px;color:var(--text-muted);font-size:9.5px}.pulse-level-row{padding:10px;display:flex;align-items:center;gap:10px;border:1px solid var(--border-subtle);border-radius:9px;background:var(--bg-base);margin-top:6px}.pulse-level-row.active{border-color:color-mix(in srgb,var(--brand) 28%,var(--border-subtle))}.pulse-level-dot{width:30px;height:30px;display:grid;place-items:center;border-radius:8px;background:var(--bg-elevated-2);color:var(--text-muted)}.pulse-level-row.active .pulse-level-dot{background:var(--brand-soft);color:var(--brand)}.pulse-level-row>div{min-width:0}.pulse-level-row strong,.pulse-level-row small{display:block}.pulse-level-row strong{font-size:11px}.pulse-level-row strong em{margin-left:5px;color:var(--brand);font-style:normal;font-size:9px}.pulse-level-row small{margin-top:3px;color:var(--text-muted);font-size:9.5px}
@media(max-width:620px){.pulse-wallet{align-items:flex-start;flex-direction:column}.pulse-server-summary{grid-template-columns:1fr}.pulse-action-card{align-items:stretch;flex-direction:column}.pulse-action-card .btn{width:100%}.pulse-allocation-row{grid-template-columns:1fr auto}.pulse-allocation-row small{display:none}}


.server-pulse-chip{display:inline-flex;align-items:center;gap:3px;height:18px;padding:0 5px;margin-left:4px;border:1px solid color-mix(in srgb,var(--brand) 35%,transparent);border-radius:6px;background:var(--brand-soft);color:var(--brand);font-size:9px;font-weight:850;vertical-align:middle}.server-pulse-chip i{font-size:8px}

/* ================================================================
   NEXUS — Discord tarzı ses bağlantı paneli
   ================================================================ */

.voice-connection-dock {
  position: relative;

  flex-shrink: 0;

  min-height: 72px;

  display: flex;
  align-items: center;
  justify-content: space-between;

  gap: 10px;

  padding: 11px 10px;

  background:
    linear-gradient(
      180deg,
      color-mix(
        in srgb,
        var(--bg-base) 94%,
        var(--status-online) 6%
      ),
      var(--bg-base)
    );

  border-top:
    1px solid
    var(--border-subtle);

  opacity: 0;

  transform:
    translateY(8px);

  transition:
    opacity .18s ease,
    transform .18s ease,
    background .18s ease;
}


.voice-connection-dock[hidden] {
  display: none !important;
}


.voice-connection-dock.connected {
  opacity: 1;

  transform:
    translateY(0);
}


/* Sol taraf */

.voice-connection-info {
  flex: 1;

  min-width: 0;

  display: flex;

  align-items: center;

  gap: 10px;
}


/* Bağlantı simgesi */

.voice-connection-icon {
  position: relative;

  width: 34px;
  height: 34px;

  flex: 0 0 34px;

  display: grid;
  place-items: center;

  border-radius: 10px;

  color:
    var(--status-online);

  background:
    color-mix(
      in srgb,
      var(--status-online) 12%,
      transparent
    );

  border:
    1px solid
    color-mix(
      in srgb,
      var(--status-online) 25%,
      transparent
    );
}


.voice-connection-icon::after {
  content: '';

  position: absolute;

  right: 4px;
  top: 4px;

  width: 6px;
  height: 6px;

  border-radius: 50%;

  background:
    var(--status-online);

  box-shadow:
    0 0 8px
    color-mix(
      in srgb,
      var(--status-online) 65%,
      transparent
    );
}


.voice-connection-icon i {
  font-size: 13px;
}


/* Yazılar */

.voice-connection-copy {
  flex: 1;

  min-width: 0;
}


.voice-connection-title {
  margin-bottom: 2px;

  color:
    var(--status-online);

  font-size: 12px;

  font-weight: 750;

  line-height: 1.2;
}


.voice-connection-channel {
  max-width: 100%;

  overflow: hidden;

  color:
    var(--text-primary);

  font-size: 12.5px;

  font-weight: 650;

  line-height: 1.3;

  text-overflow: ellipsis;

  white-space: nowrap;
}


.voice-connection-server {
  margin-top: 1px;

  max-width: 100%;

  overflow: hidden;

  color:
    var(--text-muted);

  font-size: 10.5px;

  line-height: 1.3;

  text-overflow: ellipsis;

  white-space: nowrap;
}


/* Sesten çıkma */

.voice-disconnect-btn {
  width: 34px;
  height: 34px;

  flex: 0 0 34px;

  display: grid;
  place-items: center;

  border: 0;

  border-radius: 9px;

  outline: none;

  background:
    transparent;

  color:
    var(--text-secondary);

  cursor: pointer;

  transition:
    background .14s ease,
    color .14s ease,
    transform .14s ease;
}


.voice-disconnect-btn:hover {

  background:
    color-mix(
      in srgb,
      var(--status-dnd) 16%,
      transparent
    );

  color:
    var(--status-dnd);

  transform:
    translateY(-1px);
}


.voice-disconnect-btn:active {
  transform:
    scale(.94);
}


.voice-disconnect-btn:disabled {
  opacity: .45;

  cursor:
    wait;
}


/* Açık tema */

html[data-theme="light"]
.voice-connection-dock {

  background:
    linear-gradient(
      180deg,
      color-mix(
        in srgb,
        var(--bg-base) 97%,
        var(--status-online) 3%
      ),
      var(--bg-base)
    );
}
/* =========================================================================
   DM sağ profil paneli — yalnızca direkt mesaj görünümünde
   ========================================================================= */
.app-shell.dm-mode {
  grid-template-columns: 76px 240px minmax(0, 1fr) 280px;
}

.member-panel.dm-profile-mode {
  padding: 0;
  background: var(--bg-base);
  border-left: 1px solid var(--border-subtle);
}

.dm-profile-loading {
  min-height: 180px;
  display: grid;
  place-items: center;
}

.dm-profile-panel {
  min-height: 100%;
  color: var(--text-primary);
}

.dm-profile-banner {
  position: relative;
  height: 112px;
  background:
    radial-gradient(circle at 20% 10%, color-mix(in srgb, var(--dm-profile-accent, var(--brand)) 54%, transparent), transparent 52%),
    linear-gradient(145deg, color-mix(in srgb, var(--dm-profile-accent, var(--brand)) 34%, var(--bg-elevated)), var(--bg-elevated));
  background-size: cover;
  background-position: center;
}

.dm-profile-banner.has-image::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 45%, rgba(0,0,0,.38));
  pointer-events: none;
}

.dm-profile-main {
  padding: 0 16px 22px;
}

.dm-profile-avatar-btn {
  position: relative;
  z-index: 2;
  width: 88px;
  height: 88px;
  margin-top: -43px;
  padding: 0;
  border: 5px solid var(--bg-base);
  border-radius: 31%;
  background: var(--bg-base);
  cursor: pointer;
}

.dm-profile-avatar-wrap {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
}

.dm-profile-avatar-wrap img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: 27%;
  background: var(--bg-elevated);
}

.dm-profile-presence {
  position: absolute;
  right: -2px;
  bottom: -2px;
  width: 18px;
  height: 18px;
  border: 4px solid var(--bg-base);
  border-radius: 50%;
  background: var(--status-offline);
}
.dm-profile-presence.online,.dm-profile-status-mini.online { background: var(--status-online); }
.dm-profile-presence.idle,.dm-profile-status-mini.idle { background: var(--status-idle); }
.dm-profile-presence.dnd,.dm-profile-status-mini.dnd { background: var(--status-dnd); }
.dm-profile-presence.offline,.dm-profile-status-mini.offline { background: var(--status-offline); }

.dm-profile-identity {
  margin-top: 10px;
  min-width: 0;
}

.dm-profile-name-line {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 6px;
}

.dm-profile-name-line strong {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 18px;
  line-height: 1.25;
}

.dm-profile-plus {
  flex: 0 0 auto;
  color: var(--brand);
  font-size: 20px;
  font-weight: 900;
  line-height: 1;
}

.dm-profile-bot {
  flex: 0 0 auto;
  padding: 2px 5px;
  border-radius: 4px;
  background: var(--brand);
  color: #fff;
  font-size: 8px;
  font-weight: 900;
}

.dm-profile-username {
  display: block;
  margin-top: 2px;
  color: var(--text-muted);
  font-size: 12px;
}

.dm-profile-status-text {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  color: var(--text-secondary);
  font-size: 12px;
  line-height: 1.35;
}

.dm-profile-status-mini {
  width: 8px;
  height: 8px;
  flex: 0 0 8px;
  border-radius: 50%;
  background: var(--status-offline);
}

.dm-profile-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 12px;
}

.dm-profile-badges .badge-chip {
  margin: 0;
}

.dm-profile-view-btn {
  margin-top: 14px;
  justify-content: center;
}

.dm-profile-divider {
  height: 1px;
  margin: 16px 0;
  background: var(--border-subtle);
}

.dm-profile-section + .dm-profile-section {
  margin-top: 18px;
}

.dm-profile-section h4 {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 0 0 8px;
  color: var(--text-primary);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .045em;
  text-transform: uppercase;
}

.dm-profile-section h4 span {
  color: var(--text-muted);
  font-size: 10px;
  font-weight: 700;
}

.dm-profile-section p {
  margin: 0;
  color: var(--text-secondary);
  font-size: 12.5px;
  line-height: 1.55;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.dm-profile-section p.muted {
  color: var(--text-muted);
}

.dm-profile-mutuals {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.dm-profile-mutual {
  width: 100%;
  min-width: 0;
  height: 36px;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 6px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--text-secondary);
  cursor: pointer;
  text-align: left;
}

.dm-profile-mutual:hover {
  background: var(--bg-hover);
  color: var(--text-primary);
}

.dm-profile-mutual img {
  width: 26px;
  height: 26px;
  flex: 0 0 26px;
  border-radius: 8px;
  object-fit: cover;
  background: var(--bg-elevated);
}

.dm-profile-mutual span {
  min-width: 0;
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 650;
}

.dm-profile-meta > div {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 7px;
  color: var(--text-muted);
  font-size: 11.5px;
  line-height: 1.4;
}

.dm-profile-meta > div i {
  width: 14px;
  margin-top: 2px;
  color: var(--text-muted);
  text-align: center;
}

.dm-profile-mobile-close,
.dm-profile-toggle {
  display: none;
}

/* =====================================================================
   NEXUS Developer Portal v2.3.2 — visual polish / layout fixes
   ===================================================================== */
.dev-content{
  padding-bottom:140px;
}
.dev-content>*{
  width:100%;
  max-width:1060px;
}
.dev-card{
  overflow:hidden;
}
.dev-card code,
.dev-code,
.copy-field code{
  word-break:break-word;
}
.dev-card .row-muted{
  line-height:1.5;
}
.dev-intent-list,
.dev-card .dev-intent-list{
  display:flex;
  flex-direction:column;
  gap:0;
}
.dev-setting-row{
  position:relative;
  gap:18px;
}
.dev-setting-row > div:last-child{
  display:flex;
  align-items:center;
  justify-content:flex-end;
}
.dev-card .toggle-switch{
  width:46px;
  height:26px;
}
.dev-card .toggle-slider{
  background:color-mix(in srgb,var(--bg-active) 84%, #fff 6%);
  border:1px solid color-mix(in srgb,var(--border-strong) 86%, #fff 10%);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.03);
}
.dev-card .toggle-slider::before{
  top:3px;
  left:3px;
  width:18px;
  height:18px;
  background:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.22);
}
.dev-card .toggle-switch input:checked + .toggle-slider::before{
  transform:translateX(20px);
}
.dev-savebar{
  margin-top:18px;
  padding-top:16px;
  border-top:1px solid var(--border-subtle);
  flex-wrap:wrap;
}
.dev-savebar .btn{
  flex:0 0 auto;
}
.dev-scroll-top{
  right:18px;
  bottom:18px;
}

@media (min-width: 980px){
  .dev-card .dev-setting-row{
    grid-template-columns:minmax(0, 720px) auto;
    justify-content:space-between;
  }
}

@media (max-width: 900px){
  .dev-content>*{
    max-width:none;
  }
}

@media (max-width: 640px){
  .dev-setting-row{
    grid-template-columns:minmax(0,1fr) auto;
    gap:14px;
  }
  .dev-content{
    padding-bottom:120px;
  }
  .dev-savebar{
    align-items:stretch;
  }
  .dev-savebar .btn,
  .dev-savebar a.btn{
    width:100%;
  }
}

/* ---- Profile badges: unified professional appearance ------------------ */
.profile-badges-pro.discord-badge-tray,
.dm-profile-badges {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  width: fit-content;
  max-width: 100%;
}

.profile-badges-pro.discord-badge-tray {
  width: fit-content;
  max-width: 100%;
  margin: 13px 0 0;
  padding: 7px;
  border: 1px solid rgba(255,255,255,.09);
  border-radius: 13px;
  background: rgba(9,12,16,.76);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 8px 24px rgba(0,0,0,.14);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.profile-badges-pro .badge-chip.badge-icon-only,
.dm-profile-badges .badge-chip.badge-icon-only {
  width: 32px;
  height: 32px;
  min-width: 32px;
  padding: 0;
  border-radius: 9px;
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035));
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 2px 7px rgba(0,0,0,.18);
  transform: none;
  transition: transform .15s ease, border-color .15s ease, background .15s ease, box-shadow .15s ease;
}

.profile-badges-pro .badge-chip.badge-icon-only:hover,
.dm-profile-badges .badge-chip.badge-icon-only:hover {
  transform: translateY(-2px);
  border-color: color-mix(in srgb, var(--bc) 52%, rgba(255,255,255,.16));
  background: linear-gradient(180deg, color-mix(in srgb, var(--bc) 13%, #252a31), #171b20);
  box-shadow: 0 6px 16px rgba(0,0,0,.26), 0 0 0 1px color-mix(in srgb, var(--bc) 14%, transparent);
}

.profile-badges-pro .badge-image,
.dm-profile-badges .badge-image {
  width: 21px!important;
  height: 21px!important;
  object-fit: contain;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.24));
}

.profile-badges-pro .badge-emoji,
.dm-profile-badges .badge-emoji {
  width: 21px;
  height: 21px;
  display: grid!important;
  place-items: center;
  font-size: 16px!important;
  line-height: 1;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,.24));
}

/* Sağ DM profilinde de aynı rozet kutusu dili */
.dm-profile-badges {
  width: fit-content;
  max-width: 100%;
  margin-top: 12px;
  padding: 6px;
  border: 1px solid rgba(255,255,255,.075);
  border-radius: 12px;
  background: rgba(255,255,255,.025);
}

/* Profil üstünde tooltip daha temiz ve kompakt */
.profile-badges-pro .discord-badge.has-badge-tooltip::after,
.dm-profile-badges .discord-badge.has-badge-tooltip::after {
  padding: 7px 10px;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,.10);
  background: #11151b;
  color: #f7f9fc;
  box-shadow: 0 10px 28px rgba(0,0,0,.38);
  font-size: 10.5px;
  font-weight: 750;
}
.profile-badges-pro .discord-badge.has-badge-tooltip::before,
.dm-profile-badges .discord-badge.has-badge-tooltip::before {
  background: #11151b;
}

/* ========================================================================
   Okunmamış sunucu / kanal göstergeleri
   - Normal mesaj: sunucu logosunda beyaz parlak çerçeve + kanal parlak/bold.
   - @mention: bunlara ek olarak kırmızı sayaç.
   ======================================================================== */

/* Normal okunmamış mesaj: sunucu ikonunun çevresinde parlak beyaz şerit. */
.rail-item.has-unread .bubble {
  position: relative;
  box-shadow:
    0 0 0 2px rgba(255,255,255,.94),
    0 0 10px rgba(255,255,255,.34),
    0 0 20px rgba(255,255,255,.14);
  filter: brightness(1.06);
}
.rail-item.has-unread .indicator {
  opacity: 0 !important;
  height: 0 !important;
}
.rail-item.has-unread.active .bubble {
  box-shadow:
    0 0 0 2px rgba(255,255,255,.98),
    0 0 12px rgba(255,255,255,.38),
    0 0 22px rgba(255,255,255,.16);
}

/* Kırmızı sunucu sayacı SADECE doğrudan @mention olduğunda oluşturulur. */
.server-unread-badge.mention-badge {
  position: absolute;
  right: -6px;
  bottom: -5px;
  z-index: 8;
  min-width: 19px;
  height: 19px;
  padding: 0 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  border: 2px solid var(--bg-deepest);
  background: var(--status-dnd);
  color: #fff;
  font-size: 10px;
  line-height: 1;
  font-weight: 900;
  box-shadow: 0 3px 10px rgba(0,0,0,.42);
}

/* Normal okunmamış kanal: açık, parlak ve bold. */
.channel-item.has-unread:not(.active) {
  position: relative;
  color: var(--text-primary);
  font-weight: 800;
  background: rgba(255,255,255,.035);
  box-shadow: inset 2px 0 0 rgba(255,255,255,.82);
}
.channel-item.has-unread:not(.active) .ch-name {
  color: #fff;
  font-weight: 850;
  text-shadow: 0 0 9px rgba(255,255,255,.12);
}
.channel-item.has-unread:not(.active) .ch-icon {
  color: rgba(255,255,255,.92);
  filter: drop-shadow(0 0 5px rgba(255,255,255,.18));
}
.channel-item.has-unread:not(.active)::before,
.channel-item.has-unread.active::before {
  display: none;
}

/* Kırmızı kanal sayacı SADECE doğrudan @mention olduğunda oluşturulur. */
.channel-unread-badge.mention-badge {
  flex: 0 0 auto;
  margin-left: auto;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: var(--status-dnd);
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  box-shadow: 0 2px 8px rgba(0,0,0,.28);
}
.channel-item.has-mention:not(.active) {
  box-shadow:
    inset 2px 0 0 rgba(255,255,255,.92),
    inset 0 0 18px rgba(255,255,255,.025);
}

/* Kapalı kategoride de içeride okunmamış kanal olduğu belli olsun. */
.channel-category.has-unread .channel-category-label {
  color: var(--text-primary);
  font-weight: 900;
}
.channel-category.has-unread .channel-category-label::after {
  content: '';
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-left: 7px;
  border-radius: 50%;
  background: rgba(255,255,255,.9);
  vertical-align: middle;
  box-shadow: 0 0 8px rgba(255,255,255,.34);
}

/* Yeni normal mesaj geldiğinde kısa beyaz parıltı. */
.channel-item.unread-flash:not(.active) {
  animation: nexus-channel-unread-arrive 1s ease-out;
}
.rail-item.server-unread-flash .bubble {
  animation: nexus-server-unread-arrive 1s ease-out;
}
@keyframes nexus-channel-unread-arrive {
  0% { background: rgba(255,255,255,.14); box-shadow: inset 2px 0 0 #fff, inset 0 0 22px rgba(255,255,255,.12); }
  55% { background: rgba(255,255,255,.07); }
  100% { background: rgba(255,255,255,.035); box-shadow: inset 2px 0 0 rgba(255,255,255,.82); }
}
@keyframes nexus-server-unread-arrive {
  0% { transform: scale(1); box-shadow: 0 0 0 2px #fff, 0 0 6px rgba(255,255,255,.65); }
  45% { transform: scale(1.055); box-shadow: 0 0 0 3px #fff, 0 0 18px rgba(255,255,255,.55); }
  100% { transform: scale(1); box-shadow: 0 0 0 2px rgba(255,255,255,.94), 0 0 10px rgba(255,255,255,.34), 0 0 20px rgba(255,255,255,.14); }
}

@media (prefers-reduced-motion: reduce) {
  .channel-item.unread-flash:not(.active),
  .rail-item.server-unread-flash .bubble { animation: none !important; }
}



/* ---- Voice speaking indicators ---------------------------------------- */
.voice-avatar-shell,
.voice-participant-avatar-wrap{
  position:relative;
  display:grid;
  place-items:center;
  flex:0 0 auto;
}
.voice-avatar-shell{border-radius:var(--radius-squircle)}
.voice-participant-avatar-wrap{width:24px;height:24px;border-radius:50%}
.voice-participant-avatar-wrap img{width:22px;height:22px;border-radius:50%;object-fit:cover;transition:box-shadow .14s ease,filter .14s ease}
.voice-participant-live-dot{
  position:absolute;
  right:-1px;
  bottom:-1px;
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--text-muted);
  border:2px solid var(--bg-base);
  opacity:0;
  transform:scale(.6);
  transition:opacity .12s ease,transform .12s ease,background-color .12s ease;
}
.voice-participant{
  border-radius:7px;
  transition:color .14s ease,background-color .14s ease;
}
.voice-participant.is-speaking{
  color:var(--text-primary);
  background:color-mix(in srgb,var(--pulse) 7%,transparent);
}
.voice-participant.is-speaking .voice-participant-avatar-wrap img{
  box-shadow:0 0 0 2px var(--pulse),0 0 12px color-mix(in srgb,var(--pulse) 38%,transparent);
  filter:brightness(1.07);
}
.voice-participant.is-speaking .voice-participant-live-dot{
  opacity:1;
  transform:scale(1);
  background:var(--pulse);
  box-shadow:0 0 8px color-mix(in srgb,var(--pulse) 72%,transparent);
}
.voice-participant.is-speaking .voice-participant-name{font-weight:750;color:var(--text-primary)}

.voice-tile .avatar,
.voice-tile .voice-avatar-shell{
  transition:box-shadow .14s ease,filter .14s ease,transform .14s ease;
}
.voice-tile.speaking .avatar{
  box-shadow:0 0 0 4px var(--pulse),0 0 0 8px color-mix(in srgb,var(--pulse) 16%,transparent),0 0 28px color-mix(in srgb,var(--pulse) 38%,transparent);
  filter:brightness(1.06);
}
.voice-tile.speaking .voice-avatar-shell{
  animation:nexus-speaking-ring 1.05s ease-in-out infinite;
}
.voice-tile.speaking .vname{color:var(--text-primary);font-weight:800}
@keyframes nexus-speaking-ring{
  0%,100%{filter:drop-shadow(0 0 0 transparent)}
  50%{filter:drop-shadow(0 0 8px color-mix(in srgb,var(--pulse) 50%,transparent))}
}
@media (prefers-reduced-motion:reduce){
  .voice-tile.speaking .voice-avatar-shell{animation:none}
}

/* ---- Voice focus / click-to-expand ----------------------------------- */
.voice-stage .voice-tile,
.voice-stage .voice-screen-panel{
  cursor:zoom-in;
}
.voice-stage .voice-tile.voice-focus-target,
.voice-stage .voice-screen-panel.voice-focus-target{
  cursor:zoom-out;
}
.voice-stage.voice-focus-active{
  isolation:isolate;
}
.voice-stage.voice-focus-active::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:24;
  background:color-mix(in srgb,var(--bg-base) 91%,#000 9%);
  opacity:.96;
  animation:nexus-voice-focus-backdrop .2s ease both;
}
.voice-stage.voice-focus-active .voice-focus-target{
  position:absolute!important;
  inset:14px!important;
  z-index:30!important;
  width:auto!important;
  height:auto!important;
  max-width:none!important;
  max-height:none!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  border:1px solid var(--border-subtle);
  border-radius:18px;
  background:#090b0f;
  box-shadow:0 24px 80px rgba(0,0,0,.42),0 0 0 1px rgba(255,255,255,.025) inset;
  overflow:hidden;
  will-change:transform,opacity;
}
.voice-stage.voice-focus-user .voice-tile.voice-focus-target{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  padding:26px;
}
.voice-stage.voice-focus-user .voice-tile.voice-focus-target>.voice-avatar-shell,
.voice-stage.voice-focus-user .voice-tile.voice-focus-target>.avatar{
  width:clamp(128px,18vh,210px)!important;
  height:clamp(128px,18vh,210px)!important;
}
.voice-stage.voice-focus-user .voice-tile.voice-focus-target .vname{
  font-size:16px;
  font-weight:800;
}
.voice-stage.voice-focus-user .voice-tile.voice-focus-target>.voice-video{
  order:-1;
  flex:1 1 auto;
  width:100%!important;
  height:100%!important;
  max-width:none!important;
  min-height:0;
  object-fit:contain;
  border-radius:12px;
  background:#050607;
}
.voice-stage.voice-focus-user .voice-tile.voice-focus-target:has(>.voice-video)>.voice-avatar-shell,
.voice-stage.voice-focus-user .voice-tile.voice-focus-target:has(>.voice-video)>.avatar{
  display:none;
}
.voice-stage.voice-focus-screen .voice-screen-panel.voice-focus-target{
  display:flex!important;
  flex-direction:column;
}
.voice-stage.voice-focus-screen .voice-screen-panel.voice-focus-target .voice-screen-head{
  flex:0 0 44px;
}
.voice-stage.voice-focus-screen .voice-screen-panel.voice-focus-target .voice-screen-canvas{
  flex:1 1 auto;
  height:auto;
}
.voice-stage.voice-focus-screen .voice-screen-panel.voice-focus-target .voice-screen-canvas video{
  width:100%;
  height:100%;
  object-fit:contain;
}
.voice-stage.voice-focus-active .voice-focus-target::after{
  content:"Tekrar tıkla · Küçült";
  position:absolute;
  right:12px;
  top:12px;
  z-index:4;
  padding:6px 9px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:999px;
  background:rgba(8,10,13,.74);
  color:rgba(255,255,255,.76);
  font-size:10px;
  font-weight:700;
  line-height:1;
  pointer-events:none;
  backdrop-filter:blur(8px);
}
.voice-stage.voice-focus-screen .voice-screen-panel.voice-focus-target::after{
  top:9px;
  right:10px;
}
@keyframes nexus-voice-focus-backdrop{
  from{opacity:0}
  to{opacity:.96}
}
@media(max-width:720px){
  .voice-stage.voice-focus-active .voice-focus-target{inset:8px!important;border-radius:14px}
  .voice-stage.voice-focus-user .voice-tile.voice-focus-target{padding:16px}
  .voice-stage.voice-focus-user .voice-tile.voice-focus-target>.voice-avatar-shell,
  .voice-stage.voice-focus-user .voice-tile.voice-focus-target>.avatar{width:116px!important;height:116px!important}
  .voice-stage.voice-focus-active .voice-focus-target::after{display:none}
}
@media(prefers-reduced-motion:reduce){
  .voice-stage.voice-focus-active::before{animation:none}
}
.voice-stage.voice-focus-user .voice-participant-grid{
  overflow:visible!important;
}

/* NEXUS voice - ekran paylaşımı canlı rozeti */
.voice-participant-streaming{
  display:none;
  flex:0 0 auto;
  align-items:center;
  justify-content:center;
  margin-left:1px;
  padding:1px 5px;
  min-height:15px;
  border-radius:4px;
  background:#ed4245;
  color:#fff;
  font-size:9px;
  line-height:13px;
  font-weight:800;
  letter-spacing:.01em;
  white-space:nowrap;
  box-shadow:0 0 0 1px rgba(237,66,69,.22),0 0 10px rgba(237,66,69,.16);
  opacity:0;
  transform:translateX(-3px) scale(.94);
  transition:opacity .16s ease,transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s ease;
}
.voice-participant.is-streaming .voice-participant-streaming{
  display:inline-flex;
  opacity:1;
  transform:translateX(0) scale(1);
  animation:nexus-streaming-badge-in .22s cubic-bezier(.2,.8,.2,1) both;
}
.voice-participant.is-streaming .voice-participant-name{
  color:var(--text-primary);
  font-weight:650;
}
@keyframes nexus-streaming-badge-in{
  from{opacity:0;transform:translateX(-4px) scale(.9)}
  to{opacity:1;transform:translateX(0) scale(1)}
}
@media (prefers-reduced-motion:reduce){
  .voice-participant-streaming{transition:none!important}
  .voice-participant.is-streaming .voice-participant-streaming{animation:none!important}
}

/* NEXUS Voice — ekran paylaşımı büyütme + dock ekran kapatma düzeltmesi */
.voice-screen-panel,
.voice-screen-panel .voice-screen-canvas,
.voice-screen-panel video{
  pointer-events:auto;
}
.voice-screen-panel{
  touch-action:manipulation;
  user-select:none;
  -webkit-user-select:none;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.voice-screen-panel:not(.voice-focus-target):hover{
  border-color:color-mix(in srgb,var(--text-primary) 26%,var(--border-subtle));
  box-shadow:var(--shadow-panel),0 0 0 1px rgba(255,255,255,.025) inset;
}
.voice-screen-panel:focus-visible,
.voice-tile:focus-visible{
  outline:2px solid color-mix(in srgb,var(--brand) 70%,transparent);
  outline-offset:2px;
}

.voice-dock-screen-stop-btn{
  position:relative;
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:9px;
  outline:none;
  background:color-mix(in srgb,var(--status-dnd) 10%,transparent);
  color:var(--status-dnd);
  cursor:pointer;
  transition:background .14s ease,color .14s ease,transform .14s ease,opacity .14s ease;
}
.voice-dock-screen-stop-btn[hidden]{display:none!important}
.voice-dock-screen-stop-btn:hover{
  background:color-mix(in srgb,var(--status-dnd) 20%,transparent);
  transform:translateY(-1px);
}
.voice-dock-screen-stop-btn:active{transform:scale(.94)}
.voice-dock-screen-stop-btn:disabled{opacity:.45;cursor:wait;transform:none}
.voice-dock-screen-stop-btn i{font-size:13px}
.voice-dock-screen-stop-slash{
  position:absolute;
  width:17px;
  height:2px;
  border-radius:999px;
  background:currentColor;
  transform:rotate(-43deg);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--bg-base) 35%,transparent);
}

/* --------------------------------------------------------------------------
   NEXUS Skeleton Loading
   Ağ isteği sürerken gerçek içerik boyutuna yakın iskeletler gösterir.
   -------------------------------------------------------------------------- */
.nexus-skeleton {
  display: block;
  position: relative;
  overflow: hidden;
  flex: 0 0 auto;
  background: rgba(255, 255, 255, .075);
  border-radius: 7px;
}

.nexus-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-105%);
  background: linear-gradient(
    90deg,
    transparent 0%,
    rgba(255, 255, 255, .035) 24%,
    rgba(255, 255, 255, .13) 50%,
    rgba(255, 255, 255, .035) 76%,
    transparent 100%
  );
  animation: nexus-skeleton-shimmer 1.35s cubic-bezier(.4, 0, .2, 1) infinite;
  will-change: transform;
}

@keyframes nexus-skeleton-shimmer {
  100% { transform: translateX(105%); }
}

.nexus-skeleton-list {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 12px 18px;
  pointer-events: none;
  user-select: none;
}

.nexus-skeleton-list-compact {
  padding: 4px 8px 14px;
  gap: 5px;
}

.nexus-skeleton-copy {
  min-width: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 7px;
  justify-content: center;
}

.nexus-skeleton-line {
  width: var(--sk-w, 68%);
  height: 11px;
  border-radius: 999px;
}

.nexus-skeleton-name {
  height: 13px;
  max-width: 180px;
}

.nexus-skeleton-sub {
  height: 9px;
  opacity: .72;
  max-width: 240px;
}

.nexus-skeleton-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
}

.nexus-skeleton-person {
  min-height: 58px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 9px 10px;
  border-radius: 9px;
}

.nexus-skeleton-person.compact {
  min-height: 48px;
  padding: 6px 5px;
  gap: 9px;
}

.nexus-skeleton-person.compact .nexus-skeleton-avatar {
  width: 32px;
  height: 32px;
}

.nexus-skeleton-action {
  width: 34px;
  height: 34px;
  border-radius: 9px;
}

.nexus-skeleton-toolbar-shell {
  pointer-events: none;
}

.nexus-skeleton-tab {
  width: 88px;
  height: 28px;
  border-radius: 8px;
}

.nexus-skeleton-tab.short {
  width: 68px;
}

.nexus-skeleton-button {
  width: 142px;
  height: 34px;
  border-radius: 9px;
}

.nexus-skeleton-pill {
  width: 76px;
  height: 23px;
  border-radius: 999px;
}

.nexus-skeleton-pill.small {
  width: 56px;
  height: 18px;
}

.nexus-skeleton-inbox {
  width: min(100%, 1120px);
  margin: 0 auto;
  pointer-events: none;
}

.nexus-skeleton-toolbar {
  min-height: 54px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 0 2px 10px;
}

.nexus-skeleton-notification {
  min-height: 64px;
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 12px;
  border: 1px solid rgba(255, 255, 255, .045);
  background: rgba(0, 0, 0, .08);
  border-radius: 10px;
}

.nexus-skeleton-channel-list {
  padding: 10px 8px 18px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  pointer-events: none;
}

.nexus-skeleton-channel-category {
  width: 42%;
  height: 9px;
  margin: 12px 8px 5px;
  border-radius: 999px;
}

.nexus-skeleton-channel-row {
  min-height: 34px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 5px 9px;
}

.nexus-skeleton-channel-row .nexus-skeleton-line {
  height: 10px;
  max-width: 145px;
}

.nexus-skeleton-channel-icon {
  width: 17px;
  height: 17px;
  border-radius: 5px;
}

.nexus-skeleton-messages {
  width: 100%;
  padding: 24px 18px 36px;
  display: flex;
  flex-direction: column;
  gap: 17px;
  pointer-events: none;
}

.nexus-skeleton-message {
  width: min(820px, 92%);
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.nexus-skeleton-message.grouped {
  margin-top: -8px;
}

.nexus-skeleton-message-gutter {
  width: 40px;
  flex: 0 0 40px;
}

.nexus-skeleton-message .message-avatar {
  width: 40px;
  height: 40px;
}

.nexus-skeleton-message .nexus-skeleton-copy {
  padding-top: 2px;
  gap: 8px;
}

.nexus-skeleton-member-panel {
  padding: 17px 12px;
  pointer-events: none;
}

.nexus-skeleton-member-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 0 4px 14px;
}

.nexus-skeleton-member-search {
  width: 100%;
  height: 34px;
  border-radius: 8px;
  margin-bottom: 18px;
}

.nexus-skeleton-member-category {
  width: 38%;
  height: 9px;
  border-radius: 999px;
  margin: 0 5px 9px;
}

.nexus-skeleton-member-row {
  min-height: 52px;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 5px;
}

.nexus-skeleton-member-row .nexus-skeleton-avatar {
  width: 34px;
  height: 34px;
}

@media (max-width: 760px) {
  .nexus-skeleton-messages {
    padding-inline: 12px;
  }

  .nexus-skeleton-message {
    width: 98%;
  }

  .nexus-skeleton-inbox {
    width: 100%;
  }

  .nexus-skeleton-toolbar .nexus-skeleton-button {
    width: 96px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .nexus-skeleton::after {
    animation: none;
    opacity: .35;
    transform: none;
  }
}
