/* Módulo Imóveis — Tela 1, a lista (plan/16 §9, web/imoveis.js).
 *
 * Componentes fiéis ao Stitch (`docs/referencia/stitch-imoveis/t1.html`):
 * medidas, raios, sombras e pesos vêm de lá, convertidos do Tailwind para
 * CSS puro. Cores: as do app (`app.css`) quando o papel é o mesmo — fundo,
 * cartão, texto, carmesim de ação — e tokens `--im-*` abaixo para o que o app
 * ainda não tinha (chip cinza, contagem vermelha, barra de lote invertida…).
 *
 * ⚠️ Nenhuma cor fora dos dois blocos de token (CLAUDE.md §4): cada `--im-*`
 * tem par no escuro, exceto os marcados "sobre foto", que não têm tema — o que
 * está atrás deles é uma fotografia (mesma exceção declarada em app.css). */
:root {
  --im-chip: #e6e8ea;              /* surface-container-high: chip, barra de seleção, caixa desmarcada */
  --im-erro: #ba1a1a;              /* o ponto do chip "Com problema" */
  --im-erro-s: #ffdad6;            /* contagem "A validar" */
  --im-erro-fg: #93000a;
  --im-nota-bom-s: #dff3e8;   --im-nota-bom-fg: #0b6a4c;
  --im-nota-medio-s: #fdf0d5; --im-nota-medio-fg: #8a4b06;
  --im-nota-ruim-s: #ffdad6;  --im-nota-ruim-fg: #93000a;
  --im-aviso-s: #fdf3de;           /* âmbar de atenção: busca aproximada, "parado há N dias" */
  --im-aviso-fg: #7c4306;
  --im-aviso-ico: #b45309;
  --im-lote-bg: #2d3133;           /* inverse-surface: a barra flutuante */
  --im-lote-fg: #ffffff;
  --im-lote-btn: rgba(224, 227, 229, .2);
  --im-lote-btn-hover: rgba(224, 227, 229, .3);
  --im-lote-ponto: #ffb3ae;
  --im-sombra-sm: 0 1px 2px rgba(0, 0, 0, .05);
  --im-sombra-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -2px rgba(0, 0, 0, .1);
  --im-sombra-xl: 0 20px 25px -5px rgba(0, 0, 0, .1), 0 8px 10px -6px rgba(0, 0, 0, .1);
  --im-foco: rgba(25, 28, 30, .18);
  /* sobre foto — sem par no escuro, de propósito */
  --im-codigo-bg: rgba(45, 49, 51, .8);
  --im-codigo-fg: #eff1f3;
}

:root[data-tema="escuro"] {
  --im-chip: #252c35;
  --im-erro: #f87171;
  --im-erro-s: #45161b;
  --im-erro-fg: #fda4ab;
  --im-nota-bom-s: #12302a;   --im-nota-bom-fg: #34d399;
  --im-nota-medio-s: #3a2c10; --im-nota-medio-fg: #fbbf24;
  --im-nota-ruim-s: #45161b;  --im-nota-ruim-fg: #fda4ab;
  --im-aviso-s: #3a2c10;
  --im-aviso-fg: #fcd38d;
  --im-aviso-ico: #f59e0b;
  --im-lote-bg: #e6edf3;
  --im-lote-fg: #0e1116;
  --im-lote-btn: rgba(14, 17, 22, .08);
  --im-lote-btn-hover: rgba(14, 17, 22, .14);
  --im-lote-ponto: #c51f2b;
  --im-sombra-sm: 0 1px 2px rgba(0, 0, 0, .5);
  --im-sombra-md: 0 4px 6px -1px rgba(0, 0, 0, .55), 0 2px 4px -2px rgba(0, 0, 0, .45);
  --im-sombra-xl: 0 20px 25px -5px rgba(0, 0, 0, .6), 0 8px 10px -6px rgba(0, 0, 0, .5);
  --im-foco: rgba(230, 237, 243, .28);
}

/* ── base ──────────────────────────────────────────────────────────────── */
.im-tela { display: flex; flex-direction: column; gap: 16px; }
.im-tela p { margin: 0; }
.im-ico { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.im-titulo, .im-cadastrar, .im-pilula, .im-selecao-t, .im-preco, .im-lote-rotulo, .im-lote-btn,
.im-mais, .im-marcar-todos {
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
/* o `button:hover` global pinta de carmesim: aqui nada é botão principal,
   exceto os que dizem isso de novo abaixo */
.im-tela button, .im-lote button, .im-opcoes button { min-height: 0; }

/* ── cabeçalho: "Imóveis" + Cadastrar ───────────────────────────────────── */
.im-cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 4px; }
.im-titulo { margin: 0; font-size: 24px; line-height: 30px; font-weight: 700;
  letter-spacing: -.025em; color: var(--fg); }
.im-sub { font-size: 14px; line-height: 20px; color: var(--muted); }
.im-cadastrar { display: inline-flex; align-items: center; justify-content: center; gap: 4px;
  flex: none; height: 44px; padding: 0 16px; border-radius: 10px;
  background: var(--acao); color: var(--acao-fg); box-shadow: var(--im-sombra-md);
  font-size: 13px; line-height: 18px; font-weight: 700; letter-spacing: .01em;
  text-decoration: none; transition: transform .12s ease, background .12s; }
.im-cadastrar:hover { background: var(--acao-hover); }
.im-cadastrar:active { transform: scale(.95); }
.im-cadastrar .im-ico { width: 20px; height: 20px; }

/* ── abas e chips (a mesma pílula) ──────────────────────────────────────── */
/* A fileira rola de lado até a BORDA da tela, como no Stitch (-mx-margin
   px-margin): a margem negativa desfaz o respiro de `main` (20px; 14px no
   celular, app.css). */
.im-rolo { display: flex; align-items: center; gap: 4px; overflow-x: auto;
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
  margin: 0 -20px; padding: 4px 20px; }
.im-rolo::-webkit-scrollbar { display: none; }
.im-rolo-chips { padding-top: 0; }
@media (max-width: 600px) { .im-rolo { margin: 0 -14px; padding-left: 14px; padding-right: 14px; } }
.im-pilula { display: inline-flex; align-items: center; gap: 4px; flex: none; height: 36px;
  padding: 0 16px; border: 0; border-radius: 999px; white-space: nowrap;
  background: var(--bg2); color: var(--muted); box-shadow: var(--im-sombra-sm);
  font-size: 13px; line-height: 18px; font-weight: 600; letter-spacing: .01em;
  transition: color .12s, background .12s; }
.im-pilula:hover { background: var(--bg2); color: var(--fg); }
.im-pilula.on, .im-pilula.on:hover { background: var(--fg); color: var(--bg2); }
.im-pilula:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; }
.im-pilula .im-ico { width: 16px; height: 16px; }
.im-conta { display: inline-block; min-width: 20px; padding: 2px 4px; border-radius: 999px;
  background: var(--im-erro-s); color: var(--im-erro-fg); text-align: center;
  font-size: 12px; line-height: 1; font-weight: 700; letter-spacing: .02em; }
