/* ==========================================================================
   N'est — folha de estilo do app
   Os tokens e o vocabulário visual vêm do dashboard (nest_dashboard.html,
   linhas 9–204), para que painel e app leiam como um produto só.
   Sem dependência de CDN: o app renderiza mesmo sem rede.
   ========================================================================== */

:root {
  --navy: #0B1F33;
  --navy2: #0d2840;
  --blue: #145DA0;
  --blue2: #1A6FBF;
  --blue3: #2E86C1;
  --cyan: #48CAE4;
  --cyan2: #90E0EF;
  --teal: #2A9D8F;

  --slate: #263238;
  --slate2: #37474F;
  --slate3: #546E7A;
  --slate4: #78909C;

  --bg: #F4F7FA;
  --bg2: #EBF3FA;
  --white: #FFFFFF;
  --border: #D0DCE8;
  --border2: #B8CCE0;

  --ok: #16794b;
  --warn: #a15c00;
  --bad: #b42318;

  --shadow: 0 2px 12px rgba(11, 31, 51, .09);
  --shadow-lg: 0 8px 28px rgba(11, 31, 51, .15);

  --r: 12px;
  --rs: 8px;
  --rr: 6px;

  /* assinatura visual herdada do painel */
  --fio: linear-gradient(90deg, var(--cyan), var(--blue), var(--teal));
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
  background: var(--bg);
  color: var(--slate);
  min-height: 100vh;
  font-size: 14px;
  line-height: 1.5;
}

/* Foco visível em tudo que recebe teclado — o app não tinha nenhum */
:focus-visible {
  outline: 3px solid var(--cyan);
  outline-offset: 2px;
  border-radius: var(--rr);
}

/* ---------- Barra de navegação ---------- */

.nav {
  background: var(--navy);
  position: relative;
  box-shadow: var(--shadow);
}

/* o fio gradiente é a assinatura que amarra app e painel */
.nav::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 3px;
  background: var(--fio);
}

.nav-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 20px;
  min-height: 56px;
  display: flex;
  align-items: center;
  gap: 22px;
  flex-wrap: wrap;
}

.marca {
  font-size: 19px;
  font-weight: 800;
  letter-spacing: -.6px;
  color: #fff;
  text-decoration: none;
  white-space: nowrap;
}
.marca span { color: var(--cyan); }

.nav a:not(.marca) {
  color: #C7D6E5;
  text-decoration: none;
  font-size: 13.5px;
  padding: 6px 0;
  border-bottom: 2px solid transparent;
  transition: color .15s, border-color .15s;
  white-space: nowrap;
}
.nav a:not(.marca):hover { color: #fff; border-bottom-color: var(--cyan); }
.nav a.destaque { color: var(--cyan2); font-weight: 600; }

.nav-user {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 12.5px;
  color: var(--slate4);
}
.nav-user strong { color: #DCE7F2; font-weight: 600; }

.selo {
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .09em;
  padding: 2px 7px;
  border-radius: 999px;
  background: rgba(72, 202, 228, .16);
  color: var(--cyan);
}

/* ---------- Estrutura ---------- */

main {
  max-width: 1400px;
  margin: 0 auto;
  padding: 26px 20px 60px;
}

.estreito { max-width: 900px; }

h1 {
  font-size: 22px;
  font-weight: 800;
  letter-spacing: -.4px;
  color: var(--navy);
  margin-bottom: 4px;
}

h2 {
  font-size: 17px;
  font-weight: 750;
  letter-spacing: -.2px;
  color: var(--navy);
  margin-bottom: 14px;
}

h3 {
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--blue);
  margin-bottom: 12px;
}

.subtitulo {
  color: var(--slate3);
  font-size: 13px;
  margin-bottom: 20px;
}

.cabecalho-pagina { margin-bottom: 20px; }

/* ---------- Cards ---------- */

.card {
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--r);
  box-shadow: var(--shadow);
  padding: 22px;
  margin-bottom: 18px;
}

.card-topo {
  position: relative;
  overflow: hidden;
}
.card-topo::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 3px;
  background: var(--fio);
}

.bloco {
  background: var(--bg2);
  border: 1px solid var(--border);
  border-radius: var(--rs);
  padding: 16px;
  margin-top: 18px;
}
.bloco-claro { background: var(--white); }
.bloco-tracejado { background: var(--white); border-style: dashed; }

/* ---------- Formulários ---------- */

.grade { display: grid; gap: 14px; }
.g2 { grid-template-columns: repeat(2, 1fr); }
.g3 { grid-template-columns: repeat(3, 1fr); }
.g4 { grid-template-columns: repeat(4, 1fr); }

.campo { display: flex; flex-direction: column; gap: 6px; }

.campo label,
label.rotulo {
  font-size: 10.5px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .09em;
  color: var(--blue);
}

input[type=text], input[type=password], input[type=email], input[type=number],
input[type=date], select, textarea {
  width: 100%;
  font-family: inherit;
  font-size: 13.5px;
  color: var(--slate);
  background: var(--white);
  border: 1px solid var(--border);
  border-radius: var(--rr);
  padding: 9px 11px;
  transition: border-color .15s, box-shadow .15s;
}

input:hover, select:hover, textarea:hover { border-color: var(--border2); }

