@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@500;600;700&family=JetBrains+Mono:wght@500;600;700&family=Inter:wght@400;500;600;700;800&display=swap');

:root{
  --preto:#060a10;
  --preto2:#0a1119;
  --painel:#111a27;
  --painel2:#0c1420;
  --linha:rgba(140,190,235,.14);
  --azul:#7fc1ea;
  --azul-forte:#4a9fd8;
  --azul-glow:#a9d8f5;
  --violeta:#8aa7e6;
  --violeta-forte:#5c7fd1;
  --ouro:#eab94e;
  --prata:#a8bccf;
  --texto:#eaf2fa;
  --texto-suave:#8ea3b8;
  --sucesso:#2fbf82;
  --alerta:#f2a93c;
  --perigo:#ea6b83;
  --raio:20px;
  --raio-btn:999px;
  --sombra: 0 20px 48px rgba(0,0,0,.5);
  --sidebar-largura:300px;
  --grad-a:#8fd0f0;
  --grad-b:#4a9fd8;
  /* superfícies e detalhes que trocam entre tema escuro (padrão) e claro */
  --corpo-fundo: radial-gradient(ellipse 120% 70% at 50% -10%, rgba(74,159,216,.18), transparent 55%), linear-gradient(180deg, #05080d 0%, #080d14 45%, #0b121c 100%);
  --topo-fundo: rgba(8,13,20,.78);
  --sidebar-fundo: linear-gradient(180deg, #0c131e 0%, #090e16 100%);
  --grupo-foto-fundo: linear-gradient(135deg,#16283c,#0f1c2c);
  --perfil-capa-fim:#13233a;
  --plano-card-fundo: linear-gradient(160deg, #101a28, #0c141f);
  --auth-titulo-grad: linear-gradient(100deg, var(--azul-forte), var(--azul-glow) 55%, #eaf6fd);
  --nav-ativo-texto:#eaf2fa;
  --premium-eyebrow-texto: var(--azul-glow);
  --dourado-contraste:#f0c274;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter', -apple-system, sans-serif;
  background: var(--corpo-fundo);
  color:var(--texto);
  min-height:100vh;
  overflow-x:hidden;
  position:relative;
  transition: background .3s ease, color .3s ease;
}
/* halo suave e calmo nas bordas da tela — clima leve e profissional */
.vinheta-sangue{
  position:fixed; inset:0; z-index:1; pointer-events:none;
  box-shadow: inset 0 0 160px rgba(140,195,235,.22), inset 0 0 60px rgba(120,180,230,.12);
  animation: pulso-sangue 7s ease-in-out infinite;
}
@keyframes pulso-sangue{
  0%,100%{ box-shadow: inset 0 0 160px rgba(140,195,235,.16), inset 0 0 60px rgba(120,180,230,.08); }
  50%{ box-shadow: inset 0 0 200px rgba(140,195,235,.26), inset 0 0 80px rgba(120,180,230,.14); }
}

/* ============ FUNDO: FIOS ANIMADOS + BRILHOS ============ */
#dna, #fumaca{position:fixed; inset:0; z-index:0; pointer-events:none;}
#dna{opacity:.45;}
#fumaca{opacity:.4;}
.grade-fundo{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(120,180,230,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120,180,230,.07) 1px, transparent 1px);
  background-size:42px 42px;
  mask-image: radial-gradient(ellipse 90% 60% at 50% 0%, #000 0%, transparent 75%);
}
.brilho{
  position:fixed; width:520px; height:520px; border-radius:50%;
  background: radial-gradient(circle, rgba(120,190,235,.22), transparent 70%);
  filter: blur(30px); z-index:0; pointer-events:none;
  animation: flutuar 14s ease-in-out infinite;
}
.brilho.b1{top:-180px; left:-140px;}
.brilho.b2{bottom:-220px; right:-160px; animation-delay:4s; background: radial-gradient(circle, rgba(140,200,240,.28), transparent 70%);}
@keyframes flutuar{0%,100%{transform:translate(0,0) scale(1);} 50%{transform:translate(50px,-40px) scale(1.1);}}

/* ============ TOPO ============ */
header.topo{
  position:sticky; top:0; z-index:100;
  background: var(--topo-fundo);
  backdrop-filter: blur(16px);
  border-bottom:1px solid var(--linha);
  transition: background .3s ease;
}
.topo-inner{
  max-width:1160px; margin:0 auto; padding:12px 20px;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.logo{display:flex; align-items:center; gap:12px;}
.logo img{width:42px; height:42px; object-fit:contain; filter:drop-shadow(0 0 10px rgba(120,190,235,.5));}
.logo-texto{display:flex; flex-direction:column; line-height:1.1;}
.logo-texto strong{
  font-family:'Space Grotesk', sans-serif; font-size:1.05rem; letter-spacing:1px;
  background:linear-gradient(135deg,#4a9fd8,var(--azul-glow));
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.logo-texto span{font-size:.65rem; color:var(--texto-suave); letter-spacing:.5px; text-transform:uppercase;}

.topo-acoes{display:flex; align-items:center; gap:10px;}
.pill-conta{
  display:flex; align-items:center; gap:8px; padding:6px 14px 6px 6px; border-radius:999px;
  background:rgba(120,190,235,.08); border:1px solid var(--linha); cursor:pointer; transition:.2s;
}
.pill-conta:hover{border-color:var(--azul-forte);}
.pill-conta .mini-avatar{
  width:26px; height:26px; border-radius:50%; background:linear-gradient(135deg,var(--azul),var(--azul-forte));
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:.78rem; font-weight:800;
}
.pill-conta span{font-size:.8rem; font-weight:700; color:var(--texto);}

.hamburguer{
  display:flex; flex-direction:column; justify-content:center; gap:5px;
  width:42px; height:42px; background:rgba(120,190,235,.1); border:1px solid var(--linha);
  border-radius:11px; cursor:pointer; align-items:center;
}
.hamburguer span{display:block; width:19px; height:2px; background:var(--texto); border-radius:2px; transition:.3s;}
.hamburguer:hover{border-color:var(--azul-forte); background:rgba(120,190,235,.18);}

.botao-tema{
  display:flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius:11px; flex-shrink:0;
  background:rgba(120,190,235,.1); border:1px solid var(--linha); cursor:pointer;
  color:var(--texto); font-size:1.05rem; transition:.2s;
}
.botao-tema:hover{border-color:var(--azul-forte); background:rgba(120,190,235,.18); transform:rotate(15deg);}

.badge-alerta{
  position:absolute; top:-4px; right:2px; background:var(--perigo); color:#fff;
  font-size:.62rem; padding:1px 6px; border-radius:999px; font-weight:800;
  animation: pulso 1.4s infinite; box-shadow:0 0 10px rgba(234,107,131,.6);
}
@keyframes pulso{0%,100%{transform:scale(1);} 50%{transform:scale(1.3);}}

/* ============ SIDEBAR (menu lateral esquerdo) ============ */
.sidebar-fundo{
  position:fixed; inset:0; z-index:299; background:rgba(20,50,80,.28); backdrop-filter:blur(2px);
  opacity:0; pointer-events:none; transition:opacity .3s;
}
.sidebar-fundo.aberto{opacity:1; pointer-events:auto;}
aside.sidebar{
  position:fixed; top:0; left:0; bottom:0; width:var(--sidebar-largura); max-width:86vw; z-index:300;
  background: var(--sidebar-fundo);
  border-right:1px solid var(--linha);
  box-shadow:0 0 60px rgba(70,130,180,.18);
  transform:translateX(-102%); transition:transform .35s cubic-bezier(.2,.9,.25,1);
  display:flex; flex-direction:column; overflow-y:auto;
}
aside.sidebar.aberto{transform:translateX(0);}
.sidebar-topo{
  padding:22px 20px 18px; display:flex; align-items:center; justify-content:space-between;
  border-bottom:1px solid var(--linha);
}
.sidebar-logo{display:flex; align-items:center; gap:10px;}
.sidebar-logo img{width:36px; height:36px; object-fit:contain; filter:drop-shadow(0 0 8px rgba(120,190,235,.5));}
.sidebar-logo strong{font-family:'Space Grotesk',sans-serif; font-size:.92rem; letter-spacing:.6px; color:var(--texto);}
.sidebar-fechar{background:none; border:none; color:var(--texto-suave); font-size:1.3rem; cursor:pointer; line-height:1;}
.sidebar-fechar:hover{color:var(--texto);}

.sidebar-conta{
  margin:16px 18px; padding:14px; border-radius:14px; display:flex; align-items:center; gap:12px;
  background:linear-gradient(135deg, rgba(120,190,235,.12), rgba(90,150,210,.05)); border:1px solid var(--linha);
}
.sidebar-conta .mini-avatar{
  width:42px; height:42px; border-radius:50%; background:linear-gradient(135deg,var(--azul),var(--azul-forte));
  display:flex; align-items:center; justify-content:center; color:#fff; font-weight:800; font-family:'Space Grotesk',sans-serif;
  flex-shrink:0; box-shadow:0 0 16px rgba(120,190,235,.4);
}
.sidebar-conta-nome{font-weight:700; font-size:.88rem; color:var(--texto);}
.sidebar-conta-sub{font-size:.7rem; color:var(--texto-suave); margin-top:2px;}

nav.sidebar-nav{display:flex; flex-direction:column; gap:2px; padding:8px 12px; flex:1;}
.sidebar-grupo-titulo{
  font-size:.65rem; text-transform:uppercase; letter-spacing:1.2px; color:var(--texto-suave);
  padding:16px 10px 6px; font-weight:800;
}
.nav-btn{
  display:flex; align-items:center; gap:12px; width:100%; text-align:left;
  border:1px solid transparent; background:transparent; color:var(--texto-suave);
  padding:11px 12px; border-radius:11px; font-weight:600; cursor:pointer;
  transition:.2s; font-size:.87rem; position:relative; overflow:hidden;
}
.nav-btn .ic{width:19px; height:19px; flex-shrink:0; opacity:.85;}
.nav-btn:hover{background:rgba(120,190,235,.12); color:var(--texto);}
.nav-btn:active{transform:scale(.98);}
.nav-btn.ativo{background:linear-gradient(135deg, rgba(120,190,235,.28), rgba(90,150,210,.14)); color:var(--nav-ativo-texto); border-color:rgba(120,190,235,.5);}
.nav-btn.ativo .ic{opacity:1;}
.nav-btn.destaque-premium{background:linear-gradient(135deg, rgba(234,185,78,.18), rgba(234,185,78,.06)); color:var(--dourado-contraste); border-color:rgba(234,185,78,.35);}
.nav-btn.destaque-premium:hover{background:linear-gradient(135deg, rgba(234,185,78,.28), rgba(234,185,78,.12));}
.nav-btn.sair{color:#e5879a;}

.sidebar-rodape{padding:16px 20px 22px; border-top:1px solid var(--linha); font-size:.68rem; color:var(--texto-suave); line-height:1.6;}
.sidebar-selo{display:flex; align-items:center; gap:6px; margin-bottom:8px; font-size:.7rem; color:var(--texto-suave);}

/* ============ BOTÕES ============ */
.btn{
  border:none; cursor:pointer; font-weight:700; border-radius:var(--raio-btn);
  padding:14px 26px; font-size:.92rem; color:#fff; letter-spacing:.2px;
  background:linear-gradient(135deg,var(--azul),var(--azul-forte));
  box-shadow:0 10px 26px rgba(74,159,216,.32);
  transition: transform .2s, box-shadow .2s, opacity .2s;
  position:relative; overflow:hidden;
}
.btn:hover{transform:translateY(-2px); box-shadow:0 14px 32px rgba(74,159,216,.42);}
.btn:active{transform:translateY(0) scale(.97);}
.btn::before{
  content:''; position:absolute; top:0; left:-60%; width:40%; height:100%;
  background:linear-gradient(120deg, transparent, rgba(255,255,255,.5), transparent);
  transform:skewX(-20deg); transition:left .5s;
}
.btn:hover::before{left:130%;}

/* ============ ANIMAÇÃO DE CLIQUE (ripple) EM BOTÕES E CHIPS ============ */
.onda-clique{
  position:absolute; border-radius:50%; background:rgba(255,255,255,.45);
  transform:scale(0); opacity:1; pointer-events:none;
  animation: espalhar-onda .6s ease-out forwards;
}
@keyframes espalhar-onda{
  to{ transform:scale(1); opacity:0; }
}
.btn.secundario{
  background:rgba(120,190,235,.08); color:var(--texto);
  border:1.5px solid var(--linha); box-shadow:none;
}
.btn.secundario:hover{border-color:rgba(74,159,216,.4); background:rgba(120,190,235,.14);}
.btn.perigo{background:linear-gradient(135deg,#f199ab,var(--perigo)); color:#fff;}
.btn.alerta{background:linear-gradient(135deg,#ffcf8f,var(--alerta)); color:#4a2f00;}
.btn.sucesso{background:linear-gradient(135deg,#8ce8bb,var(--sucesso)); color:#013320;}
.btn.pequeno{padding:9px 18px; font-size:.78rem;}
.btn.btn-full{width:100%;}
.btn:disabled{opacity:.45; cursor:not-allowed; transform:none;}
.btn.fantasma{
  background:transparent; color:var(--texto-suave); border:1.5px solid var(--linha); box-shadow:none;
}
.btn.fantasma:hover{border-color:rgba(74,159,216,.4); color:var(--texto);}

/* ============ LAYOUT / VIEWS ============ */
.wrap{position:relative; z-index:1; max-width:1160px; margin:0 auto; padding:0 20px 70px;}
.view{display:none; animation: entrar .5s ease;}
.view.ativo{display:block;}
@keyframes entrar{from{opacity:0; transform:translateY(16px);} to{opacity:1; transform:translateY(0);}}

.card{
  background: var(--painel);
  border:1px solid var(--linha); border-radius:var(--raio);
  box-shadow:var(--sombra); padding:26px; margin-top:20px;
  position:relative;
}
.card::before{
  content:''; position:absolute; top:0; left:22px; right:22px; height:1px;
  background:linear-gradient(90deg, transparent, rgba(120,190,235,.35), transparent);
}
.card-estreito{max-width:430px; margin:40px auto;}
.card-medio{max-width:640px; margin:20px auto;}

/* ============ TELA DE ENTRAR / CRIAR CONTA ============ */
#view-auth{padding-top:6vh;}
.auth-caixa{
  padding:1px; text-align:center; max-width:460px;
  background:linear-gradient(160deg, rgba(74,159,216,.4), rgba(8,13,20,.5) 45%, rgba(234,185,78,.14) 100%);
  box-shadow:0 30px 90px rgba(0,0,0,.55), 0 0 0 1px rgba(120,190,235,.1);
  border-radius:28px;
  animation: auth-entrar .6s cubic-bezier(.2,.8,.2,1);
}
@keyframes auth-entrar{from{opacity:0; transform:translateY(22px) scale(.98);} to{opacity:1; transform:translateY(0) scale(1);}}
.auth-caixa-interna{
  background:radial-gradient(ellipse 120% 60% at 50% -10%, rgba(74,159,216,.14), transparent 55%), linear-gradient(160deg, var(--painel), var(--painel2) 70%);
  border-radius:27px; padding:44px 30px 34px; position:relative; overflow:hidden;
}
.auth-caixa-interna::before{
  content:''; position:absolute; top:-60%; left:50%; translate:-50% 0; width:300px; height:300px;
  background:radial-gradient(circle, rgba(120,190,235,.28), transparent 70%); pointer-events:none;
}
.auth-logo{display:flex; justify-content:center; margin-bottom:20px; position:relative; z-index:1;}
.auth-logo img{
  width:70px; height:70px; object-fit:contain; padding:13px; border-radius:20px;
  background:var(--painel); box-shadow:0 0 0 1px rgba(120,190,235,.2), 0 10px 30px rgba(0,0,0,.4), 0 0 40px rgba(120,190,235,.2);
  transition:.3s;
}
.auth-titulo{
  font-family:'Space Grotesk', sans-serif; font-weight:700; font-size:2.05rem; line-height:1.15;
  background:var(--auth-titulo-grad);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  letter-spacing:-.3px; position:relative; z-index:1;
}
.auth-sub{color:var(--texto-suave); font-size:.9rem; margin-top:10px; margin-bottom:8px; position:relative; z-index:1;}
.auth-caixa label{text-align:left;}
.auth-caixa input{
  text-align:left; background:rgba(120,190,235,.06); border-color:rgba(74,159,216,.2);
}
.auth-caixa input:focus{background:rgba(120,190,235,.1); box-shadow:0 0 0 4px rgba(74,159,216,.18);}
.auth-caixa .btn-full{
  box-shadow:0 12px 30px rgba(74,159,216,.35); letter-spacing:.2px;
}
.auth-divisor{display:flex; align-items:center; gap:14px; margin:22px 0; color:var(--texto-suave); font-size:.72rem; font-family:'JetBrains Mono',monospace; letter-spacing:1px;}
.auth-divisor::before, .auth-divisor::after{content:''; flex:1; height:1px; background:var(--linha);}
.auth-links{margin-top:20px; display:flex; flex-direction:column; gap:12px; font-size:.86rem;}
.auth-links a{color:var(--texto); font-weight:700; text-decoration:underline; cursor:pointer; transition:.2s;}
.auth-links a:hover{color:var(--azul-forte);}
.auth-links-sep{color:var(--texto-suave);}
.auth-rodape{margin-top:26px; font-size:.74rem; color:var(--texto-suave); position:relative; z-index:1;}
.auth-rodape a{color:var(--texto-suave); text-decoration:underline; cursor:pointer;}

.hero{text-align:center; padding:56px 16px 20px;}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px; font-family:'JetBrains Mono',monospace;
  font-size:.7rem; letter-spacing:1.4px; text-transform:uppercase;
  color:var(--texto-suave); border:1px solid var(--linha); padding:6px 16px; border-radius:999px;
  background:rgba(120,190,235,.06); margin-bottom:18px;
}
.eyebrow::before{content:''; width:7px; height:7px; border-radius:50%; background:var(--sucesso); box-shadow:0 0 8px var(--sucesso);}
.hero h1{
  font-family:'Space Grotesk', sans-serif; font-size:2.8rem; font-weight:700; letter-spacing:-.5px; line-height:1.08;
  color:var(--texto);
}
.hero h1 .destaque{
  background:linear-gradient(100deg,var(--grad-a),var(--grad-b));
  -webkit-background-clip:text; background-clip:text; color:transparent;
  font-style:italic;
}
.hero p{color:var(--texto-suave); margin-top:14px; font-size:1.02rem; max-width:520px; margin-left:auto; margin-right:auto;}
.hero-acoes{display:flex; gap:12px; justify-content:center; margin-top:26px; flex-wrap:wrap;}

.selos-confianca{
  display:flex; gap:22px; justify-content:center; flex-wrap:wrap; margin-top:30px;
  font-size:.76rem; color:var(--texto-suave); letter-spacing:.2px;
}
.selos-confianca span{display:flex; align-items:center; gap:7px;}
.selos-confianca .ic{width:15px; height:15px; opacity:.8; flex-shrink:0;}

.estatisticas{
  display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:34px auto 0; max-width:980px;
}
.estat-item{
  background:var(--painel); border:1px solid var(--linha);
  border-radius:16px; padding:18px 14px; text-align:left;
}
.estat-item b{
  display:block; font-family:'Space Grotesk',sans-serif; font-size:1.7rem; font-weight:700; color:var(--texto);
}
.estat-item span{font-family:'JetBrains Mono',monospace; font-size:.64rem; color:var(--texto-suave); text-transform:uppercase; letter-spacing:1px;}

.painel-busca{display:flex; flex-direction:column; gap:16px; align-items:center;}
.filtros{display:flex; gap:8px; flex-wrap:wrap; justify-content:center;}
.chip{
  padding:8px 18px; border-radius:999px; background:rgba(120,190,235,.06);
  border:1px solid var(--linha); cursor:pointer; font-weight:600; color:var(--texto-suave); font-size:.85rem;
  transition:.2s; position:relative; overflow:hidden;
}
.chip:hover{border-color:rgba(74,159,216,.4); color:var(--texto);}
.chip:active{transform:scale(.94);}
.chip.ativo{background:linear-gradient(135deg,var(--azul),var(--azul-forte)); color:#fff; border-color:transparent; box-shadow:0 0 16px rgba(74,159,216,.3);}

/* ============ CAMPOS ============ */
label{font-family:'JetBrains Mono',monospace; font-weight:600; font-size:.68rem; color:var(--texto-suave); display:block; margin:16px 0 8px; letter-spacing:1.2px; text-transform:uppercase;}
input, textarea, select{
  width:100%; padding:14px 16px; border-radius:14px; border:1.5px solid var(--linha);
  background:rgba(120,190,235,.04); font-size:.92rem; color:var(--texto); transition:.2s;
  outline:none; font-family:inherit;
}
input::placeholder, textarea::placeholder{color:#a3b4c4;}
input:focus, textarea:focus, select:focus{border-color:var(--azul-forte); box-shadow:0 0 0 4px rgba(74,159,216,.16);}
select option{background:var(--painel);}
textarea{resize:vertical; min-height:100px;}
.linha-form{display:flex; gap:14px; flex-wrap:wrap;}
.linha-form>div{flex:1; min-width:200px;}
#campo-busca{max-width:480px;}

.upload-box{
  border:2px dashed var(--linha); border-radius:14px; padding:24px; text-align:center;
  cursor:pointer; transition:.2s; background:rgba(120,190,235,.03); color:var(--texto-suave); font-weight:600;
}
.upload-box:hover{background:rgba(120,190,235,.07); border-color:rgba(74,159,216,.4);}
.preview-foto{max-width:220px; max-height:150px; border-radius:12px; margin-top:14px; display:none; box-shadow:var(--sombra);}

.titulo-secao{color:var(--texto); font-size:1.15rem; margin-bottom:6px; font-family:'Space Grotesk',sans-serif; letter-spacing:.1px; font-weight:700; display:flex; align-items:center; gap:8px;}

/* ============ CARDS DE GRUPO ============ */
.grade{display:grid; grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:18px; margin-top:20px;}
.grupo-card{
  background:var(--painel);
  border-radius:16px; overflow:hidden; border:1px solid var(--linha);
  transition:.25s; display:flex; flex-direction:column;
}
.grupo-card:hover{transform:translateY(-6px); border-color:rgba(74,159,216,.5); box-shadow:0 16px 34px rgba(70,130,180,.16), 0 0 20px rgba(120,190,235,.15);}
.grupo-card.parceiro{
  border-color:rgba(234,185,78,.55);
  box-shadow:0 0 0 1px rgba(234,185,78,.2) inset, 0 12px 30px rgba(70,130,180,.1), 0 0 22px rgba(234,185,78,.1);
}
.grupo-card.parceiro:hover{border-color:rgba(234,185,78,.85); box-shadow:0 16px 34px rgba(70,130,180,.16), 0 0 26px rgba(234,185,78,.25);}
.tag.verificado{background:linear-gradient(135deg,#f3d387,var(--ouro)); color:#4a2f00; box-shadow:0 0 12px rgba(234,185,78,.45); display:inline-flex; align-items:center; gap:5px;}
.grupo-corpo h3{display:flex; align-items:center; gap:6px;}
.selo-svg{display:inline-block; vertical-align:middle; filter:drop-shadow(0 0 5px rgba(37,211,102,.5)); flex-shrink:0;}
.grupo-foto{width:100%; height:150px; object-fit:cover; background:var(--grupo-foto-fundo);}
.grupo-foto-vazia{width:100%; height:150px; display:flex; align-items:center; justify-content:center; font-size:2.2rem; background:var(--grupo-foto-fundo);}
.grupo-corpo{padding:16px; display:flex; flex-direction:column; gap:8px; flex:1;}
.tag{align-self:flex-start; font-size:.66rem; font-weight:800; padding:4px 10px; border-radius:999px; color:#fff; letter-spacing:.3px;}
.tag.wg{background:#1f9e56;}
.tag.wc{background:#0f7a68;}
.tag.tg{background:#1f8fd8;}
.tag.tc{background:#155ea3;}
.grupo-corpo h3{font-size:1.02rem; color:var(--texto);}
.grupo-corpo p{font-size:.83rem; color:var(--texto-suave); flex:1; line-height:1.4;}
.grupo-rodape{display:flex; justify-content:space-between; align-items:center; font-size:.72rem; color:var(--texto-suave); margin-top:2px;}

/* ============ TABELA ADMIN ============ */
.tabela-wrap{overflow-x:auto; margin-top:18px;}
table{width:100%; border-collapse:collapse; font-size:.84rem;}
th,td{padding:12px 10px; text-align:left; border-bottom:1px solid var(--linha);}
th{color:var(--azul-forte); font-size:.7rem; text-transform:uppercase; letter-spacing:.5px;}

/* ============ LISTAS DO PAINEL ADM (usuários, parcerias, ADMs) — cards, não tabela ============ */
.lista-cards{display:flex; flex-direction:column; gap:12px; margin-top:16px;}
.item-card{
  background:rgba(120,190,235,.03); border:1px solid var(--linha); border-radius:14px; padding:14px 16px;
}
.item-card-topo{display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap;}
.item-card-titulo{font-weight:700; color:var(--texto); font-size:.94rem; word-break:break-word;}
.item-card-meta{display:flex; flex-direction:column; gap:3px; margin-top:8px; font-size:.78rem; color:var(--texto-suave);}
.item-card-meta span b{color:var(--texto); font-weight:600;}

/* grade organizada de dados do usuário no Painel ADM */
.item-card-meta-grid{
  display:grid; grid-template-columns:repeat(2, minmax(150px,1fr)); gap:10px 16px;
  margin-top:12px; padding:12px 14px; background:rgba(120,190,235,.04);
  border:1px solid var(--linha); border-radius:12px;
}
.item-card-meta-grid span{display:flex; flex-direction:column; gap:2px; font-size:.82rem; color:var(--texto); word-break:break-word;}
.item-card-meta-grid span b{
  font-family:'JetBrains Mono',monospace; font-size:.62rem; color:var(--texto-suave);
  text-transform:uppercase; letter-spacing:.6px; font-weight:700;
}
.meta-senha .senha-mascarada{cursor:pointer; letter-spacing:1.5px; transition:.15s; border-bottom:1px dashed var(--texto-suave);}
.meta-senha .senha-mascarada:hover{color:var(--azul-forte); border-color:var(--azul-forte);}
@media (max-width:480px){.item-card-meta-grid{grid-template-columns:1fr;}}
.item-card-acoes{display:flex; flex-wrap:wrap; gap:8px; margin-top:12px;}
.item-card-acoes .btn{padding:8px 14px; font-size:.74rem; white-space:nowrap;}
tr:hover{background:rgba(120,190,235,.05);}
.status-pill{padding:4px 12px; border-radius:999px; font-size:.7rem; font-weight:800; color:#fff; display:inline-block;}
.status-ativo{background:var(--sucesso); color:#013320;}
.status-banido{background:var(--perigo);}
.status-congelado{background:var(--alerta); color:#4a2f00;}
.status-pendente{background:var(--alerta); color:#4a2f00;}
.status-recusado{background:var(--perigo);}
.status-aprovado{background:var(--sucesso); color:#013320;}
.status-bloqueado{background:#7c93e0;}
.tag.destaque{background:linear-gradient(135deg,#ffb877,#ff9a52); box-shadow:0 0 12px rgba(255,154,82,.4);}
.grupo-card.destacado{box-shadow:0 0 0 2px #ff9a52, 0 8px 24px rgba(255,154,82,.2);}
.acoes-admin{display:flex; gap:6px; flex-wrap:wrap;}

/* ============ PERFIL ============ */
.perfil-topo-card{padding:0; overflow:hidden;}
.perfil-capa{
  height:96px; position:relative;
  background:
    radial-gradient(120% 220% at 12% 0%, rgba(120,190,235,.6), transparent 62%),
    radial-gradient(90% 160% at 90% 10%, rgba(234,185,78,.22), transparent 55%),
    linear-gradient(135deg, var(--violeta-forte), var(--perfil-capa-fim) 75%);
}
.perfil-capa::after{
  content:''; position:absolute; inset:0;
  background-image: repeating-linear-gradient(115deg, rgba(255,255,255,.15) 0 2px, transparent 2px 26px);
  mix-blend-mode:overlay;
}
.perfil-cabecalho{display:flex; align-items:flex-end; gap:16px; padding:0 24px; margin-top:-40px; position:relative; z-index:2; flex-wrap:wrap;}
.avatar-anel{
  padding:3px; border-radius:50%; flex-shrink:0;
  background:linear-gradient(135deg,var(--azul),var(--azul-forte));
  box-shadow:0 14px 30px rgba(70,130,180,.3), 0 0 0 1px rgba(255,255,255,.6);
  transition:.3s;
}
.avatar-anel.avatar-anel-parceiro{background:linear-gradient(135deg,var(--ouro),#25D366 65%,var(--azul));}
.avatar{
  width:80px; height:80px; border-radius:50%; background:linear-gradient(135deg,var(--azul),var(--azul-forte));
  display:flex; align-items:center; justify-content:center; color:#fff; font-size:1.9rem; font-weight:800;
  font-family:'Space Grotesk',sans-serif; border:3px solid var(--painel);
}
.perfil-titulos{display:flex; flex-direction:column; gap:7px; padding-bottom:8px; min-width:0;}
#perfil-nome{display:flex; align-items:center; gap:6px; color:var(--texto); font-family:'Space Grotesk',sans-serif; font-size:1.15rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.perfil-premium-selo{filter:drop-shadow(0 0 5px rgba(255,157,79,.6));}
.perfil-id-chip{
  display:inline-flex; align-items:center; gap:7px; margin:14px 0 0 auto;
  background:rgba(120,190,235,.06); border:1px solid var(--linha); padding:6px 13px; border-radius:999px;
}
.perfil-id-chip span{font-family:'JetBrains Mono',monospace; font-size:.6rem; text-transform:uppercase; letter-spacing:.8px; color:var(--texto-suave);}
.perfil-id-chip b{font-family:'JetBrains Mono',monospace; font-size:.76rem; color:var(--dourado-contraste); font-weight:700; letter-spacing:.3px;}
.perfil-stats{display:grid; grid-template-columns:1fr; gap:10px; padding:20px 24px 24px;}
@media(min-width:520px){.perfil-stats{grid-template-columns:repeat(3,1fr);}}
.perfil-stat-card{
  display:flex; align-items:center; gap:12px; background:rgba(120,190,235,.04);
  border:1px solid var(--linha); border-radius:14px; padding:12px 14px;
}
.perfil-stat-icone{
  width:34px; height:34px; border-radius:10px; background:rgba(120,190,235,.16);
  display:flex; align-items:center; justify-content:center; font-size:1rem; flex-shrink:0;
}
.perfil-stat-rotulo{display:block; font-size:.63rem; text-transform:uppercase; letter-spacing:.6px; color:var(--texto-suave); font-weight:700;}
.perfil-stat-valor{display:block; font-size:.86rem; color:var(--texto); font-weight:600; margin-top:3px; word-break:break-word;}
.parceria-ativa{display:flex; align-items:center; gap:12px; border-left-color:#25D366 !important;}
.parceria-ativa .selo-svg{flex-shrink:0;}

.chat-box{
  background:rgba(120,190,235,.03); border-radius:14px; padding:16px; max-height:320px; overflow-y:auto;
  display:flex; flex-direction:column; gap:10px; border:1px solid var(--linha); margin-top:12px;
}
.bolha-msg{max-width:75%; padding:11px 15px; border-radius:14px; font-size:.86rem; line-height:1.4;}
.bolha-msg.admin{align-self:flex-start; background:var(--painel2); border:1px solid var(--linha); color:var(--texto);}
.bolha-msg.user{align-self:flex-end; background:linear-gradient(135deg,var(--azul),var(--azul-forte)); color:#fff;}
.bolha-msg small{display:block; margin-top:5px; opacity:.65; font-size:.66rem;}
.chat-input-linha{display:flex; gap:10px; margin-top:12px;}

.notif-item{
  background:rgba(120,190,235,.03); border-left:3px solid var(--azul-forte); padding:13px 15px; border-radius:10px; margin-top:12px;
  animation: entrar .4s ease; font-size:.87rem;
}
.notif-item small{color:var(--texto-suave); display:block; margin-top:4px;}

/* ============ MODAL ============ */
.modal-fundo{
  display:none; position:fixed; inset:0; background:rgba(20,50,80,.35); z-index:200;
  align-items:center; justify-content:center; padding:16px; backdrop-filter:blur(4px);
}
.modal-fundo.ativo{display:flex;}
.modal-caixa{
  background:linear-gradient(160deg, var(--painel), var(--painel2)); border-radius:18px; padding:28px; max-width:420px; width:100%;
  box-shadow:var(--sombra); border:1px solid var(--linha); animation: entrar .3s ease;
}
.modal-caixa h3{color:var(--texto); margin-bottom:10px; font-family:'Space Grotesk',sans-serif;}
.modal-sub{font-size:.85rem; color:var(--texto-suave); margin-bottom:10px;}
.fechar-x{float:right; cursor:pointer; font-size:1.3rem; color:var(--texto-suave);}
.fechar-x:hover{color:var(--perigo);}

.centro-vazio{text-align:center; padding:60px 20px; color:var(--texto-suave);}
.centro-vazio .emoji{font-size:2.6rem; display:block; margin-bottom:10px;}

.msg-flutuante{
  position:fixed; top:20px; right:20px; z-index:999; padding:15px 22px; border-radius:12px;
  color:#fff; font-weight:700; box-shadow:0 14px 30px rgba(70,130,180,.3); animation: desliza .35s ease;
  border:1px solid rgba(255,255,255,.35);
}
@keyframes desliza{from{transform:translateX(120%);} to{transform:translateX(0);}}

.rodape-site{position:relative; z-index:1; text-align:center; padding:30px 10px; color:var(--texto-suave); font-size:.8rem; border-top:1px solid var(--linha);}

/* ============ ASSINAR PREMIUM ============ */
.premium-hero{text-align:center; padding:34px 16px 8px;}
.premium-hero .eyebrow{
  color:var(--premium-eyebrow-texto); border-color:rgba(74,159,216,.35); background:rgba(74,159,216,.08);
}
.premium-status-card{
  max-width:640px; margin:22px auto 0; text-align:center; border-color:rgba(74,159,216,.3);
  background:linear-gradient(160deg, rgba(120,190,235,.1), var(--painel2));
}
.plano-card{
  max-width:420px; margin:26px auto 0; text-align:center; position:relative; overflow:hidden;
  border-color:rgba(74,159,216,.35); background:var(--plano-card-fundo);
}
.plano-card::before{
  content:''; position:absolute; top:-60%; left:-20%; width:140%; height:140%;
  background:radial-gradient(circle, rgba(120,190,235,.22), transparent 65%); pointer-events:none;
}
.plano-preco{font-family:'Space Grotesk',sans-serif; font-size:2.6rem; font-weight:800; color:var(--texto); margin:14px 0 2px; position:relative;}
.plano-preco span{font-size:.95rem; color:var(--texto-suave); font-weight:600;}
.plano-lista{list-style:none; text-align:left; margin:22px 0; display:flex; flex-direction:column; gap:12px; position:relative;}
.plano-lista li{display:flex; gap:10px; align-items:flex-start; font-size:.88rem; color:var(--prata); line-height:1.4;}
.plano-lista li .ok{color:var(--sucesso); font-weight:800; flex-shrink:0;}
.btn.violeta{background:linear-gradient(135deg,var(--violeta),var(--violeta-forte)); box-shadow:0 8px 24px rgba(92,127,209,.32), inset 0 1px 0 rgba(255,255,255,.25);}
.btn.violeta:hover{box-shadow:0 14px 32px rgba(92,127,209,.45), inset 0 1px 0 rgba(255,255,255,.3);}

/* ============ PÁGINAS DE TEXTO (Termos) ============ */
/* ============ FERRAMENTAS GRÁTIS ============ */
.ferramentas-grade{display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:18px; margin-top:10px; max-width:1180px; margin-left:auto; margin-right:auto;}
.ferramentas-titulo-secao{max-width:1180px; margin:34px auto 0; justify-content:center; text-align:center;}
.ferramenta-card{display:flex; flex-direction:column;}
.ferramenta-card h3{font-family:'Space Grotesk',sans-serif; font-size:1.02rem; color:var(--texto); display:flex; align-items:center; gap:8px; margin:0 0 4px;}
.ferramenta-card .ferramenta-desc{color:var(--texto-suave); font-size:.82rem; line-height:1.5; margin-bottom:4px;}
.ferramenta-card .linha-form{margin-top:2px;}
.ferramenta-card input, .ferramenta-card select{margin-top:0;}
.ferramenta-card .btn{margin-top:14px;}
.ferramenta-resultado{
  margin-top:14px; padding:12px 14px; border-radius:12px; border:1px solid var(--linha);
  background:rgba(120,190,235,.05); font-size:.83rem; color:var(--prata); line-height:1.6; display:none;
}
.ferramenta-resultado.ativo{display:block;}
.ferramenta-resultado.erro{border-color:rgba(255,92,114,.5); background:rgba(255,92,114,.08); color:#ffb3bd;}
.ferramenta-resultado b{color:var(--texto);}
.ferramenta-resultado .qr-img{display:block; margin-top:8px; border-radius:10px; background:#fff; padding:8px; max-width:160px;}
.ferramenta-resultado .linha-copia{display:flex; gap:8px; align-items:center; margin-top:8px; flex-wrap:wrap;}
.ferramenta-carregando{opacity:.6; pointer-events:none;}
.bloco-codigo{
  font-family:'JetBrains Mono',monospace; font-size:.74rem; background:rgba(0,0,0,.28);
  border:1px solid var(--linha); border-radius:10px; padding:10px 12px; margin:8px 0; white-space:pre-wrap;
  word-break:break-all; color:#bcd6ea;
}
html.tema-claro .bloco-codigo{background:rgba(0,0,0,.06); color:#2a3a4a;}
.doc-api-item{border-top:1px solid var(--linha); padding:16px 0;}
.doc-api-item:first-child{border-top:none; padding-top:8px;}
.doc-api-item h4{font-family:'Space Grotesk',sans-serif; font-size:.92rem; color:var(--azul-forte); margin:0 0 4px; display:flex; align-items:center; gap:7px;}
.doc-api-item p{color:var(--texto-suave); font-size:.82rem; line-height:1.6; margin:4px 0;}
.doc-api-item .tag-metodo{font-family:'JetBrains Mono',monospace; font-size:.64rem; font-weight:700; padding:2px 8px; border-radius:6px; background:rgba(74,159,216,.18); color:var(--azul-forte); letter-spacing:.5px;}
.doc-api-item a{color:var(--azul-forte); text-decoration:underline;}

.pagina-texto{max-width:760px; margin:20px auto;}
.pagina-texto h2{font-family:'Space Grotesk',sans-serif; color:var(--texto); font-size:1.4rem; margin-bottom:6px;}
.pagina-texto .atualizado{font-size:.76rem; color:var(--texto-suave); margin-bottom:20px; display:block;}
.pagina-texto h3{color:var(--azul-forte); font-size:.98rem; margin:24px 0 8px; font-weight:700;}
.pagina-texto p, .pagina-texto li{color:var(--prata); font-size:.9rem; line-height:1.7;}
.pagina-texto ul{padding-left:20px; margin:8px 0;}
.pagina-texto ul li{margin-bottom:6px;}

@media(max-width:760px){
  .hero h1{font-size:1.9rem;}
  .pill-conta span{display:none;}
  .estatisticas{grid-template-columns:repeat(2,1fr) !important;}
}

/* ============ TEMA CLARO (opcional, alternável pelo usuário) ============ */
html.tema-claro{
  --preto:#0f2438;
  --preto2:#f6fafd;
  --painel:#ffffff;
  --painel2:#f3f9fd;
  --linha:rgba(45,110,170,.14);
  --prata:#3d5266;
  --texto:#1f3247;
  --texto-suave:#65798d;
  --sombra: 0 20px 48px rgba(70,130,180,.14);
  --corpo-fundo: radial-gradient(ellipse 120% 70% at 50% -10%, rgba(150,205,240,.45), transparent 55%), linear-gradient(180deg, #eef7fc 0%, #f8fcfe 45%, #ffffff 100%);
  --topo-fundo: rgba(255,255,255,.78);
  --sidebar-fundo: linear-gradient(180deg, #ffffff 0%, #f4faff 100%);
  --grupo-foto-fundo: linear-gradient(135deg,#dbeefb,#c3e2f5);
  --perfil-capa-fim:#cfe8fa;
  --plano-card-fundo: linear-gradient(160deg, #eaf6fd, #ffffff);
  --auth-titulo-grad: linear-gradient(100deg,#2a5f8a, #4a9fd8 50%, var(--azul-glow));
  --nav-ativo-texto:#1f3247;
  --premium-eyebrow-texto:#2a5f8a;
  --dourado-contraste:#b8862c;
}
html.tema-claro .vinheta-sangue{box-shadow: inset 0 0 160px rgba(140,195,235,.16), inset 0 0 60px rgba(120,180,230,.08);}
html.tema-claro #dna{opacity:.35;}
html.tema-claro #fumaca{opacity:.3;}
html.tema-claro .grade-fundo{
  background-image:
    linear-gradient(rgba(70,140,190,.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(70,140,190,.045) 1px, transparent 1px);
}
html.tema-claro .brilho{background: radial-gradient(circle, rgba(120,190,235,.16), transparent 70%);}
html.tema-claro .brilho.b2{background: radial-gradient(circle, rgba(140,200,240,.2), transparent 70%);}
html.tema-claro .botao-tema .ic-lua{display:none;}
html.tema-claro .botao-tema .ic-sol{display:inline;}
.botao-tema .ic-sol{display:none;}

/* ============ FAVORITOS (grupos salvos) ============ */
.botao-favorito{
  position:absolute; top:10px; right:10px; z-index:2;
  width:34px; height:34px; border-radius:50%; border:none; cursor:pointer;
  background:rgba(8,13,20,.55); backdrop-filter:blur(4px);
  display:flex; align-items:center; justify-content:center; font-size:1.05rem;
  transition:.2s; box-shadow:0 4px 12px rgba(0,0,0,.3);
}
.botao-favorito:hover{transform:scale(1.12); background:rgba(8,13,20,.75);}
.botao-favorito.ativo{color:#ff6b81;}
.grupo-card{position:relative;}
.grupo-foto-wrap{position:relative;}

/* ============ VISTOS RECENTEMENTE ============ */
.recentes-faixa{display:flex; gap:12px; overflow-x:auto; padding:4px 2px 10px; margin-top:6px; scrollbar-width:thin;}
.recente-item{
  flex-shrink:0; width:150px; background:var(--painel); border:1px solid var(--linha);
  border-radius:12px; overflow:hidden; cursor:pointer; transition:.2s;
}
.recente-item:hover{border-color:rgba(74,159,216,.5); transform:translateY(-3px);}
.recente-item img, .recente-item .grupo-foto-vazia{width:100%; height:72px; object-fit:cover; font-size:1.4rem;}
.recente-item span{display:block; padding:8px 10px; font-size:.74rem; color:var(--texto); font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

/* ============ SINO DE NOTIFICAÇÕES ============ */
.botao-sino{
  position:relative; display:flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius:11px; flex-shrink:0;
  background:rgba(120,190,235,.1); border:1px solid var(--linha); cursor:pointer;
  color:var(--texto); font-size:1.05rem; transition:.2s;
}
.botao-sino:hover{border-color:var(--azul-forte); background:rgba(120,190,235,.18);}
.badge-sino{position:absolute; top:-4px; right:-2px;}
.painel-notificacoes{
  position:absolute; top:60px; right:16px; width:320px; max-width:88vw; max-height:420px;
  overflow-y:auto; background:var(--painel); border:1px solid var(--linha); border-radius:16px;
  box-shadow:var(--sombra); z-index:400; padding:10px;
}
.painel-notificacoes .notif-item{margin-top:0; margin-bottom:8px;}
.notif-item.notif-nova{border-color:rgba(74,159,216,.5); background:rgba(120,190,235,.08);}

/* ============ AVALIAÇÃO POR ESTRELAS ============ */
.avaliacao-linha{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.estrelas{display:flex; gap:2px;}
.estrela{font-size:1.05rem; color:rgba(140,190,235,.25); cursor:pointer; transition:.15s; user-select:none;}
.estrela:hover{transform:scale(1.15);}
.estrela.cheia{color:var(--ouro); text-shadow:0 0 8px rgba(234,185,78,.5);}
.avaliacao-media{font-size:.74rem; color:var(--texto-suave); font-weight:700;}

/* ============ RANKING "TOP DA SEMANA" ============ */
.top-semana-faixa{display:flex; gap:14px; overflow-x:auto; padding:6px 2px 10px; margin-top:8px; scrollbar-width:thin;}
.top-semana-card{
  position:relative; flex-shrink:0; width:190px; background:var(--painel); border:1px solid rgba(234,185,78,.3);
  border-radius:14px; overflow:hidden; cursor:pointer; transition:.2s;
  box-shadow:0 0 0 1px rgba(234,185,78,.08), 0 10px 26px rgba(0,0,0,.3);
}
.top-semana-card:hover{transform:translateY(-4px); border-color:rgba(234,185,78,.6);}
.top-semana-card img, .top-semana-card .grupo-foto-vazia{width:100%; height:96px; object-fit:cover; font-size:1.6rem;}
.top-semana-medalha{
  position:absolute; top:8px; left:8px; font-size:1.2rem; z-index:2;
  filter:drop-shadow(0 2px 4px rgba(0,0,0,.6));
}
.top-semana-info{padding:9px 11px;}
.top-semana-info strong{display:block; font-size:.82rem; color:var(--texto); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.top-semana-info span{display:block; font-size:.68rem; color:var(--ouro); margin-top:2px; font-weight:700;}
