/* ============================================================================
   Buscador de imóveis — folha de estilo do painel
   Organização:  1) tokens   2) base   3) header   4) painel (recolhível)
                 5) home   6) radares   7) cartão de imóvel   8) tabelas
                 9) overlay   10) responsivo
   Pra mudar cores/espaçamento, mexa só no bloco :root (tokens).
   ========================================================================== */

/* ---- 1. tokens ---------------------------------------------------------- */
/* O ESCURO é o padrão, e o claro é a variante — ao contrário de antes.
   Identidade de produto não é preferência de sistema: com a paleta escura só
   dentro do `prefers-color-scheme`, quem abrisse o painel num computador em
   modo claro via outro produto. A variante clara continua existindo (e legível)
   pra quem pede, lá embaixo.

   Cada cor tem UM significado, e é isso que segura a leitura da tela:
     azul/violeta ... ação e link. NUNCA badge de estado — era o vício antigo,
                      em que o roxo aparecia em meia dúzia de selos ao mesmo
                      tempo e deixava de querer dizer "clique aqui";
     verde .......... oportunidade;
     amarelo ........ queda de preço;
     vermelho ....... atenção / fora do ar;
     cinza .......... neutro, o resto. */
:root{
  --bg:#0f1117;          /* fundo da página */
  --surface:#171a22;     /* cartões, header */
  --surface-2:#1e2230;   /* zebra / cabeçalho de tabela / chip */
  --ink:#e6e9f0;         /* texto principal — cinza claro, não branco puro:
                            branco em #0f1117 dá 18:1 e vibra na leitura longa */
  --ink-soft:#a8aebd;    /* texto secundário */
  /* texto apagado. #6e7686 era o tom "certo" no olho e dava 3,5:1 na zebra —
     abaixo do mínimo de texto. Medido, não estimado: este passa em 4,5:1 nas
     TRÊS superfícies (fundo 5,4 · card 5,0 · zebra 4,6). É onde moram "há 12
     min" e as contagens dos chips, que é justamente o que se lê de relance. */
  --dim:#828a99;
  --line:#272b36;        /* divisórias */
  --line-soft:#1e222c;

  --accent:#6e8bff;      /* ações / links / seleção */
  --accent-d:#8ba2ff;
  --accent-wash:#1a2138;

  --pos:#34d399;         /* oportunidade / "no ar" */
  --pos-wash:#10281f;
  --warn:#f5c24c;        /* queda de preço / atenção */
  --warn-wash:#2b2413;
  --danger:#f2555a;      /* descartar */
  --off:#ff6b6b;         /* servidor fora */
  --off-wash:#2b1719;

  --hi:#5fe3a1;   --hi-bg:#12291f;     /* score alto  */
  --mid:#f0c75e;  --mid-bg:#2a2413;    /* score médio */
  --lo:#9aa1b1;   --lo-bg:#232833;     /* score baixo */

  --r-sm:7px; --r:11px; --r-lg:16px;

  /* superfície: hairline sempre, sombra só quando o elemento sobe (hover).
     No escuro a sombra precisa ser bem mais funda — sombra clara some. */
  --sh-sm:0 0 0 0 transparent;
  --sh:0 1px 2px rgba(0,0,0,.35), 0 8px 24px -10px rgba(0,0,0,.6);
  --sh-lift:0 2px 8px rgba(0,0,0,.5), 0 18px 44px -14px rgba(0,0,0,.7);

  /* escala de espaço — mantém o ritmo vertical consistente */
  --sp-1:.25rem; --sp-2:.5rem; --sp-3:.75rem; --sp-4:1rem; --sp-5:1.5rem; --sp-6:2.25rem;

  --maxw:1180px;
  --font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
}

/* A variante CLARA — o inverso de antes. Quem trabalha num ambiente claro (ou
   imprime uma tela) continua com um painel legível, com os mesmos significados
   de cor: azul = ação, verde = oportunidade, amarelo = queda, vermelho =
   atenção. Só o suporte muda. */
@media (prefers-color-scheme:light){
  :root{
    --bg:#f6f5f3; --surface:#ffffff; --surface-2:#f3f1ee;
    --ink:#1c1c22; --ink-soft:#54545f; --dim:#86868f;
    --line:#e8e6e2; --line-soft:#f0eeeb;
    --accent:#4f46e5; --accent-d:#4338ca; --accent-wash:#eef0fe;
    --pos:#047857; --pos-wash:#e8f5ef;
    --warn:#b45309; --warn-wash:#fbf1e5;
    --danger:#c2410c; --off:#dc2626; --off-wash:#fdeded;
    --hi:#15803d; --hi-bg:#e4f6e9; --mid:#92600e; --mid-bg:#fbf0d4;
    --lo:#5f5f6a; --lo-bg:#edecef;
    --sh:0 1px 2px rgba(20,20,30,.04), 0 6px 18px -8px rgba(20,20,30,.12);
    --sh-lift:0 2px 6px rgba(20,20,30,.05), 0 14px 34px -14px rgba(20,20,30,.20);
  }
}

/* ---- 2. base ---------------------------------------------------------- */
*{box-sizing:border-box}
/* O `display:none` que o navegador dá pro atributo `hidden` vem da folha DELE,
   que perde pra qualquer regra nossa — então todo componente com `display`
   próprio ignorava `hidden` calado. Já tinha mordido duas vezes (.imv e
   #loading, cada um com seu remendo) e mordeu de novo na linha de captação: o
   "mostrar mais 180 →" não escondia nada e a página vinha com as 240 linhas.
   Uma regra só, no começo, em vez de lembrar disso a cada componente novo. */
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);
  font:14px/1.5 var(--font);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}
h1{font-size:1.35rem;letter-spacing:-.02em;margin:0 0 .25rem;font-weight:650}
h2{font-size:1.02rem;letter-spacing:-.01em;font-weight:600}
p{margin:.3rem 0}
code{background:var(--surface-2);border:1px solid var(--line);
  padding:.08em .4em;border-radius:6px;font-size:.86em}
.dim{color:var(--dim)}
::selection{background:var(--accent-wash)}

main{max-width:var(--maxw);margin:0 auto;padding:var(--sp-6) var(--sp-5) 4rem}
.bloco{margin:var(--sp-6) 0}
.bloco h2{margin:0 0 var(--sp-4);display:flex;align-items:center;gap:.5rem;
  font-size:.95rem;font-weight:600;color:var(--ink);letter-spacing:0}
.bloco h2 .dim{font-weight:450}
.mk{width:.32rem;height:.92rem;border-radius:2px;flex:none;background:var(--line);
  outline:0}
.mk-novo{background:var(--accent)}
.mk-queda{background:var(--warn)}
.mk-todos{background:var(--pos)}
.mk-ia{background:var(--accent-d)}
.aviso-ia{background:var(--accent-wash);color:var(--accent-d);border-radius:var(--r-sm);
  padding:.65rem .85rem;font-size:.86rem;margin:var(--sp-4) 0}
.aviso{border-radius:var(--r-sm);padding:.55rem .85rem;font-size:.86rem;margin:.7rem 0;
  border:1px solid var(--line);background:var(--surface-2);color:var(--ink-soft)}
.aviso.ok{background:var(--pos-wash);color:var(--pos);border-color:transparent}
.aviso.erro{background:var(--off-wash);color:var(--off);border-color:transparent}
.ref-form .cliente-form input[type=url]{width:100%}

