/* ═════════════════════════════════════════════════════════════════════════
   Moradia.pro — componentes do fluxo Descobrir.
   Identidade travada da Rota 2 (Topografia Viva): pedra verde-musgo + lima,
   marca 2c, raio 10px com um canto em 2px como eco de polígono.
   Carrega depois de assets/identidade-core.css e não altera nenhum seletor dele.
   Toda cor vem de token; nenhum valor cru aqui.
   ═════════════════════════════════════════════════════════════════════════ */

/* eco de polígono: um canto sempre foge do raio */
.panel, .card, .zcard, .tcard, .det, .vazio, .crit-wrap { border-radius: var(--r) var(--r) var(--r) 2px; }
.brow, .tcard { border-radius: 2px var(--r) var(--r) var(--r); }

/* ── casco ────────────────────────────────────────────────────────────── */
.app-hd {
  position: sticky; top: 0; z-index: 40;
  background: color-mix(in oklab, var(--bg) 93%, transparent);
  backdrop-filter: blur(12px); border-bottom: 1px solid var(--border);
}
.app-hd-in { display: flex; align-items: center; gap: var(--sp-3); min-height: 60px; }

/* ── funil sempre visível: 94 → n ─────────────────────────────────────── */
.funil { display: flex; gap: 2px; overflow-x: auto; scrollbar-width: none; padding-block: 8px; }
.funil::-webkit-scrollbar { display: none; }
.funil-step {
  flex: none; display: grid; gap: 2px; padding: 7px 12px; border-radius: 2px;
  border: 1px solid transparent; text-align: left; color: var(--fg-mut);
  transition: background var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
}
.funil-step > * { display: block; }
.funil-k { font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.funil-n { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: 15px; color: var(--fg); }
.funil-step[aria-current="step"] { background: var(--accent-soft); border-color: var(--accent-line); color: var(--fg); }
.funil-step[disabled] { opacity: .42; cursor: not-allowed; }
@media (hover: hover) { .funil-step:not([disabled]):hover { background: color-mix(in oklab, var(--fg) 6%, var(--bg)); color: var(--fg); } }
.funil-sep { flex: none; align-self: center; color: var(--fg-dim); font-family: var(--font-mono); }

/* ── grade principal ──────────────────────────────────────────────────── */
.work { display: grid; gap: var(--sp-4); align-items: start; }
@media (min-width: 1080px) { .work { grid-template-columns: 360px minmax(0, 1fr) 340px; } }
@media (min-width: 700px) and (max-width: 1079px) { .work { grid-template-columns: 320px minmax(0, 1fr); } }
.col { display: grid; gap: var(--sp-4); align-content: start; }
@media (min-width: 1080px) { .col-crit, .col-side { position: sticky; top: 128px; max-height: calc(100vh - 148px); overflow-y: auto; overscroll-behavior: contain; } }

/* ── critérios: o mecanismo central ───────────────────────────────────── */
.crit { display: grid; gap: var(--sp-3); }
.crit-row { display: grid; gap: 8px; padding-block: var(--sp-3); border-top: 1px solid var(--border); }
.crit-row:first-child { border-top: 0; padding-top: 0; }
.crit-row > * { display: block; }
.crit-hd { display: flex; align-items: baseline; gap: 8px; }
.crit-nm { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-sm); }
.crit-val { font-family: var(--font-mono); font-size: var(--fs-meta); color: var(--fg-mut); margin-inline-start: auto; white-space: nowrap; }
.pesos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2px; padding: 3px; border: 1px solid var(--border); border-radius: 2px; background: var(--surface); }
.pesos button {
  min-height: 40px; padding: 6px 4px; border-radius: 2px; text-align: center;
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .04em; text-transform: uppercase;
  color: var(--fg-mut); transition: background var(--dur) var(--ease-out), color var(--dur) var(--ease-out);
}
@media (hover: hover) { .pesos button:hover { color: var(--fg); } }
.pesos button[aria-pressed="true"] { background: var(--accent); color: var(--on-accent); font-weight: 600; }
.pesos button[data-v="2"][aria-pressed="true"] { background: var(--accent-forte); color: var(--surface); }
.crit-help { font-size: var(--fs-meta); color: var(--fg-mut); }

