/* ===== Tema público — escuro, dourado, Poppins ===== */
:root {
  --bg: #0b0a0e; --bg2: #110f15; --card: #16141b; --card2: #1d1a23; --linha: rgba(255,255,255,.08);
  --ouro: #c9a96e; --ouro2: #e9d5a8; --texto: #efeaf3; --suave: #a59eb0; --fraco: #6e6779;
  --ok: #2fbf8f; --erro: #e46b58; --aviso: #e0b34f; --raio: 14px;
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: var(--bg); color: var(--texto); font-family: 'Poppins', system-ui, sans-serif; font-size: 15px; line-height: 1.6; -webkit-font-smoothing: antialiased; }
a { color: var(--ouro2); text-decoration: none; }
a:hover { color: #fff; }
img { max-width: 100%; display: block; }
h1, h2, h3 { line-height: 1.25; font-weight: 600; margin: 0 0 .5em; }
code { background: var(--card2); padding: 2px 6px; border-radius: 6px; font-size: .9em; }
.container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 16px; }
.conteudo { padding-top: 24px; padding-bottom: 56px; min-height: 60vh; }
.estreito { max-width: 560px; }
.ico { width: 18px; height: 18px; flex: none; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; vertical-align: -3px; }
.ico-grande { width: 40px; height: 40px; stroke-width: 1.3; }
.sub { color: var(--suave); margin-top: -4px; }

/* Topo */
.topo { position: sticky; top: 0; z-index: 30; background: rgba(11,10,14,.86); backdrop-filter: blur(14px); border-bottom: 1px solid var(--linha); }
.topo-in { display: flex; align-items: center; justify-content: space-between; height: 64px; }
.logo { font-size: 21px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: var(--ouro); }
.logo-grande { font-size: 30px; }
.nav { display: flex; gap: 18px; align-items: center; }
.nav a { color: var(--suave); font-size: 14px; display: inline-flex; gap: 6px; align-items: center; }
.nav a:hover { color: var(--texto); }