.im-conta[hidden] { display: none; }
.im-ponto { width: 8px; height: 8px; border-radius: 50%; background: var(--im-erro); flex: none; }

/* ── busca ──────────────────────────────────────────────────────────────── */
.im-filtros { display: flex; flex-direction: column; gap: 8px; }
.im-busca { position: relative; margin: 0; }
.im-busca > .im-ico { position: absolute; left: 16px; top: 50%; transform: translateY(-50%);
  width: 20px; height: 20px; color: var(--muted); pointer-events: none; }
.im-busca input { display: block; width: 100%; height: 48px; margin: 0; padding: 0 16px 0 44px;
  border: 0; border-radius: 10px; background: var(--bg2); color: var(--fg);
  box-shadow: var(--im-sombra-sm); font: inherit; font-size: 15px; line-height: 22px;
  -webkit-appearance: none; appearance: none; transition: box-shadow .15s; }
.im-busca input::placeholder { color: var(--muted); opacity: 1; }
.im-busca input:focus { outline: none; box-shadow: var(--im-sombra-md), 0 0 0 2px var(--im-foco); }

/* ── "2 selecionados · Marcar todos · ✕" ────────────────────────────────── */
.im-selecao { display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 8px 16px; border-radius: 12px; background: var(--im-chip); box-shadow: var(--im-sombra-sm); }
.im-selecao[hidden] { display: none; }
.im-selecao-conta, .im-selecao-acoes { display: flex; align-items: center; }
.im-selecao-conta { gap: 8px; min-width: 0; }
.im-selecao-acoes { gap: 4px; flex: none; }
.im-selecao-n { display: grid; place-items: center; width: 28px; height: 28px; flex: none;
  border-radius: 50%; background: var(--acao); color: var(--acao-fg);
  font-size: 12px; line-height: 16px; font-weight: 700; }
.im-selecao-t { font-size: 18px; line-height: 24px; font-weight: 700; letter-spacing: -.015em;
  color: var(--fg); white-space: nowrap; }
.im-marcar-todos { height: 32px; padding: 0 8px; border-radius: 8px; background: transparent;
  color: var(--acao-texto); font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: .02em; }
.im-marcar-todos:hover { background: var(--bg3); }
.im-limpar { display: grid; place-items: center; width: 32px; height: 32px; padding: 0;
  border-radius: 50%; background: transparent; color: var(--muted); }
.im-limpar:hover { background: var(--bg3); color: var(--fg); }
.im-limpar .im-ico { width: 18px; height: 18px; }

/* ── o card ─────────────────────────────────────────────────────────────── */
.im-lista { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; }
@media (min-width: 900px) { .im-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } }
.im-card { position: relative; display: flex; flex-direction: column; gap: 8px; overflow: hidden;
  padding: 16px; border-radius: 14px; background: var(--bg2); box-shadow: var(--im-sombra-sm);
  -webkit-touch-callout: none; transition: box-shadow .15s; }
.im-card:hover { box-shadow: var(--im-sombra-md); }
/* link esticado: o card inteiro abre a ficha, e a caixa de seleção fica
   ACIMA dele (irmãos, não aninhados — interativo dentro de interativo quebra
   teclado e leitor de tela; mesma solução do card da vitrine) */
.im-link { position: absolute; inset: 0; z-index: 1; border-radius: 14px; }
.im-link:focus-visible { outline: 2px solid var(--acao); outline-offset: -2px; }
.im-card-linha { display: flex; align-items: flex-start; gap: 16px; }

/* O quadrado mede 20px e a caixa 24px no Stitch (mt-1); o ALVO do dedo mede
   44px — as margens negativas devolvem o espaço, e o quadrado cai no mesmo
   lugar do desenho. */
.im-check { position: relative; z-index: 2; display: flex; align-items: center; justify-content: center;
  flex: none; width: 44px; height: 44px; margin: -6px -10px -14px; padding: 0; cursor: pointer; }
.im-check input { position: absolute; inset: 0; width: 100%; height: 100%;
  margin: 0; opacity: 0; cursor: pointer; }
.im-check-caixa { display: grid; place-items: center; width: 20px; height: 20px; border-radius: 6px;
  background: var(--im-chip); color: transparent; transition: background .12s, color .12s; }
.im-check-caixa .im-ico { width: 16px; height: 16px; stroke-width: 3; }
.im-check input:checked + .im-check-caixa { background: var(--acao); color: var(--acao-fg);
  box-shadow: var(--im-sombra-sm); }
.im-check input:focus-visible + .im-check-caixa { outline: 2px solid var(--acao); outline-offset: 2px; }

.im-foto { position: relative; flex: none; width: 96px; height: 96px; overflow: hidden;
  border-radius: 10px; background: var(--bg3); box-shadow: var(--im-sombra-sm); }
.im-foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.im-codigo { position: absolute; left: 4px; bottom: 4px; max-width: calc(100% - 8px);
  padding: 2px 6px; border-radius: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  background: var(--im-codigo-bg); color: var(--im-codigo-fg); backdrop-filter: blur(2px);
  font-size: 10px; line-height: 14px; font-weight: 600; letter-spacing: .02em; }

.im-corpo { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.im-topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 4px; }
/* Até DUAS linhas: com o megafone ao lado, uma linha só cortava o bairro no
   celular ("Cobertura · Cidad…") — e o bairro é metade do que o corretor lê. */
.im-local { min-width: 0; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical;
  -webkit-line-clamp: 2; line-clamp: 2; overflow-wrap: anywhere;
  font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .02em; color: var(--muted); }
.im-tela .im-preco { margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 22px; line-height: 28px; font-weight: 700; letter-spacing: -.02em; color: var(--fg);
  font-variant-numeric: tabular-nums; }
.im-mes { font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 14px; line-height: 20px; font-weight: 400; letter-spacing: 0; color: var(--muted); }
.im-consulte { font-size: 18px; color: var(--muted); }
.im-tela .im-fatos { margin-top: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 14px; line-height: 20px; color: var(--muted); }
.im-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 8px; }
.im-chip { padding: 3px 6px; border-radius: 999px; white-space: nowrap;
  background: var(--im-chip); color: var(--fg);
  font-size: 11px; line-height: 16px; font-weight: 600; letter-spacing: .02em; }
.im-chip-status { background: transparent; color: var(--muted); box-shadow: inset 0 0 0 1px var(--line); }
/* "Seu" / "Vinculado pela Total" / "Trabalhando" na aba Meus (plan/23 F3b). */
.im-chip-relacao { font-weight: 700; box-shadow: inset 0 0 0 1px var(--teal); }

/* Impulsionar no card (plan/22 F4): alvo de 44px, bola de 36px na cor do
   módulo Marketing (a cor do módulo vai no ÍCONE; carmesim só na ação principal
   da tela). As margens negativas devolvem a altura, como na caixa de seleção:
   o preço não desce por causa do botão. Acima do link esticado (z-index 2). */