input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--blue3);
  box-shadow: 0 0 0 3px rgba(72, 202, 228, .28);
}

input::placeholder { color: var(--slate4); }

input[type=checkbox] {
  width: 15px; height: 15px;
  accent-color: var(--blue);
  cursor: pointer;
}

.erro-campo {
  font-size: 11.5px;
  color: var(--bad);
  font-weight: 600;
}

.acoes {
  display: flex;
  gap: 10px;
  align-items: center;
  margin-top: 22px;
}
.acoes.direita { justify-content: flex-end; }

/* ---------- Botões ---------- */

.btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: inherit;
  font-size: 13.5px;
  font-weight: 650;
  padding: 10px 20px;
  border: 1px solid transparent;
  border-radius: var(--rs);
  cursor: pointer;
  text-decoration: none;
  transition: background .15s, border-color .15s, color .15s;
  white-space: nowrap;
}

.btn-principal { background: var(--blue); color: #fff; }
.btn-principal:hover { background: var(--blue2); }

.btn-secundario {
  background: var(--white);
  color: var(--slate2);
  border-color: var(--border);
}
.btn-secundario:hover { background: var(--bg2); border-color: var(--border2); }

.btn-perigo { background: var(--bad); color: #fff; }
.btn-perigo:hover { background: #9a1f13; }

.btn-pequeno { padding: 6px 13px; font-size: 12.5px; }

.link { color: var(--blue); text-decoration: none; font-weight: 600; }
.link:hover { text-decoration: underline; }
.link-perigo { color: var(--bad); text-decoration: none; font-weight: 600; }
.link-perigo:hover { text-decoration: underline; }

/* ---------- Central comercial do Corretor ---------- */
.corretor-largura { max-width: 1540px; }
.corretor-hero {
  display: grid; grid-template-columns: 1fr auto; gap: 30px; align-items: end;
  color: #fff; padding: 34px; margin-bottom: 22px; border-radius: 20px;
  background: radial-gradient(circle at 80% 0, rgba(72,202,228,.25), transparent 35%),
              linear-gradient(135deg, var(--navy), #123d5d 68%, #176b78);
  box-shadow: var(--shadow-lg);
}
.corretor-hero h1 { color: #fff; font-size: clamp(26px, 3vw, 43px); max-width: 800px; line-height: 1.08; }
.corretor-hero p { color: #c9dce9; max-width: 720px; margin-top: 10px; }
.corretor-hero > div > small { display: block; max-width: 720px; margin-top: 12px; padding-left: 11px; border-left: 2px solid rgba(255,255,255,.38); color: #a9c8d8; font-size: 11px; line-height: 1.5; }
.corretor-eyebrow { color: var(--cyan) !important; font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.corretor-pulso { display: flex; flex-direction: column; min-width: 170px; border-left: 1px solid rgba(255,255,255,.25); padding-left: 25px; }
.corretor-pulso strong { font-size: 42px; line-height: 1; }.corretor-pulso span { color: #c9dce9; }
.corretor-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 22px; align-items: start; }
.corretor-grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.produto-card { background: #fff; border: 1px solid var(--border); border-radius: 16px; overflow: hidden; box-shadow: var(--shadow); transition: transform .2s, box-shadow .2s; }
.produto-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.produto-imagem { min-height: 190px; display: flex; flex-direction: column; align-items: center; justify-content: center; color: #fff; text-decoration: none; background: linear-gradient(145deg, #0d2840, #145da0 62%, #2a9d8f); }
.produto-imagem span { width: 74px; height: 74px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.5); border-radius: 50%; font-size: 27px; font-weight: 800; text-transform: uppercase; }
.produto-imagem small { margin-top: 18px; color: #d8edf4; text-transform: uppercase; letter-spacing: .1em; }
.produto-conteudo { padding: 18px; }.produto-conteudo h2 { min-height: 42px; margin: 3px 0 15px; }
.produto-bairro { color: var(--blue); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .1em; }
.produto-metricas { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--border); padding-top: 13px; gap: 7px; }
.produto-metricas div { min-width: 0; }.produto-metricas dt { font-size: 9px; text-transform: uppercase; color: var(--slate4); }.produto-metricas dd { font-size: 12px; font-weight: 800; color: var(--navy); }
.tipologias { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 14px; }.tipologias span { background: var(--bg2); color: var(--blue); padding: 4px 8px; border-radius: 999px; font-size: 10px; font-weight: 700; }
.corretor-filtros { position: sticky; top: 16px; max-height: calc(100vh - 32px); overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; padding: 20px 14px 0 20px; border: 1px solid var(--border); border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
.corretor-filtros form { display: grid; gap: 14px; }.corretor-filtros label, .corretor-filtros legend { color: var(--blue); font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.corretor-filtros fieldset { border: 0; }.check-lista { max-height: 170px; overflow: auto; margin-top: 7px; padding: 8px; border: 1px solid var(--border); border-radius: 8px; }.check-lista label, .check-linha label { display: flex; gap: 7px; align-items: center; color: var(--slate2); text-transform: none; letter-spacing: 0; padding: 4px 0; }
.check-linha { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 7px; }.filtro-duplo { display: grid; grid-template-columns: 1fr 105px; gap: 8px; }
.filtro-cabecalho { display: flex; justify-content: space-between; }.filtro-cabecalho small { color: var(--teal); text-transform: uppercase; font-weight: 800; }.filtro-cabecalho button { display: none; border: 0; background: none; font-size: 25px; }
.filtro-acoes { position: sticky; z-index: 2; bottom: 0; display: grid; gap: 8px; margin: 2px -6px 0 -12px; padding: 12px; border-top: 1px solid var(--border); background: rgba(255,255,255,.96); box-shadow: 0 -8px 18px rgba(13,40,64,.08); backdrop-filter: blur(8px); }
.check-lista-curta { max-height: 110px; }.modo-correspondencia { display: grid; gap: 6px; }.modo-correspondencia label { display: flex; align-items: center; gap: 7px; color: var(--slate2); text-transform: none; letter-spacing: 0; }.aderencia-aviso { margin-top: 12px; padding: 9px 10px; border-left: 3px solid #d49a20; color: #765516; background: #fff8e8; font-size: 11px; }.aviso-comercial { margin-top: 22px; padding: 16px 18px; border: 1px solid #d8c487; border-radius: 12px; color: #5d4b19; background: linear-gradient(135deg, #fffaf0, #f8f4e7); }.aviso-comercial p { margin: 4px 0 0; font-size: 12px; }
.identificacao-cliente { display: grid; gap: 10px; padding: 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--mist); transition: border-color .2s, background .2s; }.identificacao-cliente.salvando { border-color: var(--cyan); background: #f2fbfc; }.opcao-salvar { display: flex; align-items: center; gap: 9px; cursor: pointer; }.opcao-salvar input { width: auto; }.opcao-salvar span { display: grid; gap: 1px; }.opcao-salvar small { color: var(--slate3); font-size: 10px; font-weight: 500; letter-spacing: 0; text-transform: none; }.clientes-recentes { display: grid; grid-template-columns: minmax(150px, .35fr) 1fr; gap: 14px; align-items: center; margin-bottom: 16px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; background: #fff; }.clientes-recentes > div:first-child { display: grid; }.clientes-recentes small { color: var(--slate3); }.clientes-recentes-links { display: flex; gap: 8px; overflow-x: auto; }.clientes-recentes-links a { flex: 0 0 auto; padding: 7px 11px; border: 1px solid var(--border); border-radius: 999px; color: var(--blue); text-decoration: none; }.clientes-recentes-links .ver-todos { border-color: var(--blue); font-weight: 800; }
.paginacao-comercial { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 24px 0; }.paginacao-comercial span { color: var(--slate3); font-weight: 700; }
.favoritar-card { display: flex; gap: 6px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); }.favoritar-card select { min-width: 0; }
.atalhos-corretor { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 20px; }.atalhos-corretor a { display: flex; flex-direction: column; padding: 14px 16px; color: var(--navy); text-decoration: none; background: #fff; border: 1px solid var(--border); border-radius: 12px; box-shadow: var(--shadow); }.atalhos-corretor a:hover { border-color: var(--cyan); }.atalhos-corretor span { color: var(--slate3); font-size: 11px; }.criar-consulta-card { display: block; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--border); color: var(--blue); font-size: 12px; font-weight: 700; text-decoration: none; }
.consultas-grade, .favoritos-grade { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }.consulta-card, .favorito-item { display: flex; flex-direction: column; justify-content: space-between; }.consulta-card small, .favorito-item small { color: var(--teal); font-weight: 800; text-transform: uppercase; letter-spacing: .07em; }
.atendimento-topo { display: flex; justify-content: space-between; gap: 18px; }.selo-status { align-self: start; padding: 5px 9px; border-radius: 999px; color: var(--blue); background: var(--bg2); font-size: 10px; font-weight: 800; text-transform: uppercase; }.resposta-comercial { margin-top: 16px; padding: 15px; border-left: 4px solid var(--teal); background: #eef9f7; }.atendimento-card form { margin-top: 18px; }
.demanda-kpis { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }.demanda-kpis .card { display: flex; flex-direction: column; }.demanda-kpis strong { color: var(--navy); font-size: 34px; }.demanda-kpis span { color: var(--slate3); }.demanda-colunas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }.ranking-lista { list-style-position: inside; }.ranking-lista li { display: flex; justify-content: space-between; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--border); }.ranking-lista span { display: flex; flex-direction: column; }.ranking-lista small { color: var(--slate4); }
.corretor-filtro-toggle { display: none; margin-bottom: 14px; }.vazio-comercial { grid-column: 1 / -1; }
.voltar-comercial { display: inline-block; margin-bottom: 17px; }.detalhe-hero { display: flex; gap: 20px; align-items: center; padding: 28px; color: #fff; border-radius: 18px; background: linear-gradient(130deg, var(--navy), #145d72); }.detalhe-hero h1 { color: #fff; font-size: 32px; }.detalhe-hero p { color: #d4e4ee; }
.detalhe-hero-comercial { display: grid; grid-template-columns: auto minmax(0,1fr) auto; }
.detalhe-marca { width: 90px; height: 90px; display: grid; place-items: center; overflow: hidden; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; font-size: 27px; font-weight: 800; text-transform: uppercase; }
.detalhe-marca-logo { padding: 8px; border-radius: 16px; background: #fff; }.detalhe-marca-logo img { width: 100%; height: 100%; object-fit: contain; }
.detalhe-atualizacao { display: grid; align-self: stretch; align-content: center; min-width: 150px; padding-left: 24px; border-left: 1px solid rgba(255,255,255,.22); }.detalhe-atualizacao small { color: #9fc4d4; text-transform: uppercase; letter-spacing: .08em; }.detalhe-atualizacao strong { font-size: 22px; }
.vitrine-empreendimento { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(300px,.75fr); gap: 20px; align-items: start; margin: 20px 0 30px; }
.galeria-comercial { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; align-items: start; }
.painel-visual { position: relative; display: block; aspect-ratio: 3/4; overflow: hidden; border-radius: 15px; color: #fff; background: linear-gradient(145deg,#173a54,#28728a); box-shadow: var(--shadow); }
.painel-visual img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }.painel-visual:hover img { transform: scale(1.025); }
.painel-visual span { position: absolute; right: 0; bottom: 0; left: 0; padding: 36px 14px 13px; color: #fff; font-size: 12px; font-weight: 800; background: linear-gradient(transparent,rgba(5,25,40,.86)); }
.galeria-vazia { grid-column: 1/-1; min-height: 320px; display: grid; place-content: center; gap: 6px; padding: 28px; color: #cce1eb; text-align: center; border-radius: 15px; background: radial-gradient(circle at 70% 20%,rgba(72,202,228,.18),transparent 35%),linear-gradient(145deg,#173a54,#28728a); }
.ficha-comercial { display: grid; gap: 14px; }.ficha-comercial .card { margin: 0; }.ficha-comercial h2 { margin: 2px 0 14px; }
.ficha-tecnica dl,.condicoes-comerciais dl { display: grid; gap: 0; }.ficha-tecnica dl div,.condicoes-comerciais dl div { display: grid; grid-template-columns: minmax(90px,.7fr) 1fr; gap: 10px; padding: 8px 0; border-top: 1px solid var(--border); }.ficha-tecnica dt,.condicoes-comerciais dt { color: var(--slate4); font-size: 10px; text-transform: uppercase; }.ficha-tecnica dd,.condicoes-comerciais dd { color: var(--navy); font-weight: 750; }
.atributos-empreendimento ul { list-style: none; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 0; }.atributos-empreendimento li { display: flex; gap: 7px; align-items: center; color: var(--slate2); font-size: 12px; }.atributos-empreendimento i { width: 20px; height: 20px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; color: #fff; background: var(--teal); font-style: normal; font-size: 10px; }
.plantas-comerciais { margin: 0 0 30px; }.plantas-grade { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; }.planta-card { display: grid; gap: 7px; padding: 10px; color: var(--navy); text-decoration: none; border: 1px solid var(--border); border-radius: 14px; background: #fff; box-shadow: var(--shadow); }.planta-card img { width: 100%; aspect-ratio: 3/4; object-fit: contain; background: #f4f7f8; border-radius: 9px; }.planta-card span { color: var(--blue); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.detalhe-colunas { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 20px; align-items: start; }.legenda-unidade { display: flex; gap: 7px; font-size: 11px; }.legenda-unidade i { width: 10px; height: 10px; border-radius: 50%; background: #c8f0db; }.legenda-unidade i:nth-child(2) { background: #f6c9c6; }
.tabela-comercial tr.unidade-disponivel td:first-child { border-left: 4px solid var(--ok); }.tabela-comercial tr.unidade-indisponivel { background: #fff1f0; color: #8f3f39; }.tabela-comercial form { display: flex; gap: 5px; }.tabela-comercial select { min-width: 100px; }.unidade-faltas { display: block; max-width: 190px; margin-top: 4px; color: #9a6415; font-weight: 700; }.estrela { border: 0; background: none; color: #c58b00; font-size: 25px; cursor: pointer; }.material-item { display: grid; padding: 12px 0; border-top: 1px solid var(--border); }.material-item span, .material-item small { color: var(--slate3); }

.navegacao-retorno { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }.navegacao-retorno .link { font-weight: 800; }

@media (max-width: 1100px) { .corretor-grade { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 800px) {
  .corretor-hero { grid-template-columns: 1fr; padding: 24px; }.corretor-pulso { border-left: 0; border-top: 1px solid rgba(255,255,255,.2); padding: 15px 0 0; }
  .corretor-layout { display: block; }.corretor-grade { grid-template-columns: 1fr; }.corretor-filtro-toggle { display: inline-flex; }
  .corretor-filtros { position: fixed; z-index: 50; top: 0; right: 0; bottom: 0; width: min(92vw, 360px); max-height: none; overflow-y: auto; -webkit-overflow-scrolling: touch; border-radius: 0; transform: translateX(105%); transition: transform .25s; }.corretor-filtros.aberto { transform: translateX(0); }.filtro-cabecalho button { display: block; }
  .detalhe-colunas,.vitrine-empreendimento { grid-template-columns: 1fr; }.galeria-comercial { grid-template-columns: repeat(3,minmax(0,1fr)); }.detalhe-hero { align-items: flex-start; }.detalhe-hero-comercial { grid-template-columns: auto 1fr; }.detalhe-atualizacao { grid-column: 1/-1; padding: 14px 0 0; border-top: 1px solid rgba(255,255,255,.22); border-left: 0; }.detalhe-marca { width: 62px; height: 62px; flex: 0 0 auto; }.plantas-grade { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .consultas-grade, .favoritos-grade, .demanda-kpis, .demanda-colunas, .atalhos-corretor, .clientes-recentes { grid-template-columns: 1fr; }
}
@media (max-width: 520px) { .galeria-comercial { grid-template-columns: 1fr 1fr; }.atributos-empreendimento ul { grid-template-columns: 1fr; }.detalhe-hero-comercial { grid-template-columns: 1fr; }.detalhe-marca { width: 76px; height: 76px; }.plantas-grade { grid-template-columns: 1fr 1fr; } }

/* ---------- Tabelas (mesmo desenho do painel) ---------- */

.tabela-wrap {
  overflow-x: auto;
  border: 1px solid var(--border);
  border-radius: var(--r);
  background: var(--white);
  box-shadow: var(--shadow);
}

table.tabela {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  font-size: 12.5px;
}

table.tabela th {
  position: sticky;
  top: 0;
  background: var(--navy);
  color: #fff;
  text-align: left;
  font-size: 10.5px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  padding: 11px 12px;
  white-space: nowrap;
  z-index: 2;
}

table.tabela td {
  padding: 9px 12px;
  border-bottom: 1px solid var(--border);
  color: var(--slate2);
  vertical-align: middle;
}

table.tabela tbody tr:nth-child(even) td { background: #F7FAFD; }
table.tabela tbody tr:hover td { background: #EAF4FF; }
table.tabela td.num { text-align: right; font-variant-numeric: tabular-nums; }
table.tabela td.centro, table.tabela th.centro { text-align: center; }
table.tabela .ok { color: var(--ok); font-weight: 700; }
table.tabela .warn { color: var(--warn); font-weight: 700; }
table.tabela .bad { color: var(--bad); font-weight: 700; }

.tabela-nowrap td { white-space: nowrap; }

/* ---------- Mensagens flash ----------
   O template antigo montava a classe como border-{{ category }}, que não
   existia em lugar nenhum — as mensagens saíam sem cor. */

.aviso {
  border-radius: var(--rs);
  border: 1px solid var(--border);
  border-left: 4px solid var(--slate3);
  background: var(--white);
  padding: 12px 16px;
  margin-bottom: 14px;
  font-size: 13.5px;
  box-shadow: var(--shadow);
}
.aviso-success { border-left-color: var(--teal); }
.aviso-danger  { border-left-color: var(--bad); }
.aviso-warning { border-left-color: var(--warn); }
.aviso-info    { border-left-color: var(--blue3); }

/* ---------- Estados vazios ---------- */

.vazio {
  text-align: center;
  padding: 46px 24px;
  color: var(--slate3);
}
.vazio h3 {
  color: var(--slate2);
  text-transform: none;
  letter-spacing: normal;
  font-size: 15px;
  margin-bottom: 6px;
}
.vazio p { font-size: 13px; margin-bottom: 18px; }

/* ---------- Paginação e apoio ---------- */

.paginacao {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 18px;
}

.contador { font-size: 12.5px; color: var(--slate3); margin-bottom: 10px; }

.filtros {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: flex-end;
  margin-bottom: 18px;
}
.filtros .campo { min-width: 150px; }

.mono { font-variant-numeric: tabular-nums; }
.miudo { font-size: 11.5px; color: var(--slate3); }

/* ---------- Login ---------- */

.tela-login {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background:
    radial-gradient(circle at 22% 18%, rgba(72, 202, 228, .18), transparent 30%),
    radial-gradient(circle at 82% 78%, rgba(20, 93, 160, .22), transparent 34%),
    linear-gradient(135deg, #061321 0%, var(--navy) 48%, #071A2B 100%);
}

.cartao-login {
  width: min(420px, 100%);
  background: var(--white);
  border-radius: 20px;
  padding: 34px 32px 28px;
  box-shadow: 0 28px 90px rgba(0, 0, 0, .38);
  position: relative;
  overflow: hidden;
}
.cartao-login::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: var(--fio);
}

.login-marca {
  text-align: center;
  margin-bottom: 26px;
}
.login-marca .nome {
  font-size: 30px;
  font-weight: 800;
  letter-spacing: -1px;
  color: var(--navy);
  line-height: 1;
}
.login-marca .nome span { color: var(--blue); }
.login-marca .sub {
  margin-top: 7px;
  font-size: 10.5px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .16em;
  color: var(--slate4);
}

.cartao-login .btn { width: 100%; justify-content: center; padding: 12px; }

.lembrar {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--slate2);
  margin: 16px 0 20px;
}
.lembrar label { cursor: pointer; }

/* ---------- Responsivo ---------- */

@media (max-width: 900px) {
  .g3, .g4 { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .g2, .g3, .g4 { grid-template-columns: 1fr; }
  .nav-inner { gap: 14px; padding: 10px 16px; }
  .nav-user { margin-left: 0; width: 100%; }
  main { padding: 18px 14px 40px; }
  .card { padding: 16px; }
  .acoes { flex-wrap: wrap; }
  .btn { width: 100%; justify-content: center; }
  .acoes .btn { width: auto; }
}

@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
}

/* ==========================================================================
   ESTRUTURA v2 — menu no topo, filtros na coluna esquerda
   O filtro é o gesto principal de um painel de inteligência, não um passo:
   escondê-lo atrás de um botão cobra um clique a cada pergunta nova.
   ========================================================================== */

.com-filtros{
  display:grid;
  grid-template-columns:236px minmax(0,1fr);
  align-items:start;
}
@media (max-width:900px){
  .com-filtros{grid-template-columns:1fr}
}

.filtros-col{
  background:var(--white);
  border-right:1px solid var(--border);
  padding:18px 16px 26px;
  min-height:calc(100vh - 64px);
  position:sticky;
  top:0;
}
@media (max-width:900px){
  .filtros-col{position:static;min-height:0;border-right:0;border-bottom:1px solid var(--border)}
}

.filtros-topo{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding-bottom:13px;margin-bottom:16px;border-bottom:1px solid var(--border);
}
.filtros-topo h6{font-size:13px;font-weight:700;display:flex;align-items:center;gap:7px}
.contador{
  font-size:10.5px;font-weight:700;padding:2px 7px;border-radius:999px;
  background:var(--blue);color:#fff;
}
.limpar{font-size:12px;color:var(--slate4);text-decoration:none}
.limpar:hover{color:var(--blue);text-decoration:underline}

.fgrupo{margin-bottom:20px}
.fgrupo:last-child{margin-bottom:0}
.frot{
  font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;font-weight:700;
  color:var(--slate4);margin-bottom:9px;
  display:flex;justify-content:space-between;align-items:center;
}
.frot .mais{font-size:11px;letter-spacing:0;text-transform:none;color:var(--slate4)}

.fsel{
  width:100%;padding:8px 10px;border:1px solid var(--border);border-radius:var(--rs);
  background:var(--white);color:var(--slate);font:inherit;font-size:13px;
}

/* A lista de bairros passa de 25 itens: rola dentro da própria coluna, para o
   rodapé com a contagem do recorte não ser empurrado para fora da tela. */
.flista{max-height:280px;overflow-y:auto;margin:0 -4px;padding:0 4px}

.fitem{
  display:flex;align-items:center;gap:9px;padding:5px 0;
  font-size:13px;color:var(--slate3);cursor:pointer;
}
.fitem:hover{color:var(--slate)}
.fitem.on{color:var(--slate);font-weight:600}
.fitem input{position:absolute;opacity:0;width:0;height:0}
.fbox{
  width:15px;height:15px;border-radius:4px;border:1.5px solid var(--border2);
  flex:none;display:grid;place-items:center;background:var(--white);
}
.fitem input:checked + .fbox{background:var(--blue);border-color:var(--blue)}
.fitem input:checked + .fbox::after{
  content:"";width:7px;height:4px;
  border-left:2px solid #fff;border-bottom:2px solid #fff;
  transform:rotate(-45deg) translate(1px,-1px);
}
.fitem input:focus-visible + .fbox{outline:3px solid var(--cyan);outline-offset:2px}
.fnome{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fitem .qt{margin-left:auto;font-size:11.5px;color:var(--slate4);font-variant-numeric:tabular-nums}

.filtros-pe{
  margin-top:22px;padding-top:14px;border-top:1px solid var(--border);
  font-size:12px;color:var(--slate4);
}
.filtros-pe b{
  display:block;font-size:19px;color:var(--slate);font-weight:600;margin-bottom:2px;
  font-variant-numeric:tabular-nums;
}

/* ---------- indicadores ---------- */
.kpis{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;margin-bottom:16px;
}
@media (max-width:1000px){.kpis{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.kpis{grid-template-columns:1fr}}

.kpi{
  background:var(--white);border:1px solid var(--border);border-radius:var(--r);
  padding:15px 16px;position:relative;overflow:hidden;
}
.kpi::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--cyan)}
.kpi.b::before{background:var(--teal)}
.kpi.c::before{background:var(--blue)}
.kpi.d::before{background:var(--slate4)}
.kpi.alerta::before{background:var(--warn)}
.kpi-rot{
  font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;
  color:var(--slate4);font-weight:700;margin-bottom:8px;
}
.kpi-val{
  font-size:26px;font-weight:600;letter-spacing:-.028em;line-height:1;
  font-variant-numeric:tabular-nums;
}
.kpi-pe{font-size:11.5px;color:var(--slate4);margin-top:6px;display:flex;align-items:center;gap:6px}
.kpi-pe a{color:var(--blue);font-weight:600;text-decoration:none}
.kpi-pe a:hover{text-decoration:underline}
.delta{font-weight:700;font-variant-numeric:tabular-nums}
.delta.sobe{color:var(--ok)}
.delta.desce{color:var(--bad)}

/* ---------- blocos ---------- */
.painel-duas{display:grid;grid-template-columns:1.3fr minmax(0,1fr);gap:12px;align-items:start}
@media (max-width:1000px){.painel-duas{grid-template-columns:1fr}}
.card-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:14px}
.card-h h3{font-size:14.5px;font-weight:600;margin:0}
.card-h small{font-size:11.5px;color:var(--slate4)}

.barras{display:flex;flex-direction:column;gap:10px}
.barra-l{display:grid;grid-template-columns:118px minmax(0,1fr) 104px;align-items:center;gap:12px}
.barra-l.apagado{opacity:.38}
.barra-nome{font-size:12.5px;color:var(--slate3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.barra-trilho{height:20px;background:var(--bg2);border-radius:5px;overflow:hidden;display:block}
.barra-fill{
  height:100%;border-radius:5px;display:block;
  background:linear-gradient(90deg,var(--blue),var(--cyan));
}
.barra-fill.teal{background:linear-gradient(90deg,var(--teal),var(--cyan2))}
.barra-num{
  font-size:12px;color:var(--slate3);text-align:right;
  font-variant-numeric:tabular-nums;
}
.barra-num b{color:var(--slate);font-weight:600}

.spark{display:block;overflow:visible}
.eixo{
  display:flex;justify-content:space-between;font-size:11px;
  color:var(--slate4);margin-top:8px;font-variant-numeric:tabular-nums;
}

/* ---------- cabeçalho de página em linha ---------- */
.cabecalho-pagina.linha{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:20px;flex-wrap:wrap;
}
.sync{
  display:flex;align-items:center;gap:9px;font-size:12.5px;color:var(--slate3);
  background:var(--white);border:1px solid var(--border);
  padding:7px 13px;border-radius:var(--rs);
}
.pulso{width:8px;height:8px;border-radius:50%;background:var(--slate4);flex:none}
.pulso.ok{background:var(--teal)}

/* ---------- console de operação: mesma estrutura, águas fundas ---------- */
.nav.nav-operacao{background:var(--navy);border-bottom-color:var(--navy2)}
.nav.nav-operacao .marca{color:#fff}
.nav.nav-operacao a{color:#B8CCE0}
.nav.nav-operacao a:hover{color:#fff}
.nav.nav-operacao a.on{background:rgba(72,202,228,.16);color:var(--cyan)}
.nav.nav-operacao .nav-user{color:#8FB0C8}
.nav.nav-operacao .nav-user strong{color:#E9F3F9}
.selo-op{
  font-size:10px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;
  padding:3px 9px;border-radius:5px;
  background:rgba(233,162,59,.2);color:#E9A23B;
  border:1px solid rgba(233,162,59,.4);
}
.avatar{
  width:29px;height:29px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(140deg,var(--blue),var(--teal));
  color:#fff;font-weight:700;font-size:11px;flex:none;
}

.tabela-rolagem{overflow-x:auto}
.direita{text-align:right}
.num{font-variant-numeric:tabular-nums;color:var(--slate4)}

/* ---------- contas de cliente ---------- */
.conta{
  background:var(--white);border:1px solid var(--border);
  border-radius:var(--r);margin-bottom:14px;overflow:hidden;
}
.conta-h{
  display:flex;align-items:center;gap:14px;padding:15px 17px;
  border-bottom:1px solid var(--border);flex-wrap:wrap;
}
.conta-logo{
  width:36px;height:36px;border-radius:9px;display:grid;place-items:center;
  font-weight:700;font-size:13px;color:#fff;flex:none;
  background:linear-gradient(140deg,var(--blue),var(--teal));
}
.conta-logo.neutra{background:linear-gradient(140deg,var(--slate3),var(--slate4))}
.conta-id{min-width:0}
.conta-nome{font-size:15px;font-weight:600}
.conta-meta{font-size:12px;color:var(--slate4);margin-top:2px}
.conta-dir{margin-left:auto;display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.vig{text-align:right}
.vig-r{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--slate4);font-weight:700}
.vig-v{font-size:13px;font-weight:600;margin-top:2px}
.selo-conta{
  font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  padding:5px 10px;border-radius:999px;
}
.selo-conta.vigente{background:rgba(22,121,75,.13);color:var(--ok)}
.selo-conta.falta{background:rgba(161,92,0,.15);color:var(--warn)}
.tabela-pessoas{margin:0}
.tabela-pessoas thead th{background:var(--bg2)}
.acoes-topo{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.form-inline { display: inline; margin: 0; }
.botao-link {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  font: inherit;
  cursor: pointer;
}
.nav-sair { color: inherit; }
.two-factor-grid{display:grid;grid-template-columns:minmax(260px,1fr) minmax(260px,1fr);gap:32px;align-items:start}
.two-factor-qr{width:220px;max-width:100%;height:auto;border:1px solid var(--border);border-radius:12px}
.recovery-codes{display:grid;grid-template-columns:repeat(2,minmax(160px,1fr));gap:12px;max-width:620px}
.recovery-codes code{padding:12px;background:var(--bg2);border-radius:8px;text-align:center;font-size:15px}
@media(max-width:700px){.two-factor-grid,.recovery-codes{grid-template-columns:1fr}}
.org-submit{justify-content:flex-end}
.org-vinculo{display:flex;gap:8px;align-items:center;min-width:340px}
.org-vinculo select{min-width:210px}
.org-pendente{background:rgba(161,92,0,.06)}

/* ---------- laboratorio de terrenos e estudos ---------- */
.estudos-resumo{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:18px}
.grade-estudos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.terreno-card{padding:0;overflow:hidden}
.terreno-topo{display:flex;justify-content:space-between;gap:20px;padding:20px 20px 16px}
.terreno-topo h2{font-size:20px;margin:12px 0 5px}.terreno-topo p{color:var(--slate4);font-size:13px;margin:0}
.terreno-area{font-size:18px;white-space:nowrap;color:var(--blue);font-variant-numeric:tabular-nums}
.terreno-meta{display:flex;gap:14px;flex-wrap:wrap;padding:10px 20px;background:var(--bg2);color:var(--slate4);font-size:11px}
.lista-estudos{padding:8px 12px 12px}.lista-estudos a{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 8px;border-bottom:1px solid var(--border);text-decoration:none;color:var(--slate)}
.lista-estudos a:last-child{border-bottom:0}.lista-estudos a:hover{background:var(--bg2)}
.lista-estudos small{display:block;color:var(--slate4);margin-top:2px}
.status-estudo{display:inline-flex;padding:5px 9px;border-radius:999px;font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;background:var(--bg2);color:var(--slate4);white-space:nowrap}
.status-estudo.em_analise{background:rgba(0,103,177,.12);color:var(--blue)}
.status-estudo.concluido{background:rgba(22,121,75,.13);color:var(--ok)}
.status-estudo.arquivado{background:rgba(90,105,117,.15);color:var(--slate3)}
.laboratorio-vazio{padding:54px 24px}.laboratorio-vazio .btn{margin-top:12px}
.form-estudo{max-width:980px}.etapa-estudo{display:grid;grid-template-columns:64px minmax(0,1fr);gap:20px;margin-bottom:14px}
.etapa-num{font-size:28px;font-weight:600;color:var(--cyan);letter-spacing:-.04em}.etapa-corpo h2{font-size:18px;margin:0 0 18px}
.etapa-corpo .campo{margin-bottom:14px}.etapa-corpo textarea{resize:vertical;min-height:110px}
.erro{display:block;color:var(--bad);font-size:11.5px;margin-top:5px}
.acoes-form{display:flex;justify-content:flex-end;gap:10px;margin:18px 0 30px}
.estudo-layout{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);gap:16px;align-items:start}
.ficha-estudo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;margin:18px 0 0}
.ficha-estudo div{padding:13px 0;border-top:1px solid var(--border)}.ficha-estudo dt{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--slate4);font-weight:700}.ficha-estudo dd{margin:5px 0 0;font-size:13px}
.trilha-estudo ol{list-style:none;padding:0;margin:18px 0}.trilha-estudo li{position:relative;padding:8px 8px 8px 28px;color:var(--slate4);border-left:1px solid var(--border)}.trilha-estudo li::before{content:"";position:absolute;left:-5px;top:13px;width:9px;height:9px;border-radius:50%;background:var(--border2)}.trilha-estudo li.feito{color:var(--slate);font-weight:600}.trilha-estudo li.feito::before{background:var(--teal)}
@media(max-width:900px){.grade-estudos,.estudo-layout{grid-template-columns:1fr}.estudos-resumo{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.estudos-resumo,.ficha-estudo{grid-template-columns:1fr}.etapa-estudo{grid-template-columns:1fr}.etapa-num{font-size:18px}.terreno-topo{flex-direction:column}.terreno-area{font-size:16px}}

/* Produto proposto */
.produto-form{display:grid;gap:16px}.secao-titulo{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}.secao-titulo h2{margin:0}.tabela-responsiva{overflow-x:auto}.tabela-produto{width:100%;border-collapse:collapse}.tabela-produto th,.tabela-produto td{padding:10px 8px;border-bottom:1px solid var(--border);text-align:left}.tabela-produto th{font-size:12px;text-transform:uppercase;color:var(--slate4)}.tabela-produto input{min-width:88px;width:100%}.tabela-produto td:first-child input{min-width:160px}.atributos-produto{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.atributos-produto li{display:flex;gap:8px;align-items:center;padding:10px;border:1px solid var(--border);border-radius:10px}.chips-produto{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}.chips-produto span{padding:6px 10px;border-radius:999px;background:var(--bg2);font-size:13px}.produto-resumo{margin-top:16px}.erro{display:block;color:#a52a2a;margin-top:4px}
@media(max-width:760px){.atributos-produto{grid-template-columns:1fr 1fr}.secao-titulo{flex-direction:column}.produto-resumo .estudos-resumo{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.atributos-produto,.produto-resumo .estudos-resumo{grid-template-columns:1fr}}

/* Pre-selecao de concorrentes */
.aviso-modelo{display:flex;justify-content:space-between;gap:16px;border-left:4px solid var(--blue)}.grade-concorrentes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.concorrente-card:first-child{grid-column:span 2}.concorrente-topo{display:flex;justify-content:space-between;gap:12px}.categoria-concorrente{font-weight:700;color:var(--blue);text-transform:uppercase;font-size:12px;letter-spacing:.08em}.amostra{font-size:12px;color:var(--slate4)}.metricas-concorrente{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}.metricas-concorrente div{background:var(--bg2);padding:10px;border-radius:10px}.metricas-concorrente dt{font-size:11px;color:var(--slate4);text-transform:uppercase}.metricas-concorrente dd{margin:5px 0 0;font-weight:700}.justificativa{border-top:1px solid var(--border);padding-top:12px}.limitacoes-modelo,.etapa-concorrentes{margin-top:16px}
@media(max-width:760px){.grade-concorrentes{grid-template-columns:1fr}.concorrente-card:first-child{grid-column:auto}.metricas-concorrente{grid-template-columns:1fr}.aviso-modelo{flex-direction:column}}