/* BRUCEE — painel administrativo */
:root{
  --verde:#2F2F2F; --verde-fundo:#1F1F1F; --tinta:#191919;
  --areia:#F5F5F5; --linha:#E3E3E3; --texto:#242424; --suave:#717171; --alerta:#9A3B2E;
}
*{box-sizing:border-box}
body{margin:0;background:var(--areia);color:var(--texto);
  font:400 14px/1.55 "Jost","Helvetica Neue",Arial,sans-serif}
a{color:var(--verde);text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:2px solid var(--verde);outline-offset:2px}

/* O menu cresceu para 14 itens e passou a quebrar em duas linhas, empurrando o
   bloco do usuário para baixo e para a esquerda — parecia defeito.
   Grade de três colunas: marca à esquerda, menu no meio (pode ocupar quantas
   linhas precisar), usuário sempre à direita, no topo. */
.p-topo{
  display:grid; grid-template-columns:auto 1fr auto; align-items:start;
  column-gap:24px; background:var(--verde-fundo); color:#fff; padding:0 26px;
  /* Mesma barra fixa do site: com dezessete telas, ter o menu sempre à mão
     poupa uma rolagem a cada troca. */
  position:sticky; top:0; z-index:50;
}
.p-marca{
  color:#fff; font-family:"EB Garamond","Cormorant Garamond",Georgia,serif;
  font-size:22px; letter-spacing:.24em; display:flex; align-items:center;
  min-height:60px; white-space:nowrap
}
.p-marca small{font-family:inherit;font-size:10px;letter-spacing:.2em;opacity:.6;margin-left:8px}
.p-marca:hover{text-decoration:none}
.p-menu{display:flex;gap:0 2px;flex-wrap:wrap;align-content:center;min-height:60px}
/* Espaçamento vertical menor: com o menu em duas linhas, 20px em cima e
   embaixo de cada item dobrava a altura da barra. */