.im-impulsionar { position: relative; z-index: 2; display: grid; place-items: center; flex: none;
  width: 44px; height: 44px; margin: -14px -12px -14px 0; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--mod-marketing); cursor: pointer; }
.im-tela .im-impulsionar:hover { background: transparent; color: var(--mod-marketing); }
.im-impulsionar-bola { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%;
  background: var(--mod-marketing-s); transition: transform .12s; }
.im-impulsionar:hover .im-impulsionar-bola { box-shadow: var(--im-sombra-sm); }
.im-impulsionar:active .im-impulsionar-bola { transform: scale(.92); }
.im-impulsionar:focus-visible { outline: 2px solid var(--acao); outline-offset: -2px; }
.im-impulsionar .im-ico { width: 18px; height: 18px; }

/* "2 corretores trabalhando · visita agendada · parado há 22 dias" */
.im-tela .im-trabalho { display: flex; align-items: flex-start; gap: 6px; margin-top: 2px;
  font-size: 13px; line-height: 18px; color: var(--fg); }
.im-trabalho .im-ico { width: 16px; height: 16px; margin-top: 1px; color: var(--muted); }
.im-trabalho > span { min-width: 0; }
.im-trabalho-quente .im-ico { color: var(--im-aviso-ico); }
.im-parado { color: var(--im-aviso-fg); font-weight: 600; white-space: nowrap; }

/* "Cadastro 70% · falta área útil, sem foto +1" — só para quem gere; cor pela
   faixa da nota (os mesmos tokens do círculo que ela substituiu). */
.im-tela .im-cadastro { display: flex; align-items: flex-start; gap: 6px; padding: 6px 8px; border-radius: 8px;
  font-size: 13px; line-height: 18px; }
.im-cadastro > span { min-width: 0; }
.im-cadastro .im-ico { width: 16px; height: 16px; margin-top: 1px; }
.im-cadastro strong { font-weight: 700; white-space: nowrap; }
.im-cadastro-bom { background: var(--im-nota-bom-s); color: var(--im-nota-bom-fg); }
.im-cadastro-medio { background: var(--im-nota-medio-s); color: var(--im-nota-medio-fg); }
.im-cadastro-ruim { background: var(--im-nota-ruim-s); color: var(--im-nota-ruim-fg); }
.im-cadastro-mais { font-weight: 700; white-space: nowrap; }

/* ── rodapé da lista, vazio, aproximado ─────────────────────────────────── */
.im-vazio { padding: 40px 12px; border-radius: 14px; background: var(--bg2); box-shadow: var(--im-sombra-sm);
  text-align: center; color: var(--muted); }
.im-tela .im-conta-lista { margin-top: 4px; text-align: center; font-size: 13px; line-height: 18px; color: var(--muted); }
.im-mapa { display: inline-flex; align-items: center; gap: 4px; vertical-align: bottom; }
.im-mapa .im-ico { width: 14px; height: 14px; }
.im-mais-caixa { display: flex; justify-content: center; }
.im-mais { height: 44px; padding: 0 20px; border-radius: 999px; background: var(--bg2); color: var(--fg);
  box-shadow: var(--im-sombra-sm); font-size: 13px; font-weight: 700; }
.im-mais:hover { background: var(--bg3); }
.im-mais:disabled { background: var(--bg2); color: var(--muted); }
.im-tela .im-aproximado { padding: 8px 12px; border-radius: 10px; background: var(--im-aviso-s);
  color: var(--im-aviso-fg); font-size: 13px; line-height: 18px; }

/* ── a barra flutuante "Lote de ação" ───────────────────────────────────── */
/* fixed acima da barra inferior do celular (bottom-20 do Stitch = 80px) */
.im-lote-caixa { position: fixed; left: 0; right: 0; bottom: calc(24px + env(safe-area-inset-bottom, 0px));
  z-index: 40; padding: 0 16px; pointer-events: none; }
.im-lote-caixa[hidden] { display: none; }
@media (max-width: 760px) {
  body.sv-com-nav .im-lote-caixa { bottom: calc(80px + env(safe-area-inset-bottom, 0px)); }
}
.im-lote { display: flex; align-items: center; justify-content: space-between; gap: 4px;
  max-width: 508px; margin: 0 auto; padding: 6px 6px 6px 16px; border-radius: 999px;
  background: var(--im-lote-bg); color: var(--im-lote-fg); box-shadow: var(--im-sombra-xl);
  pointer-events: auto; }
.im-lote-rotulo { display: flex; align-items: center; gap: 4px; flex: none; white-space: nowrap;
  font-size: 13px; line-height: 18px; font-weight: 700; letter-spacing: .01em; }
.im-lote-ponto { position: relative; width: 8px; height: 8px; border-radius: 50%; background: var(--im-lote-ponto); }
.im-lote-ponto::after { content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: var(--im-lote-ponto); animation: im-pulso 1s cubic-bezier(0, 0, .2, 1) infinite; }
@keyframes im-pulso { 75%, 100% { transform: scale(2); opacity: 0; } }
/* Ações QUEBRAM linha em vez de rolar escondidas (MÉDIO-3 da auditoria da F3b:
   com os botões de rede da aba Total, "Abrir/Fechar para a rede" ficavam fora
   da tela a 360/390 e cortados no desktop, sem barra de rolagem visível). */
.im-lote-acoes { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end;
  gap: 4px; min-width: 0; }
/* Mais de duas ações (aba Total): a barra vira um cartão de duas linhas —
   o rótulo em cima, os botões embaixo, cada um ocupando o que couber. */
.im-lote.im-lote-largo { flex-wrap: wrap; border-radius: 20px; padding: 10px; gap: 8px; }
.im-lote.im-lote-largo .im-lote-rotulo { flex: 1 1 100%; padding-left: 6px; }
.im-lote.im-lote-largo .im-lote-acoes { flex: 1 1 100%; justify-content: stretch; }
.im-lote.im-lote-largo .im-lote-btn { flex: 1 1 140px; justify-content: center; }
.im-lote-btn { display: inline-flex; align-items: center; gap: 4px; flex: none; height: 44px; padding: 0 12px;
  border-radius: 999px; background: var(--im-lote-btn); color: var(--im-lote-fg);
  font-size: 12px; line-height: 16px; font-weight: 700; letter-spacing: .02em; white-space: nowrap;
  transition: transform .12s, background .12s; }
.im-lote-btn:hover { background: var(--im-lote-btn-hover); }
.im-lote-btn:active { transform: scale(.95); }
.im-lote-btn.im-lote-principal { background: var(--acao); color: var(--acao-fg); box-shadow: var(--im-sombra-sm); }
.im-lote-btn.im-lote-principal:hover { background: var(--acao-hover); }
.im-lote-btn.im-desligado { opacity: .5; }
.im-lote-btn .im-ico { width: 16px; height: 16px; }
/* a lista não termina escondida atrás da barra */
body.im-com-lote .im-tela { padding-bottom: 80px; }
body.im-com-lote.im-com-lote-largo .im-tela { padding-bottom: 200px; }