.field { display: grid; gap: 6px; }
.field > * { display: block; }
.field-lb { font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--fg-mut); }
select.inp, input.inp {
  width: 100%; min-height: 44px; padding: 10px 12px; border: 1px solid var(--border-hi);
  border-radius: 2px; background: var(--bg); color: var(--fg);
}
input[type="range"].inp { padding: 0; border: 0; background: none; min-height: 44px; accent-color: var(--accent-forte); }

/* ── match explicado ──────────────────────────────────────────────────── */
.mt-hero { display: grid; gap: 6px; }
.mt-hero > * { display: block; }
.mt-p { font-family: var(--font-mono); font-size: clamp(38px, 5vw, 52px); font-weight: 500; line-height: 1; letter-spacing: -.03em; }
.mt-lb { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-h3); }
.mt-of { font-size: var(--fs-meta); color: var(--fg-mut); }

.mt { display: grid; gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: 2px; overflow: hidden; }
.mt-row { display: grid; grid-template-columns: minmax(0, 1fr) 92px; gap: var(--sp-3); align-items: center; padding: 10px var(--sp-3); background: var(--surface); }
.mt-row > * { display: block; }
.mt-row[data-off="1"] { opacity: .5; }
.mt-row[data-fail="1"] { background: color-mix(in oklab, var(--fg) 5%, var(--surface)); }
.mt-nm { display: grid; gap: 3px; }
.mt-nm > * { display: block; }
.mt-t { font-size: var(--fs-sm); }
.mt-sub { font-family: var(--font-mono); font-size: 11px; color: var(--fg-mut); }
.mt-fig { display: grid; gap: 3px; justify-items: end; }
.mt-fig > * { display: block; }
.mt-pct { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: var(--fs-sm); white-space: nowrap; }
.mt-bar { width: 92px; height: 6px; border-radius: 2px; background: color-mix(in oklab, var(--fg) 9%, var(--bg)); overflow: hidden; }
/* medido: acento cheio sobre a trilha dá 2,50:1 — abaixo do piso de 3:1.
     O acento forte dá 3,70:1, e é o mesmo token usado no solo do mapa. */
  .mt-bar > span { display: block; height: 100%; background: var(--accent-forte); }
.mt-row[data-w="2"] .mt-bar > span { background: var(--accent-forte); }
  .mt-row[data-cls="info"] .mt-bar > span { background: var(--fg-dim); }
.tagw {
  display: inline-block; padding: 2px 6px; border-radius: 2px; flex: none;
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase;
  border: 1px solid var(--border-hi); color: var(--fg-mut);
}
.tagw[data-w="1"] { border-color: var(--accent-line); color: var(--fg); background: var(--accent-soft); }
.tagw[data-w="2"] { border-color: transparent; background: var(--accent-forte); color: var(--surface); }
.tagw[data-fail="1"] { background: none; border-color: var(--fg-dim); color: var(--fg); text-decoration: line-through; }

/* ── cartões de zona e trecho ─────────────────────────────────────────── */
.grid-z { display: grid; gap: var(--sp-3); grid-template-columns: repeat(auto-fill, minmax(232px, 1fr)); }
.zcard, .tcard {
  display: grid; gap: 10px; padding: var(--sp-3); text-align: left;
  border: 1px solid var(--border); background: var(--surface); color: var(--fg);
  transition: border-color var(--dur) var(--ease-out), background var(--dur) var(--ease-out);
}
.zcard > *, .tcard > * { display: block; }
@media (hover: hover) { .zcard:hover, .tcard:hover { border-color: var(--accent-forte); } }
.zcard[aria-pressed="true"], .tcard[aria-pressed="true"] { border-color: var(--accent-forte); background: var(--accent-soft); }
.zcard[data-empty="1"], .tcard[data-empty="1"] { opacity: .55; }
.z-hd { display: flex; align-items: baseline; gap: 8px; }
.z-nm { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-h3); }
.z-p { font-family: var(--font-mono); font-size: var(--fs-sm); margin-inline-start: auto; white-space: nowrap; }
.z-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.z-stats > * { display: block; }
.z-st { display: grid; gap: 1px; }
.z-st > * { display: block; }
.z-st-v { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: var(--fs-sm); white-space: nowrap; }
.z-st-k { font-size: 11px; color: var(--fg-mut); }
.z-names { font-size: var(--fs-meta); color: var(--fg-mut); }