/* Botões */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 22px; border-radius: 999px; border: 1px solid var(--linha); background: var(--card2); color: var(--texto); font: inherit; font-weight: 500; cursor: pointer; transition: .2s; text-align: center; }
.btn:hover { border-color: var(--ouro); color: #fff; }
.btn-ouro, .nav .btn-ouro { background: linear-gradient(135deg, #dcc18a, #ad8a4c); color: #1b150b; border: 0; }
.btn-ouro:hover { filter: brightness(1.08); color: #1b150b; }
.btn-sm { padding: 8px 16px; font-size: 13px; }
.btn-bloco { width: 100%; }
.btn-perigo { border-color: rgba(228,107,88,.45); color: var(--erro); }
.btn:disabled { opacity: .45; cursor: not-allowed; filter: none; }
button.link { background: none; border: 0; color: var(--fraco); font: inherit; cursor: pointer; text-decoration: underline; padding: 0; }

/* Alertas e pílulas */
.alerta { padding: 12px 16px; border-radius: 10px; margin: 0 0 16px; border: 1px solid; font-size: 14px; }
.alerta ul { margin: 0; padding-left: 18px; }
.alerta-ok { background: rgba(47,191,143,.1); border-color: rgba(47,191,143,.35); color: #a8ecd3; }
.alerta-erro { background: rgba(228,107,88,.1); border-color: rgba(228,107,88,.35); color: #f5b9ae; }
.alerta-aviso { background: rgba(224,179,79,.1); border-color: rgba(224,179,79,.35); color: #f2d797; }
.pill { display: inline-block; padding: 2px 10px; border-radius: 999px; font-size: 12px; font-weight: 500; }
.pill-ok { background: rgba(47,191,143,.15); color: #7fe0bd; }
.pill-erro { background: rgba(228,107,88,.15); color: #f1a596; }
.pill-aviso { background: rgba(224,179,79,.15); color: #efcf86; }
.pill-neutro { background: rgba(255,255,255,.08); color: var(--suave); }
.pill-ouro { background: var(--ouro); color: #1b150b; }

/* Hero e busca */
.hero { padding: 48px 0 28px; background: radial-gradient(1000px 360px at 50% -80px, rgba(201,169,110,.16), transparent 70%); border-bottom: 1px solid var(--linha); margin-bottom: 24px; }
.hero h1 { font-size: clamp(28px, 5vw, 46px); font-weight: 300; letter-spacing: -.01em; }
.hero h1 em { font-style: normal; font-weight: 600; color: var(--ouro2); }
.hero-pre { color: var(--ouro); text-transform: uppercase; letter-spacing: .2em; font-size: 12px; margin: 0 0 10px; }
.busca { display: grid; grid-template-columns: 1fr 220px auto; gap: 10px; margin-top: 22px; }
.busca-campo { display: flex; align-items: center; gap: 10px; background: var(--card); border: 1px solid var(--linha); border-radius: 999px; padding: 0 18px; color: var(--fraco); }
.busca-campo input { border: 0; background: none; padding: 13px 0; color: var(--texto); font: inherit; width: 100%; outline: none; }
.busca select { border-radius: 999px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.chip { padding: 6px 14px; border-radius: 999px; background: var(--card); border: 1px solid var(--linha); color: var(--suave); font-size: 13px; }
.chip small { color: var(--fraco); margin-left: 4px; }
.chip.ativo, .chip:hover { border-color: var(--ouro); color: var(--ouro2); }
.chip-limpar { border-style: dashed; }

/* Grade de anúncios */
.lista-topo { color: var(--fraco); font-size: 13px; margin-bottom: 14px; }
.grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.card-perfil { position: relative; display: block; border-radius: var(--raio); overflow: hidden; background: var(--card); border: 1px solid var(--linha); transition: transform .25s, border-color .25s; color: var(--texto); }
.card-perfil:hover { transform: translateY(-3px); border-color: rgba(201,169,110,.5); color: var(--texto); }
.card-perfil.nivel-2 { border-color: rgba(201,169,110,.55); box-shadow: 0 0 0 1px rgba(201,169,110,.25), 0 14px 40px -18px rgba(201,169,110,.5); }
.card-img { aspect-ratio: 3 / 4; background: var(--card2); }
.card-img img { width: 100%; height: 100%; object-fit: cover; }
.card-info { position: absolute; inset: auto 0 0 0; padding: 40px 14px 14px; background: linear-gradient(transparent, rgba(8,7,10,.92) 55%); }
.card-nome { font-weight: 600; font-size: 16px; display: flex; align-items: center; gap: 6px; }
.card-meta { color: var(--suave); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.card-valor { color: var(--ouro2); font-weight: 600; font-size: 14px; margin-top: 2px; }
.card-valor small { color: var(--fraco); font-weight: 400; }
.verif { color: var(--ouro); display: inline-flex; }
.verif .ico { width: 16px; height: 16px; }
.selo { position: absolute; top: 10px; left: 10px; background: rgba(11,10,14,.75); border: 1px solid rgba(201,169,110,.6); color: var(--ouro2); font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: 3px 10px; border-radius: 999px; display: inline-flex; align-items: center; gap: 4px; backdrop-filter: blur(6px); }
.selo .ico { width: 12px; height: 12px; }
.selo-top { background: linear-gradient(135deg, #dcc18a, #ad8a4c); color: #1b150b; border: 0; }
.selo-inline { position: static; margin-bottom: 10px; }
.paginacao { display: flex; justify-content: center; align-items: center; gap: 18px; margin-top: 32px; color: var(--fraco); font-size: 14px; }
.paginacao a { padding: 8px 18px; border: 1px solid var(--linha); border-radius: 999px; }
.vazio { text-align: center; padding: 64px 16px; color: var(--suave); }
.vazio .ico { color: var(--fraco); margin-bottom: 8px; }

/* Perfil */
.voltar { display: inline-block; color: var(--suave); font-size: 14px; margin-bottom: 16px; }
.perfil { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 28px; align-items: start; }
.galeria-principal { border-radius: var(--raio); overflow: hidden; background: var(--card); aspect-ratio: 4 / 5; }
.galeria-principal img { width: 100%; height: 100%; object-fit: cover; }
.galeria-vazia { display: grid; place-items: center; color: var(--fraco); }
.galeria-miniaturas { display: grid; grid-template-columns: repeat(auto-fill, minmax(76px, 1fr)); gap: 8px; margin-top: 10px; }
.miniatura { position: relative; padding: 0; border: 2px solid transparent; border-radius: 10px; overflow: hidden; cursor: pointer; aspect-ratio: 1; background: var(--card); }
.miniatura img { width: 100%; height: 100%; object-fit: cover; opacity: .7; transition: .2s; }
.miniatura.ativa { border-color: var(--ouro); }
.miniatura.ativa img, .miniatura:hover img { opacity: 1; }
.mini-tag { position: absolute; inset: auto 0 0; background: rgba(0,0,0,.7); color: var(--aviso); font-size: 10px; }
.perfil-info { position: sticky; top: 84px; background: var(--card); border: 1px solid var(--linha); border-radius: var(--raio); padding: 24px; }
.perfil-info h1 { font-size: 30px; margin-bottom: 4px; }
.verificada { color: var(--ouro2); font-size: 13px; display: flex; align-items: center; gap: 6px; margin: 0 0 12px; }
.perfil-meta { color: var(--suave); margin: 2px 0; display: flex; gap: 6px; align-items: center; }
.perfil-valor { font-size: 26px; font-weight: 600; color: var(--ouro2); margin: 14px 0; }
.perfil-valor small { font-size: 14px; color: var(--fraco); font-weight: 400; }
.tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 12px 0; }
.tag { font-size: 13px; padding: 5px 12px; border-radius: 999px; background: var(--card2); border: 1px solid var(--linha); color: var(--suave); display: inline-flex; gap: 6px; align-items: center; }
.tag .ico { width: 15px; height: 15px; }
.perfil-dados { margin: 14px 0; display: grid; gap: 10px; }
.perfil-dados div { display: grid; gap: 2px; }
.perfil-dados dt { color: var(--fraco); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; display: flex; gap: 6px; align-items: center; }
.perfil-dados dd { margin: 0; }
.contatos { display: grid; gap: 10px; margin-top: 18px; }
.dica { color: var(--fraco); font-size: 12.5px; margin: 12px 0 0; }
.link-denuncia { display: inline-flex; gap: 6px; align-items: center; color: var(--fraco); font-size: 13px; margin-top: 16px; }
.link-denuncia:hover { color: var(--erro); }
.perfil-sobre { margin-top: 32px; max-width: 780px; }
.perfil-sobre p { color: #d9d3df; }

/* Formulários */
.form-card { background: var(--card); border: 1px solid var(--linha); border-radius: var(--raio); padding: 28px; }
.form-card h1 { font-size: 26px; }
.form { display: grid; gap: 14px; }
.form label { display: grid; gap: 6px; font-size: 13.5px; color: var(--suave); }
.form label small { color: var(--fraco); font-size: 12px; }
input[type=text], input[type=email], input[type=password], input[type=date], input[type=tel], input[type=search], input[type=number], select, textarea {
  width: 100%; background: var(--bg2); border: 1px solid var(--linha); border-radius: 10px; padding: 12px 14px; color: var(--texto); font: inherit; font-size: 15px; outline: none; transition: border-color .2s;
}
input:focus, select:focus, textarea:focus { border-color: var(--ouro); }
select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--fraco) 50%), linear-gradient(135deg, var(--fraco) 50%, transparent 50%); background-position: calc(100% - 20px) 52%, calc(100% - 15px) 52%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 36px; }
textarea { resize: vertical; }
input[type=date]::-webkit-calendar-picker-indicator { filter: invert(.7); }
.linha-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.linha-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 14px; }
.form label.check, label.check { display: flex; grid-template-columns: none; gap: 10px; align-items: flex-start; color: var(--texto); font-size: 14px; cursor: pointer; }
.check input { accent-color: var(--ouro); width: 18px; height: 18px; margin: 2px 0 0; flex: none; }
.radios { border: 0; padding: 0; margin: 0; display: grid; gap: 8px; }
.radios legend { color: var(--suave); font-size: 13.5px; margin-bottom: 6px; }
.radios-linha { display: flex; flex-wrap: wrap; gap: 18px; }
.radios-linha legend { width: 100%; }
.form-rodape { color: var(--fraco); font-size: 14px; text-align: center; margin: 18px 0 0; }

/* Portão 18+ */
.pagina-gate { background: radial-gradient(800px 500px at 50% 0, rgba(201,169,110,.18), transparent 70%), var(--bg); }
.gate { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
.gate-card { max-width: 480px; text-align: center; background: rgba(22,20,27,.85); border: 1px solid var(--linha); border-radius: 20px; padding: 36px 28px; }
.gate-18 { display: inline-block; margin: 18px 0 14px; border: 1px solid var(--ouro); color: var(--ouro2); border-radius: 999px; padding: 4px 16px; font-weight: 600; letter-spacing: .1em; }
.gate-card h1 { font-size: 22px; }
.gate-card p { color: var(--suave); font-size: 14px; }
.gate-acoes { display: grid; gap: 10px; margin: 22px 0 14px; }
.gate-rodape { font-size: 12px !important; color: var(--fraco) !important; }

/* Painel */
.abas { display: flex; gap: 4px; overflow-x: auto; border-bottom: 1px solid var(--linha); margin-bottom: 24px; scrollbar-width: none; }
.abas a, .abas button { display: inline-flex; align-items: center; gap: 8px; padding: 12px 16px; color: var(--suave); border-bottom: 2px solid transparent; white-space: nowrap; font: inherit; font-size: 14px; background: none; border-top: 0; border-left: 0; border-right: 0; cursor: pointer; }
.abas a.ativa { color: var(--ouro2); border-bottom-color: var(--ouro); }
.abas a:hover, .abas button:hover { color: var(--texto); }
.abas-sair { margin-left: auto; }
.titulo-pagina { font-size: 24px; margin-bottom: 18px; }
.stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 18px; }
.stat { background: var(--card); border: 1px solid var(--linha); border-radius: var(--raio); padding: 16px; display: grid; gap: 4px; }
.stat span { color: var(--fraco); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; display: flex; gap: 6px; align-items: center; }
.stat strong { font-size: 20px; font-weight: 600; }
.stat small { color: var(--suave); font-size: 12.5px; }
.caixa { background: var(--card); border: 1px solid var(--linha); border-radius: var(--raio); padding: 22px; margin-bottom: 18px; }
.caixa h2 { font-size: 18px; display: flex; justify-content: space-between; align-items: baseline; }
.caixa h2 small { color: var(--fraco); font-weight: 400; font-size: 13px; }
.caixa-perigo { border-color: rgba(228,107,88,.3); }
.etapas { list-style: none; padding: 0; margin: 0 0 16px; display: grid; gap: 8px; }
.etapas li { display: grid; grid-template-columns: 40px 1fr auto; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 10px; background: var(--bg2); }
.etapas b { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--card2); color: var(--fraco); }
.etapas li.feita b { background: rgba(47,191,143,.15); color: var(--ok); }
.etapas strong { display: block; font-weight: 500; }
.etapas small { color: var(--fraco); }
.etapas a { font-size: 13px; }
.acoes-linha { display: flex; flex-wrap: wrap; gap: 10px; }
.regras { color: var(--suave); font-size: 13.5px; padding-left: 18px; margin: 0 0 16px; }
.upload { display: grid; gap: 12px; }
.upload-area { position: relative; display: grid !important; place-items: center; gap: 6px; text-align: center; padding: 28px 16px; border: 1.5px dashed rgba(201,169,110,.4); border-radius: var(--raio); background: var(--bg2); cursor: pointer; color: var(--suave); transition: .2s; }
.upload-area:hover { border-color: var(--ouro); }
.upload-area .ico { color: var(--ouro); }
.upload-area strong { color: var(--texto); font-weight: 500; }
.upload-area input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.grade-fotos { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.foto-item { position: relative; border-radius: 12px; overflow: hidden; aspect-ratio: 3 / 4; background: var(--card); border: 1px solid var(--linha); }
.foto-item img { width: 100%; height: 100%; object-fit: cover; }
.foto-item > .pill { position: absolute; top: 8px; left: 8px; }
.foto-capa { left: auto !important; right: 8px; }
.foto-acoes { position: absolute; inset: auto 0 0 0; display: flex; justify-content: flex-end; gap: 6px; padding: 8px; background: linear-gradient(transparent, rgba(0,0,0,.8)); }
.foto-acoes button { width: 34px; height: 34px; border-radius: 50%; border: 0; background: rgba(255,255,255,.12); color: #fff; cursor: pointer; display: grid; place-items: center; }
.foto-acoes button:hover { background: var(--ouro); color: #1b150b; }
.verif-ok { display: flex; gap: 18px; align-items: center; }
.verif-ok .ico { color: var(--ok); }
.verif-aguardando .ico { color: var(--aviso); }
.verif-ok p { color: var(--suave); margin: 0; }

/* Planos e Pix */
.planos { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin-bottom: 18px; }
.plano { background: var(--card); border: 1px solid var(--linha); border-radius: var(--raio); padding: 22px; display: flex; flex-direction: column; }
.plano.nivel-2 { border-color: rgba(201,169,110,.6); background: linear-gradient(180deg, rgba(201,169,110,.08), var(--card) 40%); }
.plano h3 { font-size: 18px; }
.plano-preco { font-size: 26px; font-weight: 600; color: var(--ouro2); }
.plano-preco small { font-size: 13px; color: var(--fraco); font-weight: 400; }
.plano p { color: var(--suave); font-size: 13.5px; }
.plano ul { list-style: none; padding: 0; margin: 0 0 18px; display: grid; gap: 6px; font-size: 13.5px; flex: 1; }
.plano li .ico { color: var(--ouro); width: 16px; height: 16px; }
.pix-grid { display: grid; grid-template-columns: 252px 1fr; gap: 24px; align-items: start; }
.pix-qr { background: #fff; padding: 16px; border-radius: 14px; width: 252px; }
.pix-qr img, .pix-qr canvas { width: 100% !important; height: auto !important; }
.pix-passos { color: var(--suave); padding-left: 18px; margin-top: 0; font-size: 14px; }
.pix-copia { display: grid; gap: 6px; font-size: 13px; color: var(--suave); margin-bottom: 10px; }
.pix-copia textarea { font-family: ui-monospace, monospace; font-size: 12px; word-break: break-all; }
.pix .btn { margin-bottom: 8px; }
.pix-cancelar { text-align: center; margin-top: 4px; }
.tabela-rolagem { overflow-x: auto; }
.tabela { width: 100%; border-collapse: collapse; font-size: 14px; }
.tabela th { text-align: left; color: var(--fraco); font-weight: 500; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; }
.tabela th, .tabela td { padding: 10px 8px; border-bottom: 1px solid var(--linha); white-space: nowrap; }

/* Textos legais */
.texto-legal { max-width: 820px; }
.texto-legal h2 { font-size: 18px; margin-top: 28px; color: var(--ouro2); }
.texto-legal p, .texto-legal li { color: #d6d0dc; }

/* Rodapé */
.rodape { border-top: 1px solid var(--linha); background: var(--bg2); padding: 32px 0 24px; margin-top: 40px; }
.rodape-topo { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 14px; margin-bottom: 18px; }
.rodape-topo nav { display: flex; gap: 20px; flex-wrap: wrap; }
.rodape-topo nav a { color: var(--suave); font-size: 14px; }
.rodape-aviso { color: var(--fraco); font-size: 12.5px; max-width: 900px; }
.rodape-alerta { color: var(--suave); }
.rodape-alerta .ico { color: var(--aviso); }
.rodape-copy { color: var(--fraco); font-size: 12px; margin: 18px 0 0; }

/* Responsivo */
@media (max-width: 900px) {
  .perfil { grid-template-columns: 1fr; }
  .perfil-info { position: static; }
  .stats { grid-template-columns: repeat(2, 1fr); }
  .linha-3 { grid-template-columns: 1fr 1fr; }
  .pix-grid { grid-template-columns: 1fr; justify-items: center; }
  .pix-grid > div:last-child { width: 100%; }
}
@media (max-width: 640px) {
  .busca { grid-template-columns: 1fr; }
  .grade { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .card-info { padding: 32px 10px 10px; }
  .card-nome { font-size: 14px; }
  .linha-2, .linha-3 { grid-template-columns: 1fr; }
  .form-card { padding: 22px 18px; }
  .abas span { display: none; }
  .abas a, .abas button { padding: 12px; }
  .etapas li { grid-template-columns: 36px 1fr; }
  .etapas li > :last-child { grid-column: 2; justify-self: start; }
  .hero { padding-top: 32px; }
}