/* ── folha de escolha (Tipo, Cidade) — dentro da folha de servicos.js ──── */
.im-opcoes { display: flex; flex-direction: column; border-radius: 14px; overflow: hidden;
  background: var(--bg2); box-shadow: inset 0 0 0 1px var(--line); }
.im-opcao { display: flex; align-items: center; gap: 8px; width: 100%; min-height: 48px; padding: 10px 14px;
  border: 0; border-radius: 0; background: transparent; color: var(--fg); text-align: left;
  font-size: 15px; font-weight: 600; }
.im-opcao + .im-opcao { border-top: 1px solid var(--line); }
.im-opcao:hover { background: var(--bg3); }
.im-opcao > span:first-child { flex: 1; min-width: 0; }
.im-opcao-n { color: var(--muted); font-size: 13px; font-weight: 600; }
.im-opcao.on { color: var(--acao-texto); }
.im-opcao .im-ico { width: 18px; height: 18px; }

/* ── Visão rápida (web/imoveis-rapida.js, plan/22 F4) — dentro da folha de
   servicos.js: de baixo no celular, diálogo central a partir de 720px. ────── */
.imr { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.imr p { margin: 0; }
/* O cabeçalho (código, título, ✕) fica PRESO no topo da folha enquanto ela rola:
   numa tela baixa (notebook com ~650px úteis, validação de 30/09) a folha rola
   cedo e o ✕ e o nome do imóvel sumiam para cima. `top: -10px` e a margem
   negativa cobrem o `padding-top` da folha (app.css, `.sv-folha`) — sem eles o
   texto rolando apareceria na fresta acima do cabeçalho preso. */
.imr-cab { display: flex; align-items: flex-start; justify-content: space-between; gap: 8px;
  position: sticky; top: -10px; z-index: 2; margin: -10px 0 0; padding: 10px 0 4px; background: var(--bg2); }
.imr-cab-t { min-width: 0; padding-top: 2px; }
.imr-cod { font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .02em; color: var(--muted); }
.sv-folha .imr h3 { font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 17px; line-height: 22px; font-weight: 700; letter-spacing: -.01em; color: var(--fg);
  overflow-wrap: anywhere; }
.imr h3:focus { outline: none; }
.imr-x { display: grid; place-items: center; flex: none; width: 44px; height: 44px; margin: -4px -8px 0 0;
  padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--muted); }
.sv-folha .imr-x:hover { background: var(--bg3); color: var(--fg); }
.imr-x:focus-visible { outline: 2px solid var(--acao); outline-offset: -2px; }
.imr-x .im-ico { width: 20px; height: 20px; }

.imr-galeria { display: flex; flex-direction: column; gap: 8px; }
.imr-foto { position: relative; overflow: hidden; border-radius: 14px; background: var(--bg3);
  aspect-ratio: 16 / 10; max-height: 34vh; }
.imr-foto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.imr-foto-n { position: absolute; right: 8px; bottom: 8px; padding: 2px 8px; border-radius: 999px;
  background: var(--im-codigo-bg); color: var(--im-codigo-fg);
  font-size: 11px; line-height: 16px; font-weight: 600; letter-spacing: .02em; }
.imr-minis { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding: 2px; }
.imr-minis::-webkit-scrollbar { display: none; }
.sv-folha .imr-mini { display: grid; place-items: center; flex: none; width: 56px; height: 44px; min-height: 0;
  padding: 0; border: 0; border-radius: 8px; overflow: hidden; background: var(--bg3); color: var(--fg);
  box-shadow: inset 0 0 0 1px var(--line); font-size: 13px; font-weight: 700; text-decoration: none; }
.sv-folha .imr-mini:hover { background: var(--bg3); }
.imr-mini img { display: block; width: 100%; height: 100%; object-fit: cover; }
.sv-folha .imr-mini.on { box-shadow: 0 0 0 2px var(--fg); }
.imr-mini:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; }

.imr-precos { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 12px; }
.sv-folha .imr-preco { font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 24px; line-height: 30px; font-weight: 800; letter-spacing: -.02em; color: var(--fg);
  font-variant-numeric: tabular-nums; }
.imr-outro-preco { font-size: 14px; line-height: 20px; color: var(--muted); font-variant-numeric: tabular-nums; }
.imr .im-chips { margin-top: -4px; }

/* Compacto: quatro por linha já a 360px — os fatos confirmam, não decidem. */
.imr-fatos { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 6px; margin: 0; }
.imr-fatos > div { padding: 6px 8px; border-radius: 10px; background: var(--bg3); min-width: 0; }
.imr-fatos dt { font-size: 11px; line-height: 14px; font-weight: 600; letter-spacing: .02em; color: var(--muted);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.imr-fatos dd { margin: 1px 0 0; font-size: 14px; line-height: 18px; font-weight: 700; color: var(--fg);
  overflow-wrap: anywhere; font-variant-numeric: tabular-nums; }

.imr-trabalho, .imr-cadastro { display: flex; align-items: flex-start; gap: 6px; font-size: 14px; line-height: 20px; }
.imr-trabalho { color: var(--fg); }
.imr-trabalho .im-ico { width: 18px; height: 18px; margin-top: 1px; color: var(--muted); }
.imr-trabalho.im-trabalho-quente .im-ico { color: var(--im-aviso-ico); }
.imr-cadastro { padding: 8px 10px; border-radius: 10px; }
.imr-cadastro .im-ico { width: 18px; height: 18px; margin-top: 1px; }
.imr-bloco { display: flex; flex-direction: column; gap: 6px; }
.sv-folha .imr-faltas { margin: 0; padding-left: 22px; font-size: 14px; line-height: 20px; color: var(--fg); gap: 2px; }
.imr-texto { font-size: 14px; line-height: 20px; color: var(--muted); overflow-wrap: anywhere; }
.imr-aviso { padding: 8px 10px; border-radius: 10px; background: var(--im-aviso-s); color: var(--im-aviso-fg);
  font-size: 13px; line-height: 18px; }

/* As ações ficam coladas no pé da folha enquanto ela rola: o polegar alcança
   Impulsionar sem descer até o fim (DESIGN-SYSTEM, pilar 1). */
.imr-acoes { position: sticky; bottom: calc(-18px - env(safe-area-inset-bottom, 0px)); z-index: 1;
  display: flex; flex-wrap: wrap; gap: 8px; margin: 0 -16px calc(-18px - env(safe-area-inset-bottom, 0px));
  padding: 10px 16px calc(12px + env(safe-area-inset-bottom, 0px));
  background: var(--bg2); box-shadow: 0 -1px 0 var(--line); }
.imr-trabalhar { display: contents; }
.imr-trabalhar:empty { display: none; }
.sv-folha .imr-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  flex: 1 1 140px; min-height: 48px; padding: 0 14px; border: 0; border-radius: 10px;
  background: var(--bg2); color: var(--fg); box-shadow: inset 0 0 0 1px var(--line);
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: 14px; line-height: 18px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.sv-folha .imr-btn:hover { background: var(--bg3); }
.sv-folha .imr-btn:disabled { background: var(--bg2); color: var(--muted); }
.sv-folha .imr-btn.imr-principal { flex-basis: 100%; background: var(--acao); color: var(--acao-fg); box-shadow: var(--im-sombra-sm); }
.sv-folha .imr-btn.imr-principal:hover { background: var(--acao-hover); }
.imr-btn:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; }
.imr-btn .im-ico { width: 18px; height: 18px; }
.imr-acoes .imr-aviso { flex: 1 1 100%; }
@media (min-width: 720px) {
  .imr-acoes { bottom: -18px; margin-bottom: -18px; padding-bottom: 14px; border-radius: 0 0 20px 20px; }
  .imr-foto { max-height: 300px; }
}
/* Tela baixa: a foto encolhe para o preço e as ações caberem sem rolar. A
   altura da folha usa `dvh` onde existe — no celular, `vh` conta a barra de
   endereço escondida e a folha passava do topo visível. */