/* ── linha de bairro ranqueada ────────────────────────────────────────── */
.rank { display: grid; gap: 8px; }
.brow {
  display: grid; grid-template-columns: 30px minmax(0, 1fr) 96px; gap: var(--sp-3); align-items: center;
  padding: 10px var(--sp-3); text-align: left; border: 1px solid var(--border);
  background: var(--surface); color: var(--fg);
  transition: border-color var(--dur) var(--ease-out), background var(--dur) var(--ease-out);
}
.brow > * { display: block; }
@media (hover: hover) { .brow:hover { border-color: var(--accent-forte); } }
.brow[aria-pressed="true"] { border-color: var(--accent-forte); background: var(--accent-soft); }
.b-pos { font-family: var(--font-mono); font-size: var(--fs-meta); color: var(--fg-mut); }
.b-nm { display: grid; gap: 3px; }
.b-nm > * { display: block; }
.b-t { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-sm); }
.b-sub { font-family: var(--font-mono); font-size: 11px; color: var(--fg-mut); }
.b-fig { display: grid; gap: 3px; justify-items: end; }
.b-fig > * { display: block; }

/* ── território fora do critério ──────────────────────────────────────── */
.excl { display: grid; gap: 8px; }
.excl-row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--sp-3); align-items: start;
  padding: 9px var(--sp-3); border: 1px dashed var(--border-hi); border-radius: 2px;
}
.excl-row > * { display: block; }
.excl-why { font-size: var(--fs-meta); color: var(--fg); }
.excl-tag {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--fg-mut); white-space: nowrap;
}

/* ── detalhe do lugar ─────────────────────────────────────────────────── */
.det { border: 1px solid var(--border); background: var(--surface); overflow: hidden; }
.det-hd { padding: var(--sp-3) var(--sp-4); border-bottom: 1px solid var(--border); display: grid; gap: 4px; }
.det-hd > * { display: block; }
.det-bd { padding: var(--sp-4); display: grid; gap: var(--sp-4); }
.det-bd > * { display: block; }
.det-foto { display: grid; gap: 6px; }
.det-foto > * { display: block; }
.det-foto img { border-radius: 2px; }

/* ── mapa ─────────────────────────────────────────────────────────────── */
.mapwrap { border: 1px solid var(--border); border-radius: var(--r) var(--r) var(--r) 2px; background: var(--surface); overflow: hidden; }
.mapwrap-hd { padding: 10px var(--sp-3); border-bottom: 1px solid var(--border); display: flex; align-items: center; gap: var(--sp-3); flex-wrap: wrap; }
.mapwrap-bd { padding: var(--sp-3); }
.map .fora { fill: url(#hatch-fora); }
.map .bairro.fora { cursor: default; }
.map .esc { stroke: var(--fg); stroke-width: 2.6; fill: none; vector-effect: non-scaling-stroke; }
.map .pt { stroke: var(--surface); stroke-width: 1.2; vector-effect: non-scaling-stroke; }
.map .anc { fill: none; stroke: var(--fg); stroke-width: 2.2; vector-effect: non-scaling-stroke; stroke-dasharray: 4 3; }

/* ── estado vazio explicado ───────────────────────────────────────────── */
.vazio { display: grid; gap: 12px; padding: var(--sp-5) var(--sp-4); border: 1px dashed var(--border-hi); justify-items: start; }
.vazio > * { display: block; }
.vazio-t { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-h3); }

/* ── estágio de imóveis: handoff declarado ────────────────────────────── */
.query {
  display: grid; gap: 6px; padding: var(--sp-3); border: 1px solid var(--border-hi); border-radius: 2px;
  background: color-mix(in oklab, var(--fg) 4%, var(--surface));
  font-family: var(--font-mono); font-size: var(--fs-meta); line-height: 1.6;
}
.query > * { display: block; }
.query b { color: var(--accent-text); font-weight: 500; }

/* ── entradas de lista escalonadas ────────────────────────────────────── */
@keyframes od-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }
.stag > * { animation: od-in 220ms var(--ease-out) both; }
.stag > *:nth-child(2) { animation-delay: 40ms; }
.stag > *:nth-child(3) { animation-delay: 80ms; }
.stag > *:nth-child(4) { animation-delay: 120ms; }
.stag > *:nth-child(5) { animation-delay: 160ms; }
.stag > *:nth-child(n+6) { animation-delay: 200ms; }
@media (prefers-reduced-motion: reduce) { .stag > * { animation: none; } }


