/* ============================================================
   DARKNET HUB — style.css
   Cyberpunk Premium · 70% Discord · 20% Linear · 10% próprio
   Mobile-First → Desktop
   ============================================================ */

:root{
  --bg:        #030304;
  --surface:   #060607;
  --surface-2: #08080a;
  --card:      #0a0a0c;
  --card-hi:   #101013;
  --line:      #18181d;
  --line-soft: #111114;

  --primary:   #ff0033;
  --primary-2: #ff2e55;
  --primary-dk:#b3001f;
  --glow:      0 0 0 1px rgba(255,0,51,.35), 0 0 22px -4px rgba(255,0,51,.55);

  --text:      #ffffff;
  --text-2:    #b0b0b8;
  --text-3:    #71717a;

  --radius:    14px;
  --radius-sm: 10px;
  --ease:      cubic-bezier(.4,0,.2,1);
  --t:         180ms var(--ease);

  --side-w:    268px;
  --mem-w:     264px;
  --bar-h:     58px;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  font-family:'Inter',system-ui,sans-serif;
  background:var(--bg);
  color:var(--text);
  -webkit-font-smoothing:antialiased;
  overflow:hidden;
}
button{font-family:inherit;cursor:pointer;color:inherit;background:none;border:none}
input,textarea{font-family:inherit}
.hidden{display:none !important}
em{font-style:normal}