@media (max-height: 700px) {
  .imr-foto { max-height: 26vh; }
}
.sv-folha.imr-folha { max-height: min(88vh, calc(100dvh - 12px)); }
@media (min-width: 720px) {
  .sv-folha.imr-folha { max-height: calc(100dvh - 48px); }
}

/* ── Mesa de validação: a aba A validar (web/imoveis-revisao.js), a página
   por imóvel (web/revisao-imovel.js) e o cartão que as duas e a ficha dividem
   (plan/21 §6, plan/22 F1). ──────────────────────────────────────────────── */
/* Mesma linguagem do resto da tela: cartão branco com sombra curta, pílulas,
   chips, o círculo de ícone; carmesim cheio só na ação principal da TELA (o
   "Aplicar as outras" da amostra, ou o "Aplicar" da barra quando ele não está
   à vista) — o botão principal de cada cartão é verde suave, não carmesim;
   âmbar para o que pede atenção ("Confira: …", obsoletas, falhas). */
.rv { position: relative; display: flex; flex-direction: column; gap: 12px; padding: 16px;
  border-radius: 14px; background: var(--bg2); box-shadow: var(--im-sombra-sm); }
.rv-titulo, .rv-rodar, .rv-grupo-abrir, .rv-alta, .rv-acao, .rv-mais, .rv-lote, .rv-aviso, .ri-btn,
.rv-ed-salvar, .rv-ed-cancelar, .rv-dec-desfazer, .rv-aviso-desfazer, .rv-folha-btn {
  font-family: "Plus Jakarta Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
.rv p, .rv-cartao p { margin: 0; }
.rv-cab { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 8px 12px; }
.rv-cab-texto { flex: 1 1 200px; min-width: 0; }
.rv-titulo { display: flex; align-items: center; gap: 8px; margin: 0; color: var(--fg);
  font-size: 18px; line-height: 24px; font-weight: 700; letter-spacing: -.015em; }
.rv-titulo:focus { outline: none; }
/* o UM número: "12 anúncios ativos para validar" */
.im-tela .rv-conta { margin-top: 4px; font-size: 15px; line-height: 22px; color: var(--fg); }
.rv-conta[hidden] { display: none; }
.rv-conta-n { font-size: 22px; line-height: 26px; font-weight: 800; letter-spacing: -.02em;
  font-variant-numeric: tabular-nums; }
.im-tela .rv-sub { margin-top: 2px; font-size: 13px; line-height: 18px; color: var(--muted); }
/* "Rodar conferência": ação secundária, discreta (a conferência também roda sozinha) */
.im-tela .rv-rodar { display: inline-flex; align-items: center; gap: 6px; flex: none; height: 44px; padding: 0 12px;
  border-radius: 999px; background: transparent; color: var(--muted); box-shadow: inset 0 0 0 1px var(--line);
  font-size: 13px; line-height: 18px; font-weight: 600; letter-spacing: .01em; white-space: nowrap; }
.im-tela .rv-rodar:hover { background: var(--bg3); color: var(--fg); }
.im-tela .rv-rodar:disabled { background: transparent; color: var(--muted); }
.rv-rodar:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; }

/* Por tipo | Por imóvel | Histórico */
.rv-abas { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
/* as três dividem a linha no celular de 360px (nenhuma escondida atrás da borda) */
.rv-abas .im-pilula { flex: 1 0 auto; justify-content: center; height: 44px; padding: 0 10px; }
.rv .im-pilula:not(.on) { background: var(--bg3); box-shadow: inset 0 0 0 1px var(--line); }

.rv-grupos { display: flex; flex-direction: column; border-radius: 12px; box-shadow: inset 0 0 0 1px var(--line); }
.rv-grupo + .rv-grupo { border-top: 1px solid var(--line); }
.im-tela .rv-grupo-abrir { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 64px;
  padding: 10px 12px; border-radius: 12px; background: transparent; color: var(--fg); text-align: left;
  font-size: 14px; line-height: 20px; font-weight: 700; }
.im-tela .rv-grupo-abrir:hover { background: var(--bg3); }
.rv-grupo-abrir:focus-visible { outline: 2px solid var(--acao); outline-offset: -2px; }
.rv-grupo-ico { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 50%;
  background: var(--bg3); color: var(--fg); }
/* nome · a linha do que o grupo é · o acerto medido da regra */
.rv-grupo-txt { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.rv-grupo-nome { min-width: 0; }
.rv-grupo-linha { font-size: 12px; line-height: 16px; font-weight: 500; color: var(--muted); }
.rv-grupo-selos { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
/* a contagem do grupo (com a unidade) e o acerto, na mesma linha, embaixo do texto */
.rv-grupo-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; margin-top: 2px; }
.rv-grupo-meta .rv-grupo-selos { margin-top: 0; }
.rv-grupo-meta .rv-grupo-n, .rv-imovel-topo .rv-grupo-n { min-width: 0; }
.rv-grupo-n { flex: none; min-width: 24px; padding: 2px 8px; border-radius: 999px; background: var(--im-chip);
  color: var(--fg); text-align: center; font-size: 12px; line-height: 16px; font-weight: 700;
  font-variant-numeric: tabular-nums; white-space: nowrap; }
.rv-grupo-n-un { font-weight: 500; }
/* as sugestões, secundárias ao número de anúncios do grupo (L6) */
.rv-grupo-n-sec { flex: none; font-size: 12px; line-height: 16px; font-weight: 500; color: var(--muted);
  font-variant-numeric: tabular-nums; white-space: nowrap; }
.rv-seta { width: 18px; height: 18px; color: var(--muted); transition: transform .15s; }
.rv-grupo-abrir[aria-expanded="true"] .rv-seta, .rv-imovel-abrir[aria-expanded="true"] .rv-seta { transform: rotate(180deg); }
.rv-grupo-corpo[hidden] { display: none; }
/* o sub-filtro dos textos: 44px de alvo, quebra linha no celular em vez de rolar */
.rv-sub-filtro { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 8px 8px; }
.rv-sub-filtro .im-pilula { height: 44px; padding: 0 14px; }
.rv-grupo-acoes { display: flex; justify-content: flex-end; padding: 0 8px 4px; }
.im-tela .rv-alta { display: inline-flex; align-items: center; gap: 6px; height: 44px; padding: 0 12px; border-radius: 10px;
  background: transparent; color: var(--acao-texto); font-size: 13px; line-height: 16px; font-weight: 700; letter-spacing: .02em; }
.im-tela .rv-alta:hover { background: var(--bg3); }
.rv-alta:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; }
.rv .rv-mais { display: block; width: calc(100% - 16px); min-height: 44px; margin: 4px 8px 8px; padding: 0 12px;
  border-radius: 10px; background: var(--bg3); color: var(--fg); box-shadow: inset 0 0 0 1px var(--line);
  font-size: 13px; line-height: 18px; font-weight: 700; }
.rv .rv-mais:hover { background: var(--im-chip); }
.rv .rv-mais:disabled { color: var(--muted); }
.rv-mais:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; }