/* ═════════════════════════════════════════════════════════════════════════
   Classes de critério — acrescentado na rodada do modelo de três classes.
   Regra do sistema: o acento lima significa DECISÃO da pessoa. Critério
   informativo e custo em estado informativo usam neutros derivados da tinta
   e nunca o acento; o custo só ganha acento depois de o gate ser ligado,
   porque aí passou a ser escolha. Contrastes medidos antes de escrever:
   corpo/caixa informativa 14,46:1 · texto secundário na caixa 4,69:1 ·
   corpo/trilha 12,43:1 · acento forte/trilha 3,70:1 · fg-dim/superfície 3,19:1.
   ═════════════════════════════════════════════════════════════════════════ */

.crit-sec { display: grid; gap: var(--sp-3); }
.crit-sec > * { display: block; }
.crit-sec-hd { display: grid; gap: 3px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
.crit-sec-hd > * { display: block; }
.crit-sec-k {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--fg-mut);
}
.crit-sec-t { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-sm); }
.crit-sec-d { font-size: var(--fs-meta); color: var(--fg-mut); line-height: 1.5; }

/* critério informativo: sem controle, por definição */
.info-row {
  display: grid; gap: 8px; padding: var(--sp-3);
  background: color-mix(in oklab, var(--fg) 4.5%, var(--surface));
  border-radius: 2px;
}
.info-row > * { display: block; }
.info-hd { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.info-nm { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-sm); }
.info-tag {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase;
  color: var(--fg-mut); border: 1px solid var(--border-hi); border-radius: 2px; padding: 2px 6px;
  margin-inline-start: auto; flex: none;
}
.info-v { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: var(--fs-sm); }
.info-why { font-size: var(--fs-meta); color: var(--fg-mut); line-height: 1.5; }
.info-gap {
  display: grid; gap: 4px; padding: 10px; border: 1px dashed var(--border-hi); border-radius: 2px;
}
.info-gap > * { display: block; }
.info-gap-k {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--fg-mut);
}

/* gate de renda: a conta fica visível */
.gate { display: grid; gap: var(--sp-3); }
.gate > * { display: block; }
.gate-grid { display: grid; gap: var(--sp-2) var(--sp-3); grid-template-columns: 1fr 1fr; }
.gate-grid > * { display: block; }
@media (max-width: 420px) { .gate-grid { grid-template-columns: 1fr; } }
.gate-conta {
  display: grid; gap: 4px; padding: var(--sp-3); border-radius: 2px;
  background: color-mix(in oklab, var(--fg) 4.5%, var(--surface));
  font-family: var(--font-mono); font-size: var(--fs-meta); line-height: 1.6;
}
.gate-conta > * { display: block; }
.gate-teto { font-size: 22px; font-variant-numeric: tabular-nums; }
.gate-nota { font-family: var(--font-body); font-size: var(--fs-meta); color: var(--fg-mut); line-height: 1.5; }

/* interruptor: o estado mora no knob e no rótulo, nunca só na trilha —
   a trilha desligada fica em 1,43:1 e não pode carregar significado */