/* status das fontes (/fontes) */
.fontes-resumo{display:flex;gap:.5rem;flex-wrap:wrap;margin:.7rem 0 var(--sp-5)}
.st{font-size:.8rem;font-weight:550;white-space:nowrap}
.fontes-resumo .st{border-radius:999px;padding:.3rem .7rem;border:1px solid var(--line)}
.st-ok{color:var(--pos)} .fontes-resumo .st-ok{background:var(--pos-wash);border-color:transparent}
.st-vazio{color:var(--warn)} .fontes-resumo .st-vazio{background:var(--warn-wash);border-color:transparent}
.st-erro{color:var(--off)} .fontes-resumo .st-erro{background:var(--off-wash);border-color:transparent}
.st-nunca,.st-nunca *{color:var(--dim)}
.fontes-erros{margin-top:var(--sp-4);font-size:.86rem}
.fontes-erros li{margin:.3rem 0}
.quem{font-size:.8rem;color:var(--dim);margin-left:.5rem;white-space:nowrap}

/* página Aprendizado */
.apr-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--sp-4);margin:var(--sp-4) 0}
.apr-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:1rem 1.1rem}
.apr-card h2{margin:.1rem 0 .6rem;font-size:.95rem}
.apr-num{font-size:1.6rem;font-weight:700;line-height:1.1;margin:.2rem 0 .4rem;letter-spacing:-.02em}
.apr-num span{font-size:.8rem;font-weight:450;color:var(--dim)}
.apr-num-sm{font-size:1.15rem;margin-top:1rem}
.apr-list{list-style:none;padding:0;margin:.5rem 0;font-size:.86rem}
.apr-list li{margin:.35rem 0}
.apr-list .apr-sep{border-top:1px solid var(--line);margin-top:.6rem;padding-top:.5rem;color:var(--dim)}
.apr-bars{margin:.6rem 0}
.apr-bar{display:flex;align-items:center;gap:.5rem;font-size:.78rem;margin:.3rem 0}
.apr-bar span{flex:0 0 5.5rem;text-align:right;color:var(--dim)}
.apr-bar b{height:.75rem;min-width:2px;background:var(--accent);border-radius:3px;display:block}
.apr-bar i{color:var(--dim);font-style:normal;white-space:nowrap}
.apr-bar.apr-structured b,.apr-bar.apr-jsonld b{background:var(--pos)}
.apr-bar.apr-heuristic b{background:var(--warn)}
.apr-hint{font-size:.76rem;margin-top:.5rem}

/* página Servidor */
.srv-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:var(--sp-4);margin:var(--sp-4) 0}
.srv-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:1rem 1.1rem}
.srv-card h2{margin:.1rem 0 .7rem;font-size:.95rem}
.srv-list{list-style:none;padding:0;margin:0;font-size:.88rem}
.srv-list li{margin:.45rem 0;line-height:1.35}
.lvl-ok{color:var(--ink)}
.lvl-aviso{color:var(--warn)}
.lvl-erro{color:var(--off);font-weight:600}
.lvl-nd{color:var(--dim)}
.srv-wide{grid-column:1/-1}
.srv-big{font-size:2rem;font-weight:700;line-height:1.1;letter-spacing:-.02em;margin:.2rem 0 .1rem}
.srv-un{font-size:.95rem;font-weight:500;color:var(--dim);margin-left:.15rem}
.srv-tag{font-size:.74rem;font-weight:600;margin-left:.5rem;vertical-align:middle}
.srv-spark-wrap{margin:.3rem 0 .6rem}
.srv-spark{width:100%;height:34px;display:block;opacity:.8}
.srv-mini li{margin:.3rem 0;font-size:.83rem}
.srv-jobs li{margin:.6rem 0;padding-left:0}
.job-lin{display:flex;flex-wrap:wrap;gap:.2rem .8rem;justify-content:space-between;align-items:baseline}
.job-barra{height:5px;border-radius:3px;background:var(--line);margin-top:.35rem;overflow:hidden}
.job-barra i{display:block;height:100%;background:var(--warn);border-radius:3px}

/* mapa por bairro */
#mapa-radar{height:340px;border-radius:var(--r);overflow:hidden;margin-bottom:var(--sp-4);
  border:1px solid var(--line);background:var(--surface-2)}
#mapa-radar .leaflet-container{font:inherit;background:var(--surface-2)}
#mapa-radar .leaflet-popup-content{font-size:.85rem;line-height:1.5}

/* resumo por bairro */
.bairro-tab{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  overflow:hidden}
.bairro-row{display:grid;grid-template-columns:9rem 1fr 2.5rem 6.5rem auto;align-items:center;
  gap:.7rem;padding:.55rem .9rem;border-bottom:1px solid var(--line-soft);cursor:pointer;font-size:.86rem}