/* ── o cartão ──────────────────────────────────────────────────────────── */
.rv-itens { display: flex; flex-direction: column; margin: 0; padding: 0 8px 8px; list-style: none; }
.rv-item { display: flex; align-items: flex-start; gap: 12px; padding: 12px 8px; border-top: 1px solid var(--line); }
/* `container-type`: as ações se arrumam pela largura do CARTÃO (mesa, ficha,
   página), não da janela. */
.rv-cartao { flex-direction: column; align-items: stretch; gap: 8px; container-type: inline-size; }
.rv-item.rv-marcado { border-radius: 10px; background: var(--bg3); }
.rv-item.rv-marcado + .rv-item { border-top-color: transparent; }
.rv-cartao[aria-busy="true"] { opacity: .6; }
.rv-linha { display: flex; align-items: flex-start; gap: 12px; min-width: 0; }
/* o alvo de 44px centrado na primeira linha de texto (20px) */
.rv-item .im-check { margin: -12px; }
.rv-capa { position: relative; flex: none; width: 56px; height: 56px; overflow: hidden; border-radius: 10px;
  background: var(--bg3); box-shadow: var(--im-sombra-sm); }
.rv-capa img { display: block; width: 100%; height: 100%; object-fit: cover; }
.rv-corpo { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.rv-topo { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 6px; min-width: 0; }
.rv-cod { flex: none; color: var(--fg); font-size: 13px; line-height: 20px; font-weight: 700;
  text-decoration: underline; text-decoration-color: var(--line); text-underline-offset: 3px; }
.rv-cod:hover { text-decoration-color: currentColor; }
.rv-cod:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; border-radius: 4px; }
.rv-tit { flex: 1 1 100%; order: 3; min-width: 0; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2;
  -webkit-box-orient: vertical; font-size: 13px; line-height: 18px; color: var(--muted); }
.rv-topo .im-chip { flex: none; }
.rv-acerto { flex: none; padding: 2px 8px; border-radius: 999px; background: var(--bg3); color: var(--fg);
  box-shadow: inset 0 0 0 1px var(--line); font-size: 11px; line-height: 16px; font-weight: 700; letter-spacing: .02em; }
.rv-acerto-pouco { color: var(--muted); font-weight: 600; }
/* a frase que diz o que fazer, com o valor em negrito */
.rv-frase { font-size: 14px; line-height: 20px; color: var(--fg); overflow-wrap: anywhere; }
.rv-frase b { font-weight: 800; }
.rv-frase .rv-cod { font-size: 14px; }
.rv-confira { align-self: flex-start; margin-top: 4px; padding: 3px 8px; border-radius: 8px;
  background: var(--im-aviso-s); color: var(--im-aviso-fg); font-size: 12px; line-height: 16px; font-weight: 600; }
.rv-nota-conf { font-size: 12px; line-height: 16px; color: var(--muted); }
.rv-mudanca { font-size: 14px; line-height: 20px; color: var(--fg); overflow-wrap: anywhere; }
.rv-campo, .rv-de, .rv-seta-mudanca { color: var(--muted); }
.rv-para { font-weight: 700; }
/* o trecho do anúncio, menor, embaixo; o longo nasce recolhido em 3 linhas */
.rv-evid { margin-top: 4px; font-size: 12px; line-height: 16px; color: var(--muted); overflow-wrap: anywhere; }
.rv-evid-curta { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 3; -webkit-box-orient: vertical; }
.rv-evid mark { padding: 0 2px; border-radius: 3px; background: var(--im-aviso-s); color: var(--im-aviso-fg); font-weight: 700; }
/* Textos do anúncio (plan/17, Entrega D) — celular primeiro: 2 linhas, diferença recolhida. */
.rv-texto { display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  white-space: pre-line; margin-top: 2px; font-size: 13px; line-height: 18px; color: var(--fg); }
.rv-ver-diff { margin-top: 4px; padding: 0; border: 0; background: none; color: var(--acao-texto);
  font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; }
button.rv-ver-diff { min-height: 44px; }
.rv-ver-trecho { align-self: flex-start; margin-top: 0; }
button.rv-ver-diff:hover { background: none; text-decoration: underline; }
.rv-diff { display: grid; gap: 2px; margin-top: 6px; padding: 8px; border-radius: var(--radius-sm);
  background: var(--bg2); font-size: 12px; line-height: 16px; white-space: pre-wrap; }
.rv-diff[hidden] { display: none; }
.rv-diff del { color: var(--im-erro-fg); background: var(--im-erro-s); }
.rv-diff ins { text-decoration: none; color: var(--im-nota-bom-fg); background: var(--im-nota-bom-s); }
.rv-diff span { color: var(--muted); }
.rv-diff del.rv-diff-vazio { text-decoration: none; font-style: italic; }

/* As ações: o principal (verbo + valor, "Preencher 240 m²") ocupa a linha
   inteira no cartão estreito do celular; embaixo, "Outro valor" · "Não é isso"
   · ⋯. Cartão largo (desktop): uma linha só. 48px de altura, alvo folgado. */
.rv-acoes { display: flex; flex-wrap: wrap; gap: 6px; }
.rv-cartao .rv-acao { display: inline-flex; align-items: center; justify-content: center; gap: 6px; flex: 1 1 0;
  min-width: 0; min-height: 48px; padding: 4px 10px; border: 0; border-radius: 10px; background: var(--bg3); color: var(--fg);
  box-shadow: inset 0 0 0 1px var(--line); text-align: center; font-size: 13px; line-height: 16px; font-weight: 700; }
.rv-cartao .rv-acao:hover { background: var(--im-chip); }
.rv-cartao .rv-acao-principal { flex: 1 1 100%; font-size: 14px; }
.rv-cartao .rv-acao-principal, .rv-cartao .rv-acao-principal:hover { background: var(--im-nota-bom-s); color: var(--im-nota-bom-fg); box-shadow: none; }
.rv-cartao .rv-acao-mais { flex: 0 0 48px; padding: 0; }
@container (min-width: 520px) {
  .rv-cartao .rv-acao-principal { flex: 2 1 0; }
}
.rv-cartao .rv-acao[aria-expanded="true"] { background: var(--fg); color: var(--bg2); }
.rv-cartao .rv-acao:disabled { opacity: .5; cursor: default; }
.rv-cartao .rv-acao .im-ico { width: 18px; height: 18px; }
.rv-acao:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; }
.rv-erro { font-size: 12px; line-height: 16px; color: var(--im-erro-fg); overflow-wrap: anywhere; }
.rv-erro[hidden] { display: none; }