.sw {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--sp-3);
  align-items: center; width: 100%; min-height: 44px; padding: 8px 10px;
  border: 1px solid var(--border-hi); border-radius: 2px; text-align: left;
  background: var(--surface); color: var(--fg);
}
.sw > * { display: block; }
.sw[disabled] { opacity: .55; cursor: not-allowed; }
.sw-track {
  width: 40px; height: 22px; border-radius: 11px; position: relative; flex: none;
  background: color-mix(in oklab, var(--fg) 16%, var(--bg));
  border: 1px solid var(--border-hi);
  transition: background var(--dur) var(--ease-out);
}
.sw-track::after {
  content: ''; position: absolute; top: 2px; left: 2px;
  width: 16px; height: 16px; border-radius: 50%; background: var(--fg);
  transition: transform var(--dur) var(--ease-out), background var(--dur) var(--ease-out);
}
.sw[aria-pressed="true"] .sw-track { background: var(--accent); }
.sw[aria-pressed="true"] .sw-track::after { transform: translateX(18px); background: var(--on-accent); }
.sw-lb { display: grid; gap: 2px; }
.sw-lb > * { display: block; }
.sw-t { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-sm); }
.sw-d { font-size: var(--fs-meta); color: var(--fg-mut); line-height: 1.45; }
@media (prefers-reduced-motion: reduce) { .sw-track, .sw-track::after { transition: none; } }

/* faixa de custo: mediana marcada, quartis como extensão, teto como linha */
.faixa { display: grid; gap: 6px; }
.faixa > * { display: block; }
.faixa-tr {
  position: relative; height: 26px; border-radius: 2px;
  background: color-mix(in oklab, var(--fg) 9%, var(--bg));
  border: 1px solid var(--border);
}
.faixa-iqr {
  position: absolute; top: 6px; height: 14px; border-radius: 2px;
  background: color-mix(in oklab, var(--accent-forte) 34%, transparent);
}
.faixa-med {
  position: absolute; top: 2px; width: 3px; height: 22px; border-radius: 2px;
  background: var(--fg);
}
.faixa-teto { position: absolute; top: -3px; width: 2px; height: 32px; background: var(--fg); }
.faixa-teto::after {
  content: 'seu teto'; position: absolute; top: -14px; left: 4px;
  font-family: var(--font-mono); font-size: 10px; color: var(--fg-mut); white-space: nowrap;
}
.faixa-teto[data-lado="fim"]::after { left: auto; right: 4px; }
.faixa-esc { display: flex; justify-content: space-between; }
.faixa-esc span { font-family: var(--font-mono); font-size: 10px; color: var(--fg-mut); }
.faixa-acima { background: repeating-linear-gradient(135deg, var(--border-hi) 0 1px, transparent 1px 6px); }

/* dado indisponível: mesma linguagem da lacuna, nunca célula vazia */
.indisp {
  display: grid; gap: 4px; padding: 10px; border: 1px dashed var(--border-hi); border-radius: 2px;
}
.indisp > * { display: block; }
.indisp-k {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--fg-mut);
}
.indisp-d { font-size: var(--fs-meta); color: var(--fg-mut); line-height: 1.5; }

/* erro de campo: ao lado do campo, com causa e remédio */
.err { display: block; font-size: var(--fs-meta); color: var(--fg); line-height: 1.45; }
.err::before { content: '↳ '; color: var(--fg-mut); }
.inp[aria-invalid="true"] { border-color: var(--fg); border-width: 2px; }

/* ponto de transporte no mapa ampliado */
.map .pt-transporte { stroke: var(--surface); stroke-width: 1.4; vector-effect: non-scaling-stroke; }

/* ═════════════════════════════════════════════════════════════════════════
   Lugares-âncora — de uma âncora para um conjunto tipado.
   Nenhum token de cor novo: a âncora é um ponto da rotina da pessoa, não uma
   decisão sobre o território, então usa a tinta e os neutros já medidos.
   O numeral do marcador é --bg sobre --fg (15,15:1, o mesmo par do corpo).
   ═════════════════════════════════════════════════════════════════════════ */