.bairro-row:last-child{border-bottom:0}
.bairro-row:hover{background:var(--surface-2)}
.bairro-row.on{background:var(--accent-wash)}
.bairro-nome{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bairro-bar{background:var(--surface-2);border-radius:999px;height:.45rem;overflow:hidden}
.bairro-row.on .bairro-bar{background:#fff}
.bairro-bar i{display:block;height:100%;background:var(--accent);border-radius:999px}
.bairro-n{text-align:right;font-weight:700}
.bairro-m2{font-weight:600;color:var(--pos)}
.bairro-extra{font-size:.78rem;white-space:nowrap}
@media (max-width:640px){
  .bairro-row{grid-template-columns:1fr 2rem 5rem;gap:.5rem}
  .bairro-bar,.bairro-extra{display:none}
}

button,input,select,textarea{font:inherit;color:inherit}
button{background:var(--accent);color:#fff;border:0;border-radius:var(--r-sm);
  padding:.6rem 1.15rem;font-weight:600;font-size:.9rem;cursor:pointer;
  transition:background .12s,transform .06s,box-shadow .12s}
button:hover{background:var(--accent-d)}
button:active{transform:translateY(1px)}
input,select{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:.48rem .62rem;transition:border-color .12s,box-shadow .12s}
input:focus,select:focus{outline:0;border-color:var(--accent);
  box-shadow:0 0 0 3px var(--accent-wash)}

/* ---- 3. header ------------------------------------------------------- */
/* ---- barra lateral ------------------------------------------------------
   Substitui o menu de topo. O de antes tinha 5 itens + um "Sistema ▾" que
   abria por cima do conteúdo; aqui cada seção tem lugar fixo e o conteúdo
   ganha a altura inteira da tela. Em telas estreitas ela vira uma faixa
   horizontal de novo — numa largura de celular, 240px de menu comeriam
   dois terços da tela. */
:root{--lateral:236px}

.lateral{position:fixed;inset:0 auto 0 0;width:var(--lateral);z-index:20;
  display:flex;flex-direction:column;gap:.15rem;padding:1rem .7rem;
  background:var(--surface);border-right:1px solid var(--line);overflow-y:auto}
.lateral .logo{font-weight:700;font-size:1rem;letter-spacing:-.02em;color:var(--ink);
  display:flex;flex-direction:column;gap:.1rem;padding:.2rem .55rem 1.1rem}
.lateral .logo:hover{text-decoration:none}
.logo-sub{font-size:.68rem;font-weight:500;color:var(--dim);letter-spacing:.01em}

.lateral nav{display:flex;flex-direction:column;gap:.1rem}
.lateral nav a{color:var(--ink-soft);font-weight:500;font-size:.88rem;
  display:flex;align-items:center;gap:.6rem;
  padding:.5rem .55rem;border-radius:var(--r-sm);transition:background .12s,color .12s}
.lateral nav a:hover{background:var(--surface-2);color:var(--ink);text-decoration:none}
/* item ativo: barra de accent + fundo lavado. É a ÚNICA coisa azul do menu —
   o resto é neutro, senão a cor de ação vira decoração (ver os tokens). */
.lateral nav a.on{background:var(--accent-wash);color:var(--ink);
  box-shadow:inset 3px 0 0 var(--accent)}
.lateral nav .ic{width:1.15rem;text-align:center;flex:none;font-size:.95rem}
.nav-sep{height:1px;background:var(--line);margin:.55rem .55rem}

.lateral-pe{margin-top:auto;padding-top:1rem;display:flex;flex-direction:column;
  gap:.45rem;align-items:flex-start;border-top:1px solid var(--line)}
.lateral-pe .btn-sec{font-size:.78rem}

/* o conteúdo desloca pra direita da barra */
body{padding-left:var(--lateral)}

/* pular pro conteúdo: sem o menu de topo, quem usa teclado passaria por 9
   links antes de chegar na página. Só aparece quando recebe foco. */
.pular{position:absolute;left:-999px;top:0;z-index:30;background:var(--accent);
  color:#fff;padding:.5rem .9rem;border-radius:0 0 var(--r-sm) 0}
.pular:focus{left:0}

@media (max-width:860px){
  :root{--lateral:0px}
  body{padding-left:0}
  .lateral{position:static;width:auto;flex-direction:row;flex-wrap:wrap;
    align-items:center;gap:.5rem;border-right:0;border-bottom:1px solid var(--line);
    padding:.55rem var(--sp-4)}
  .lateral .logo{flex-direction:row;align-items:center;gap:.4rem;padding:0 .6rem 0 0}
  .logo-sub{display:none}
  .lateral nav{flex-direction:row;flex-wrap:wrap;gap:.1rem}
  .lateral nav a{padding:.34rem .6rem;border-radius:999px}
  .lateral nav a.on{box-shadow:none;background:var(--accent-wash)}
  .nav-sep{display:none}
  .lateral-pe{margin:0 0 0 auto;flex-direction:row;align-items:center;
    border-top:0;padding-top:0}
}

.srv{display:inline-flex;align-items:center;gap:.4rem;
  font-size:.76rem;font-weight:600;padding:.3rem .65rem;border-radius:999px;
  border:1px solid transparent;white-space:nowrap;cursor:default}
.srv .dot{width:.46rem;height:.46rem;border-radius:50%;background:currentColor;flex:none}
.srv-ok{color:var(--pos);background:var(--pos-wash)}
.srv-parado,.srv-sem-radar{color:var(--warn);background:var(--warn-wash)}
.srv-off{color:var(--off);background:var(--off-wash)}
.srv-off .dot{animation:blink 1s steps(1) infinite}
.srv-trabalhando{color:var(--accent-d,var(--accent));background:var(--accent-wash)}
.srv-trabalhando .dot{animation:pulso 1.1s ease-in-out infinite}
@keyframes blink{50%{opacity:.25}}
@keyframes pulso{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.7)}}
@media (prefers-reduced-motion:reduce){.srv-trabalhando .dot,.srv-off .dot{animation:none}}

/* aviso "buscando…" na tela do radar */
.radar-buscando{display:flex;align-items:center;gap:.6rem;background:var(--accent-wash);
  color:var(--accent-d,var(--accent));border-radius:var(--r-sm);padding:.65rem .85rem;
  font-size:.88rem;font-weight:500;margin:.7rem 0}
.radar-buscando .sp{width:1rem;height:1rem;border:2px solid currentColor;border-right-color:transparent;
  border-radius:50%;animation:girar .8s linear infinite;flex:none}
@keyframes girar{to{transform:rotate(360deg)}}

/* ---- 4. painel recolhível (componente único) ----------------------- */
/* usado em: busca avançada, blocos de cliente/dono/referência do radar,
   radares pausados, detalhes de fontes com erro, grupos de Favoritos.
   Um estilo só pra todos — mesma seta, mesmo cabeçalho, mesmo respiro. */
details.painel,details.avancado,details.cliente,details.pausados,
details.fontes-erros{
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  margin:.7rem 0;padding:0 .9rem;overflow:hidden}
details[open].painel,details[open].avancado,details[open].cliente,
details[open].pausados,details[open].fontes-erros{padding-bottom:.9rem}
details.painel > summary,details.avancado > summary,details.cliente > summary,
details.pausados > summary,details.fontes-erros > summary{
  cursor:pointer;list-style:none;display:flex;align-items:center;gap:.55rem;
  margin:0 -.9rem;padding:.7rem .9rem;font-weight:600;font-size:.9rem;color:var(--ink);
  transition:background .12s}
details.painel > summary::-webkit-details-marker,
details.avancado > summary::-webkit-details-marker,
details.cliente > summary::-webkit-details-marker,
details.pausados > summary::-webkit-details-marker,
details.fontes-erros > summary::-webkit-details-marker{display:none}
details.painel > summary::before,details.avancado > summary::before,
details.cliente > summary::before,details.pausados > summary::before,
details.fontes-erros > summary::before{
  content:"";width:.42rem;height:.42rem;border-right:1.6px solid var(--dim);
  border-bottom:1.6px solid var(--dim);transform:rotate(-45deg);flex:none;
  margin-left:.1rem;transition:transform .15s}
details[open].painel > summary::before,details[open].avancado > summary::before,
details[open].cliente > summary::before,details[open].pausados > summary::before,
details[open].fontes-erros > summary::before{transform:rotate(45deg)}
details.painel > summary:hover,details.avancado > summary:hover,
details.cliente > summary:hover,details.pausados > summary:hover,
details.fontes-erros > summary:hover{background:var(--surface-2)}
details[open].painel > summary,details[open].avancado > summary,
details[open].cliente > summary,details[open].pausados > summary,
details[open].fontes-erros > summary{margin-bottom:.85rem;
  border-bottom:1px solid var(--line-soft)}
/* corpo: primeiro filho depois do summary não leva margem/padding extra no topo */
details.painel > summary + *,details.avancado > summary + *,
details.cliente > summary + *,details.pausados > summary + *,
details.fontes-erros > summary + *{margin-top:0}
details.pausados > .radar-cards{margin:0 -.9rem -.9rem;padding:.9rem}
details.fontes-erros > ul{margin:0}

/* meta à direita no cabeçalho do painel (contagem, resumo) */
.painel-meta{margin-left:auto;font-weight:450;font-size:.82rem}
.painel-tit{font-weight:600}

/* ---- 5. home -------------------------------------------------------- */
.hero{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:1.6rem 1.7rem;margin-bottom:var(--sp-4)}
.hero h1{margin-bottom:.9rem}
input.big{width:100%;padding:.85rem 1rem;border-radius:var(--r);font-size:1rem;
  margin-bottom:.6rem}
.preco-faixa{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem;margin:0 0 .8rem}
.preco-faixa label{display:flex;align-items:center;gap:.5rem;font-size:.88rem;
  font-weight:550;color:var(--ink-soft);flex:1;min-width:150px}
.preco-faixa input{flex:1;min-width:0;width:160px;font-weight:450;color:var(--ink)}
.preco-faixa .dim{flex-basis:100%;font-size:.77rem}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem;margin:.7rem 0}
.grid label,.check{display:flex;flex-direction:column;gap:.3rem;font-size:.8rem;color:var(--dim);font-weight:550}
.check{flex-direction:row;align-items:center;gap:.5rem;font-size:.88rem;color:var(--ink)}
.check input[name=nome_radar]{flex:1;max-width:240px}