/* "Outro valor": o campo no próprio cartão */
.rv-editor { display: flex; flex-direction: column; gap: 6px; padding: 10px; border-radius: 10px; background: var(--bg3); }
.rv-editor[hidden] { display: none; }
.rv-editor .rv-ed-rot { margin: 0; font-size: 12px; line-height: 16px; font-weight: 700; color: var(--muted); }
.rv-editor input, .rv-editor select, .rv-editor textarea { min-height: 44px; background: var(--bg2); }
.rv-editor textarea { resize: vertical; line-height: 22px; }
.rv-ed-acoes { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 2px; }
.rv-cartao .rv-ed-salvar, .rv-cartao .rv-ed-cancelar { display: inline-flex; align-items: center; gap: 6px;
  min-height: 44px; padding: 0 16px; border-radius: 10px; font-size: 14px; font-weight: 700; }
.rv-cartao .rv-ed-salvar, .rv-cartao .rv-ed-salvar:hover { background: var(--teal-dark); color: var(--btn-fg); }
.rv-cartao .rv-ed-cancelar, .rv-cartao .rv-ed-cancelar:hover { background: transparent; color: var(--fg); box-shadow: inset 0 0 0 1px var(--line); }
.rv-ed-salvar:focus-visible, .rv-ed-cancelar:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; }

/* "Conferir 5 ao acaso" e o lote liberado por ela */
.rv-amostra { display: flex; flex-direction: column; gap: 4px; margin: 4px 8px 8px; padding: 10px;
  border-radius: 12px; background: var(--bg3); box-shadow: inset 0 0 0 1px var(--line); }
.rv-amostra-cab { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.rv-amostra-tit { display: flex; align-items: center; gap: 6px; font-size: 13px; line-height: 18px; font-weight: 700; color: var(--fg); }
.rv-amostra .im-limpar { flex: none; width: 44px; height: 44px; }
.rv-amostra .rv-itens { padding: 0; gap: 8px; }
.rv-amostra .rv-cartao { border-top: 0; border-radius: 10px; background: var(--bg2); }
.rv-amostra-msg { font-size: 13px; line-height: 18px; color: var(--fg); }
.rv-amostra-erro { padding: 6px 10px; border-radius: 8px; background: var(--im-aviso-s); color: var(--im-aviso-fg); }
.rv .rv-lote { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; min-height: 48px;
  margin-top: 4px; border-radius: 10px; background: var(--acao); color: var(--acao-fg); font-size: 15px; font-weight: 700; }
.rv .rv-lote:hover { background: var(--acao-hover); }
.rv .rv-lote:disabled { opacity: .5; }
.rv-lote:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; }

/* Por imóvel (acordeão: o anúncio abre ali mesmo) e Histórico */
.rv-imoveis, .rv-decisoes { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none;
  border-radius: 12px; box-shadow: inset 0 0 0 1px var(--line); }
.rv-imovel + .rv-imovel, .rv-decisao + .rv-decisao { border-top: 1px solid var(--line); }
.im-tela .rv-imovel-abrir { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 72px; padding: 8px 12px;
  border-radius: 12px; background: transparent; color: var(--fg); text-align: left; font: inherit; }
.im-tela .rv-imovel-abrir:hover { background: var(--bg3); }
.rv-imovel-abrir:focus-visible { outline: 2px solid var(--acao); outline-offset: -2px; }
.rv-imovel-aberto { background: var(--bg3); }
.rv-imovel-aberto .rv-cartao { border-radius: 10px; background: var(--bg2); }
.rv-imovel-aberto .rv-cartao + .rv-cartao { margin-top: 8px; }
.rv-imovel-painel { padding: 0 4px 8px; }
.rv-imovel-painel[hidden] { display: none; }
.rv-imovel-painel .rv-itens { padding: 0 4px; }
.rv-imovel-painel .rv-cartao { border-top: 0; }
.rv-imovel-corpo { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.rv-imovel-topo { display: flex; align-items: center; gap: 6px; }
.rv-imovel-cod { font-size: 14px; line-height: 20px; font-weight: 700; }
.rv-imovel-local { overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  font-size: 13px; line-height: 18px; color: var(--muted); }
/* os tipos de sugestão do anúncio, em chips */
.rv-chips { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 2px; }
.rv-chip { padding: 1px 8px; border-radius: 999px; background: var(--im-chip); color: var(--fg);
  font-size: 11px; line-height: 16px; font-weight: 700; }
.rv-imovel-links { display: flex; flex-wrap: wrap; align-items: center; gap: 0 16px; padding: 0 8px; }
.rv-link { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--acao-texto);
  font-size: 13px; font-weight: 700; text-decoration: none; }
.rv-link:hover { text-decoration: underline; }
.rv-link-discreto { color: var(--muted); font-weight: 600; text-decoration: underline;
  text-decoration-color: var(--line); text-underline-offset: 3px; }
.rv-link:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; border-radius: 4px; }
.rv-decisao { display: flex; flex-direction: column; gap: 4px; padding: 12px; }
.rv-decisao .rv-tit { order: 0; flex: 1 1 auto; display: block; white-space: nowrap; text-overflow: ellipsis; }
.rv-dec { flex: none; padding: 2px 8px; border-radius: 999px; background: var(--im-chip); color: var(--fg);
  font-size: 11px; line-height: 16px; font-weight: 700; }
.rv-dec-aplicada, .rv-dec-corrigida { background: var(--im-nota-bom-s); color: var(--im-nota-bom-fg); }
.rv-dec-nao_aplicada { background: var(--im-nota-ruim-s); color: var(--im-nota-ruim-fg); }
.rv-dec-adiada { background: var(--im-nota-medio-s); color: var(--im-nota-medio-fg); }
.rv-dec-motivo, .rv-dec-quem { font-size: 12px; line-height: 16px; color: var(--muted); overflow-wrap: anywhere; }
.rv .rv-dec-desfazer { align-self: flex-start; min-height: 44px; padding: 0 14px; border-radius: 10px;
  background: transparent; color: var(--acao-texto); box-shadow: inset 0 0 0 1px var(--line);
  font-size: 13px; font-weight: 700; }
.rv .rv-dec-desfazer:hover { background: var(--bg3); }
.rv-dec-desfazer:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; }
.rv-corte, .rv-vazio { padding: 4px 16px 8px; font-size: 12px; line-height: 16px; color: var(--muted); }
.rv-vazio { padding: 0; font-size: 13px; line-height: 18px; }

.rv-resumo { display: flex; align-items: flex-start; gap: 8px; padding: 10px 8px 10px 14px; border-radius: 10px;
  font-size: 14px; line-height: 20px; }