.p-menu a{
  color:#D2D2D2; padding:10px 12px; font-size:12.5px; letter-spacing:.05em;
  border-bottom:2px solid transparent; white-space:nowrap
}
.p-menu a:hover{color:#fff;text-decoration:none}
.p-menu a.ativo{color:#fff;border-bottom-color:#fff}
.p-usuario{
  font-size:12.5px; color:#D2D2D2; display:flex; align-items:center; gap:4px;
  min-height:60px; white-space:nowrap
}
.p-usuario a{color:#fff;margin-left:12px;border:1px solid rgba(255,255,255,.3);padding:5px 12px;font-size:11px}

.p-corpo{max-width:1180px;margin:0 auto;padding:26px 20px 60px}
.p-cabeca{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:22px;flex-wrap:wrap}
.p-cabeca h1{font-family:"EB Garamond","Cormorant Garamond",Georgia,serif;font-weight:400;font-size:28px;letter-spacing:.04em;margin:0 0 4px}
.p-cabeca p{margin:0;color:var(--suave);font-size:13.5px;max-width:640px}

.p-btn{display:inline-block;background:var(--verde);color:#fff;border:1px solid var(--verde);
  padding:11px 20px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
.p-btn:hover{background:var(--tinta);text-decoration:none}
.p-btn.linha{background:none;color:var(--verde)}
.p-btn.linha:hover{background:#fff}

.p-cartoes{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:22px}
.p-cartao{background:#fff;border:1px solid var(--linha);padding:16px 18px}
.p-cartao span{display:block;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--suave)}
.p-cartao strong{font-size:26px;font-weight:400;font-family:"EB Garamond","Cormorant Garamond",Georgia,serif}

.p-filtros{display:flex;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.p-filtros input,.p-filtros select{height:40px;border:1px solid var(--linha);padding:0 12px;background:#fff;min-width:170px}

/* Barra de ações em massa, acima da tabela de anúncios. */
.p-massa { display: flex; align-items: center; gap: 14px; margin: -8px 0 16px; flex-wrap: wrap; }
.p-massa select { height: 38px; border: 1px solid var(--linha); padding: 0 10px; background: #fff; }
.p-massa #btn-massa:disabled { opacity: .4; cursor: not-allowed; }

/* Agenda semanal de visitas: sete colunas, uma por dia, com o dia de hoje
   destacado. Empilha em coluna única no celular — sete colunas de 130px cada
   não cabem em tela nenhuma de bolso. */
.p-agenda { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; background: var(--linha); border: 1px solid var(--linha); }
.p-agenda-dia { background: #fff; min-height: 160px; display: flex; flex-direction: column; }
.p-agenda-dia.hoje { background: #ECECEC; }
.p-agenda-cabeca { padding: 10px 12px; font-size: 12px; text-transform: uppercase; letter-spacing: .06em;
  color: var(--suave); border-bottom: 1px solid var(--linha); }
.p-agenda-vazio { color: #B0B0B0; font-size: 12px; padding: 10px 12px; margin: 0; }
.p-agenda-cartao {
  display: block; margin: 8px 8px 0; padding: 8px 10px; background: var(--areia);
  border-left: 3px solid var(--verde); font-size: 12px; color: var(--texto); text-decoration: none;
}
.p-agenda-cartao:hover { background: #ECECEC; }
.p-agenda-cartao.passou { border-left-color: #B0B0B0; opacity: .6; }
.p-agenda-cartao b { display: block; font-size: 13px; }
.p-agenda-cartao span { display: block; margin-top: 2px; }
.p-agenda-cartao small { display: block; color: var(--suave); margin-top: 2px; }
@media (max-width: 900px) {
  .p-agenda { grid-template-columns: 1fr; }
  .p-agenda-dia { min-height: 0; }
}

.p-tabela{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--linha);font-size:13.5px}

/* Paginação de listas do painel — mesma ideia da paginação pública, num
   tamanho mais discreto (o painel já é denso, não precisa de números grandes). */
.p-paginacao { display: flex; gap: 6px; justify-content: center; margin: 18px 0 4px; flex-wrap: wrap; }
.p-paginacao a {
  min-width: 34px; height: 34px; display: grid; place-items: center;
  border: 1px solid var(--linha); font-size: 12.5px; padding: 0 10px; background: #fff;
}
.p-paginacao a:hover { border-color: var(--verde); }
.p-paginacao a.atual { background: var(--verde); color: #fff; border-color: var(--verde); }

.p-tabela th{text-align:left;font-weight:400;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--suave);padding:12px 14px;border-bottom:1px solid var(--linha)}
.p-tabela td{padding:13px 14px;border-bottom:1px solid var(--linha);vertical-align:top}
.p-tabela tr:last-child td{border-bottom:0}
.p-tabela small{display:block;color:var(--suave);font-size:11.5px}
.p-forte{font-size:14.5px}
.p-alerta{color:var(--alerta)}
.p-acoes form{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
/* Barra de ações no topo de uma tela: botões de verdade, e não os links
   discretos de dentro das tabelas (.p-acoes). */
.p-barra-acoes{display:flex;gap:12px;flex-wrap:wrap;align-items:center;margin-bottom:18px}
.p-acoes button{background:none;border:0;color:var(--verde);cursor:pointer;padding:0;font-size:13px}
.p-acoes button:hover{text-decoration:underline}

.p-etiqueta,.p-status{display:inline-block;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;padding:3px 9px;border:1px solid var(--linha)}
.p-etiqueta.diamante{background:var(--verde-fundo);color:#fff;border-color:var(--verde-fundo)}
.p-etiqueta.premium{background:#E8EBE4}
.p-status.ativa{background:#E7EFE4;border-color:#BBCDB4}
.p-status.pendente{background:#FBF3DF;border-color:#E4D3A4}
.p-status.suspensa,.p-status.encerrada{background:#F4E5E2;border-color:#DCB9B2}

.p-vazio{background:#fff;border:1px solid var(--linha);padding:44px;text-align:center}
.p-vazio strong{display:block;font-weight:400;font-size:17px;margin-bottom:6px}
.p-vazio p{color:var(--suave);margin:0 0 18px}

.recado{padding:13px 16px;margin-bottom:18px;border-left:3px solid var(--verde);background:#fff;font-size:13.5px}
.recado.erro{border-left-color:var(--alerta)}

.p-form{background:#fff;border:1px solid var(--linha)}
.p-form fieldset{border:0;border-bottom:1px solid var(--linha);margin:0;padding:22px 24px}
.p-form fieldset:last-of-type{border-bottom:0}
.p-form legend{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--suave);padding:0 0 12px}
.p-grade{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.p-grade label{display:block;font-size:12.5px}
.p-grade label.largo{grid-column:1/-1}
.p-grade label.marcador{grid-column:1/-1;display:flex;gap:9px;align-items:center}
.p-grade input,.p-grade select,.p-grade textarea{
  width:100%;margin-top:6px;border:1px solid var(--linha);padding:10px 12px;background:#fff;font:inherit}
.p-grade label.marcador input{width:auto;margin:0}
.p-grade input[type=color]{height:42px;padding:4px}
.p-grade small{display:block;color:var(--suave);font-size:11.5px;margin-top:5px}
.p-grade textarea{resize:vertical}
.p-previa{border:1px solid var(--linha);padding:10px;text-align:center}
.p-previa img{max-height:60px;max-width:100%;margin:0 auto 6px}
.p-nota{grid-column:1/-1;color:var(--suave);font-size:12.5px;margin:0}
.p-rodape-form{display:flex;gap:12px;padding:20px 24px;background:var(--areia);border-top:1px solid var(--linha)}

.p-entrar{max-width:380px;margin:80px auto;background:#fff;border:1px solid var(--linha);padding:34px}
.p-entrar h1{font-family:"EB Garamond","Cormorant Garamond",Georgia,serif;font-weight:400;letter-spacing:.18em;text-align:center;margin:0 0 6px}
.p-entrar p.sub{text-align:center;color:var(--suave);font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin:0 0 26px}
.p-entrar label{display:block;font-size:12.5px;margin-bottom:14px}
.p-entrar input{width:100%;margin-top:6px;border:1px solid var(--linha);padding:11px 12px;font:inherit}
.p-entrar .p-btn{width:100%;margin-top:8px}

@media (max-width:900px){
  .p-cartoes{grid-template-columns:repeat(2,1fr)}
  .p-grade{grid-template-columns:1fr 1fr}
  .p-tabela{display:block;overflow-x:auto}
}
@media (max-width:600px){
  .p-grade{grid-template-columns:1fr}
  .p-topo{gap:10px}
}

/* Galeria de fotos do anúncio */
.p-galeria{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.p-galeria figure{margin:0;background:#fff;border:1px solid var(--linha)}
.p-galeria figure.capa{border-color:var(--verde);border-width:2px}
.p-galeria img{width:100%;aspect-ratio:4/3;object-fit:cover}
.p-galeria figcaption{display:flex;gap:12px;align-items:center;padding:9px 11px;font-size:12px}
.p-galeria figcaption button{background:none;border:0;color:var(--verde);cursor:pointer;padding:0;font:inherit}
.p-galeria figcaption button:hover{text-decoration:underline}
@media (max-width:900px){.p-galeria{grid-template-columns:repeat(2,1fr)}}

/* Pedido de visita destacado na lista de leads: tem prazo, então precisa
   saltar aos olhos entre os contatos comuns. */
.marca-visita {
  display: inline-block; margin-top: 3px; padding: 2px 7px;
  background: #1f3a2c; color: #fff; border-radius: 2px;
  font-size: 10.5px; letter-spacing: .04em;
}
.marca-visita.passou { background: #8a5a1f; }


/* Mesmos algarismos legíveis do site: no painel os números são valores e
   contagens, onde confundir 1 com 7 custa caro. */
.p-cartao strong, .p-tabela td, .p-forte {
  font-variant-numeric: lining-nums tabular-nums;
  font-feature-settings: "lnum" 1, "tnum" 1;
}

/* Botão que age como link dentro de uma linha da tabela: as ações de apagar e
   duplicar precisam de formulário (POST + token), mas devem parecer os outros
   links da coluna, e não botões soltos. */
.p-link {
  background: none; border: 0; padding: 0; font: inherit; cursor: pointer;
  color: var(--tinta, #1A1A1A); text-decoration: underline; text-underline-offset: 3px;
}
.p-link:hover { opacity: .7; }
.p-link.perigo { color: #a1341f; }

/* --------------------------------------------------------------------------
   Painel: pendências, barras e alertas
   -------------------------------------------------------------------------- */
.p-alerta { color: #a1341f; }

.pendencias { list-style: none; margin: 0; padding: 0; }
.pendencias li { border-left: 2px solid #D8D8D8; padding: 8px 0 8px 14px; margin-bottom: 8px; }
.pendencias li.grave { border-left-color: #a1341f; }
.pendencias a { text-decoration: none; }
.pendencias b { font-size: 17px; margin-right: 4px; }
.pendencias li.grave b { color: #a1341f; }

/* Gráfico de barras sem biblioteca: são oito valores, e uma dependência de
   30 KB para desenhar oito retângulos não se paga. */
.barras { display: flex; align-items: flex-end; gap: 10px; height: 150px; padding-top: 8px; }
.barra { flex: 1; display: flex; flex-direction: column; align-items: center; height: 100%; }
.barra-valor { font-size: 12px; color: #707070; margin-bottom: 4px; }
.barra-haste { width: 100%; max-width: 46px; background: #323232; margin-top: auto; }
.barra:hover .barra-haste { background: #3d5c48; }
.barra-rotulo { font-size: 10.5px; color: #9A9A9A; margin-top: 6px; }

/* Linha do tempo do lead */
.linha-tempo { list-style: none; margin: 0; padding: 0; }
.linha-tempo li {
  /* 2ª coluna em auto e não 108px fixos: "acompanhamento" tem 117px e ficava
     cortado dentro do selo. */
  display: grid; grid-template-columns: 108px auto 1fr auto; gap: 12px;
  align-items: baseline; padding: 9px 0; border-bottom: 1px solid #ECECEC; font-size: 13px;
}
.lt-quando { color: #9A9A9A; font-size: 11.5px; }
.lt-tipo {
  font-size: 10px; letter-spacing: .08em; text-transform: uppercase;
  color: #707070; border: 1px solid #E2E2E2; padding: 2px 7px; text-align: center;
  white-space: nowrap;
}
.lt-tipo.lt-situacao { background: #323232; color: #fff; border-color: #323232; }
.lt-autor { color: #9A9A9A; font-size: 11.5px; }
@media (max-width: 760px) {
  .linha-tempo li { grid-template-columns: 1fr; gap: 3px; }
}

/* Marcação por família de ação na auditoria: o olho acha o que importa sem ler
   linha por linha. */
.p-marca-acao {
  font-size: 11px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  padding: 2px 7px; border: 1px solid #E2E2E2; white-space: nowrap;
}
.p-marca-acao.grave    { background: #fbeae6; border-color: #e8c4ba; color: #a1341f; }
.p-marca-acao.atencao  { background: #fdf6e8; border-color: #e6d4ae; color: #8a5a1f; }
.p-marca-acao.destaque { background: #eaf0ec; border-color: #c6d6cc; color: #24352a; }


/* Legibilidade (v8.9): o padrão do painel seguia o do site — corpo pequeno com
   espaçamento largo entre letras. Em caixa alta e tamanho reduzido, espaço
   demais faz o olho soletrar em vez de ler a palavra. */
.p-cartao span, .p-tabela th, legend {
  font-weight: 500; letter-spacing: .07em;
}
.p-tabela th { font-size: 11.5px; }
.p-tabela small { font-size: 12px; color: #5F5F5F; }
.p-nota { font-size: 12.5px; color: #5F5F5F; }


/* Mesmo padrão do site: placeholder com o corpo e o peso do texto digitado, e
   foco visível para quem navega por teclado. */
.p-form input, .p-form select, .p-form textarea,
.p-filtros input, .p-filtros select {
  font-size: 14px; font-weight: 400; color: #1A1A1A;
}
.p-form ::placeholder, .p-filtros ::placeholder { color: #5F5F5F; opacity: 1; }
.p-form input:focus, .p-form select:focus, .p-form textarea:focus,
.p-filtros input:focus, .p-filtros select:focus {
  outline: 2px solid #323232; outline-offset: 1px;
}

/* --------------------------------------------------------------------------
   Rótulos dos formulários do painel
   --------------------------------------------------------------------------
   Só havia regra para label dentro de .p-grade. Rótulo fora dela ficava inline
   e o formulário virava um parágrafo com caixas no meio — foi o que aconteceu
   no cadastro de condomínio. Esta regra vale para qualquer formulário do painel,
   com ou sem grade, e evita que o próximo formulário novo repita o problema.
   -------------------------------------------------------------------------- */
.p-form label {
  display: block; font-size: 12.5px; margin-bottom: 16px;
}
.p-form label > input,
.p-form label > select,
.p-form label > textarea {
  display: block; width: 100%; margin-top: 6px;
}
.p-form label small {
  display: block; margin-top: 5px; color: #5F5F5F; font-size: 12px; line-height: 1.5;
}
/* Caixa de marcação é a exceção: precisa ficar ao lado do texto. */
.p-form label.marcador {
  display: flex; gap: 9px; align-items: flex-start;
}
.p-form label.marcador input { width: auto; margin: 2px 0 0; flex: none; }
.p-form label.marcador small { margin-top: 3px; }

/* Botões dentro de uma célula de tabela, um por linha, para não colarem uns nos
   outros como aconteceu na lista de integrações. */
.p-acoes form { display: block; margin-top: 5px; }
.p-acoes > a { display: inline-block; margin-bottom: 4px; }

/* O cadastro de condomínio tem campos longos (nome, apelidos, slug). Três
   colunas espremem tudo; duas dão respiro sem virar formulário comprido. */
.p-grade.duas { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 900px) { .p-grade, .p-grade.duas { grid-template-columns: 1fr; } }

/* Duas colunas lado a lado no painel (origem e dispositivo, por exemplo). */
.p-colunas { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin-top: 18px; }
.p-colunas > * { min-width: 0; margin: 0; }
@media (max-width: 860px) { .p-colunas { grid-template-columns: 1fr; } }

/* Barras sem rótulo (série diária longa): a legenda vai no title. */
.barras .barra:only-child { max-width: 60px; }


/* Mesma seta desenhada do site: a nativa muda de forma entre navegadores e
   deixava o painel com duas linguagens de ícone. */
.p-form select, .p-filtros select, .p-grade select {
  -webkit-appearance: none; -moz-appearance: none; appearance: none;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235F5F59' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
  background-size: 15px 15px; padding-right: 36px;
}


/* Em tela estreita, a barra vira três linhas empilhadas e o menu rola na
   horizontal — melhor que espremer 14 itens em coluna. */
@media (max-width: 900px) {
  .p-topo { grid-template-columns: 1fr auto; }
  .p-menu {
    grid-column: 1 / -1; flex-wrap: nowrap; overflow-x: auto;
    min-height: 0; padding-bottom: 4px;
    scrollbar-width: thin;
  }
  .p-marca, .p-usuario { min-height: 48px; }
}

/* Divisor entre o uso diário e a manutenção do portal. */
.p-divisor {
  align-self: center; width: 1px; height: 18px;
  background: rgba(255, 255, 255, .22); margin: 0 10px;
}
@media (max-width: 900px) { .p-divisor { margin: 0 6px; } }

/* Abas dentro de uma tela do painel. */
.abas-painel { display: flex; gap: 4px; margin: 0 0 18px; border-bottom: 1px solid var(--linha); }
.abas-painel a {
  padding: 10px 16px; font-size: 12.5px; color: #5F5F5F; text-decoration: none;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.abas-painel a.ativa { color: #1A1A1A; border-bottom-color: #323232; font-weight: 500; }
.abas-painel a:hover { color: #1A1A1A; }


/* Mesma reserva do site: sem ela, o painel escorrega ao ir de uma tela curta
   (Login IP sem tentativas) para uma longa (lista de anúncios). */
html { scrollbar-gutter: stable; }
@supports not (scrollbar-gutter: stable) { html { overflow-y: scroll; } }

/* Lista de escolha da vitrine: duas colunas em tela larga, para uma carteira de
   trinta anúncios não virar uma tira comprida. */
.vitrine-lista {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 4px 20px; max-height: 340px; overflow-y: auto;
  border: 1px solid var(--linha); padding: 12px 14px; margin-bottom: 12px;
}
.vitrine-lista label { margin: 0; padding: 5px 0; font-size: 13px; }
.vitrine-lista small { color: #5F5F5F; margin-left: 6px; }

/* ==================== v15.0 ==================== */
.p-alternar{display:inline-flex; border:1px solid #d8d8d4; border-radius:2px; overflow:hidden; margin-right:8px}
.p-alternar a{padding:8px 14px; font-size:12px; text-decoration:none; color:inherit}
.p-alternar a.ativo{background:#191919; color:#fff}
.p-cabeca .p-acoes{display:flex; align-items:center; flex-wrap:wrap; gap:8px}

.p-motivos{margin:0 0 18px; padding:12px 16px}
.p-motivos summary{cursor:pointer; font-size:13px}
.p-barrinha{display:block; height:8px; background:#5F5F5F; border-radius:1px}

/* Quadro de leads */
.quadro{display:grid; grid-template-columns:repeat(5, minmax(210px, 1fr)); gap:12px; overflow-x:auto; padding-bottom:10px}
.quadro-coluna{background:#f3f3f1; border:1px solid #e4e4e0; border-radius:2px; padding:10px; min-height:220px}
.quadro-coluna.sobre{outline:2px dashed #191919; outline-offset:-4px}
.quadro-coluna h2{font-size:13px; letter-spacing:.06em; text-transform:uppercase; margin:2px 4px 10px;
  display:flex; justify-content:space-between}
.quadro-coluna h2 span{font-weight:400; color:#5F5F5F}
.quadro-lista{display:flex; flex-direction:column; gap:8px}
.quadro-cartao{background:#fff; border:1px solid #e4e4e0; border-radius:2px; padding:10px 11px;
  display:flex; flex-direction:column; gap:3px; font-size:13px}
.quadro.com-js .quadro-cartao{cursor:grab}
.quadro-cartao.arrastando{opacity:.45}
.quadro-cartao.movendo{opacity:.6; pointer-events:none}
.quadro-cartao small{color:#5F5F5F; font-size:11.5px}
.quadro-mover{display:flex; gap:6px; margin-top:6px}
.quadro-mover select{flex:1; font-size:12px; padding:4px}
.quadro-mover button{font-size:12px; padding:4px 8px}
/* Com JavaScript o arrastar resolve; o seletor só aparece quando o cartão
   recebe foco pelo teclado. */
.quadro.com-js .quadro-mover{display:none}
.quadro.com-js .quadro-cartao:focus-within .quadro-mover{display:flex}
.quadro-mais{font-size:12px; text-align:center; padding:6px}
.p-dialogo{border:1px solid #d8d8d4; border-radius:2px; padding:22px; max-width:420px; width:92vw}
.p-dialogo::backdrop{background:rgba(0,0,0,.35)}
.p-dialogo h2{font-size:17px; margin:0 0 14px}
.p-dialogo label{display:block; margin-bottom:14px}
.p-dialogo select{width:100%; margin-top:6px}
.p-dialogo .p-acoes{justify-content:flex-end}

/* Respostas prontas */
.respostas{display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:12px}
.resposta{border:1px solid #e4e4e0; border-radius:2px; padding:12px 14px; margin-bottom:10px}
.resposta p{font-size:13px; color:#3a3a3a; white-space:pre-line; margin:6px 0 10px}
.resposta small{color:#5F5F5F; margin-left:6px}
.p-previa{white-space:pre-wrap; background:#f7f7f5; border:1px solid #e4e4e0; padding:14px; font-size:12.5px;
  max-height:420px; overflow:auto}
.p-linha-form{padding:12px 16px; margin:0 0 18px}
.p-linha-form p{margin:0 0 4px}

/* ==================== v15.7 — painel no celular ==================== */
/* O <fieldset> tem largura mínima igual ao conteúdo por padrão do navegador
   (min-inline-size: min-content), e ignora o overflow da tabela dentro dele:
   no painel inicial, em 390px, a página inteira rolava de lado. */
fieldset { min-width: 0; }

@media (max-width: 560px) {
  /* Alvos de toque: campos e botões do painel tinham 15–22px de altura no
     celular, quando o mínimo confortável é 40px. */
  .p-form input:not([type=checkbox]):not([type=radio]),
  .p-form select, .p-filtros input, .p-filtros select {
    min-height: 44px; padding: 0 12px;
  }
  .p-form textarea { padding: 10px 12px; }
  /* !important porque .p-grade label.marcador input e .p-form label.marcador
     input fixam width:auto (13px de padrão do navegador) e são mais
     específicas: no celular o alvo ficava menor que a ponta do dedo. */
  input[type=checkbox], input[type=radio] { width: 20px !important; height: 20px; }
  .p-btn, .p-acoes button, .p-form button, .p-filtros button, .p-link {
    min-height: 44px; padding-inline: 14px;
  }
  .p-form label { display: block; margin-bottom: 14px; }
  .p-cartoes { grid-template-columns: 1fr 1fr; }
}