::-webkit-scrollbar{width:8px;height:8px}
::-webkit-scrollbar-thumb{background:#26262e;border-radius:8px}
::-webkit-scrollbar-thumb:hover{background:#33333d}
::-webkit-scrollbar-track{background:transparent}

/* ---------- glow util ---------- */
[data-glow]{box-shadow:var(--glow)}

/* ============================================================
   APP GRID (desktop)
   ============================================================ */
.app{
  display:grid;
  grid-template-columns:var(--side-w) 1fr var(--mem-w);
  grid-template-rows:1fr;
  height:100dvh;
  width:100%;
}

/* ---------------- Coluna 1: sidebar ---------------- */
.sidebar{
  grid-column:1;
  background:var(--surface);
  border-right:1px solid var(--line-soft);
  display:flex;flex-direction:column;min-height:0;
}
.sidebar-head{padding:0 0 10px}
.sidebar-head .search{margin:0 14px}
/* banner do servidor (substitui a foto) */
.brand-banner{
  position:relative;height:96px;margin-bottom:12px;
  background:#16161b center/cover no-repeat;display:flex;align-items:flex-end;
  border-bottom:1px solid var(--line-soft);overflow:hidden;
}
.brand-banner-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,7,9,.1),rgba(7,7,9,.85))}
.brand-name{position:relative;z-index:1;padding:12px 14px;font-size:19px;font-weight:800;color:#fff;letter-spacing:.4px;text-shadow:0 2px 12px rgba(0,0,0,.8)}
.brand-banner .brand-caret{position:absolute;top:10px;right:10px;z-index:1;color:#fff;background:rgba(0,0,0,.4);border-radius:7px;padding:4px;font-size:12px}
.brand{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.brand-logo{
  width:44px;height:44px;border-radius:13px;display:grid;place-items:center;
  background:linear-gradient(145deg,#1a1a20,#101015);color:var(--primary);
  box-shadow:0 0 0 1px rgba(255,0,51,.5), 0 0 18px -2px rgba(255,0,51,.7);
  flex:none;overflow:hidden;
}
.brand-logo img{width:100%;height:100%;object-fit:cover}
.brand-text strong{
  font-size:16px;font-weight:800;letter-spacing:.4px;color:#fff;
  text-shadow:0 0 14px rgba(255,0,51,.55);
}
.brand-text span{font-size:9.5px;color:var(--primary);letter-spacing:1.4px;font-weight:700;opacity:.85}
.auth-logo-img{width:34px;height:34px;border-radius:10px;object-fit:cover;box-shadow:0 0 14px -2px rgba(255,0,51,.7)}
.brand-text{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.brand-text strong{font-size:14px;letter-spacing:.5px}
.brand-text span{font-size:9.5px;color:var(--text-3);letter-spacing:1.2px;font-weight:600}
.brand-caret{margin-left:auto;color:var(--text-3);font-size:12px;padding:4px}

.search{
  display:flex;align-items:center;gap:8px;
  background:var(--bg);border:1px solid var(--line);
  border-radius:10px;padding:8px 10px;color:var(--text-3);
  transition:var(--t);
}
.search:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.12)}
.search input{flex:1;min-width:0;background:none;border:none;outline:none;color:var(--text);font-size:13px}
.search input::placeholder{color:var(--text-3)}
.search kbd{
  flex:none;font-family:'JetBrains Mono',monospace;font-size:9px;line-height:1;color:var(--text-3);
  border:1px solid var(--line);border-radius:5px;padding:3px 6px;white-space:nowrap;
  display:inline-flex;align-items:center;
}

.channel-list{flex:1;overflow-y:auto;padding:6px 8px 16px}
.cat-label{
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 8px 6px;font-size:10.5px;font-weight:700;
  letter-spacing:1.3px;color:var(--text-3);
}
.cat-label.accent{color:var(--primary)}
.cat-label .add{font-size:16px;color:var(--text-3);line-height:1}
.cat-label .add:hover{color:#fff}

.channel{
  display:flex;align-items:center;gap:9px;width:100%;
  padding:8px 10px;border-radius:9px;color:var(--text-2);
  font-size:14.5px;font-weight:500;transition:var(--t);text-align:left;
  position:relative;
}
.channel .ch-hash{color:var(--text-3);font-weight:600}
.channel .ch-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.channel .ch-desc{display:none}
.channel .lock-i{font-size:11px;color:var(--text-3)}
.channel:hover{background:var(--card);color:#fff}
.channel.active{background:linear-gradient(90deg,rgba(255,0,51,.16),rgba(255,0,51,.04));color:#fff}
.channel.active .ch-hash{color:var(--primary)}
.channel.active::before{
  content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;
  border-radius:3px;background:var(--primary);
}
.channel.is-restricted .ch-name{color:var(--text-3)}
.channel.accent .ch-name{color:var(--primary);font-weight:600}

/* ---------------- Coluna 2: content ---------------- */
.content{
  grid-column:2;position:relative;
  background:var(--bg);
  display:flex;flex-direction:column;min-width:0;min-height:0;
}
.content-head{
  display:flex;align-items:center;gap:12px;
  height:56px;padding:0 18px;border-bottom:1px solid var(--line-soft);
  background:linear-gradient(180deg,var(--surface),var(--bg));
  flex:none;
}
.head-title{display:flex;align-items:center;gap:10px;min-width:0}
.head-title .hash{color:var(--text-3);font-size:20px;font-weight:600}
.head-title h1{font-size:16px;font-weight:700}
.head-desc{
  color:var(--text-3);font-size:13px;padding-left:12px;
  border-left:1px solid var(--line);white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;
}
.head-actions{margin-left:auto;display:flex;gap:4px}
.icon-btn{
  width:36px;height:36px;border-radius:9px;display:grid;place-items:center;
  color:var(--text-2);transition:var(--t);
}
.icon-btn:hover{background:var(--card);color:#fff}

.feed-wrap{position:relative;flex:1;display:flex;flex-direction:column;min-height:0}
.feed{flex:1;overflow-y:auto;padding:18px 18px 8px;display:flex;flex-direction:column;gap:2px}

/* divisória "novas mensagens" */
.new-divider{
  display:flex;align-items:center;gap:10px;margin:14px 4px;
  color:var(--primary);font-size:10px;font-weight:700;letter-spacing:1.5px;
}
.new-divider::before,.new-divider::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,transparent,rgba(255,0,51,.5),transparent)}

/* ----- mensagem de chat ----- */
.msg{display:flex;gap:12px;padding:7px 8px;border-radius:10px;transition:background var(--t)}
.msg:hover{background:rgba(255,255,255,.02)}
.msg-avatar{flex:none}
.msg-avatar img{width:42px;height:42px;border-radius:12px;object-fit:cover;cursor:pointer}
.msg-body{min-width:0;flex:1}
.msg-head{display:flex;align-items:center;gap:8px;margin-bottom:2px}
.msg-name{font-weight:700;font-size:14.5px;cursor:pointer}
/* cores de cargo GENÉRICAS — valem em qualquer lugar (chat, card de perfil, membros, prévia)
   a cor custom (VIP/Staff) é aplicada inline e vence estas regras */
.role-admin{color:var(--primary);text-shadow:0 0 12px rgba(255,0,51,.5)}
.role-moderator{color:#0c0c0c;text-shadow:0 0 6px rgba(255,255,255,.9),0 0 2px rgba(255,255,255,.95)}
.role-user{color:#fff}
.role-vip{color:#fff}
.msg-time{font-size:11px;color:var(--text-3)}
.msg-time{font-size:11px;color:var(--text-3)}
.msg-presence{width:7px;height:7px;border-radius:50%;background:#23a55a;box-shadow:0 0 6px #23a55a}
.msg-text{font-size:14.5px;color:#dcdce2;line-height:1.5;word-wrap:break-word;white-space:pre-wrap}
.msg-reactions{display:flex;gap:6px;margin-top:6px;flex-wrap:wrap;align-items:center}
.reaction{
  display:inline-flex;align-items:center;gap:5px;font-size:12px;font-weight:600;
  background:var(--card);border:1px solid var(--line);border-radius:20px;
  padding:3px 10px;color:var(--text-2);cursor:pointer;transition:var(--t);
}
.reaction[data-react]:hover{border-color:var(--primary);color:#fff}
.reaction-img{width:18px;height:18px;border-radius:4px;object-fit:cover}
.reaction.add-react{padding:4px 8px;color:var(--text-3);opacity:0}
.msg:hover .add-react,.post:hover .add-react,.forum-card:hover .add-react,.announce-msg:hover .add-react,.msg-reactions:hover .add-react{opacity:1}
.reaction.add-react:hover{color:var(--primary);border-color:var(--primary)}
/* mensagem mencionando @everyone (estilo Discord, em vermelho) */
.msg.mentions-everyone{background:rgba(255,0,51,.07);border-left:3px solid var(--primary);border-radius:0 10px 10px 0;padding-left:10px}
.attach{
  display:flex;align-items:center;gap:12px;margin-top:8px;max-width:380px;
  background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px 14px;
}
.attach .file-ico{width:34px;height:34px;border-radius:8px;background:var(--surface-2);display:grid;place-items:center;color:var(--primary)}
.attach .file-meta{flex:1;min-width:0}
.attach .file-meta b{font-size:13px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.attach .file-meta small{font-size:11px;color:var(--text-3)}
.attach .dl{color:var(--text-2)}
a.attach{text-decoration:none;color:inherit;transition:var(--t)}
a.attach:hover{border-color:var(--primary);background:var(--card-hi)}
a.attach:hover .dl{color:var(--primary)}
.msg-link{color:#5aa3ff;text-decoration:none;word-break:break-all}
.msg-link:hover{text-decoration:underline}
/* bloqueio total por ban de IP */
#banBlock{position:fixed;inset:0;z-index:9999;background:rgba(6,6,8,.97);backdrop-filter:blur(6px);display:grid;place-items:center;padding:24px}
#banBlock .ban-card{max-width:420px;text-align:center;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:38px 30px;box-shadow:0 40px 90px -20px #000}
#banBlock .ban-card svg{color:var(--primary)}
#banBlock h2{font-size:20px;margin:14px 0 8px}
#banBlock p{color:var(--text-2);font-size:14px;line-height:1.6}
.msg-del{margin-left:auto;color:var(--text-3);font-size:12px;opacity:0;transition:var(--t)}
.msg:hover .msg-del{opacity:1}
.msg-del:hover{color:var(--primary)}

/* ----- POST card (canais de aprovação) ----- */
.post{
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:16px;margin-bottom:12px;
}
.post.pending{border-color:rgba(255,180,0,.35)}
.post-head{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.post-head img{width:36px;height:36px;border-radius:10px}
.post-status{margin-left:auto;font-size:10px;font-weight:700;letter-spacing:1px;padding:4px 10px;border-radius:20px}
.post-status.pending{background:rgba(255,180,0,.12);color:#ffb400;border:1px solid rgba(255,180,0,.35)}
.post-status.approved{background:rgba(35,165,90,.12);color:#23a55a;border:1px solid rgba(35,165,90,.35)}
.post-text{font-size:14.5px;color:#dcdce2;line-height:1.55}
.post-media{margin-top:10px;border-radius:10px;overflow:hidden;border:1px solid var(--line)}
.post-media img{width:100%;display:block}
.post-link{display:inline-block;margin-top:8px;color:var(--primary);font-size:13px;word-break:break-all}
.post-review{display:flex;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}

/* ----- composer ----- */
.composer{
  display:flex;align-items:center;gap:10px;margin:6px 18px 18px;
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
  padding:8px 10px;transition:var(--t);
}
.composer:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.1)}
.composer-add{width:34px;height:34px;border-radius:50%;background:var(--surface-2);color:var(--text-2);font-size:20px;display:grid;place-items:center}
.composer-add:hover{background:var(--primary);color:#fff}
.composer input{flex:1;background:none;border:none;outline:none;color:#fff;font-size:14.5px}
.composer input::placeholder{color:var(--text-3)}
.composer-emoji{color:var(--text-3);font-size:18px;padding:0 4px}
.composer-send{width:40px;height:40px;border-radius:11px;background:var(--primary);color:#fff;display:grid;place-items:center}
.composer-send:hover{background:var(--primary-2)}

/* composer de post = mesmo padrão (pill) do chat geral */
.post-composer{display:flex;align-items:center;gap:10px;margin:6px 18px 18px;
  background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:8px 10px;transition:var(--t)}
.post-composer:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.1)}
.post-composer input[type=text]{flex:1;background:none;border:none;outline:none;color:#fff;font-size:14.5px}
.post-composer input[type=text]::placeholder{color:var(--text-3)}
.post-composer .composer-add.attached{background:var(--primary);color:#fff}
.file-pick{position:relative;overflow:hidden;background:var(--surface-2);border:1px solid var(--line);border-radius:9px;padding:9px 14px;color:var(--text-2);font-size:13px}
.file-pick input{position:absolute;inset:0;opacity:0;cursor:pointer}
/* composer de post: mídia só ícone + botão de enviar (avião) à direita */
.file-pick.icon-only{padding:0;width:40px;height:40px;display:grid;place-items:center;flex:none}
.file-pick.icon-only:hover{border-color:var(--primary);color:#fff}
.post-row .post-send{margin-left:auto;flex:none;border:0;cursor:pointer}

/* ----- LOCK overlay (blur) ----- */
.feed-wrap.locked .feed,
.feed-wrap.locked .composer,
.feed-wrap.locked .post-composer{
  filter:blur(12px);
  pointer-events:none;user-select:none;
}
.lock-overlay{
  position:absolute;inset:0;z-index:20;
  display:grid;place-items:center;padding:24px;
  background:rgba(7,7,9,.55);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  animation:fade .25s var(--ease);
}
.lock-card{
  max-width:380px;text-align:center;
  background:linear-gradient(160deg,var(--card-hi),var(--card));
  border:1px solid var(--line);border-radius:20px;padding:34px 28px;
  box-shadow:0 30px 80px -20px #000,var(--glow);
  animation:pop .3s var(--ease);
}
.lock-icon{
  width:64px;height:64px;border-radius:18px;margin:0 auto 16px;
  display:grid;place-items:center;color:var(--primary);
  background:radial-gradient(circle at 50% 35%,rgba(255,0,51,.18),transparent 70%);
  border:1px solid rgba(255,0,51,.3);
}
.lock-overlay.vip .lock-icon{color:#f4c869;border-color:rgba(244,200,105,.35);background:radial-gradient(circle at 50% 35%,rgba(244,200,105,.18),transparent 70%)}
.lock-card h2{font-size:20px;margin-bottom:10px}
.lock-card p{color:var(--text-2);font-size:14px;line-height:1.6;margin-bottom:22px}
.lock-actions{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}

/* ---------------- Coluna 3: membros ---------------- */
.members{
  grid-column:3;background:var(--surface);
  border-left:1px solid var(--line-soft);
  display:flex;flex-direction:column;min-height:0;
}
.members-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 16px 10px;font-size:11px;font-weight:700;
  letter-spacing:1px;color:var(--text-3);
}
.members-list{flex:1;overflow-y:auto;padding:0 10px 18px}
.mem-group{padding:14px 6px 6px;font-size:10.5px;font-weight:700;letter-spacing:1px;color:var(--text-3)}
.member{
  display:flex;align-items:center;gap:11px;padding:7px 8px;border-radius:9px;
  transition:var(--t);width:100%;text-align:left;
}
.member:hover{background:var(--card)}
.mem-avatar{position:relative;flex:none}
.mem-avatar img{width:34px;height:34px;border-radius:50%;object-fit:cover}
.dot{
  position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:50%;
  border:2.5px solid var(--surface);background:var(--text-3);
}
.dot.online{background:#23a55a}
.dot.away{background:#f0b232}
.mem-meta{min-width:0;line-height:1.2}
.mem-name{font-size:14px;font-weight:700;display:flex;align-items:center;gap:6px}
.mem-name .crown{color:var(--primary)}
.mem-name.role-admin{color:var(--primary);text-shadow:0 0 12px rgba(255,0,51,.45)}
.mem-name.role-moderator{color:#0c0c0c;text-shadow:0 0 6px rgba(255,255,255,.85)}
.mem-name.role-user{color:#e7e7ea}
.mem-sub{font-size:11px;color:var(--text-3)}
.mem-more{display:block;text-align:center;color:var(--text-3);font-size:12px;padding:10px}

/* ---------------- userbar ---------------- */
.userbar{
  position:fixed;left:0;bottom:0;width:var(--side-w);
  height:var(--bar-h);background:var(--surface-2);
  border-top:1px solid var(--line-soft);border-right:1px solid var(--line-soft);
  display:flex;align-items:center;gap:8px;padding:0 10px;z-index:5;
}
.sidebar{padding-bottom:var(--bar-h)}
.userbar-id{display:flex;align-items:center;gap:9px;flex:1;padding:6px;border-radius:9px;min-width:0}
.userbar-id:hover{background:var(--card)}
.avatar-wrap{position:relative;flex:none}
.avatar-wrap img{width:34px;height:34px;border-radius:50%;object-fit:cover}
.userbar-meta{min-width:0;line-height:1.2;text-align:left}
.userbar-meta strong{font-size:13.5px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.userbar-meta small{font-size:11px;color:var(--text-3)}

/* ============================================================
   BOTÕES
   ============================================================ */
.btn-primary{
  background:var(--primary);color:#fff;font-weight:600;font-size:14px;
  padding:11px 20px;border-radius:11px;transition:var(--t);
}
.btn-primary:hover{background:var(--primary-2)}
.btn-primary.full{width:100%}
.btn-ghost{
  background:var(--card-hi);color:#fff;font-weight:600;font-size:14px;
  padding:11px 20px;border-radius:11px;border:1px solid var(--line);transition:var(--t);
}
.btn-ghost:hover{background:#22222a;border-color:#2d2d36}
.btn-ghost.danger{color:var(--primary);border-color:rgba(255,0,51,.3)}
.btn-ghost.danger:hover{background:rgba(255,0,51,.1)}
.btn-mini{font-size:12px;padding:7px 14px;border-radius:9px;font-weight:600}
.btn-approve{background:rgba(35,165,90,.15);color:#23a55a;border:1px solid rgba(35,165,90,.4)}
.btn-reject{background:rgba(255,0,51,.12);color:var(--primary);border:1px solid rgba(255,0,51,.35)}

/* ============================================================
   MODAIS
   ============================================================ */
.modal-backdrop{
  position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:20px;
  background:rgba(3,3,5,.7);backdrop-filter:blur(6px);animation:fade .2s var(--ease);
}
.card-close{position:absolute;top:14px;right:14px;width:30px;height:30px;border-radius:8px;color:var(--text-2);display:grid;place-items:center;z-index:2}
.card-close:hover{background:rgba(255,255,255,.08);color:#fff}

/* ----- profile card ----- */
.profile-card{
  width:380px;max-width:100%;background:var(--card);border:1px solid var(--line);
  border-radius:18px;overflow:hidden;position:relative;
  box-shadow:0 40px 90px -20px #000,var(--glow);animation:pop .25s var(--ease);
}
.profile-banner{
  height:118px;background:#1a1a20 center/cover;position:relative;
}
.profile-banner::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(22,22,27,.6))}
.profile-body{padding:0 22px 22px;position:relative}
.profile-avatar{position:relative;width:84px;height:84px;margin-top:-42px;margin-bottom:10px}
.profile-avatar img{width:100%;height:100%;border-radius:22px;object-fit:cover;border:4px solid var(--card);background:var(--card)}
.profile-avatar .dot{width:18px;height:18px;border-width:3px;right:2px;bottom:2px}
.profile-top{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.profile-top h2{font-size:21px}
.profile-handle{font-size:13px;color:var(--text-3);width:100%}
.badge{
  font-size:10px;font-weight:700;letter-spacing:.8px;padding:4px 10px;border-radius:7px;
  background:rgba(255,0,51,.14);color:var(--primary);border:1px solid rgba(255,0,51,.35);
  display:inline-flex;align-items:center;gap:5px;
}
.profile-bio{font-size:13.5px;color:var(--text-2);line-height:1.55;margin:12px 0}
.profile-section{margin-top:14px}
.profile-section h4{font-size:10.5px;letter-spacing:1px;color:var(--text-3);margin-bottom:7px}
.role-chip{display:inline-flex;align-items:center;gap:7px;background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:6px 11px;font-size:13px;font-weight:600}
.role-chip i{width:9px;height:9px;border-radius:50%;background:var(--primary)}
.pflag{display:inline-flex;align-items:center;margin-left:8px;vertical-align:middle}
.pflag .flag{height:16px;border-radius:3px}
#pRoleFlag .flag{height:20px}
/* ---------- Badges dinâmicas (insígnias de perfil) ---------- */
.pbadges{display:inline-flex;align-items:center;gap:6px;margin-left:8px;vertical-align:middle}
.pbadge{height:20px;width:auto;vertical-align:middle;filter:drop-shadow(0 0 4px rgba(255,0,51,.35))}
.badge-form{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:14px}
.badge-form-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:4px}
.badge-form-row input[type=text]{flex:1;min-width:170px;background:#000;border:1px solid var(--line);border-radius:10px;padding:10px 12px;color:#fff;font-size:13.5px;outline:none;transition:var(--t)}
.badge-form-row input[type=text]:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.12)}
.badge-row-adm.editing{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.12),0 0 14px rgba(255,0,51,.2)}
.badge-adm-img{width:34px;height:34px;object-fit:contain;flex:none;background:#000;border:1px solid var(--line);border-radius:8px;padding:3px}
.badge-user-row{flex-direction:column;align-items:stretch;gap:9px}
.bdg-count{color:var(--text-3)}
.badge-checks{display:flex;flex-wrap:wrap;gap:8px}
.badge-check{display:inline-flex;align-items:center;gap:7px;background:#000;border:1px solid var(--line);border-radius:9px;padding:7px 11px;cursor:pointer;font-size:12.5px;color:var(--text-2);transition:var(--t);user-select:none}
.badge-check img{height:16px;width:auto}
.badge-check input{display:none}
.badge-check:hover{border-color:rgba(255,0,51,.55);color:#fff}
.badge-check.on{border-color:var(--primary);color:#fff;box-shadow:0 0 0 3px rgba(255,0,51,.12),0 0 12px rgba(255,0,51,.25)}
.badge-check.icon-only{padding:8px;gap:0}
.badge-check.icon-only img{height:22px}

/* ----- Módulo 2: broadcast de sistema (alerta global) ----- */
.sysbc{position:fixed;top:12px;left:50%;transform:translateX(-50%);z-index:55;
  display:flex;align-items:center;gap:12px;width:min(680px,94vw);
  background:#000;border:1px solid var(--line);border-left-width:4px;border-left-color:#3b82f6;
  border-radius:12px;padding:11px 14px;box-shadow:0 22px 55px -14px #000,0 0 0 1px rgba(255,255,255,.03);
  animation:bcDrop .35s var(--ease)}
@keyframes bcDrop{from{opacity:0;transform:translate(-50%,-14px)}to{opacity:1;transform:translate(-50%,0)}}
.sysbc.hidden{display:none}
.sysbc-ic{flex:none;display:inline-flex;color:#3b82f6}
.sysbc-main{flex:1;min-width:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 9px}
.sysbc-tag{font-size:10px;font-weight:800;letter-spacing:1px;color:#3b82f6}
.sysbc-title{font-size:13.5px;font-weight:700;color:#fff}
.sysbc-body{font-size:12.5px;color:var(--text-2);width:100%}
.sysbc-x{flex:none;width:28px;height:28px;border-radius:8px;color:var(--text-3);display:grid;place-items:center;transition:var(--t)}
.sysbc-x:hover{background:rgba(255,255,255,.08);color:#fff}
.sysbc[data-level="warning"]{border-left-color:#f5c518}
.sysbc[data-level="warning"] .sysbc-ic,.sysbc[data-level="warning"] .sysbc-tag{color:#f5c518}
.sysbc[data-level="critical"]{border-left-color:var(--primary);box-shadow:0 22px 55px -14px #000,0 0 22px rgba(255,0,51,.35);animation:bcDrop .35s var(--ease),bcPulse 1.8s ease-in-out .35s infinite}
.sysbc[data-level="critical"] .sysbc-ic,.sysbc[data-level="critical"] .sysbc-tag{color:var(--primary)}
@keyframes bcPulse{0%,100%{box-shadow:0 22px 55px -14px #000,0 0 18px rgba(255,0,51,.25)}50%{box-shadow:0 22px 55px -14px #000,0 0 30px rgba(255,0,51,.55)}}
/* composer admin */
.bc-form{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:14px;margin-top:8px}
.bc-hint{font-size:12px;color:var(--text-3);margin:4px 0 10px}
.bc-form-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px}
.bc-form input[type=text]{flex:1;min-width:180px;background:#000;border:1px solid var(--line);border-radius:10px;padding:10px 12px;color:#fff;font-size:13.5px;outline:none;transition:var(--t)}
.bc-form input[type=text]:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.12)}
.bc-form select{background:#000;border:1px solid var(--line);border-radius:10px;padding:10px 12px;color:#fff;font-size:13px}
.bc-form textarea{width:100%;background:#000;border:1px solid var(--line);border-radius:10px;padding:10px 12px;color:#fff;font-size:13.5px;outline:none;resize:vertical;transition:var(--t)}
.bc-form textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.12)}
.bc-row .bc-dot{width:9px;height:9px;border-radius:50%;flex:none;background:#3b82f6}
.bc-row[data-lvl="warning"] .bc-dot{background:#f5c518}
.bc-row[data-lvl="critical"] .bc-dot{background:var(--primary);box-shadow:0 0 8px rgba(255,0,51,.7)}
.profile-since{font-size:13px;color:var(--text-2)}
.profile-cta{display:flex;flex-direction:column;gap:10px;margin-top:18px}
.profile-cta .btn-primary,.profile-cta .btn-ghost{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.card-gear{position:absolute;top:14px;right:50px;width:30px;height:30px;border-radius:8px;color:var(--text-2);display:grid;place-items:center;z-index:2;background:rgba(0,0,0,.3)}
.card-gear:hover{background:rgba(255,255,255,.12);color:#fff}
.dm-box{display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--line);border-radius:11px;padding:6px 6px 6px 14px;transition:var(--t)}
.dm-box:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.1)}
.dm-box input{flex:1;min-width:0;background:none;border:none;outline:none;color:#fff;font-size:14px}
.dm-box button{width:36px;height:36px;border-radius:9px;background:var(--primary);color:#fff;display:grid;place-items:center;flex:none}
.dm-box button:hover{background:var(--primary-2)}
.req-sent{font-size:12px;color:var(--text-3);font-weight:600;padding:6px 10px}

/* ----- auth / login (estilo Discord, tela cheia, fundo preto) ----- */
#authModal{background:#000;backdrop-filter:none}
.auth-card{
  width:440px;max-width:100%;background:#000000;border:1px solid #141416;
  border-radius:16px;padding:32px;position:relative;
  box-shadow:0 50px 120px -25px #000,0 0 0 1px rgba(255,0,51,.12);animation:pop .25s var(--ease);
}
/* logo da marca no login (fundo preto do PNG mescla com o card preto) */
.auth-brand-logo{display:block;width:100%;max-width:260px;height:auto;margin:0 auto 2px;
  object-fit:contain;box-shadow:none;border:0;outline:none;-webkit-user-drag:none;user-select:none}
.auth-logo{display:flex;align-items:center;gap:10px;justify-content:center;color:var(--primary);margin-bottom:14px}
.auth-logo strong{color:#fff;font-size:18px;letter-spacing:.5px}
.auth-title{font-size:22px;font-weight:800;text-align:center;margin-bottom:6px}
.auth-sub{font-size:14px;color:var(--text-2);text-align:center;margin-bottom:22px}
.field .req{color:var(--primary);font-style:normal}
.auth-forgot{display:block;color:var(--primary);font-size:13px;font-weight:600;margin:-4px 0 16px}
/* dropdown de país (preto/moderno) */
.country-select{position:relative}
.cs-trigger{width:100%;display:flex;align-items:center;justify-content:space-between;gap:8px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:11px 13px;color:#fff;font-size:14px;transition:var(--t)}
.cs-trigger:hover{border-color:#2d2d36}
.country-select:focus-within .cs-trigger{border-color:var(--primary)}
.cs-current{display:flex;align-items:center;gap:8px;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text-2)}
.cs-current .flag{flex:none}
.cs-caret{color:var(--text-3);display:inline-flex}
.cs-menu{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:30;background:var(--card-hi);border:1px solid var(--line);border-radius:12px;padding:8px;box-shadow:0 24px 60px -18px #000,var(--glow);animation:pop .15s var(--ease)}
.cs-search{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:9px 11px;color:#fff;font-size:13px;outline:none;margin-bottom:6px}
.cs-search:focus{border-color:var(--primary)}
.cs-list{max-height:230px;overflow-y:auto;display:flex;flex-direction:column;gap:2px}
.cs-item{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:8px 10px;border-radius:8px;color:var(--text);font-size:13.5px;transition:var(--t)}
.cs-item:hover{background:var(--card)}
.cs-item .flag{width:22px;height:auto;border-radius:3px;flex:none}
.cs-empty{padding:14px;text-align:center;color:var(--text-3);font-size:13px}
.auth-forgot:hover{text-decoration:underline}
.auth-tabs{display:flex;background:var(--bg);border:1px solid var(--line);border-radius:11px;padding:4px;margin-bottom:20px}
.auth-tab{flex:1;padding:9px;border-radius:8px;font-size:14px;font-weight:600;color:var(--text-2);transition:var(--t)}
.auth-tab.active{background:var(--primary);color:#fff}
.field{display:block;margin-bottom:14px}
.field span{display:block;font-size:11px;font-weight:700;letter-spacing:.5px;color:var(--text-3);margin-bottom:6px}
.field input,.field textarea{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:11px 13px;color:#fff;font-size:14px;outline:none;transition:var(--t)}
.field input:focus,.field textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.1)}
.field input[type=file]{margin-top:8px;font-size:12px;color:var(--text-3);padding:8px}
/* seletor de avatar no cadastro */
.avatar-pick{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.av-opt{aspect-ratio:1;border-radius:10px;overflow:hidden;border:2px solid transparent;padding:0;background:var(--bg);transition:var(--t);cursor:pointer}
.av-opt img{width:100%;height:100%;object-fit:cover;display:block}
.av-opt:hover{border-color:var(--line)}
.av-opt.sel{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.18)}
@media (max-width:420px){.avatar-pick{grid-template-columns:repeat(3,1fr)}}
/* player de música de fundo (Configurações) */
.music-player{display:flex;align-items:center;gap:12px;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.mp-btn{width:36px;height:36px;flex:none;border-radius:9px;background:var(--surface-2);border:1px solid var(--line);color:var(--text-2);display:grid;place-items:center;transition:var(--t);cursor:pointer}
.mp-btn:hover{color:#fff;border-color:var(--primary)}
.mp-info{flex:1;min-width:0;display:flex;align-items:center;gap:9px}
.mp-name{font-size:13px;color:var(--text-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mp-eq{display:inline-flex;align-items:flex-end;gap:2px;height:14px}
.mp-eq i{width:3px;background:var(--primary);border-radius:2px;animation:eq .9s ease-in-out infinite}
.mp-eq i:nth-child(1){height:6px;animation-delay:0s}
.mp-eq i:nth-child(2){height:12px;animation-delay:.15s}
.mp-eq i:nth-child(3){height:8px;animation-delay:.3s}
.mp-eq.off i{animation-play-state:paused;opacity:.3}
@keyframes eq{0%,100%{transform:scaleY(.4)}50%{transform:scaleY(1)}}
.auth-error{color:var(--primary);font-size:13px;margin-bottom:12px}
.auth-foot{text-align:center;font-size:13px;color:var(--text-3);margin-top:16px}
.auth-foot button{color:var(--primary);font-weight:600}

/* ----- settings / VIP ----- */
.settings-card{
  width:480px;max-width:100%;background:var(--card);border:1px solid var(--line);
  border-radius:18px;padding:28px;position:relative;
  box-shadow:0 40px 90px -20px #000;animation:pop .25s var(--ease);
  max-height:90dvh;overflow-y:auto;
}
.settings-card h2{font-size:19px;margin-bottom:18px}
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.vip-box{margin-top:8px;background:linear-gradient(160deg,rgba(255,0,51,.08),transparent);border:1px solid rgba(255,0,51,.3);border-radius:14px;padding:16px}
.vip-box h4{font-size:13px;color:var(--primary);margin-bottom:4px}
.vip-box p{font-size:12.5px;color:var(--text-2);margin-bottom:12px}
.vip-pick{display:flex;align-items:center;gap:14px}
.vip-pick input[type=color]{width:54px;height:44px;border:none;border-radius:10px;background:none;cursor:pointer}
.vip-preview{font-size:17px;font-weight:700}
.settings-cta{display:flex;gap:10px;margin-top:20px}
.settings-cta .btn-primary{flex:1}

/* ----- toast ----- */
.toast{
  position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);
  background:var(--card-hi);border:1px solid var(--line);border-radius:12px;
  padding:13px 20px;font-size:14px;z-index:90;box-shadow:0 20px 50px -15px #000,var(--glow);
  opacity:0;transition:var(--t);
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* ============================================================
   ANIMAÇÕES
   ============================================================ */
@keyframes fade{from{opacity:0}to{opacity:1}}
@keyframes pop{from{opacity:0;transform:scale(.95) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}
@keyframes slideUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
.msg,.post{animation:slideUp .2s var(--ease)}

/* ============================================================
   MOBILE / RESPONSIVO
   ============================================================ */
.mobile-only{display:none}
.bottom-nav{display:none}

@media (max-width:1100px){
  :root{--mem-w:0px}
  .app{grid-template-columns:var(--side-w) 1fr}
  .members{
    position:fixed;right:0;top:0;bottom:0;width:300px;z-index:50;
    transform:translateX(100%);transition:transform var(--t);
    box-shadow:-20px 0 60px -20px #000;
  }
  .members.open{transform:translateX(0)}
}

@media (max-width:760px){
  :root{--bar-h:62px}
  .mobile-only{display:inherit}

  .app{grid-template-columns:1fr;grid-template-rows:1fr}
  .content{grid-column:1}

  /* sidebar vira drawer */
  .sidebar{
    position:fixed;left:0;top:0;bottom:0;width:84%;max-width:320px;z-index:50;
    transform:translateX(-100%);transition:transform var(--t);
    box-shadow:20px 0 60px -20px #000;padding-bottom:0;
  }
  body[data-view="channels"] .sidebar{transform:translateX(0)}

  .userbar{left:0;width:84%;max-width:320px;transform:translateX(-100%);transition:transform var(--t)}
  body[data-view="channels"] .userbar{transform:translateX(0)}

  /* members vira bottom sheet */
  .members{
    width:100%;top:auto;height:78dvh;border-radius:22px 22px 0 0;
    transform:translateY(100%);border-left:none;border-top:1px solid var(--line);
    box-shadow:0 -20px 60px -20px #000;
  }
  .members.open{transform:translateY(0)}

  .content-head{padding:0 14px}
  .head-desc{display:none}
  .feed{padding:14px 12px 8px}
  .composer,.post-composer{margin:6px 12px}
  .slow-bar,.rec-bar{margin:0 12px 8px}
  .feed-wrap{padding-bottom:var(--bar-h)}

  /* bottom nav */
  .bottom-nav{
    display:flex;position:fixed;left:0;right:0;bottom:0;height:var(--bar-h);z-index:55;
    background:var(--surface-2);border-top:1px solid var(--line-soft);
    padding-bottom:env(safe-area-inset-bottom);
  }
  .bn{
    flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    font-size:10.5px;font-weight:600;color:var(--text-3);transition:var(--t);position:relative;
  }
  .bn.active{color:var(--primary)}
  .bn-ico{font-size:19px;position:relative}
  .bn-ico[data-badge]::after{
    content:attr(data-badge);position:absolute;top:-4px;right:-9px;
    background:var(--primary);color:#fff;font-size:9px;font-weight:700;
    min-width:15px;height:15px;border-radius:8px;display:grid;place-items:center;padding:0 3px;
  }

  /* drawer scrim */
  body[data-view="channels"] .content::before,
  .members.open ~ .content::before{content:""}

  .profile-card,.auth-card,.settings-card,.admin-card,.notif-card,.forum-compose{width:100%;border-radius:16px}
  .settings-cols{grid-template-columns:1fr}
  .emoji-pop{left:12px;right:12px;width:auto;bottom:74px}
  .store-grid{grid-template-columns:1fr}
  .vault{grid-template-columns:1fr}
  .vault-side{position:static;order:-1}
  .vault-grid{grid-template-columns:1fr 1fr}
  .vault-cats{grid-template-columns:repeat(4,1fr)}
  .hero-title{font-size:28px}.vault-hero{height:200px}
  .pkg-grid{grid-template-columns:1fr 1fr}
  .voice-msg{min-width:0;max-width:100%;width:100%}
  .status-menu{left:12px;right:12px;width:auto;bottom:calc(var(--bar-h) + 8px)}
  .channel-form,.create-acc-row{grid-template-columns:1fr}
  .admin-tabs{flex-wrap:wrap}
  .head-title h1{font-size:15px}
}

/* scrim para drawers no mobile */
.scrim{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:45;animation:fade .2s var(--ease)}

/* ============================================================
   i18n / bandeiras · welcome · login brand · premium · pin
   ============================================================ */
.flag{vertical-align:middle;border-radius:2px;width:auto;display:inline-block;box-shadow:0 0 0 1px rgba(0,0,0,.4)}
.lang-toggle,.auth-langs{display:inline-flex;gap:4px}
.auth-langs{position:absolute;top:14px;left:16px}
.lang-flag{width:22px;height:16px;border-radius:3px;overflow:hidden;opacity:.45;transition:var(--t);border:1px solid transparent}
.lang-flag img{width:100%;height:100%;object-fit:cover;display:block}
.lang-flag:hover{opacity:.8}
.lang-flag.active{opacity:1;border-color:var(--primary)}

/* login: marca + tagline */
.auth-brand{text-align:center;margin-bottom:20px}
.auth-brand strong{display:block;font-size:30px;font-weight:800;letter-spacing:.5px;color:#fff}
.auth-tagline{display:block;font-size:13px;color:var(--text-2);margin-top:6px;line-height:1.5}

/* welcome popup */
.welcome-card{width:460px;max-width:100%;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:30px;text-align:center;position:relative;box-shadow:0 50px 120px -25px #000,0 0 0 1px rgba(255,0,51,.12);animation:pop .25s var(--ease)}
.welcome-ic{width:60px;height:60px;border-radius:16px;margin:0 auto 14px;display:grid;place-items:center;color:var(--primary);background:radial-gradient(circle at 50% 35%,rgba(255,0,51,.18),transparent 70%);border:1px solid rgba(255,0,51,.3)}
.welcome-ic svg{width:30px;height:30px}
.welcome-card h2{font-size:21px;margin-bottom:10px}
.welcome-sub{font-size:14px;color:var(--text);line-height:1.6;margin-bottom:12px}
.welcome-desc{font-size:13px;color:var(--text-2);line-height:1.6;margin-bottom:18px;padding:12px;background:var(--bg);border:1px solid var(--line);border-radius:12px}
.welcome-dont{display:flex;align-items:center;gap:8px;justify-content:center;font-size:12.5px;color:var(--text-3);margin-bottom:16px}

/* selo premium na loja */
.product.premium{border-color:#e8b34a}
.product-tag.premium{background:linear-gradient(135deg,#f4c869,#c9952f);color:#1a1205;display:inline-flex;align-items:center;gap:4px}

/* mensagem fixada */
.msg.pinned{background:rgba(255,180,0,.05);border-left:3px solid #ffb400;border-radius:0 10px 10px 0;padding-left:10px}
.pin-tag{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;letter-spacing:.5px;color:#ffb400;margin-bottom:3px}
.msg-pin{color:var(--text-3);padding:2px;border-radius:6px}
.msg-pin:hover{color:#ffb400}

/* ============================================================
   ÍCONES (data-icon containers)
   ============================================================ */
[data-icon]{display:inline-flex;align-items:center;justify-content:center}
[data-icon] svg{display:block}
.search [data-icon]{color:var(--text-3)}
.brand-logo{color:var(--primary)}
.auth-logo span[data-icon]{color:var(--primary)}
.lock-icon[data-icon] svg{width:30px;height:30px}
.icon-btn.sm{width:30px;height:30px}
.icon-btn.sm.danger{color:var(--primary)}
.icon-btn.danger:hover{background:rgba(255,0,51,.12)}
#adminBtn{color:var(--primary)}
.empty{color:var(--text-3);text-align:center;margin-top:40px}

/* ============================================================
   MODO LENTO
   ============================================================ */
.slow-bar{
  display:flex;align-items:center;gap:8px;justify-content:center;
  margin:0 18px 8px;padding:8px;border-radius:10px;font-size:13px;
  background:rgba(255,180,0,.1);border:1px solid rgba(255,180,0,.3);color:#ffb400;
}
.slow-bar b{color:#fff}
.composer-send:disabled{opacity:.4;cursor:not-allowed}

/* ============================================================
   MÍDIA NO CHAT
   ============================================================ */
.msg-media-wrap{margin-top:8px;max-width:340px}
.msg-media{max-width:340px;max-height:300px;border-radius:12px;border:1px solid var(--line);display:block}
video.msg-media{width:340px}

/* ============================================================
   EMOJI / FIGURINHAS / GIFS
   ============================================================ */
.emoji-pop{
  position:absolute;bottom:78px;right:18px;width:320px;z-index:30;
  background:var(--card-hi);border:1px solid var(--line);border-radius:14px;
  box-shadow:0 24px 60px -18px #000,var(--glow);overflow:hidden;animation:pop .2s var(--ease);
}
.emoji-tabs{display:flex;border-bottom:1px solid var(--line)}
.emoji-tab{flex:1;padding:10px;font-size:12.5px;font-weight:600;color:var(--text-2);transition:var(--t);display:flex;align-items:center;justify-content:center;gap:5px}
.emoji-tab.active{color:#fff;box-shadow:inset 0 -2px 0 var(--primary)}
.vip-lock{display:inline-flex;color:var(--text-3)}
.vip-lock svg{width:11px;height:11px}
.emoji-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;padding:12px;max-height:220px;overflow-y:auto}
.emoji-item{font-size:22px;border-radius:8px;padding:4px;transition:var(--t)}
.emoji-item:hover{background:var(--card)}
.sticker-item{border-radius:10px;overflow:hidden;aspect-ratio:1;border:1px solid var(--line)}
.sticker-item img{width:100%;height:100%;object-fit:cover}
.emoji-gate{padding:30px 22px;text-align:center;color:var(--text-2)}
.emoji-gate [data-icon]{color:var(--primary);margin-bottom:8px}
.emoji-gate [data-icon] svg{width:26px;height:26px}
.emoji-gate p{font-size:13px;line-height:1.5}

/* ============================================================
   AUTH — logins demo
   ============================================================ */
.demo-creds{margin-top:14px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 12px}
.demo-creds summary{font-size:12.5px;color:var(--text-2);cursor:pointer;font-weight:600}
.demo-creds ul{list-style:none;margin-top:8px;display:flex;flex-direction:column;gap:4px}
.demo-creds li{font-size:12px;color:var(--text-3);font-family:'JetBrains Mono',monospace}
.demo-creds b{color:var(--primary)}

/* ============================================================
   PERSONALIZAÇÃO (estilo Discord)
   ============================================================ */
.discord-like{width:760px;max-width:100%}
.settings-cols{display:grid;grid-template-columns:1fr 320px;gap:24px}
.settings-form h2{font-size:18px;margin-bottom:18px}
.set-row{padding:14px 0;border-top:1px solid var(--line-soft)}
.set-row:first-of-type{border-top:none;padding-top:0}
.set-label{display:block;font-size:11px;font-weight:700;letter-spacing:.6px;color:var(--text-3);text-transform:uppercase;margin-bottom:8px}
.set-label small{text-transform:none;color:var(--text-3);font-weight:500}
.set-row input[type=text],.set-row textarea{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:11px 13px;color:#fff;font-size:14px;outline:none;transition:var(--t)}
.set-row input[type=text]:focus,.set-row textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.1)}
.set-row input[type=file]{margin-top:8px;font-size:12px;color:var(--text-3)}
.vip-inline{display:flex;align-items:center;gap:12px}
.vip-inline input[type=color]{width:48px;height:40px;border:none;border-radius:10px;background:none;cursor:pointer}
.vip-inline input[type=color]:disabled{opacity:.4;cursor:not-allowed}
.set-hint{font-size:12px;color:var(--text-3)}

.settings-preview h3,.placa-title{font-size:11px;font-weight:700;letter-spacing:.6px;color:var(--text-3);text-transform:uppercase;margin-bottom:10px}
.placa-title{margin-top:18px}
.preview-card{background:var(--bg);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.preview-banner{height:90px;background:linear-gradient(135deg,var(--primary),#16161b)}
.preview-body{padding:0 16px 16px}
.preview-avatar{position:relative;width:66px;height:66px;margin-top:-33px;margin-bottom:10px}
.preview-avatar img{width:100%;height:100%;border-radius:18px;object-fit:cover;border:4px solid var(--bg);background:var(--bg)}
.preview-avatar .dot{width:16px;height:16px;border-width:3px;border-color:var(--bg);right:0;bottom:0}
.preview-name{font-size:18px;font-weight:700}
.preview-handle{font-size:12.5px;color:var(--text-3);display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:2px}
.preview-pron{color:var(--text-3)}
.badge.mini{font-size:9px;padding:2px 7px}
.preview-bio{font-size:13px;color:var(--text-2);margin:10px 0 0;min-height:14px}
.placa{display:flex;align-items:center;gap:10px;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:10px 12px}
.placa img{width:30px;height:30px;border-radius:50%;object-fit:cover}

/* ============================================================
   PAINEL ADMIN
   ============================================================ */
.admin-card{
  width:560px;max-width:100%;background:var(--card);border:1px solid var(--line);
  border-radius:18px;padding:26px;position:relative;max-height:90dvh;overflow-y:auto;
  box-shadow:0 40px 90px -20px #000,var(--glow);animation:pop .25s var(--ease);
}
.admin-head{display:flex;align-items:center;gap:10px;margin-bottom:18px;color:var(--primary)}
.admin-head h2{font-size:18px;color:#fff}
.admin-tabs{display:flex;background:var(--bg);border:1px solid var(--line);border-radius:11px;padding:4px;margin-bottom:18px}
.admin-tab{flex:1;padding:9px;border-radius:8px;font-size:13.5px;font-weight:600;color:var(--text-2);transition:var(--t)}
.admin-tab.active{background:var(--primary);color:#fff}
.channel-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:18px}
.channel-form input,.channel-form select{background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:10px;color:#fff;font-size:13.5px;outline:none}
.channel-form input:focus,.channel-form select:focus{border-color:var(--primary)}
.channel-form .chk{grid-column:1/-1;display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-2)}
.channel-form .btn-primary{grid-column:1/-1}
.admin-list{display:flex;flex-direction:column;gap:8px}
.admin-row{display:flex;align-items:center;gap:10px;background:var(--bg);border:1px solid var(--line);border-radius:11px;padding:10px 12px}
.admin-row.banned{opacity:.6;border-color:rgba(255,0,51,.4)}
.admin-cat{display:flex;align-items:center;gap:8px;margin:14px 0 4px;padding:0 2px}
.admin-cat-name{font-size:11px;font-weight:800;letter-spacing:1px;color:var(--text-3);text-transform:uppercase}
.admin-cat-name em{color:var(--text-3);font-weight:600;font-style:normal;opacity:.7}
.admin-cat .icon-btn.sm{margin-left:auto}
.admin-cat .cat-edit{flex:1;background:var(--bg);border:1px solid var(--primary);border-radius:8px;padding:7px 10px;color:#fff;font-size:13px;font-weight:700;letter-spacing:.5px;outline:none;text-transform:uppercase}
.admin-row-ch{margin-left:12px}
/* destaque do formulário quando entra em modo edição (clicou na canetinha) */
.channel-form.form-editing{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.14),0 0 22px -4px rgba(255,0,51,.55);animation:formFlash .7s var(--ease)}
@keyframes formFlash{0%{box-shadow:0 0 0 6px rgba(255,0,51,.3)}100%{box-shadow:0 0 0 3px rgba(255,0,51,.14),0 0 22px -4px rgba(255,0,51,.55)}}
.admin-av{width:34px;height:34px;border-radius:50%;object-fit:cover;flex:none}
.admin-row-main{flex:1;min-width:0}
.admin-row-main b{font-size:14px;display:block}
.admin-row-main small{font-size:11px;color:var(--text-3)}
.admin-row-act{display:flex;gap:4px}
/* linha de usuário com histórico de IPs */
.admin-row-user{flex-direction:column;align-items:stretch;gap:9px}
.admin-row-head{display:flex;align-items:center;gap:10px}
.ip-history{border-top:1px solid var(--line-soft);padding-top:9px;display:flex;flex-direction:column;gap:5px}
.ip-history-h{font-size:10.5px;font-weight:800;letter-spacing:.6px;color:var(--text-3);text-transform:uppercase}
.ip-history-h.ip-none{opacity:.7;font-weight:600;text-transform:none;letter-spacing:0}
.ip-row{display:flex;align-items:center;gap:8px;font-size:12px}
.ip-row code{font-family:'JetBrains Mono',monospace;color:#ff5c76;background:rgba(255,0,51,.08);border:1px solid rgba(255,0,51,.22);border-radius:6px;padding:2px 8px}
.ip-meta{color:var(--text-3);font-size:11px;flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ip-ban-mini{flex:none;font-size:10.5px;font-weight:700;color:var(--text-2);border:1px solid var(--line);border-radius:6px;padding:3px 9px;transition:var(--t)}
.ip-ban-mini:hover{border-color:var(--primary);color:var(--primary)}
.role-sel{background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:6px 8px;color:#fff;font-size:12.5px;outline:none}

/* criar conta (admin) */
.create-acc{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:16px}
.create-acc h4{font-size:12px;color:var(--text-3);letter-spacing:.5px;text-transform:uppercase;margin-bottom:10px}
.create-acc-row{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.create-acc-row input,.create-acc-row select{background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:9px 10px;color:#fff;font-size:13px;outline:none}
.create-acc-row input:focus,.create-acc-row select:focus{border-color:var(--primary)}
.create-acc-row .btn-primary{grid-column:1/-1}

/* título de post na fila */
.post-title{font-size:15px;font-weight:700;margin:2px 0 6px}

/* painel ao vivo */
.panel-live{display:flex;align-items:center;gap:9px;margin:4px 4px 14px;font-size:11px;font-weight:700;letter-spacing:.8px;color:var(--primary)}
.live-dot{width:9px;height:9px;border-radius:50%;background:var(--primary);box-shadow:0 0 0 0 rgba(255,0,51,.6);animation:pulse 1.6s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,0,51,.5)}70%{box-shadow:0 0 0 8px rgba(255,0,51,0)}100%{box-shadow:0 0 0 0 rgba(255,0,51,0)}}

/* ============================================================
   FÓRUM (estilo Discord)
   ============================================================ */
.forum-bar{display:flex;gap:12px;align-items:center;margin-bottom:14px}
.forum-search{flex:1;display:flex;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:11px 14px;color:var(--text-3);transition:var(--t)}
.forum-search:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.1)}
.forum-search input{flex:1;min-width:0;background:none;border:none;outline:none;color:#fff;font-size:14px}
.forum-search input::placeholder{color:var(--text-3)}
.forum-bar .btn-primary{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.forum-sort{display:inline-flex;align-items:center;gap:7px;background:var(--card);border:1px solid var(--line);border-radius:10px;padding:8px 14px;font-size:13px;color:var(--text-2);margin-bottom:14px;cursor:pointer;width:max-content}
.forum-list{display:flex;flex-direction:column;gap:1px}
.forum-card{background:var(--card);border:1px solid transparent;border-bottom:1px solid var(--line-soft);border-radius:12px;padding:16px 18px;transition:var(--t);cursor:pointer}
.forum-card:hover{background:var(--card-hi);border-color:var(--line)}
.forum-card.pending{border-left:3px solid #ffb400}
.forum-card-top{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.forum-card-top h3{font-size:16px;font-weight:700}
.forum-preview{font-size:14px;color:var(--text-2);line-height:1.5}
.forum-preview .msg-name{font-weight:700}
.forum-media{margin:10px 0;border-radius:10px;overflow:hidden;border:1px solid var(--line);max-width:420px}
.forum-media img{width:100%;display:block}
.forum-card-meta{display:flex;align-items:center;gap:6px;margin-top:10px;font-size:12.5px;color:var(--text-3)}
.forum-card-meta svg{vertical-align:middle}

/* modal nova postagem */
.forum-compose{width:540px;max-width:100%;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px;position:relative;box-shadow:0 40px 90px -20px #000,var(--glow);animation:pop .25s var(--ease)}
.forum-compose h2{font-size:18px;margin-bottom:18px}
.forum-compose input[type=text],.forum-compose input[type=url],.forum-compose textarea{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:11px 13px;color:#fff;font-size:14px;outline:none;margin-bottom:12px;transition:var(--t)}
.forum-compose input:focus,.forum-compose textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.1)}
.forum-compose textarea{resize:vertical}
.forum-compose-row{display:flex;gap:10px;align-items:center;margin-bottom:12px}
.forum-compose-row input[type=url]{flex:1;margin-bottom:0}
.forum-note{display:flex;align-items:center;gap:7px;font-size:12.5px;color:var(--text-3);margin-bottom:16px}
.forum-note [data-icon]{color:var(--primary)}

/* editor de banners da Vault */
.vault-admin-bar{display:flex;justify-content:flex-end;margin-bottom:8px}
.hero-ed-card{width:600px;max-height:88dvh;overflow-y:auto}
.hero-ed-item{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:12px}
.hero-ed-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.hero-ed-row b{font-size:13px;color:var(--text-2)}
.hero-ed-del{width:28px;height:28px;border-radius:8px;color:var(--text-3);display:grid;place-items:center;background:var(--surface-2)}
.hero-ed-del:hover{color:var(--primary)}
.hero-ed-2{display:flex;gap:10px}
.hero-ed-2 input{flex:1}
.hero-ed-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:6px}

/* ============================================================
   ANÚNCIOS + MENÇÕES
   ============================================================ */
.announce-msg{
  margin:10px 8px;border-radius:0 12px 12px 0;overflow:hidden;
  background:rgba(255,180,0,.06);
  border-left:3px solid #ffb400;
  animation:slideUp .2s var(--ease);
}
.announce-bar{display:flex;align-items:center;gap:8px;background:transparent;color:#ffb400;font-size:11px;font-weight:800;letter-spacing:1.2px;padding:8px 14px 2px}
.announce-content{display:flex;gap:12px;padding:14px}
.announce-av{width:40px;height:40px;border-radius:11px;object-fit:cover;cursor:pointer;flex:none}
.announce-content .msg-name{font-weight:700;font-size:14.5px;cursor:pointer}
.announce-content .msg-time{font-size:11px;color:var(--text-3);margin-left:8px}
.announce-text{font-size:15px;color:#fff;line-height:1.55;margin-top:4px;font-weight:500;white-space:pre-wrap;word-wrap:break-word}
.announce-content .msg-del{margin-left:auto;color:var(--text-3);align-self:flex-start}
.announce-content .msg-del:hover{color:var(--primary)}
.mention{background:rgba(255,0,51,.16);color:var(--primary);font-weight:600;padding:0 4px;border-radius:5px}

/* ============================================================
   NOTIFICAÇÕES
   ============================================================ */
.icon-btn{position:relative}
.icon-btn[data-count]:not([data-count="0"])::after{
  content:attr(data-count);position:absolute;top:2px;right:2px;
  background:var(--primary);color:#fff;font-size:9px;font-weight:700;
  min-width:15px;height:15px;border-radius:8px;display:grid;place-items:center;padding:0 3px;
}
.notif-card{width:440px;max-width:100%;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px;position:relative;max-height:80dvh;overflow-y:auto;box-shadow:0 40px 90px -20px #000,var(--glow);animation:pop .25s var(--ease)}
.notif-head{display:flex;align-items:center;gap:10px;margin-bottom:16px;color:var(--primary)}
.notif-head h2{font-size:18px;color:#fff}
.notif-list{display:flex;flex-direction:column;gap:8px}
.notif-row{display:flex;gap:11px;background:var(--bg);border:1px solid var(--line);border-radius:11px;padding:12px}
.notif-row.unread{border-color:rgba(255,0,51,.4);background:rgba(255,0,51,.05)}
.notif-ic{color:var(--primary);flex:none}
.notif-main{font-size:13.5px;min-width:0}
.notif-main small{color:var(--text-3);font-size:11px;font-weight:400}
.notif-text{color:var(--text-2);font-size:13px;margin-top:4px}

/* ============================================================
   UPLOAD MODERNO + TEMA GRADIENTE
   ============================================================ */
.upload-btn{
  display:inline-flex;align-items:center;gap:9px;margin-top:10px;
  background:linear-gradient(135deg,var(--card-hi),var(--card));
  border:1px dashed var(--line);border-radius:11px;padding:11px 16px;
  font-size:13px;font-weight:600;color:var(--text-2);cursor:pointer;
  transition:var(--t);position:relative;overflow:hidden;
}
.upload-btn:hover{border-color:var(--primary);color:#fff;border-style:solid;box-shadow:0 0 0 3px rgba(255,0,51,.08)}
.upload-btn [data-icon]{color:var(--primary)}
.upload-btn input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}
.upload-btn.sm{margin-top:0;padding:9px 12px;font-size:12.5px}

.theme-swatches,.style-colors{display:flex;gap:14px;margin-top:10px}
.swatch{display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer}
.swatch input[type=color]{width:64px;height:48px;border:none;border-radius:12px;background:none;cursor:pointer;padding:0}
.swatch input[type=color]:disabled{opacity:.4;cursor:not-allowed}
.swatch span{font-size:11px;color:var(--text-3);font-weight:600}
.style-mode{display:inline-flex;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:3px}
.mode-btn{padding:7px 16px;border-radius:7px;font-size:12.5px;font-weight:600;color:var(--text-2);transition:var(--t)}
.mode-btn.active{background:var(--primary);color:#fff}

/* ============================================================
   ADMIN — figurinhas/emojis
   ============================================================ */
.asset-form{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:14px;margin-bottom:16px}
.asset-form h4{font-size:12px;color:var(--text-3);letter-spacing:.5px;text-transform:uppercase;margin-bottom:10px}
.asset-form-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.asset-form-row select,.asset-form-row input[type=text]{background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:9px 10px;color:#fff;font-size:13px;outline:none}
.asset-form-row input[type=text]{flex:1;min-width:140px}
.asset-form-row select:focus,.asset-form-row input:focus{border-color:var(--primary)}
.asset-manage{display:flex;flex-direction:column;gap:6px}
.asset-group{font-size:11px;font-weight:700;letter-spacing:.5px;color:var(--text-3);margin-top:10px}
.asset-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.asset-cell{position:relative;aspect-ratio:1;background:var(--surface-2);border:1px solid var(--line);border-radius:9px;display:grid;place-items:center;overflow:hidden}
.asset-cell img{width:100%;height:100%;object-fit:cover}
.asset-emoji{font-size:20px}
.asset-del{position:absolute;top:1px;right:1px;width:16px;height:16px;border-radius:6px;background:rgba(0,0,0,.6);color:#fff;display:grid;place-items:center;opacity:0;transition:var(--t)}
.asset-cell:hover .asset-del{opacity:1}
.asset-del:hover{background:var(--primary)}

/* ============================================================
   CRYPT COINS (💎)
   ============================================================ */
.coin{height:14px;width:auto;vertical-align:-2px;display:inline-block;object-fit:contain}
.coins-pill{display:inline-flex;align-items:center;gap:6px;background:var(--card-hi);border:1px solid var(--line);border-radius:20px;padding:6px 13px;font-size:13px;font-weight:800;color:#fff;transition:var(--t)}
.coins-pill:hover{border-color:var(--primary)}
.coins-pill .coin{height:16px}
.wb-value .coin{height:22px}
.product-price .coin,.cart-total .coin,.pkg-coins .coin{height:16px}
/* admin coins */
.admin-h{font-size:12px;color:var(--text-3);letter-spacing:.5px;text-transform:uppercase;margin-bottom:10px}
.pkg-admin-form{display:grid;grid-template-columns:1.4fr .8fr .8fr 1fr;gap:8px;margin-bottom:14px}
.pkg-admin-form input{background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:9px 10px;color:#fff;font-size:13px;outline:none}
.pkg-admin-form input:focus{border-color:var(--primary)}
.pkg-admin-form .btn-primary{grid-column:1/-1}
.adjust-card{width:380px;max-width:100%;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:24px;position:relative;box-shadow:0 40px 90px -20px #000,var(--glow);animation:pop .25s var(--ease)}
.adjust-card h2{font-size:18px;margin-bottom:14px}
.adjust-user{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.adjust-user img{width:36px;height:36px;border-radius:50%;object-fit:cover}
.adjust-user b{font-size:15px}
.adjust-bal{background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:11px 13px;font-size:13px;color:var(--text-2);margin-bottom:14px}
.adjust-bal b{color:#fff;font-size:15px}
.adjust-row{display:flex;gap:8px;margin-bottom:10px}
.adjust-row select,.adjust-row input,.adjust-card input[type=text]{flex:1;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:10px 12px;color:#fff;font-size:14px;outline:none}
.adjust-card input[type=text]{width:100%;margin-bottom:12px}
.adjust-row select:focus,.adjust-row input:focus{border-color:var(--primary)}
/* entrega / bot Crypter */
.deliver-fields{margin:4px 0 10px;display:flex;flex-direction:column;gap:8px}
.deliver-fields textarea,.deliver-fields input{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:10px;color:#fff;font-size:13.5px;outline:none;resize:vertical}
.deliver-fields textarea:focus,.deliver-fields input:focus{border-color:var(--primary)}
.bot-form{display:flex;flex-direction:column;gap:10px}
.bot-row{display:flex;gap:14px}
.bot-av-prev{width:64px;height:64px;border-radius:16px;overflow:hidden;background:var(--surface-2);border:1px solid var(--line);flex:none}
.bot-av-prev img{width:100%;height:100%;object-fit:cover}
.bot-fields{flex:1;display:flex;flex-direction:column;gap:8px}
.bot-fields input,.bot-fields select{background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:9px 11px;color:#fff;font-size:13.5px;outline:none}
.bot-fields input:focus,.bot-fields select:focus{border-color:var(--primary)}
.bot-form .btn-primary{align-self:flex-start}
.deliver-ok{font-size:11px;color:#23a55a;font-weight:700}
.admin-tabs{flex-wrap:wrap}
.wallet-card{width:420px;max-width:100%;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px;position:relative;max-height:88dvh;overflow-y:auto;box-shadow:0 40px 90px -20px #000,var(--glow);animation:pop .25s var(--ease)}
.wallet-card h2{font-size:18px;margin-bottom:16px}
.wallet-balance{display:flex;align-items:center;justify-content:space-between;background:linear-gradient(135deg,rgba(255,0,51,.14),transparent);border:1px solid rgba(255,0,51,.3);border-radius:14px;padding:16px}
.wb-label{font-size:12px;color:var(--text-3);text-transform:uppercase;letter-spacing:1px}
.wb-value{font-size:26px;font-weight:800}
.wallet-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}
.wallet-stats div{background:var(--bg);border:1px solid var(--line);border-radius:11px;padding:11px 13px}
.wallet-stats small{display:block;font-size:11px;color:var(--text-3);margin-bottom:3px}
.wallet-stats b{font-size:15px}
.wallet-h{font-size:11px;letter-spacing:.6px;color:var(--text-3);text-transform:uppercase;margin:18px 0 8px}
.wallet-tx{display:flex;flex-direction:column;gap:6px}
.wtx{display:flex;align-items:center;gap:10px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:9px 11px}
.wtx-ic{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;flex:none}
.wtx-ic.pos{background:rgba(35,165,90,.15);color:#23a55a}.wtx-ic.neg{background:rgba(255,0,51,.12);color:var(--primary)}
.wtx-main{flex:1;min-width:0}.wtx-main b{font-size:13px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wtx-main small{font-size:11px;color:var(--text-3)}
.wtx-amt{font-size:13px;font-weight:700}.wtx-amt.pos{color:#23a55a}.wtx-amt.neg{color:var(--primary)}
.coins-card{width:680px;max-width:100%;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px;position:relative;box-shadow:0 40px 90px -20px #000,var(--glow);animation:pop .25s var(--ease)}
.coins-card h2{font-size:19px;margin-bottom:6px}
.coins-sub{font-size:12.5px;color:var(--text-3);margin-bottom:18px}
.coins-foot{font-size:12px;color:var(--text-3);margin-top:16px;text-align:center}
.pkg-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.pkg-card{position:relative;background:var(--bg);border:1px solid var(--line);border-radius:14px;padding:18px 14px;text-align:center;transition:var(--t)}
.pkg-card:hover{transform:translateY(-2px);border-color:#2d2d36}
.pkg-card.popular{border-color:var(--primary)}
.pkg-pop{position:absolute;top:-9px;left:50%;transform:translateX(-50%);background:var(--primary);color:#fff;font-size:9px;font-weight:800;letter-spacing:.8px;padding:3px 9px;border-radius:10px}
.pkg-coins{font-size:18px;font-weight:800}
.pkg-bonus{font-size:11.5px;color:#23a55a;font-weight:700;margin-top:2px}
.pkg-name{font-size:13px;color:var(--text-2);margin:8px 0 2px;font-weight:600}
.pkg-price{font-size:16px;font-weight:800;color:var(--primary);margin-bottom:12px}

/* ----- checkout PIX (AfiliaxPay) ----- */
.pix-card{width:420px;max-width:100%;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px;position:relative;max-height:90dvh;overflow-y:auto;box-shadow:0 40px 90px -20px #000,var(--glow);animation:pop .25s var(--ease)}
.pix-title{display:flex;align-items:center;gap:8px;font-size:18px;margin-bottom:4px}
.pix-sub{font-size:13px;color:var(--text-2);margin-bottom:16px}
.pix-lb{display:block;font-size:11px;letter-spacing:.5px;color:var(--text-3);text-transform:uppercase;margin:10px 0 5px}
.pix-in{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:10px 12px;color:var(--text);font-size:14px;transition:var(--t)}
.pix-in:focus{outline:none;border-color:var(--primary)}
.pix-err{color:var(--primary);font-size:12.5px;margin:10px 0 0;min-height:1px}
.pix-card .btn-primary,.pix-card .btn-ghost{margin-top:14px;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.pix-qrwrap{display:grid;place-items:center;background:#fff;border-radius:14px;padding:14px;margin:6px 0 14px}
.pix-qr{width:230px;height:230px;max-width:100%;display:block;image-rendering:pixelated}
.pix-hint{font-size:12.5px;color:var(--text-2);margin-bottom:8px}
.pix-copybox{background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:10px 12px;max-height:88px;overflow-y:auto}
.pix-copybox code{font-family:var(--mono,'JetBrains Mono',monospace);font-size:11.5px;color:var(--text-2);word-break:break-all;line-height:1.5}
.pix-status{display:flex;align-items:center;gap:9px;justify-content:center;font-size:13.5px;color:var(--text-2);margin-top:16px;font-weight:600}
.pix-spin{width:15px;height:15px;border:2px solid var(--line);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}
.pix-ok{display:inline-flex;color:#23a55a}
@keyframes spin{to{transform:rotate(360deg)}}

/* ============================================================
   STATUS (dots + menu)
   ============================================================ */
.dot.dnd{background:#f23f43}
.dot.offline{background:#80848e}
/* online=verde · away=laranja · dnd=vermelho · offline=cinza (definidos em .dot.online/.away acima) */
.status-menu{
  position:fixed;left:8px;bottom:var(--bar-h);width:252px;z-index:40;
  background:var(--card-hi);border:1px solid var(--line);border-radius:12px;padding:6px;
  box-shadow:0 24px 60px -18px #000,var(--glow);animation:pop .15s var(--ease);
}
.status-opt{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:9px 10px;border-radius:8px;font-size:14px;font-weight:600;color:var(--text);transition:var(--t)}
.status-opt:hover{background:var(--card)}
.status-opt small{display:block;color:var(--text-3);font-size:11px;font-weight:400}
.status-opt .dot{position:relative;width:11px;height:11px;border:none;flex:none}

/* ============================================================
   MODERAÇÃO (censura / delete)
   ============================================================ */
.msg-mod{display:inline-flex;gap:4px;margin-left:auto;opacity:0;transition:var(--t)}
.msg:hover .msg-mod,.announce-msg:hover .msg-mod{opacity:1}
.msg-censor,.msg-del{color:var(--text-3);padding:2px;border-radius:6px}
.msg-censor:hover{color:#ffb400}.msg-del:hover{color:var(--primary)}
.msg-text.censored{font-style:italic;color:var(--text-3)}
.post-del{margin-left:8px;color:var(--text-3);padding:3px;border-radius:6px}
.post-del:hover{color:var(--primary);background:rgba(255,0,51,.1)}
.forum-card-top .post-del{margin-left:auto}

/* ============================================================
   BUSCA DE USUÁRIOS (admin)
   ============================================================ */
.admin-search{display:flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:9px 12px;margin-bottom:12px;color:var(--text-3)}
.admin-search input{flex:1;min-width:0;background:none;border:none;outline:none;color:#fff;font-size:13.5px}
.ipban-form{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}
.ipban-form input{flex:1;min-width:120px;background:var(--surface-2);border:1px solid var(--line);border-radius:8px;padding:9px 10px;color:#fff;font-size:13px;outline:none}
.ipban-form input:focus{border-color:var(--primary)}
@media (max-width:760px){.ipban-form{flex-direction:column}.ipban-form .btn-ghost{width:100%}}

/* ============================================================
   MENSAGEM DE VOZ
   ============================================================ */
.composer-mic{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;color:var(--text-2);transition:var(--t)}
.composer-mic:hover{color:#fff;background:var(--surface-2)}
.composer-mic.recording{color:#fff;background:var(--primary);animation:pulse 1.4s infinite}
.attach-preview{margin:0 18px 8px}
.attach-chip{display:inline-flex;align-items:center;gap:12px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:8px 10px;max-width:320px}
.attach-chip img,.attach-chip video{width:54px;height:54px;border-radius:9px;object-fit:cover;flex:none}
.attach-ic{width:54px;height:54px;border-radius:9px;background:var(--surface-2);display:grid;place-items:center;color:var(--primary)}
.attach-chip-meta{min-width:0;flex:1}
.attach-chip-meta b{font-size:13px;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.attach-chip-meta small{font-size:11px;color:var(--text-3)}
.attach-rm{width:26px;height:26px;border-radius:7px;color:var(--text-3);display:grid;place-items:center;flex:none}
.attach-rm:hover{background:rgba(255,0,51,.12);color:var(--primary)}
.rec-bar{display:flex;align-items:center;gap:10px;margin:0 18px 8px;padding:9px 12px;border-radius:10px;background:rgba(255,0,51,.1);border:1px solid rgba(255,0,51,.35);font-size:13px;color:#fff}
.rec-bar b{font-variant-numeric:tabular-nums}
.rec-dot{width:10px;height:10px;border-radius:50%;background:var(--primary);animation:pulse 1.2s infinite}
.rec-bar button{margin-left:auto;font-size:12.5px;color:var(--text-2);font-weight:600}
.rec-bar #recSend{margin-left:0}
.rec-bar #recCancel:hover{color:#fff}
.voice-msg{display:inline-flex;align-items:center;gap:12px;margin-top:8px;background:var(--card);border:1px solid var(--line);border-radius:24px;padding:8px 14px 8px 8px;min-width:240px;max-width:340px}
.voice-play{width:34px;height:34px;border-radius:50%;background:var(--primary);color:#fff;display:grid;place-items:center;flex:none}
.voice-play:hover{background:var(--primary-2)}
.voice-bar{flex:1;height:5px;background:var(--surface-2);border-radius:4px;overflow:hidden}
.voice-prog{height:100%;width:0;background:var(--primary);border-radius:4px;transition:width .1s linear}
.voice-time{font-size:12px;color:var(--text-2);font-variant-numeric:tabular-nums;min-width:34px;text-align:right}

/* ============================================================
   MENU LATERAL (Amigos / Loja) + DMs
   ============================================================ */
.side-menu{display:flex;flex-direction:column;gap:2px;padding:4px 0 8px;margin-bottom:4px;border-bottom:1px solid var(--line-soft)}
.side-item{display:flex;align-items:center;gap:10px;width:100%;padding:9px 10px;border-radius:9px;color:var(--text-2);font-size:14.5px;font-weight:600;transition:var(--t)}
.side-item svg{color:var(--text-3)}
.side-item:hover{background:var(--card);color:#fff}
.side-item.active{background:linear-gradient(90deg,rgba(255,0,51,.16),rgba(255,0,51,.04));color:#fff}
.side-item.active svg{color:var(--primary)}
.tag-new{margin-left:auto;font-size:9px;font-weight:800;letter-spacing:.5px;background:var(--primary);color:#fff;padding:2px 7px;border-radius:10px}
.side-badge{margin-left:auto;min-width:18px;height:18px;border-radius:9px;background:var(--primary);color:#fff;font-size:10.5px;font-weight:800;display:grid;place-items:center;padding:0 5px}
/* lista de mensagens (Mensagens diretas) */
.msglist{display:flex;flex-direction:column;gap:2px}
.msg-conv{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;cursor:pointer;transition:var(--t)}
.msg-conv:hover{background:var(--card)}
.msg-conv.unread{background:rgba(255,0,51,.05)}
.msg-conv .mem-avatar img{width:42px;height:42px;border-radius:50%;object-fit:cover}
.conv-main{flex:1;min-width:0}
.conv-top{display:flex;align-items:center;gap:8px}
.conv-top .msg-name{font-size:14.5px;font-weight:700}
.conv-badge{margin-left:auto;min-width:18px;height:18px;border-radius:9px;background:var(--primary);color:#fff;font-size:10.5px;font-weight:800;display:grid;place-items:center;padding:0 5px}
.conv-prev{font-size:13px;color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.conv-close{width:28px;height:28px;border-radius:8px;color:var(--text-3);display:grid;place-items:center;flex:none;opacity:0;transition:var(--t)}
.msg-conv:hover .conv-close{opacity:1}
.conv-close:hover{background:rgba(255,0,51,.12);color:var(--primary)}
.bot-tag{font-size:9px;font-weight:800;letter-spacing:.5px;background:var(--primary);color:#fff;padding:1px 6px;border-radius:6px;vertical-align:middle}
.dm-row{display:flex;align-items:center;gap:9px;width:100%;padding:7px 10px;border-radius:9px;color:var(--text-2);font-size:14px;font-weight:500;transition:var(--t)}
.dm-row:hover{background:var(--card);color:#fff}
.dm-row.active{background:linear-gradient(90deg,rgba(255,0,51,.16),rgba(255,0,51,.04));color:#fff}
.dm-row .mem-avatar img{width:30px;height:30px;border-radius:50%;object-fit:cover}
.dm-row .ch-name{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ============================================================
   LOJA
   ============================================================ */
.store{padding:4px}
.store-add{display:inline-flex;align-items:center;gap:8px;margin-bottom:16px}
.store-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}

/* ===== VAULT premium (3 colunas) ===== */
.vault{display:grid;grid-template-columns:1fr 332px;gap:18px;align-items:start}
.vault-main{min-width:0}
.vault-sec-head{display:flex;align-items:center;justify-content:space-between;margin:20px 2px 12px}
.vault-sec-head>span{font-size:11px;font-weight:800;letter-spacing:1.2px;color:var(--text-3)}
.vault-clear{font-size:12px;color:var(--primary);font-weight:600}
/* hero */
.vault-hero{position:relative;height:240px;border-radius:20px;overflow:hidden;border:1px solid var(--line)}
.hero-slide{position:absolute;inset:0;background-size:cover;background-position:center;padding:30px 34px;display:flex;flex-direction:column;justify-content:center;opacity:0;transition:opacity .5s var(--ease);pointer-events:none}
.hero-slide.active{opacity:1;pointer-events:auto}
.hero-tag{display:inline-block;width:max-content;background:rgba(255,0,51,.16);border:1px solid rgba(255,0,51,.45);color:var(--primary);font-size:10px;font-weight:800;letter-spacing:1px;padding:5px 12px;border-radius:20px;margin-bottom:14px}
.hero-title{font-size:38px;font-weight:800;letter-spacing:.5px;line-height:1;color:#fff}
.hero-title b{color:var(--primary);font-weight:800;text-shadow:0 0 24px rgba(255,0,51,.6)}
.hero-sub{font-size:14px;color:var(--text-2);max-width:440px;margin:12px 0 18px;line-height:1.5}
.hero-btn{width:max-content}
.hero-dots{position:absolute;bottom:14px;left:34px;display:flex;gap:6px}
.hero-dot{width:22px;height:5px;border-radius:3px;background:rgba(255,255,255,.25);transition:var(--t)}
.hero-dot.active{background:var(--primary);width:30px}
/* categorias */
.vault-cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px}
.vault-cat{display:flex;flex-direction:column;align-items:center;gap:8px;background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px 8px;color:var(--text-2);font-size:12.5px;font-weight:600;transition:var(--t)}
.vault-cat:hover{transform:translateY(-2px);border-color:var(--primary);color:#fff}
.vault-cat.active{border-color:var(--primary);background:linear-gradient(160deg,rgba(255,0,51,.12),transparent);color:#fff}
.vault-cat-ic{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--surface-2);color:var(--primary)}
.vault-cat.active .vault-cat-ic{background:var(--primary);color:#fff}
.vault-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
/* painel direito */
.vault-side{position:sticky;top:0;display:flex;flex-direction:column;gap:14px}
.vault-side-head{font-size:10.5px;font-weight:800;letter-spacing:1px;color:var(--text-3);padding:0 2px}
.vault-preview{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.vp-banner{height:96px;background:linear-gradient(135deg,var(--primary),#16161b)}
.vp-body{padding:0 16px 16px;position:relative}
.vp-avatar{position:relative;width:72px;height:72px;margin-top:-36px;margin-bottom:8px}
.vp-avatar img{width:100%;height:100%;border-radius:20px;object-fit:cover;border:4px solid var(--card);background:var(--card)}
.vp-avatar .dot{width:16px;height:16px;border-width:3px;border-color:var(--card);right:2px;bottom:2px}
.vp-name{font-size:18px;font-weight:700}
.vp-handle{font-size:12.5px;color:var(--text-3);display:flex;align-items:center;gap:6px;margin:2px 0 8px}
.vp-bio{font-size:13px;color:var(--text-2);line-height:1.5;margin-top:10px}
/* carrinho */
.vault-cart{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:16px}
.cart-head{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:700;margin-bottom:12px}
.cart-count{margin-left:auto;background:var(--primary);color:#fff;font-size:11px;font-weight:800;min-width:20px;height:20px;border-radius:10px;display:grid;place-items:center;padding:0 6px}
.cart-list{display:flex;flex-direction:column;gap:7px;max-height:200px;overflow-y:auto}
.cart-item{display:flex;align-items:center;gap:8px;font-size:13px}
.ci-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ci-price{color:var(--text-2);font-weight:600;white-space:nowrap}
.ci-rm{width:22px;height:22px;border-radius:6px;color:var(--text-3);display:grid;place-items:center;flex:none}
.ci-rm:hover{background:rgba(255,0,51,.12);color:var(--primary)}
.cart-empty{font-size:13px;color:var(--text-3);text-align:center;padding:10px 0}
.cart-total{display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);margin-top:12px;padding-top:12px;font-size:14px}
.cart-total b{font-size:17px;color:var(--primary)}
.cart-checkout{margin-top:12px;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.cart-bal{display:block;text-align:center;font-size:12px;color:var(--text-3);margin-top:8px}
.product{position:relative;background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:var(--t)}
.product:hover{transform:translateY(-2px);border-color:#2d2d36}
.product.featured{border-color:rgba(255,0,51,.5)}
.product-tag{position:absolute;top:10px;left:10px;z-index:2;background:var(--primary);color:#fff;font-size:9.5px;font-weight:800;letter-spacing:.8px;padding:4px 9px;border-radius:20px}
.product-admin{position:absolute;top:8px;right:8px;z-index:2;display:flex;gap:4px}
.product-edit,.product-del{width:28px;height:28px;border-radius:8px;background:rgba(0,0,0,.55);color:#fff;display:grid;place-items:center}
.product-edit:hover{background:#3a3a44}.product-del:hover{background:var(--primary)}
.product-img{aspect-ratio:1;width:100%;background:var(--surface-2) center/cover}
.product-body{padding:14px;display:flex;flex-direction:column;gap:8px;flex:1}
.product-body h3{font-size:15.5px;line-height:1.3}
.product-body p{font-size:13px;color:var(--text-2);line-height:1.5;flex:1}
.product-temp{display:inline-flex;align-items:center;gap:5px;align-self:flex-start;margin:2px 0 2px;padding:3px 9px;border-radius:20px;font-size:10.5px;font-weight:700;letter-spacing:.3px;color:var(--primary);background:rgba(255,0,51,.1);border:1px solid rgba(255,0,51,.35)}
.product-temp svg{width:11px;height:11px}
.product-foot{display:flex;align-items:center;justify-content:space-between;margin-top:6px}
.product-price{font-size:17px;font-weight:800;color:var(--primary)}

/* ============================================================
   AMIGOS
   ============================================================ */
.friend-row{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:11px;transition:var(--t)}
.friend-row:hover{background:var(--card)}
.friend-row .mem-avatar img{width:38px;height:38px;border-radius:50%;object-fit:cover}
.friend-meta{flex:1;min-width:0}
.friend-meta .mem-name{font-size:14.5px;font-weight:700;display:block}
.friend-meta small{font-size:12px;color:var(--text-3)}
.friend-act{display:flex;gap:4px}
.friend-act .icon-btn.danger{color:var(--primary)}
.chk{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-2);margin-bottom:12px}

/* ============================================================
   MENSAGEM DE SISTEMA (entrada na comunidade)
   ============================================================ */
.sys-msg{display:flex;align-items:center;gap:8px;justify-content:center;margin:10px 0;font-size:13px;color:var(--text-2);text-align:center}
.sys-msg .sys-ic{color:#23a55a;display:inline-flex}
.sys-msg .sys-time{color:var(--text-3);font-size:11px}

/* ============================================================
   MENSAGENS EFÊMERAS
   ============================================================ */
.composer-eph{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;color:var(--text-2);transition:var(--t)}
.composer-eph:hover{color:#fff;background:var(--surface-2)}
.composer-eph.on{color:#fff;background:var(--primary)}
.eph-menu{position:absolute;bottom:78px;right:60px;z-index:30;width:230px;background:var(--card-hi);border:1px solid var(--line);border-radius:12px;padding:6px;box-shadow:0 24px 60px -18px #000,var(--glow);animation:pop .15s var(--ease)}
.eph-menu-head{font-size:10.5px;letter-spacing:.5px;color:var(--text-3);text-transform:uppercase;padding:8px 10px 6px;display:flex;justify-content:space-between}
.eph-menu-head small{color:var(--primary);font-weight:700}
.eph-menu button{display:flex;align-items:center;gap:8px;width:100%;text-align:left;padding:9px 10px;border-radius:8px;font-size:13.5px;font-weight:600;color:var(--text);transition:var(--t)}
.eph-menu button:hover{background:var(--card)}
.eph-menu button.active{color:var(--primary)}
.eph-menu button [data-icon]{color:var(--text-3)}
/* ----- modo de escrita (negrito / itálico / vermelho-admin) ----- */
.composer-fmt{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;color:var(--text-2);transition:var(--t)}
.composer-fmt b{font-size:16px;line-height:1}
.composer-fmt:hover{color:#fff;background:var(--surface-2)}
.composer-fmt.on{color:#fff;background:var(--surface-2);box-shadow:0 0 0 1px rgba(255,0,51,.35)}
.fmt-menu{position:absolute;bottom:78px;right:60px;z-index:30;width:230px;background:var(--card-hi);border:1px solid var(--line);border-radius:12px;padding:6px;box-shadow:0 24px 60px -18px #000,var(--glow);animation:pop .15s var(--ease)}
.fmt-menu-head{font-size:10.5px;letter-spacing:.5px;color:var(--text-3);text-transform:uppercase;padding:8px 10px 6px}
.fmt-menu button{display:flex;align-items:center;gap:8px;width:100%;text-align:left;padding:9px 10px;border-radius:8px;font-size:13.5px;font-weight:600;color:var(--text);transition:var(--t)}
.fmt-menu button:hover{background:var(--card)}
.fmt-menu button.active{color:var(--primary)}
.fmt-menu button.active::after{content:"✓";margin-left:auto;color:var(--primary)}
.fmt-menu .fmt-red{margin-top:4px;border-top:1px solid var(--line);border-radius:0 0 8px 8px;color:var(--text-2)}
.fmt-menu .fmt-red.on{color:var(--primary);background:rgba(255,0,51,.08)}
.fmt-menu .fmt-red.on::after{content:"●";margin-left:auto;color:var(--primary)}
/* texto vermelho renderizado (só de autor admin) */
.msg-red{color:var(--primary);font-weight:600;text-shadow:0 0 8px rgba(255,0,51,.35)}
.msg-text strong{font-weight:800;color:#fff}
.msg-text em{font-style:italic}
.eph-once{display:inline-flex;align-items:center;gap:8px;margin-top:4px;background:var(--card);border:1px dashed var(--primary);border-radius:10px;padding:9px 14px;font-size:13px;color:var(--primary);font-weight:600;cursor:pointer}
.eph-once:hover{background:rgba(255,0,51,.08)}
.eph-gone{display:inline-flex;align-items:center;gap:8px;margin-top:4px;font-size:12.5px;color:var(--text-3);font-style:italic}
.eph-count{color:var(--primary);font-size:12px;font-weight:600}
.eph-revealed{animation:fade .2s var(--ease)}
.eph-badge{display:inline-flex;align-items:center;gap:3px;margin-left:8px;font-size:10px;font-weight:700;color:#ffb400;border:1px solid rgba(255,180,0,.4);border-radius:10px;padding:1px 7px;vertical-align:middle}

/* admin — servidor */
.server-form{display:flex;flex-direction:column;gap:10px}
.server-form h4{font-size:12px;color:var(--text-3);letter-spacing:.5px;text-transform:uppercase;margin-bottom:4px}
.server-form .set-label{margin-top:6px}
.server-form input[type=text]{background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:10px 12px;color:#fff;font-size:14px;outline:none}
.server-form input[type=text]:focus{border-color:var(--primary)}
.server-banner-prev{height:110px;border-radius:12px;background:var(--surface-2) center/cover no-repeat;border:1px solid var(--line)}
.server-form .btn-primary{margin-top:6px;align-self:flex-start}

/* ============================================================
   TERMINAL WEB-CLI (canal /terminal) — estética Kali Linux (preto/vermelho)
   ============================================================ */
.term-shell{display:flex;flex-direction:column;height:100%;min-height:0;margin:14px 18px 18px;
  background:#000;border:1px solid #262626;border-radius:8px;overflow:hidden;
  box-shadow:0 24px 60px -22px #000,0 0 0 1px rgba(255,0,51,.12);
  font-family:'JetBrains Mono',ui-monospace,monospace}
/* barra de título estilo gnome-terminal do Kali */
.term-titlebar{display:flex;align-items:center;gap:10px;padding:7px 12px;background:#1b1b1b;border-bottom:1px solid #000}
.term-tb-ico{color:#c9c9c9;font-size:12px;font-weight:700;flex:none}
.term-tb-title{flex:1;min-width:0;text-align:center;color:#eaeaea;font-family:Inter,sans-serif;font-size:13px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.term-titlebar .term-cvebtn{flex:none}
.term-tb-btns{display:flex;gap:8px;flex:none}
.term-tb-btns i{width:12px;height:12px;border-radius:50%;background:#3a3a3a;display:inline-block}
.term-tb-btns .tb-close{background:#ff0033}
/* barra de menu (File Actions Edit View Help) */
.term-menubar{display:flex;align-items:center;gap:16px;padding:5px 12px;background:#111;border-bottom:1px solid #000}
.term-menubar>span{color:#cfcfcf;font-family:Inter,sans-serif;font-size:12.5px}
.term-menubar>span:hover{color:#fff}
.term-menubar .term-cvebtn{margin-left:auto}
/* corpo */
.term-body{flex:1;min-height:0;overflow-y:auto;padding:12px 14px;font-size:13.5px;line-height:1.5;color:#eaeaea;background:#000}
.term-line{white-space:pre-wrap;word-break:break-word;margin-bottom:2px}
.term-sys{color:#9aa0a6}
.term-out{color:#eaeaea}
.term-ok{color:#26d367}
.term-err{color:#ff3b30}
.term-ai{color:#ff8a95}
.term-red{color:#ff2d4f}
.term-white{color:#fff}
.term-danger{color:#ff0000;font-weight:700;animation:termBlink .55s steps(1) infinite}
.term-mult{color:#fff;font-weight:700}
.term-jackpot{color:#26d367;font-weight:800;letter-spacing:1px}
.term-reels{color:#fff;font-weight:700;letter-spacing:2px;font-size:16px}
/* prompt Kali de duas linhas ┌──(kali㉿kali)-[~] / └─$ */
.kp-line1,.kp-echo1{color:#ff2d4f;font-weight:700}
.kp-line1 b,.kp-echo1 b{color:#fff}
.kp-line2,.kp-echo2{display:flex;align-items:center}
.kp-arrow{color:#ff2d4f;font-weight:700;margin-right:8px;flex:none}
.term-cmd .kp-echo2 span:last-child{color:#fff}
.kali-prompt{padding:2px 0}
.term-inputline{border-top:1px solid #141414;padding:8px 14px 12px;background:#000}
#termInput{flex:1;background:transparent;border:none;outline:none;color:#fff;
  font-family:'JetBrains Mono',monospace;font-size:13.5px;caret-color:#fff}
.term-caret{width:8px;height:15px;background:#d0d0d0;animation:termBlink 1s steps(1) infinite;flex:none}
@keyframes termBlink{0%,50%{opacity:1}50.01%,100%{opacity:0}}

/* ============================================================
   Produto desativado na Vault (visível só p/ admin)
   ============================================================ */
.product.inactive{opacity:.55;filter:grayscale(.4)}
.product-tag.off{background:#3a3a42;color:#ff8fa3}

/* ============================================================
   NSFW — imagens borradas com olho central (clique revela)
   ============================================================ */
.msg-media-wrap{position:relative;display:inline-block;max-width:100%}
.msg-media-wrap.nsfw .msg-media{filter:blur(20px) brightness(.55);pointer-events:none;transition:filter .2s}
.nsfw-eye{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.4);
  border:none;color:#c9c9c9;cursor:pointer;border-radius:12px;transition:var(--t)}
.nsfw-eye:hover{color:#fff;background:rgba(0,0,0,.5)}
.msg-media-wrap:not(.nsfw) .nsfw-eye{display:none}

/* botão CVE VULN DB no header do terminal */
.term-cvebtn{margin-left:auto;background:#1a0004;border:1px solid #ff0033;color:#ff5c76;
  font-family:'JetBrains Mono',monospace;font-size:10.5px;font-weight:700;letter-spacing:.5px;
  padding:4px 9px;border-radius:6px;cursor:pointer;transition:var(--t)}
.term-cvebtn:hover{background:#ff0033;color:#fff}

/* ============================================================
   RED ROOM — pop-up chill + janela da lareira (arrastável)
   ============================================================ */
.redroom-welcome{position:relative;max-width:420px;min-height:600px;text-align:center;padding:0;overflow:hidden;
  display:flex;flex-direction:column;justify-content:flex-end;
  background-size:cover;background-position:center;background-repeat:no-repeat;
  box-shadow:0 40px 90px -20px #000}
.redroom-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.25) 40%,rgba(0,0,0,.85))}
.redroom-content{position:relative;z-index:1;padding:24px 30px 34px}
.redroom-welcome h2{color:#fff;text-shadow:0 2px 12px rgba(0,0,0,.8)}
.redroom-welcome p{color:#f0f0f0;text-shadow:0 1px 8px rgba(0,0,0,.9)}
.fp-spacer{flex:1}
.redroom-welcome h2{font-size:20px;margin-bottom:10px}
.redroom-welcome p{color:var(--text-2);font-size:15px;line-height:1.6;margin-bottom:22px}
.fireplace-win{position:fixed;z-index:120;width:300px;background:#0b0b0e;border:1px solid var(--line);
  border-radius:14px;overflow:hidden;box-shadow:0 30px 80px -20px #000,0 0 0 1px rgba(255,0,51,.2)}
/* barra de arrastar invisível sobre o GIF — só os botões flutuam */
.fireplace-head{position:absolute;top:0;left:0;right:0;z-index:2;display:flex;align-items:center;gap:8px;padding:8px 10px;
  background:transparent;cursor:move;user-select:none}
.fireplace-head b{flex:1;font-size:12.5px;color:#fff;letter-spacing:.3px}
.fireplace-head button{width:26px;height:26px;border-radius:7px;background:rgba(0,0,0,.5);color:#fff;
  display:grid;place-items:center;cursor:pointer;transition:var(--t);backdrop-filter:blur(4px)}
.fireplace-head button:hover{background:var(--primary);color:#fff}
.fireplace-win img{display:block;width:100%;height:180px;object-fit:cover}

/* ============================================================
   Anúncios (admin) + imagem em notificações
   ============================================================ */
.notif-img{display:block;margin-top:8px;max-width:100%;max-height:120px;border-radius:10px;object-fit:cover;border:1px solid var(--line)}
.ad-form{display:flex;flex-direction:column;gap:6px}
.ad-form select,.ad-form textarea,.ad-form input[type=text]{width:100%;background:var(--bg);border:1px solid var(--line);border-radius:9px;padding:10px 12px;color:#fff;font-size:14px;outline:none}
.ad-form select:focus,.ad-form textarea:focus,.ad-form input:focus{border-color:var(--primary)}
.ad-form textarea{resize:vertical}
.ad-form .btn-primary{margin-top:10px}
.ad-preview{margin:8px 0 2px;background:var(--bg);border:1px dashed var(--line);border-radius:12px;padding:12px}
.ad-preview .notif-row{margin:0}

/* MÓDULO 1 — patente (rank) no perfil */
.rank-badge{display:inline-block;font-size:12px;font-weight:800;letter-spacing:.5px;padding:3px 10px;border-radius:8px;border:1px solid;background:rgba(255,255,255,.03)}
.rank-progress{display:block;margin-top:8px;font-size:11.5px;color:var(--text-3)}

/* botão shadowban no painel admin */
.btn-shadow{background:#2a1a3a;color:#c9a0ff;border:1px solid #5a3a7a}
.btn-shadow:hover{background:#3a2550;color:#fff}

/* ============================================================
   Admin — log de transações de cryptcoins (tempo real)
   ============================================================ */
.tx-live{font-size:10px;font-weight:800;letter-spacing:.5px;color:#26d367;margin-left:8px;animation:txPulse 1.6s ease-in-out infinite}
@keyframes txPulse{0%,100%{opacity:1}50%{opacity:.35}}
.coin-tx-log{max-height:260px;overflow-y:auto;background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:6px;display:flex;flex-direction:column;gap:2px}
.tx-row{display:grid;grid-template-columns:1.1fr .9fr .6fr .7fr 1.6fr .7fr;gap:8px;align-items:center;padding:7px 9px;border-radius:8px;font-size:12.5px;transition:background var(--t)}
.tx-row:hover{background:var(--card)}
.tx-user{font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tx-type{color:var(--text-2);font-size:11.5px}
.tx-amt{font-weight:800;font-family:'JetBrains Mono',monospace;text-align:right}
.tx-amt.pos{color:#26d367}
.tx-amt.neg{color:#ff3b30}
.tx-bal{color:var(--text-3);font-family:'JetBrains Mono',monospace;font-size:11.5px}
.tx-desc{color:var(--text-3);font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tx-time{color:var(--text-3);font-size:11px;text-align:right;white-space:nowrap}
.tx-new{animation:txFlash 1.2s ease}
@keyframes txFlash{0%{background:rgba(38,211,103,.25)}100%{background:transparent}}

/* ============================================================
   Termos de Uso — checkbox no cadastro + modal jurídico
   ============================================================ */
.terms-check{display:flex;align-items:flex-start;gap:9px;margin:2px 0 14px;cursor:pointer;font-size:13px;color:#fff;line-height:1.5}
.terms-check input[type=checkbox]{appearance:none;-webkit-appearance:none;width:18px;height:18px;flex:none;margin-top:1px;background:#000;border:1.5px solid var(--line);border-radius:5px;cursor:pointer;position:relative;transition:var(--t)}
.terms-check input[type=checkbox]:hover{border-color:var(--primary)}
.terms-check input[type=checkbox]:checked{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.12)}
.terms-check input[type=checkbox]:checked::after{content:"";position:absolute;left:5px;top:1px;width:5px;height:10px;border:solid var(--primary);border-width:0 2px 2px 0;transform:rotate(45deg)}
.terms-check-txt{flex:1}
.terms-link{color:var(--primary);font-weight:600;text-decoration:none}
.terms-link:hover{text-decoration:underline}
/* botão: cinza/opaco quando bloqueado, glow vermelho quando liberado */
#authSubmit.is-disabled,#authSubmit:disabled{background:#242428 !important;color:#6d6d75 !important;box-shadow:none !important;cursor:not-allowed}
#authSubmit:not(.is-disabled):not(:disabled){box-shadow:0 0 0 1px rgba(255,0,51,.5),0 0 22px -3px rgba(255,0,51,.75)}
/* modal dos termos */
.terms-card{width:680px;max-width:100%;max-height:86dvh;background:#000;border:1px solid var(--line);border-radius:16px;padding:26px 24px;position:relative;display:flex;flex-direction:column;box-shadow:0 40px 90px -20px #000,0 0 0 1px rgba(255,0,51,.15);animation:pop .25s var(--ease)}
.terms-body{overflow-y:auto;padding-right:8px;color:#fff}
.terms-body .tc-title{color:var(--primary);font-size:18px;font-weight:800;margin-bottom:4px}
.terms-body .tc-meta{color:var(--text-3);font-size:12px;margin-bottom:16px}
.terms-body .tc-h{color:var(--primary);font-size:14px;font-weight:800;margin:18px 0 6px;letter-spacing:.3px}
.terms-body p{color:#e8e8ec;font-size:13.5px;line-height:1.6;margin-bottom:8px}
.terms-body .tc-hl{color:var(--primary);font-weight:700}

/* ============================================================
   FÓRUM — thread (respostas) + Accept Solution
   ============================================================ */
.forum-card.clickable{cursor:pointer}
.forum-card.clickable:hover{border-color:var(--primary)}
.forum-card.resolved{border-color:rgba(38,211,103,.4)}
.solved-badge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:800;letter-spacing:.3px;color:#26d367;background:rgba(38,211,103,.1);border:1px solid rgba(38,211,103,.35);border-radius:7px;padding:2px 8px}
.thread-view{display:flex;flex-direction:column;gap:14px;padding:4px 2px 20px;max-width:820px;margin:0 auto;width:100%}
.thread-back{align-self:flex-start;display:inline-flex;align-items:center;gap:6px}
.thread-topic{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:18px 20px}
.thread-topic.resolved{box-shadow:0 0 0 1px rgba(38,211,103,.3)}
.thread-topic-top{display:flex;align-items:center;gap:12px;justify-content:space-between;margin-bottom:8px}
.thread-topic-top h2{font-size:19px;font-weight:800}
.thread-author{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--text-2);margin-bottom:12px}
.thread-author .reply-av{width:26px;height:26px;border-radius:50%;object-fit:cover}
.thread-body{font-size:14.5px;color:#dcdce2;line-height:1.6;white-space:pre-wrap;word-wrap:break-word}
.thread-replies-h{font-size:11px;font-weight:800;letter-spacing:1px;color:var(--text-3);text-transform:uppercase;padding:4px 2px}
.thread-replies{display:flex;flex-direction:column;gap:10px}
.reply{display:flex;gap:11px;background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.reply.is-solution{border-color:rgba(38,211,103,.45);background:linear-gradient(180deg,rgba(38,211,103,.06),transparent)}
.reply-av{width:34px;height:34px;border-radius:50%;object-fit:cover;flex:none}
.reply-main{flex:1;min-width:0}
.reply-head{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.reply-head .msg-name{font-size:14px;font-weight:700}
.reply-head .msg-time{font-size:11px;color:var(--text-3)}
.reply-body{font-size:14px;color:#dcdce2;line-height:1.5;white-space:pre-wrap;word-wrap:break-word}
.reply-actions{margin-top:8px}
.accept-sol{display:inline-flex;align-items:center;gap:5px}
.thread-composer{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:8px 10px;margin-top:4px}
.thread-composer:focus-within{border-color:var(--primary);box-shadow:0 0 0 3px rgba(255,0,51,.1)}
.thread-composer input{flex:1;background:none;border:none;outline:none;color:#fff;font-size:14.5px}
.thread-composer input::placeholder{color:var(--text-3)}

/* ============================================================
   CANAIS DE VOZ (estilo Discord · LiveKit)
   ============================================================ */
/* canal 🔊 na sidebar */
.voice-ch-wrap{display:flex;flex-direction:column}
.voice-channel .vc-ico{display:inline-flex;align-items:center;color:var(--text-3)}
.voice-channel.active{background:var(--card);color:#fff}
.voice-channel.active .vc-ico{color:var(--primary);filter:drop-shadow(0 0 6px rgba(255,0,51,.7))}

/* usuários conectados (indentados sob o canal, como no Discord) */
.voice-users{display:flex;flex-direction:column;gap:2px;padding:2px 0 6px 30px}
.voice-user{display:flex;align-items:center;gap:8px;padding:3px 8px 3px 4px;border-radius:8px;color:var(--text-2);font-size:13px;min-width:0}
.voice-user:hover{background:var(--card)}
.vu-av{position:relative;flex:none;width:22px;height:22px}
.vu-av img{width:22px;height:22px;border-radius:50%;object-fit:cover;display:block}
.vu-av::after{ /* anel de VAD (aparece ao falar) */
  content:'';position:absolute;inset:-3px;border-radius:50%;
  border:2px solid transparent;transition:border-color 120ms linear, box-shadow 120ms linear;
  pointer-events:none;
}
.voice-user.speaking{color:#fff}
.voice-user.speaking .vu-av::after{
  border-color:#26d367;
  box-shadow:0 0 8px rgba(38,211,103,.85), inset 0 0 5px rgba(38,211,103,.4);
  animation:vadPulse 1.1s ease-in-out infinite;
}
@keyframes vadPulse{
  0%,100%{box-shadow:0 0 6px rgba(38,211,103,.6), inset 0 0 4px rgba(38,211,103,.3)}
  50%{box-shadow:0 0 14px rgba(38,211,103,1), inset 0 0 7px rgba(38,211,103,.55)}
}
.vu-name{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.vu-flag{display:inline-flex;align-items:center;color:var(--primary);opacity:.9;flex:none}

/* ---------- barra de voz (acima do painel do usuário) ---------- */
.voicebar{
  position:fixed;left:0;bottom:var(--bar-h);width:var(--side-w);
  background:var(--surface-2);
  border-top:1px solid var(--line-soft);border-right:1px solid var(--line-soft);
  display:flex;align-items:center;gap:8px;padding:8px 10px;z-index:6;
}
body.voice-on .sidebar{padding-bottom:calc(var(--bar-h) + 52px)}
.voicebar-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
.voicebar-status{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:#26d367}
.voicebar-status .vb-signal{display:inline-flex;filter:drop-shadow(0 0 5px rgba(38,211,103,.8))}
.voicebar-status.is-mock{color:var(--primary)}
.voicebar-status.is-mock .vb-signal{filter:drop-shadow(0 0 5px rgba(255,0,51,.8))}
.voicebar-room{font-size:11.5px;color:var(--text-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.voicebar-actions{display:flex;align-items:center;gap:4px;flex:none}
.vb-btn{
  display:inline-flex;align-items:center;justify-content:center;
  width:30px;height:30px;border-radius:8px;color:var(--text-2);
  transition:background var(--t), color var(--t), box-shadow var(--t);
}
.vb-btn:hover{background:var(--card);color:#fff}
.vb-btn.active{ /* mutado/ensurdecido = destaque vermelho neon */
  color:var(--primary);background:rgba(255,0,51,.08);
  box-shadow:0 0 0 1px rgba(255,0,51,.35), 0 0 12px -2px rgba(255,0,51,.6);
}
.vb-btn.vb-danger:hover{
  color:#fff;background:var(--primary);
  box-shadow:0 0 14px -2px rgba(255,0,51,.8);
}

/* mobile: acompanha o drawer da sidebar (mesmo comportamento da .userbar) */
@media (max-width:900px){
  .voicebar{left:0;width:84%;max-width:320px;transform:translateX(-100%);transition:transform var(--t)}
  body[data-view="channels"] .voicebar{transform:translateX(0)}
}