.rv-resumo:focus { outline: none; box-shadow: 0 0 0 2px var(--im-foco); }
.rv-resumo-ok { background: var(--im-nota-bom-s); color: var(--im-nota-bom-fg); }
.rv-resumo-aviso { background: var(--im-aviso-s); color: var(--im-aviso-fg); }
.rv-resumo-texto { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.rv-falhas { margin: 4px 0 0; padding-left: 18px; font-size: 13px; line-height: 18px; }
.im-tela .rv-resumo-nota { margin-top: 4px; font-size: 13px; line-height: 18px; }
.im-tela .rv-resumo .im-limpar { color: inherit; }

/* a barra de decisão gruda no rodapé enquanto o painel está na tela */
.rv-barra { position: sticky; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 30;
  display: flex; flex-direction: column; align-items: stretch; gap: 6px; }
.rv-barra[hidden] { display: none; }
@media (max-width: 760px) {
  body.sv-com-nav .rv-barra { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
}
.rv-barra .im-lote { width: 100%; }
.rv-barra .im-lote-btn { height: 44px; }
.im-tela .rv-barra-nota { align-self: center; max-width: 508px; padding: 4px 10px; border-radius: 8px;
  background: var(--im-aviso-s); color: var(--im-aviso-fg); box-shadow: var(--im-sombra-sm);
  text-align: center; font-size: 12px; line-height: 16px; }
.rv-barra .im-lote-btn:disabled { background: var(--im-lote-btn); color: var(--im-lote-fg); opacity: .5; cursor: not-allowed; }
.rv-barra .im-lote-btn.im-lote-principal:disabled { background: var(--acao); color: var(--acao-fg); opacity: .45; }
.rv-barra .im-lote-btn:focus-visible { outline: 2px solid var(--im-lote-fg); outline-offset: 2px; }

/* as folhas (motivos, mais, fichas) vivem na folha de servicos.js — de baixo
   no celular, diálogo central no desktop (app.css, `.sv-veu`) */
.sv-folha .rv-folha-nota { margin: 0; }
.rv-folha-sec { margin: 0; font-size: 11px; line-height: 14px; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; color: var(--muted); }
.rv-folha-confirma { display: flex; flex-direction: column; gap: 10px; padding: 12px; border-radius: 14px; background: var(--bg3); }
.rv-folha-confirma p { margin: 0; }
a.rv-folha-link { color: var(--fg); text-decoration: none; }
.rv-folha-link .im-ico { width: 18px; height: 18px; color: var(--muted); }
/* "Decidir depois": amanhã · 1 semana · 1 mês, lado a lado */
.rv-folha-adiar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.sv-folha .rv-folha-btn, .sv-folha .rv-folha-btn:hover { min-height: 48px; padding: 0 6px; border: 0; border-radius: 10px;
  background: var(--bg3); color: var(--fg); box-shadow: inset 0 0 0 1px var(--line); font-size: 14px; font-weight: 700; }
.sv-folha .rv-folha-btn:hover { background: var(--im-chip); }
.rv-folha-btn:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; }

/* o aviso "Aplicada · Desfazer", ~6 s acima da barra de baixo */
.rv-aviso { position: fixed; left: 50%; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index: 55;
  transform: translateX(-50%); display: flex; align-items: center; gap: 8px; max-width: calc(100vw - 32px);
  padding: 4px 4px 4px 16px; border-radius: 999px; background: var(--im-lote-bg); color: var(--im-lote-fg);
  box-shadow: var(--im-sombra-xl); font-size: 14px; line-height: 20px; font-weight: 600; }
.rv-aviso[hidden] { display: none; }
.rv-aviso-texto { min-width: 0; padding: 8px 0; overflow-wrap: anywhere; }
.rv-aviso-alerta { background: var(--im-aviso-s); color: var(--im-aviso-fg); }
.rv-aviso .rv-aviso-desfazer, .rv-aviso .rv-aviso-desfazer:hover { flex: none; min-height: 44px; padding: 0 16px;
  border-radius: 999px; background: var(--im-lote-btn); color: var(--im-lote-fg); font-size: 13px; font-weight: 700; }
.rv-aviso-desfazer:focus-visible { outline: 2px solid var(--im-lote-fg); outline-offset: 2px; }
@media (max-width: 760px) {
  body.sv-com-nav .rv-aviso { bottom: calc(84px + env(safe-area-inset-bottom, 0px)); }
}

/* a página de UM imóvel (#/revisar/<codigo>) */
.ri-tela { gap: 12px; }
.ri-voltar { display: inline-flex; align-items: center; gap: 4px; align-self: flex-start; min-height: 44px;
  color: var(--muted); font-size: 14px; font-weight: 600; text-decoration: none; }
.ri-voltar:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; border-radius: 6px; }
.ri-imovel { display: flex; align-items: center; gap: 12px; }
.ri-capa { flex: none; width: 88px; height: 88px; overflow: hidden; border-radius: 12px; background: var(--bg3);
  box-shadow: var(--im-sombra-sm); }
.ri-capa img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ri-imovel-corpo { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.ri-titulo { font-size: 16px; line-height: 22px; font-weight: 700; color: var(--fg); overflow-wrap: anywhere; }
.ri-linha { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font-size: 13px; line-height: 18px; }
.ri-muted, .ri-conta { color: var(--muted); }
.ri-conta { font-size: 13px; line-height: 18px; }
.rv .ri-itens { padding: 0; }
.ri-itens > .rv-cartao:first-child { border-top: 0; }
.ri-vazio { display: flex; flex-direction: column; gap: 8px; font-size: 15px; }
.ri-acoes { display: flex; flex-wrap: wrap; gap: 8px; }
.im-tela .ri-btn { flex: 1 1 auto; min-height: 48px; padding: 0 14px; white-space: nowrap; border-radius: 10px; background: var(--bg3);
  color: var(--fg); box-shadow: inset 0 0 0 1px var(--line); font-size: 15px; font-weight: 700; }
.im-tela .ri-btn:hover { background: var(--im-chip); }
.im-tela .ri-proximo, .im-tela .ri-proximo:hover { background: var(--fg); color: var(--bg2); box-shadow: none; }
.ri-btn:focus-visible { outline: 2px solid var(--acao); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  .im-lote-ponto::after { animation: none; }
  .im-cadastrar, .im-pilula, .im-card, .im-check-caixa, .im-lote-btn, .im-busca input, .rv-seta { transition: none; }
}

/* "Procurar pelo pedido do cliente" (web/busca-cliente.js) — recolhido por
   padrão: é a ferramenta de quem recebe uma ligação, não a busca do dia. */
.im-pedido { margin: 10px 0 0; }
.im-pedido > summary { cursor: pointer; font-size: 13.5px; font-weight: 700; color: var(--mod-carteira);
  min-height: 32px; display: flex; align-items: center; }
.im-pedido[open] > summary { margin-bottom: 8px; }
.im-pedido #bc_resposta:not(:empty) { margin-top: 8px; }