.anc-list { display: grid; gap: 8px; }
.anc-row {
  display: grid; gap: 8px; padding: 10px var(--sp-3);
  border: 1px solid var(--border); border-radius: 2px; background: var(--surface);
}
.anc-row > * { display: block; }
.anc-row[data-limite="1"] { border-color: var(--accent-forte); }
.anc-hd { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: var(--sp-3); align-items: start; }
.anc-hd > * { display: block; }
.anc-n {
  width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center;
  background: var(--fg); color: var(--bg);
  font-family: var(--font-mono); font-size: 11px; font-variant-numeric: tabular-nums;
}
.anc-nm { display: grid; gap: 2px; }
.anc-nm > * { display: block; }
.anc-t { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-sm); }
.anc-sub { font-family: var(--font-mono); font-size: 11px; color: var(--fg-mut); }
.anc-rm {
  width: 28px; height: 28px; display: grid; place-items: center; flex: none;
  border: 1px solid var(--border-hi); border-radius: 2px; font-size: 15px; line-height: 1;
}
@media (hover: hover) { .anc-rm:hover { border-color: var(--fg); } }
.anc-lim { display: grid; grid-template-columns: minmax(0, 1fr) 120px; gap: var(--sp-2); align-items: center; }
.anc-lim > * { display: block; }
@media (max-width: 460px) { .anc-lim { grid-template-columns: minmax(0, 1fr); } }
.anc-sw {
  display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px; align-items: center;
  min-height: 44px; text-align: left; color: inherit;
}
.anc-sw > * { display: block; }
.anc-sw-t { font-size: var(--fs-meta); line-height: 1.35; }
/* o knob e a trilha do interruptor de âncora precisam do próprio escopo:
   as regras de .sw não alcançam .anc-sw, e sem isto o estado não mudaria */
.anc-sw[aria-pressed="true"] .sw-track { background: var(--accent); }
.anc-sw[aria-pressed="true"] .sw-track::after { transform: translateX(18px); background: var(--on-accent); }
.anc-km input[disabled] { opacity: .5; cursor: not-allowed; }
.anc-km input[aria-invalid="true"] { border-color: var(--fg); border-width: 2px; }
.anc-km { display: grid; gap: 2px; }
.anc-km > * { display: block; }
.anc-km input { width: 100%; min-height: 40px; padding: 6px 10px; border: 1px solid var(--border-hi);
  border-radius: 2px; background: var(--bg); color: var(--fg);
  font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.anc-km-lb { font-family: var(--font-mono); font-size: 10px; letter-spacing: .08em;
  text-transform: uppercase; color: var(--fg-mut); }

.anc-add { display: grid; gap: var(--sp-2); padding-top: var(--sp-3); border-top: 1px solid var(--border); }
.anc-add > * { display: block; }
.anc-add-grid { display: grid; gap: var(--sp-2); grid-template-columns: 1fr 1fr; }
.anc-add-grid > * { display: block; }
@media (max-width: 460px) { .anc-add-grid { grid-template-columns: 1fr; } }

/* bloco de distâncias no painel de match */
.dist { display: grid; gap: 1px; background: var(--border); border: 1px solid var(--border);
  border-radius: 2px; overflow: hidden; }
.dist-row { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: var(--sp-3);
  align-items: center; padding: 9px var(--sp-3); background: var(--surface); }
.dist-row > * { display: block; }
.dist-row[data-fora="1"] { background: color-mix(in oklab, var(--fg) 5%, var(--surface)); }
.dist-nm { display: grid; gap: 2px; }
.dist-nm > * { display: block; }
.dist-t { font-size: var(--fs-sm); }
.dist-sub { font-family: var(--font-mono); font-size: 11px; color: var(--fg-mut); }
.dist-km { font-family: var(--font-mono); font-variant-numeric: tabular-nums;
  font-size: var(--fs-sm); white-space: nowrap; text-align: right; }
.dist-tot { display: flex; align-items: baseline; gap: 8px; padding-top: 8px; }
.dist-tot-v { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-size: 20px; }

/* marcador de âncora numerado no mapa */
.map .anc-dot { fill: var(--fg); }
.map .anc-lb { font-family: var(--font-mono); font-size: 15px; fill: var(--bg);
  text-anchor: middle; dominant-baseline: central; pointer-events: none; }

/* ═════════════════════════════════════════════════════════════════════════
   Anúncios fictícios — estágio de imóveis.
   Nenhum token de cor novo. O estado "dado fictício" reusa a mesma linguagem
   já estabelecida para lacuna declarada — contorno tracejado, etiqueta
   monoespaçada em caixa alta e hachura — porque é da mesma família: uma
   afirmação sobre o mundo que a interface precisa qualificar. Nunca vermelho
   de alarme, que está na lista do proibido.
   ═════════════════════════════════════════════════════════════════════════ */

.fict {
  display: grid; gap: 8px; padding: var(--sp-3) var(--sp-4);
  border: 2px dashed var(--border-hi); border-radius: 2px;
  background: repeating-linear-gradient(135deg,
    color-mix(in oklab, var(--fg) 5%, var(--surface)) 0 2px,
    var(--surface) 2px 9px);
}
.fict > * { display: block; }
.fict-k {
  font-family: var(--font-mono); font-size: 11px; letter-spacing: .14em;
  text-transform: uppercase; color: var(--fg);
}
.fict-d { font-size: var(--fs-sm); line-height: 1.5; color: var(--fg); max-width: 68ch; }
.fict-tag {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--fg-mut);
  border: 1px dashed var(--border-hi); border-radius: 2px; padding: 1px 5px;
  flex: none; white-space: nowrap;
}