.campo-bairros{margin:.7rem 0}
.campo-bairros .rotulo{display:block;font-size:.8rem;color:var(--dim);margin-bottom:.4rem;font-weight:550}
.chips-bairros{display:flex;flex-wrap:wrap;gap:.4rem}
.chips-bairros .chip{display:inline-flex;align-items:center;gap:.35rem;flex-direction:row;
  background:var(--surface);border:1px solid var(--line);border-radius:999px;
  padding:.3rem .72rem;font-size:.83rem;color:var(--ink);cursor:pointer;transition:.12s}
.chips-bairros .chip:hover{border-color:var(--accent)}
.chips-bairros .chip:has(input:checked){background:var(--accent-wash);border-color:var(--accent);
  color:var(--accent-d);font-weight:600}
.chips-bairros .chip input{margin:0;accent-color:var(--accent)}

.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.9rem;margin:var(--sp-4) 0}
.stats .card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:1rem 1.2rem;text-align:center;transition:.14s}
.stats .card b{display:block;font-size:1.55rem;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.stats .card span{color:var(--dim);font-size:.82rem}
a.card{color:inherit}
a.card:hover{border-color:var(--accent);text-decoration:none;transform:translateY(-1px);box-shadow:var(--sh)}

table.mini{border-collapse:collapse;font-size:.88rem;margin-top:.6rem}
table.mini td,table.mini th{padding:.35rem .9rem;border-bottom:1px solid var(--line);text-align:left}

/* ---- 6. meus radares (cards) --------------------------------------- */
.radar-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));
  gap:.9rem;margin-top:var(--sp-4)}
.rc{display:flex;flex-direction:column;gap:.6rem;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r-lg);padding:1.2rem;
  color:var(--ink);transition:transform .14s,box-shadow .14s,border-color .14s}
.rc:hover{border-color:var(--accent);text-decoration:none;transform:translateY(-1px);box-shadow:var(--sh)}
.rc-nome{font-weight:650;font-size:1.02rem;letter-spacing:-.01em}
.rc-crit{display:flex;flex-wrap:wrap;gap:.35rem}
.crit{background:var(--surface-2);border:1px solid var(--line-soft);color:var(--ink-soft);
  border-radius:999px;padding:.18rem .6rem;font-size:.76rem;font-weight:500;
  white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.rc-nums{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.15rem}
.rc-nums span{display:inline-flex;align-items:baseline;gap:.3rem;font-size:.8rem;color:var(--dim);
  background:var(--surface-2);border-radius:var(--r-sm);padding:.28rem .58rem}
.rc-nums b{font-size:.95rem;font-weight:700;color:var(--ink)}
.rc-nums .n-novo{background:var(--accent-wash);color:var(--accent-d)}
.rc-nums .n-novo b{color:var(--accent-d)}
.rc-nums .n-dest{background:var(--pos-wash);color:var(--pos)}
.rc-nums .n-dest b{color:var(--pos)}
.rc-nums .n-queda{background:var(--warn-wash);color:var(--warn)}
.rc-nums .n-queda b{color:var(--warn)}
.rc-nums .n-ia{background:var(--accent-wash);color:var(--accent-d);font-weight:600}
.rc-nums .n-ia b{color:var(--accent-d)}
.rc-rodape{font-size:.77rem;color:var(--dim);margin-top:auto;padding-top:.5rem;border-top:1px solid var(--line-soft)}

.pausados{margin-top:var(--sp-5)}
.rc-pausado{opacity:.62}
.rc-pausado:hover{opacity:1}

.cli-tag{display:inline-block;font-size:.72rem;font-weight:600;vertical-align:middle;
  background:var(--accent-wash);color:var(--accent-d);border-radius:999px;padding:.14rem .5rem;margin-left:.35rem}

/* blocos de cliente/dono/referência na página do radar — herdam .painel;
   aqui só o form interno */
.cliente-form{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
  gap:.7rem;align-items:end;margin-top:.2rem}
.cliente-form label{display:flex;flex-direction:column;gap:.25rem;font-size:.77rem;
  color:var(--dim);font-weight:600}
.cliente-form label.wide,.cliente-form .wide{grid-column:1/-1}
.cliente-form .rotulo{font-size:.77rem;color:var(--dim);display:block;margin-bottom:.4rem}
.cliente-form textarea{background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:.5rem .6rem;resize:vertical;font:inherit}
.cliente-form textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-wash)}
.cliente-form button{align-self:start}

/* agrupa os painéis de configuração do radar num bloco só, separado da lista */
.radar-config{margin:var(--sp-4) 0 0;border:1px solid var(--line);border-radius:var(--r);
  background:var(--surface-2);padding:.5rem .6rem}
.radar-config > .rotulo{font-size:.74rem;font-weight:650;text-transform:uppercase;
  letter-spacing:.04em;color:var(--dim);padding:.3rem .3rem .15rem}
.radar-config details.cliente{margin:.35rem 0;background:var(--surface)}

/* ---- 7. cartão de imóvel ------------------------------------------- */
.topo-result{margin-bottom:var(--sp-4)}
.voltar{font-size:.83rem;font-weight:500;color:var(--dim)}
.voltar:hover{color:var(--accent)}
.topo-result .rc-crit{margin:.55rem 0}
.topo-result form{margin-top:.9rem;display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.btn-sec{display:inline-block;font-size:.84rem;color:var(--dim);padding:.38rem .58rem;border-radius:var(--r-sm)}
.btn-sec:hover{background:var(--surface-2);color:var(--ink);text-decoration:none}
button.btn-sec{background:var(--surface);color:var(--ink-soft);border:1px solid var(--line);font-weight:600}
button.btn-sec:hover{background:var(--surface-2);color:var(--ink);border-color:var(--accent)}
button.btn-danger{background:var(--surface);color:var(--danger);border:1px solid var(--line);font-weight:600}
button.btn-danger:hover{background:var(--off-wash);border-color:var(--danger)}
.corr-tab{display:flex;flex-direction:column;gap:.5rem;margin-top:var(--sp-4)}
.corr-lin{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.7rem .9rem;border:1px solid var(--line);border-radius:var(--r-sm);background:var(--surface)}
.corr-lin.corr-bloq{background:var(--off-wash);border-color:var(--danger)}
.corr-quem{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;min-width:0}
.corr-cargo{background:var(--surface-2);color:var(--ink-soft);border:1px solid var(--line-soft)}
.acoes-radar{margin-top:.9rem;display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.acoes-radar form{display:inline-flex}
.acoes-radar .spacer{flex:1}
.tag-pausado{background:var(--surface-2);color:var(--dim);border:1px solid var(--line)}

/* barra de filtros do radar */
.filtro-bar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:.7rem 1rem;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:.85rem 1rem;margin-bottom:var(--sp-5)}
.filtro-bar label{display:flex;flex-direction:column;gap:.25rem;font-size:.74rem;
  color:var(--dim);font-weight:600}
.filtro-bar input,.filtro-bar select{padding:.38rem .52rem;font-size:.86rem}
.filtro-bar select[name=bairro]{max-width:14rem}
.filtro-bar input[type=number]{width:5rem}
.filtro-bar input[name=preco_max]{width:7rem}
.filtro-bar .fx{display:flex;align-items:center;gap:.3rem}
.filtro-bar .fx span{color:var(--dim)}
.toggles{display:flex;flex-wrap:wrap;gap:.35rem}
.toggles button{background:var(--surface);color:var(--ink-soft);border:1px solid var(--line);
  border-radius:999px;padding:.36rem .75rem;font-size:.79rem;font-weight:550}
.toggles button:hover{border-color:var(--accent);color:var(--ink)}
.toggles button.on{background:var(--ink);color:var(--surface);border-color:var(--ink)}
#limpar{align-self:flex-end;margin-left:auto}   /* canto oposto aos chips, como o "mostrar descartados" da captação */
#filtro-contagem{align-self:center;font-size:.81rem;font-weight:600}

.imv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));
  gap:1rem;align-items:start}