.imv-bar { display: grid; gap: var(--sp-2); }
.imv-bar > * { display: block; }
.imv-bar-row { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-3); align-items: flex-end; }
.imv-ct { display: grid; gap: 4px; }
.imv-ct > * { display: block; }
.imv-ct-lb {
  font-family: var(--font-mono); font-size: 10px; letter-spacing: .1em;
  text-transform: uppercase; color: var(--fg-mut);
}

.imv-grid { display: grid; gap: var(--sp-3); grid-template-columns: repeat(auto-fill, minmax(268px, 1fr)); }
.imv-card {
  display: grid; gap: 10px; padding: var(--sp-3);
  border: 1px solid var(--border); border-radius: 2px var(--r) var(--r) var(--r);
  background: var(--surface);
}
.imv-card > * { display: block; }
.imv-card[data-cabe="0"] { border-style: dashed; }
.imv-hd { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.imv-tipo { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-sm); }
.imv-ref { font-family: var(--font-mono); font-size: 10px; color: var(--fg-mut); margin-inline-start: auto; }
.imv-preco { display: grid; gap: 2px; }
.imv-preco > * { display: block; }
.imv-preco-v {
  font-family: var(--font-mono); font-variant-numeric: tabular-nums;
  font-size: 24px; line-height: 1.05; letter-spacing: -.02em;
}
.imv-preco-m2 { font-family: var(--font-mono); font-size: 11px; color: var(--fg-mut); }
.imv-especs { display: flex; flex-wrap: wrap; gap: 6px; }
.imv-esp {
  display: inline-flex; align-items: baseline; gap: 4px; flex: none;
  padding: 3px 8px; border: 1px solid var(--border); border-radius: 999px;
  font-size: var(--fs-meta); color: var(--fg-mut); white-space: nowrap;
}
.imv-esp b { font-family: var(--font-mono); font-weight: 500; color: var(--fg); }
.imv-ft { display: grid; gap: 3px; padding-top: 8px; border-top: 1px solid var(--border); }
.imv-ft > * { display: block; }
.imv-ft-l { font-size: var(--fs-meta); color: var(--fg-mut); line-height: 1.45; }
.imv-teto { font-family: var(--font-mono); font-size: 11px; }
.imv-teto[data-cabe="1"] { color: var(--accent-text); }
.imv-mais { display: grid; place-items: center; padding: var(--sp-3); }