.imv{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:1.05rem;display:flex;flex-direction:column;gap:.5rem;
  transition:transform .14s,box-shadow .14s,border-color .14s}
.imv:hover{transform:translateY(-1px);box-shadow:var(--sh);border-color:var(--line)}
.imv.is-disc{opacity:.42;filter:saturate(.4)}
.imv.is-visto:not(.is-disc){opacity:.72}
.imv-foto{display:block;margin:-1.05rem -1.05rem 0;aspect-ratio:16/10;overflow:hidden;
  border-radius:var(--r-lg) var(--r-lg) 0 0;background:var(--surface-2)}
.imv-foto img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .18s}
.imv:hover .imv-foto img{transform:scale(1.03)}
.imv-top{display:flex;justify-content:space-between;align-items:flex-start;gap:.5rem;min-height:1.3rem}
.imv-tags{display:flex;flex-wrap:wrap;gap:.3rem}
.tag{font-size:.72rem;font-weight:600;letter-spacing:0;
  border-radius:6px;padding:.16rem .5rem;line-height:1.35}
.tag-novo{background:var(--accent);color:#fff}
.tag-queda{background:var(--warn-wash);color:var(--warn)}
.tag-fav{background:var(--mid-bg);color:var(--mid)}
.tag-env{background:var(--pos-wash);color:var(--pos)}
/* "mobiliado", "planejados", "pronto pra morar" são ATRIBUTOS do imóvel, não
   estado que exija ação — e eram três selos em azul no mesmo card, lado a lado
   com "novo", que também é azul. Era esse acúmulo que fazia o azul parar de
   querer dizer alguma coisa. Neutros agora; o azul fica pra ação e pro que
   mudou desde a última rodada. */
.tag-mob{background:var(--surface-2);color:var(--ink-soft);border:1px solid var(--line)}
.tag-parado{background:var(--lo-bg);color:var(--lo)}
.tag-reforma{background:var(--warn-wash);color:var(--warn)}
.tag-visto{background:var(--surface-2);color:var(--dim);border:1px solid var(--line)}
.tag-visitado{background:var(--mid-bg);color:var(--mid)}
.tag-vale{background:var(--accent-wash);color:var(--accent-d)}
.fb button.vale-preco.on{background:var(--accent-d);border-color:var(--accent-d);color:#fff}
.tag-foto{background:var(--warn-wash);color:var(--warn)}
.tag-tk{background:var(--surface-2);color:var(--ink-soft);border:1px solid var(--line-soft)}
.tag-tk.t-baixo{color:var(--pos)}
.tag-tk.t-alto{color:var(--accent-d)}
a.crit.t-baixo.on{background:var(--pos);border-color:var(--pos)}
a.crit.t-alto.on{background:var(--accent-d);border-color:var(--accent-d)}
.imv-scores{display:flex;gap:.3rem;flex:none}

.imv-tit{font-size:.94rem;margin:0;font-weight:600;letter-spacing:-.01em;line-height:1.35}
.imv-tit .dim{display:block;font-weight:450;font-size:.83rem;margin-top:.1rem;color:var(--ink-soft)}
.imv-preco{font-size:1.22rem;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.imv-preco .dim{font-size:.8rem;font-weight:450}
.imv-preco.sc{font-size:.95rem;font-weight:550;color:var(--dim)}
.spark{vertical-align:middle;margin-left:.5rem;color:var(--dim);overflow:visible}
.spark-down{color:var(--warn)}
.imv-op{font-size:.82rem;color:var(--pos);background:var(--pos-wash);
  border-radius:var(--r-sm);padding:.4rem .6rem;line-height:1.45}
.imv-op .dim{color:var(--pos);opacity:.75}
.imv-ia{font-size:.82rem;color:var(--accent-d);background:var(--accent-wash);
  border-radius:var(--r-sm);padding:.4rem .6rem;line-height:1.45}
.imv-ia .dim{color:var(--accent-d);opacity:.75}
.imv-capta{font-size:.82rem;color:var(--accent-d);background:var(--accent-wash);
  border-radius:var(--r-sm);padding:.4rem .6rem;line-height:1.45;font-weight:500}
a.crit{text-decoration:none}
a.crit:hover{border-color:var(--accent);color:var(--ink)}
a.crit.on{background:var(--ink);border-color:var(--ink);color:var(--surface)}
.capta-cidades{margin:.7rem 0}

.imv-acoes{display:flex;justify-content:space-between;align-items:center;gap:.5rem;
  margin-top:auto;padding-top:.65rem;border-top:1px solid var(--line-soft);flex-wrap:wrap}
.imv-link{font-size:.82rem;font-weight:600}
.fb{display:flex;gap:.3rem;position:relative}
.fb button{background:var(--surface);color:var(--dim);border:1px solid var(--line);
  border-radius:var(--r-sm);padding:.3rem .5rem;font-size:.8rem;font-weight:600;
  transition:.12s;line-height:1}
.fb button:hover{border-color:var(--accent);color:var(--ink)}
.fb button.on{background:var(--accent);color:#fff;border-color:var(--accent)}
.fb button[data-a="discarded"].on{background:var(--danger);border-color:var(--danger)}
/* captações: "vale a pena" / "não vale" — treina o algoritmo daquela cidade */
.fb-capta button.vale.on{background:var(--pos);border-color:var(--pos);color:#fff}
.fb-capta button.naovale.on{background:var(--danger);border-color:var(--danger);color:#fff}
.fb-capta button.vale:hover{border-color:var(--pos);color:var(--pos)}
.fb-capta button.naovale:hover{border-color:var(--danger);color:var(--danger)}
/* 📞 "fiz contato" — worklist: qual imóvel eu já corri atrás */
.fb-capta button.contato.on{background:var(--accent);border-color:var(--accent);color:#fff}
.fb-capta button.contato:hover{border-color:var(--accent);color:var(--accent)}

/* seção "vale a pena" (o que o corretor marcou 👍) no topo das captações */
.bloco-vale{border:1px solid var(--pos);border-radius:var(--r);padding:1rem 1rem .4rem;
  background:var(--pos-wash)}
.bloco-vale > h2{margin-top:0}
.sub-vale{margin:.2rem 0 .8rem}
/* a worklist é `details`: fechada ela vira uma faixa de um resumo só, e as
   captações novas voltam pra primeira tela */
.bloco-vale>summary{list-style:none;cursor:pointer;display:flex;align-items:center;
  gap:.75rem;flex-wrap:wrap}
.bloco-vale>summary::-webkit-details-marker{display:none}
.bloco-vale>summary::marker{content:""}
.bloco-vale>summary h2{margin:0}
/* a seta é do `details`, então gira sozinha com o estado */
.bloco-vale>summary::after{content:"▸";color:var(--pos);font-size:.85rem;
  transition:transform .15s}
.bloco-vale[open]>summary::after{transform:rotate(90deg)}
.vale-resumo{margin-left:auto;font-size:.84rem;color:var(--ink-soft)}
.bloco-vale:not([open]){padding-bottom:1rem}

/* ☰ / ▦ — troca lista por card com foto grande (parâmetro `vista`) */
.vista-sw{display:inline-flex;gap:.15rem;margin-left:.5rem}
.vista-sw .crit{padding:.3rem .5rem;font-size:.9rem;line-height:1}
.grid-feito .imv{opacity:.6}
.grid-feito .imv:hover{opacity:1}
.imv.is-contatado .fb-capta button.contato.on{box-shadow:0 0 0 2px var(--accent-wash)}
.tag-contato{background:var(--accent-wash);color:var(--accent-d,var(--accent))}

.motivo-pop{position:absolute;bottom:100%;right:0;margin-bottom:.4rem;z-index:8;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm);
  box-shadow:var(--sh-lift);padding:.4rem;display:flex;flex-direction:column;gap:.2rem;
  min-width:150px}
.motivo-pop button{background:transparent;border:0;text-align:left;padding:.35rem .5rem;
  border-radius:6px;font-size:.82rem;color:var(--ink-soft);font-weight:500}
.motivo-pop button:hover{background:var(--surface-2);color:var(--ink)}
.motivo-pop button.sm{color:var(--dim);border-top:1px solid var(--line-soft);
  margin-top:.15rem;padding-top:.45rem;font-size:.78rem}
.fb button.wa:hover{border-color:#25d366;color:#128c3e}

/* selo de score (compat / oportunidade) */
.b{display:inline-block;min-width:2.4em;text-align:center;padding:.16em .5em;
  border-radius:999px;font-weight:700;font-size:.71rem;letter-spacing:.01em;white-space:nowrap}
.compat-hi,.op-hi{background:var(--hi-bg);color:var(--hi)}
.compat-mid,.op-mid{background:var(--mid-bg);color:var(--mid)}
.compat-lo,.op-lo{background:var(--lo-bg);color:var(--lo)}
.b.dim{background:transparent;color:var(--dim);font-weight:400}

/* ---- 8. tabelas (base / fontes / resultados) ---------------------- */
.filtros-inline{display:flex;gap:.5rem;margin:.9rem 0;flex-wrap:wrap}
.filtros-inline input{width:150px;flex:1;min-width:120px}
/* tabelas têm 6-10 colunas — no celular teriam que espremer ou vazar da tela;
   em vez disso, rola só a tabela na horizontal, a página em si nunca rola de lado */
.tabela-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--r);
  border:1px solid var(--line)}
.tabela-scroll table.resultados{border:0;border-radius:0}
table.resultados{width:100%;border-collapse:separate;border-spacing:0;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;font-size:.86rem}
table.resultados th{background:var(--surface-2);text-align:left;padding:.6rem .75rem;
  border-bottom:1px solid var(--line);white-space:nowrap;font-weight:600;color:var(--ink-soft)}
table.resultados td{padding:.55rem .75rem;border-bottom:1px solid var(--line-soft)}
table.resultados tbody tr:last-child td{border-bottom:0}
table.resultados tbody tr:hover{background:var(--surface-2)}
table.resultados tr.motivo td{padding:.35rem .75rem;background:var(--pos-wash);color:var(--pos);font-size:.82rem}
table.sortable th[data-sort]{cursor:pointer}
table.sortable th[data-sort]:hover{color:var(--accent)}

details.dups,details.dups summary{display:inline}
details.dups summary{cursor:pointer;color:var(--dim);font-size:.8rem;margin-left:.3rem}
details.dups a{display:inline-block;margin-left:.4rem;font-size:.8rem}

/* mesma classe .dups, mas dentro do cartão de imóvel vira bloco próprio */
.imv details.dups{display:block;font-size:.8rem;color:var(--dim);margin-top:-.15rem}
.imv details.dups summary{display:list-item;margin-left:0;cursor:pointer}
.imv details.dups a{display:block;margin:.25rem 0 0 1rem}

/* ---- 9. overlay de carregamento --------------------------------- */
#loading{position:fixed;inset:0;background:color-mix(in srgb,var(--bg) 82%,transparent);
  -webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;z-index:60}
#loading .box{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:2rem 2.5rem;text-align:center;max-width:380px;box-shadow:var(--sh-lift)}
#loading p{margin:.4rem 0}
.spinner{width:34px;height:34px;border:3px solid var(--line);border-top-color:var(--accent);
  border-radius:50%;margin:0 auto .8rem;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* ---- 10. responsivo --------------------------------------------- */
@media (max-width:640px){
  main{padding:1.2rem 1rem 3rem}
  header{gap:.5rem .9rem;flex-wrap:wrap;padding:.55rem 1rem}
  .srv .txt{display:none}
  .srv{padding:.3rem;margin-left:auto;order:2}
  .logo{order:1}
  header .btn-sec{order:2}
  /* nav com 5 links não cabe numa linha — vira faixa própria, rolável na
     horizontal, em vez de quebrar em 2-3 linhas desalinhadas */
  header nav{order:3;flex-basis:100%;flex-wrap:nowrap;overflow-x:auto;
    -webkit-overflow-scrolling:touch;gap:.3rem;padding-bottom:.15rem}
  header nav a{white-space:nowrap;flex:none;padding:.45rem .8rem}
  .hero{padding:1.2rem}
  .stats{grid-template-columns:1fr 1fr}
  .radar-cards,.imv-grid{grid-template-columns:1fr}
  .imv-acoes{flex-direction:column;align-items:stretch}
  .fb{justify-content:space-between}
  .fb button{padding:.55rem .6rem;font-size:.85rem}
  table.resultados{font-size:.8rem}

  /* área de ações do radar (rodar/pausar/excluir) e barra de filtro —
     em vez de botões pequenos lado a lado, empilha em largura cheia:
     mais fácil de acertar o toque, sem precisar mirar */
  .acoes-radar{flex-direction:column;align-items:stretch}
  .acoes-radar form,.acoes-radar>a{width:100%}
  .acoes-radar form button{width:100%}
  .acoes-radar .spacer{display:none}
  .filtro-bar{padding:.8rem .9rem}
  .filtro-bar input[type=number],.filtro-bar input[name=preco_max]{width:100%}
  .filtro-bar label{flex:1;min-width:110px}
  .filtro-bar select[name=bairro]{max-width:none;width:100%}
  .toggles button{padding:.5rem .8rem;font-size:.81rem}

  .cliente-form{grid-template-columns:1fr}
  .painel-meta{flex-basis:100%;margin-left:1rem}
}

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

/* produção da última rodada (complemento ao Result=success do systemd) */
.job-prod { margin-top: 2px; font-size: .72rem }

/* 🔑 anúncio do próprio dono — o achado que a tela de captação existe pra mostrar */
.tag-dono { background: #0f7a3d; color: #fff; font-weight: 600 }
.tag-anunciante { background: var(--bg-2, #eee); color: var(--fg-2, #555) }


/* ---- organização da nav: o dia a dia visível, o resto agrupado ----
   Eram 8 itens + selo + usuário + sair, e "Servidor" caía sozinho numa 2ª
   linha em TODA tela a 1280px. */
header nav{flex-wrap:nowrap;gap:.1rem}
.nav-mais{position:relative}
.nav-mais>summary{list-style:none;cursor:pointer;color:var(--ink-soft);font-weight:500;
  font-size:.88rem;padding:.32rem .55rem;border-radius:var(--r-s);white-space:nowrap}
.nav-mais>summary::-webkit-details-marker{display:none}
.nav-mais>summary::marker{content:""}
.nav-mais>summary:hover{background:var(--surface-2);color:var(--ink)}
.nav-mais>summary.on{background:var(--ink);color:var(--surface)}
.nav-mais>div{position:absolute;top:calc(100% + .3rem);left:0;z-index:40;min-width:11rem;
  display:flex;flex-direction:column;gap:.1rem;padding:.3rem;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  box-shadow:0 10px 28px rgba(0,0,0,.12)}
@media (max-width:640px){
  /* a faixa rolável da nav (bloco 10) recortava o menu Sistema, que abre PRA
     FORA dela: `overflow-x:auto` cria contexto de recorte. Com 4 links + menu
     cabe quebrar em duas linhas, e nada fica escondido fora da tela. */
  header nav{flex-wrap:wrap;overflow:visible}
  .nav-mais>div{left:auto;right:0}
}

/* pílulas do card de radar em grade: sem isso cada card quebrava numa altura
   diferente (2 ou 3 linhas) e a grade inteira ficava irregular */
.rc-nums{display:grid;grid-template-columns:repeat(auto-fill,minmax(7.2rem,1fr));gap:.35rem}
.rc-nums span{justify-content:flex-start}

/* motivo da captação: 3 linhas, resto no title do hover. O clamp fica no SPAN
   de dentro, não no bloco: `overflow` corta na borda do PADDING, então clampar o
   bloco deixava ~6 px da 4ª linha aparecendo dentro do padding de baixo. */
.imv-capta span{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;
  overflow:hidden}


/* barra de filtros da captação: um bloco só, com rótulo por grupo */
.filtros{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem 1.2rem;
  margin:.7rem 0 1.1rem;padding:.55rem .75rem;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r)}
/* grupo rotulado — serve à barra da captação e à do radar (.toggles) */
.fg{display:flex;flex-wrap:wrap;align-items:center;gap:.3rem}
.fg-rot{font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--dim);margin-right:.1rem}
.filtros .fg-fim{margin-left:auto}
.toggles{gap:.35rem 1.1rem;align-items:center}
.crit-dono.on{background:#0f7a3d;border-color:#0f7a3d;color:#fff}
.crit-dono.on .dim{color:#cfe9da}


/* ---- captação: a linha (.ci) -----------------------------------------
   É o formato da página inteira, worklist e lista geral. O card grande com
   foto de 200 px fazia sentido pra escolher UM imóvel; a captação é varrer 225
   pra marcar dez, e em card isso dava uma página de 14.837 px com metade da
   altura em foto de cozinha. A linha alinha tudo em colunas — o olho desce
   comparando preço com preço, m² com m², em vez de saltar entre cartões.
   O que não cabe numa linha não sumiu: abre no clique. */
.ci-grupo{margin:.2rem 0 1.5rem;border:1px solid var(--line);border-radius:var(--r);
  background:var(--surface);overflow:hidden}
.ci-grupo-tit{font-size:.7rem;font-weight:650;text-transform:uppercase;
  letter-spacing:.06em;color:var(--dim);margin:1.1rem 0 .4rem;padding-left:.1rem}
.ci-grupo-tit .dim{text-transform:none;letter-spacing:0;font-weight:500}

.ci{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;
  border-bottom:1px solid var(--line-soft)}
.ci:last-child{border-bottom:0}
.ci:hover{background:var(--surface-2)}
.ci-det{min-width:0}
/* duas linhas: os dados na de cima, o argumento na de baixo com a largura
   toda. Numa coluna ao lado, o motivo cabia em 45 caracteres e perdia sempre
   o número que decide ("−32% vs a mediana"). Score e foto atravessam as duas. */
.ci-det>summary{list-style:none;cursor:pointer;display:grid;align-items:center;
  gap:.15rem .75rem;padding:.42rem .7rem;
  grid-template-columns:2.4rem 3.4rem 12.8rem minmax(0,1fr);
  grid-template-rows:auto auto}
.ci-det>summary::-webkit-details-marker{display:none}
.ci-det>summary::marker{content:""}
.ci-score,.ci-thumb{grid-row:1/3}
.ci-preco{grid-column:3;grid-row:1}
.ci-specs{grid-column:4;grid-row:1}
.ci-motivo{grid-column:3/-1;grid-row:2}

/* o score é a razão da ordem da lista — fica na margem, como numeração */
.ci-score{font-size:.82rem;font-weight:700;text-align:center;border-radius:var(--r-sm);
  padding:.2rem 0;font-variant-numeric:tabular-nums}
.ci-score.hi{background:var(--hi-bg);color:var(--hi)}
.ci-score.mid{background:var(--mid-bg);color:var(--mid)}
.ci-score.lo{background:var(--lo-bg);color:var(--lo)}

/* 3,4 rem bastam pra "é apartamento decente ou é foto de geladeira" */
.ci-thumb{width:3.4rem;height:2.5rem;border-radius:var(--r-sm);overflow:hidden;
  background:var(--surface-2);display:block}
.ci-thumb img{width:100%;height:100%;object-fit:cover;display:block}

.ci-preco{font-weight:650;font-size:.9rem;white-space:nowrap;
  font-variant-numeric:tabular-nums;line-height:1.25}
.ci-preco small{font-weight:500;font-size:.72rem;color:var(--dim);margin-left:.25rem}
.ci-specs{font-size:.84rem;color:var(--ink-soft);display:flex;align-items:center;
  gap:.3rem;flex-wrap:wrap;min-width:0}
.ci-specs .tag{font-size:.68rem;padding:.06rem .3rem}
.ci-motivo{font-size:.78rem;color:var(--dim);white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;min-width:0}

.ci-corpo{padding:.1rem .7rem .8rem 6.5rem;display:flex;flex-direction:column;
  gap:.45rem;align-items:flex-start}
.ci-meta{margin:0;font-size:.79rem;color:var(--dim)}
.ci .fb{flex:none;padding-right:.6rem;gap:.25rem}
.ci .fb button{white-space:nowrap;font-size:.76rem;padding:.26rem .5rem}
.ci .captei.on{background:var(--pos);border-color:var(--pos);color:#fff}
.tag-captei{background:var(--pos);color:#fff}
/* contato feito e captado ficam visíveis, mas recuam: o que salta é o que falta */
.ci.is-contatado .ci-preco,.ci.is-contatado .ci-specs{opacity:.6}
.ci.is-disc{opacity:.45}
.ci.is-captei{background:var(--pos-wash)}
.ci-destaques{border-color:var(--accent);box-shadow:var(--sh)}

@media (max-width:640px){
  .ci{grid-template-columns:1fr}
  .ci-det>summary{grid-template-columns:2.4rem 3.4rem minmax(0,1fr);gap:.2rem .5rem;
    padding:.5rem .6rem}
  .ci-preco{grid-column:3;grid-row:1}
  .ci-specs{grid-column:3;grid-row:2}
  .ci-motivo{grid-column:1/-1;grid-row:3}
  .ci-corpo{padding-left:.6rem}
  .ci .fb{justify-content:flex-end;padding:0 .6rem .5rem}
}

/* endereço na captação: o uso é copiar pro EEmovel, então fica em bloco
   próprio, selecionável, e não espremido na linha de specs */
.ci-end{margin:0;font-size:.84rem;font-weight:550;color:var(--ink-soft);
  user-select:all}
.ci-end-fraco{font-weight:450;color:var(--dim);user-select:auto}
.ci-end .dim{font-weight:450}
.tag-end{background:var(--accent-wash);color:var(--accent-d)}
.crit-end.on{background:var(--accent);border-color:var(--accent);color:#fff}
.crit-end.on .dim{color:#d9dcfb}
.ci-endereco{display:flex;flex-direction:column;gap:.1rem}
.ci-end-ev{margin:0;font-size:.76rem;color:var(--dim)}
.ev-ruim{color:var(--danger);font-weight:600}
.ev-bom{color:var(--pos);font-weight:600}

/* ---- painel de entrada --------------------------------------------------
   Quatro números e uma tabela. A tentação aqui é encher de gráfico; o que a
   pessoa pergunta ao abrir é "mudou alguma coisa?", e isso são números. */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
  gap:var(--sp-3);margin:var(--sp-5) 0}
.kpi{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:var(--sp-4);display:flex;flex-direction:column;gap:.15rem;
  color:var(--ink);transition:border-color .12s,transform .12s}
a.kpi:hover{border-color:var(--accent);text-decoration:none;transform:translateY(-1px)}
.kpi b{font-size:1.75rem;font-weight:700;letter-spacing:-.03em;line-height:1.1}
.kpi span{font-size:.79rem;color:var(--dim)}
/* a cor diz o QUE é, não o quanto: verde oportunidade, amarelo queda, azul novo */
.kpi.k-pos b{color:var(--pos)} .kpi.k-warn b{color:var(--warn)} .kpi.k-acc b{color:var(--accent)}

.painel-radares td b.n-pos{color:var(--pos)}
.painel-radares td b.n-warn{color:var(--warn)}
.painel-radares td b.n-acc{color:var(--accent)}

.acoes{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:var(--sp-3)}
.acao{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);
  padding:var(--sp-4);display:flex;flex-direction:column;gap:.3rem;color:var(--ink)}
.acao:hover{border-color:var(--accent);text-decoration:none}
.acao span{font-size:.8rem;color:var(--dim)}

/* linhas de radar do painel — substituem a tabela, que escrevia o mesmo nome
   de cliente em duas linhas e não dizia qual radar era qual */
.rad-lista{display:flex;flex-direction:column;gap:.4rem}
.rad-linha{display:grid;grid-template-columns:minmax(0,1.1fr) auto auto;gap:var(--sp-4);
  align-items:center;background:var(--surface);border:1px solid var(--line);
  border-radius:var(--r);padding:.7rem var(--sp-4);color:var(--ink);
  transition:border-color .12s,transform .12s}
.rad-linha:hover{border-color:var(--accent);text-decoration:none;transform:translateY(-1px)}
.rad-tit{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.rad-tit b{font-weight:600;letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rad-cli{font-size:.74rem;color:var(--dim)}
.rad-nums{display:flex;gap:.35rem;flex-wrap:wrap;justify-content:flex-end}
.pil{font-size:.76rem;color:var(--ink-soft);background:var(--surface-2);
  border:1px solid var(--line);border-radius:999px;padding:.2rem .55rem;white-space:nowrap}
.pil b{font-weight:700}
/* a cor diz O QUE é, e é a mesma do resto do painel */
.pil.p-pos{background:var(--pos-wash);border-color:transparent;color:var(--pos)}
.pil.p-acc{background:var(--accent-wash);border-color:transparent;color:var(--accent-d)}
.pil.p-warn{background:var(--warn-wash);border-color:transparent;color:var(--warn)}
.rad-quando{font-size:.75rem;white-space:nowrap}
@media (max-width:760px){
  .rad-linha{grid-template-columns:1fr;gap:.45rem}
  .rad-nums{justify-content:flex-start}
}

/* resumo do radar no card: uma linha do que define a busca, o lugar embaixo */
.rc-resumo{font-size:.83rem;color:var(--ink-soft);margin:.1rem 0 .15rem;
  display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}
.rc-mais{font-size:.7rem;color:var(--dim);background:var(--surface-2);
  border:1px solid var(--line);border-radius:999px;padding:.05rem .35rem;cursor:help}
.rc-onde{font-size:.78rem;color:var(--dim);margin-bottom:.5rem}

/* ---- celular, revisto em 02/10 -------------------------------------------
   Medido a 390 px (iPhone): o menu virava 3 linhas de abas + o logo solto
   (~150 px antes de qualquer conteúdo); os filtros de captação ocupavam a
   1ª tela inteira; as ações do radar eram 5 faixas cheias com o "excluir"
   tão chamativo quanto o "rodar agora". Este bloco vem por último e manda. */
@media (max-width:860px){
  /* linha 1: logo + status; linha 2: abas numa faixa única que rola */
  .lateral{flex-wrap:wrap;row-gap:.35rem;padding:.5rem var(--sp-4) .35rem}
  .lateral .logo{order:1}
  .lateral-pe{order:2}
  .lateral nav{order:3;flex-basis:100%;flex-wrap:nowrap;overflow-x:auto;
    -webkit-overflow-scrolling:touch;scrollbar-width:none;gap:.25rem;
    margin:0 calc(-1 * var(--sp-4));padding:0 var(--sp-4) .15rem}
  .lateral nav::-webkit-scrollbar{display:none}
  .lateral nav a{white-space:nowrap;flex:none}
}
@media (max-width:640px){
  .srv .txt{display:none}
  .srv{padding:.32rem}

  /* cada grupo de chips (captações, filtros do radar) numa linha que rola —
     em vez de quebrar em 3-4 linhas e empurrar os imóveis pra 2ª tela */
  .fg{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;
    scrollbar-width:none;max-width:100%;padding-bottom:.1rem}
  .fg::-webkit-scrollbar{display:none}
  .fg>*{flex:none;white-space:nowrap}
  .filtros{gap:.45rem}

  /* ações do radar: "rodar agora" em largura cheia; o resto lado a lado,
     ainda fácil de tocar; "excluir" discreto no fim (é irreversível) */
  .acoes-radar{display:grid;grid-template-columns:1fr 1fr;gap:.45rem}
  .acoes-radar form:first-child{grid-column:1/-1}
  .acoes-radar>a,.acoes-radar>button,.acoes-radar form,.acoes-radar form button{width:100%}
  .acoes-radar .btn-sec{text-align:center}
  .acoes-radar .btn-danger{background:none;border:0;color:var(--dim);font-weight:500;
    font-size:.82rem;padding:.4rem}
  /* pausar | excluir na mesma linha (o excluir só existe pra quem pode) */

  /* tabela "por bairro": o preço não quebra em "R$ / 4.253/m²" */
  .bairro-row{grid-template-columns:minmax(0,1fr) 2.2rem auto}
  .bairro-m2{white-space:nowrap}

  /* tela de treino: 2×2 e sem atalho de teclado que não existe no toque */
  .ti-acoes{grid-template-columns:1fr 1fr}
}
@media (hover:none){.so-teclado{display:none}}
@media (max-width:640px){
  /* a faixa que rola só funciona se o pai deixar ela encolher: item flex não
     fica menor que o conteúdo sem min-width:0 (a página do radar tinha virado
     558 px de largura numa tela de 390) */
  .toggles,.filtros{min-width:0;max-width:100%;width:100%}
  .toggles .fg,.filtros .fg{min-width:0;flex:1 1 100%}
}
@media (max-width:640px){
  /* tabelas (Imóveis, Aprendizado): sem quebrar "R$ / 1.820.000" em duas
     linhas — cada linha fica baixa e a tabela rola de lado na própria caixa */
  table.resultados th,table.resultados td{white-space:nowrap;padding:.45rem .55rem}
}
/* contas da equipe (/servidor/corretores): ações por linha */
.acoes-equipe{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center}
.acoes-equipe form{display:inline-flex;gap:.3rem}
.troca-senha input{width:9rem;padding:.35rem .5rem}
