/* SIGA · mapa — estilos compartilhados pelo Google Maps e pelo fallback.
   Os marcadores usam as mesmas classes nos dois, então o visual não muda. */
:root{
  --bg:#F8FAFC;--card:#fff;--line:#E2E8F0;--line2:#F1F5F9;--line3:#CBD5E1;
  --ink:#020817;--ink2:#334155;--mut:#64748B;--mut2:#94A3B8;--head:#0F172A;
  --r:16px;--r2:12px;--r3:8px;--sh:0 1px 2px 0 rgba(0,0,0,.05);
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);
  font:14px/20px Inter,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
.wrap{display:grid;grid-template-columns:420px 1fr;height:100vh}
.side{background:#fff;border-right:1px solid var(--line2);padding:24px;overflow-y:auto}
.side h1{font-size:24px;line-height:32px;font-weight:700;color:var(--head);margin:0}
.side .sub{font-size:14px;color:var(--mut);margin:4px 0 22px}
.lab{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--mut2);font-weight:700;margin-bottom:10px}
#stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.st{background:#fff;border:1px solid var(--line2);border-radius:var(--r2);padding:14px 10px;text-align:center}
.st b{display:block;font-size:22px;line-height:28px;font-weight:700;color:var(--head);font-variant-numeric:tabular-nums}
.st span{font-size:11.5px;color:var(--mut)}
.st-1{background:#F0FBF5;border-color:#D6F0E3}.st-2{background:#F7F3FE;border-color:#E7DDFB}
.st-3{background:#F0F4FE;border-color:#DCE5FC}.st-4{background:#F5F7FB;border-color:#E4EAF2}
#filtros{margin-top:22px;border-top:1px solid var(--line2)}
.row{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid var(--line2)}
.row .ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;flex:0 0 auto}
.row .ic svg{width:20px;height:20px}
.row .tx{flex:1;min-width:0;font-size:14px;font-weight:500;color:var(--ink2)}
.row .tx small{display:block;font-size:11px;color:var(--mut2);margin-top:2px}
.row-sel select{width:100%;margin-top:6px;padding:9px 11px;border:1px solid var(--line);
  border-radius:var(--r3);background:#fff;font:inherit;font-size:13px;color:var(--ink2)}
.row-sel{display:block}
.sw{width:44px;height:24px;border-radius:99px;background:var(--line3);position:relative;cursor:pointer;flex:0 0 auto;transition:background .16s}
.sw i{position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;
  box-shadow:0 1px 3px rgba(0,0,0,.25);transition:transform .16s}
.sw[aria-checked="true"]{background:#7C5CE0}
.sw[aria-checked="true"] i{transform:translateX(20px)}
.nota{margin-top:20px;font-size:12px;line-height:1.55;color:var(--mut);background:var(--bg);
  border-radius:var(--r2);padding:12px 14px}
.nota b{color:var(--ink2)}
#aviso-fallback{margin-top:14px;font-size:12px;line-height:1.5;color:#96650A;background:#FDF4E2;
  border-left:3px solid #E8A317;border-radius:var(--r3);padding:11px 13px}

/* ---- área do mapa ---- */
.mapbox{position:relative;overflow:hidden;background:#A5D5EE}
#mapa{position:absolute;inset:0}
.ctl-tl{position:absolute;top:14px;left:14px;z-index:5;display:flex;background:#fff;border-radius:var(--r3);
  box-shadow:0 2px 6px rgba(2,8,23,.22);overflow:hidden}
/* Os controles da referência valem NOS DOIS mapas. Esta regra escondia todos
   eles quando o Google entrava, supondo que os nativos assumiriam — e os nativos
   de tipo, zoom e recentrar estão desligados de propósito, para não haver dois de
   cada na tela. Com a regra antiga, a produção ficaria sem nenhum. */
.ctl-tl button{padding:9px 18px;border:0;background:#fff;font:inherit;font-size:14px;font-weight:600;color:var(--mut);cursor:pointer}
.ctl-tl button[aria-pressed="true"]{color:var(--head)}
.ctl-tl button+button{border-left:1px solid var(--line2)}
.ctl-tr{position:absolute;top:14px;right:14px;z-index:5;display:flex;align-items:center;gap:12px;background:#fff;
  border-radius:var(--r2);box-shadow:0 2px 6px rgba(2,8,23,.22);padding:10px 14px}
.ctl-tr span{font-size:13px;font-weight:600;color:var(--ink2)}
.ctl-zoom{position:absolute;right:14px;bottom:14px;z-index:5;display:flex;flex-direction:column;background:#fff;
  border-radius:var(--r3);box-shadow:0 2px 6px rgba(2,8,23,.22);overflow:hidden}
.ctl-zoom button{width:40px;height:40px;border:0;background:#fff;font-size:20px;color:var(--ink2);cursor:pointer}
.ctl-zoom button+button{border-top:1px solid var(--line2)}
.ctl-rec{position:absolute;right:14px;bottom:106px;z-index:5;width:40px;height:40px;border:0;background:#fff;
  border-radius:50%;box-shadow:0 2px 6px rgba(2,8,23,.22);display:grid;place-items:center;cursor:pointer}
#rodape{position:absolute;left:14px;bottom:14px;z-index:5;background:#fff;border-radius:99px;
  box-shadow:0 2px 6px rgba(2,8,23,.22);padding:9px 16px;font-size:12.5px;color:var(--mut)}
#rodape b{color:var(--head)}

/* ---- fallback vetorial ---- */
.sm-vector{cursor:grab;touch-action:none}
.sm-vector.grab{cursor:grabbing}
.sm-svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.sm-ov{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.sm-ov>*{position:absolute}

/* ============ MARCADORES (iguais nos dois adapters) ============ */
.sm-pill{transform:translate(-50%,-100%);background:#fff;border:2px solid var(--c);border-radius:9px;
  padding:5px 9px;box-shadow:0 2px 6px rgba(2,8,23,.18);white-space:nowrap;max-width:340px;
  overflow:hidden;pointer-events:auto;cursor:pointer}
.sm-pill b{display:block;font-size:11.5px;line-height:15px;font-weight:700;color:var(--c);
  overflow:hidden;text-overflow:ellipsis}
.sm-pill span{display:block;font-size:10.5px;line-height:14px;color:var(--mut);font-weight:500}
.sm-pill .sm-votos{display:inline;font-size:10.5px;color:var(--head);font-weight:700}
.sm-pill .sm-x{color:#D24A3F}
.sm-pill:hover{z-index:9;box-shadow:0 6px 16px rgba(2,8,23,.26)}

.sm-pin{transform:translate(-50%,-50%);width:34px;height:34px;border-radius:50%;background:var(--c);
  border:2.5px solid #fff;box-shadow:0 2px 6px rgba(2,8,23,.3);display:grid;place-items:center;
  color:#fff;pointer-events:auto;cursor:pointer;position:relative}
.sm-pin svg{width:18px;height:18px}
.sm-badge{position:absolute;top:-6px;right:-8px;min-width:19px;height:19px;padding:0 5px;border-radius:99px;
  background:#0F172A;color:#fff;font-size:10.5px;font-weight:700;line-height:19px;text-align:center;
  border:2px solid #fff;font-style:normal;font-variant-numeric:tabular-nums}
.sm-badge-w{background:#fff;color:var(--c);border-color:var(--c)}

.sm-school{transform:translate(-50%,-50%);width:30px;height:30px;border-radius:9px;background:var(--c);
  border:2px solid #fff;box-shadow:0 2px 6px rgba(2,8,23,.3);display:grid;place-items:center;color:#fff;
  pointer-events:auto;cursor:pointer;position:relative}
.sm-school svg{width:16px;height:16px}

.sm-cluster{transform:translate(-50%,-50%);width:var(--t);height:var(--t);border-radius:50%;
  background:var(--c);display:grid;place-items:center;color:#fff;font-weight:700;
  box-shadow:0 0 0 7px color-mix(in srgb,var(--c) 30%,transparent),0 2px 8px rgba(2,8,23,.28);
  pointer-events:auto;cursor:pointer;font-variant-numeric:tabular-nums}
.sm-cluster b{font-size:14px}

.sm-dot{transform:translate(-50%,-50%);border-radius:50%;border:2px solid #fff;
  box-shadow:0 1px 3px rgba(2,8,23,.35);pointer-events:auto;cursor:pointer;display:block}
.sm-dot:hover{outline:3px solid rgba(255,255,255,.7);z-index:4}
.sm-heat{transform:translate(-50%,-50%);border-radius:50%;pointer-events:none;display:block;
  background:radial-gradient(circle,rgba(232,115,12,.55) 0%,rgba(232,115,12,.28) 45%,rgba(232,115,12,0) 72%)}

/* ---- cartões ---- */
.sm-card{font:13px/1.45 Inter,system-ui,sans-serif;color:var(--ink2);min-width:230px}
.sm-card-h{border-left:3px solid var(--c);padding:0 0 8px 10px;margin-bottom:8px}
.sm-card-h b{display:block;font-size:13.5px;color:var(--head);font-weight:700}
.sm-card-h span{font-size:11.5px;color:var(--mut)}
.sm-card-l{display:flex;justify-content:space-between;gap:16px;padding:4px 0;border-top:1px solid var(--line2)}
.sm-card-l span{color:var(--mut);font-size:12px}
.sm-card-l b{color:var(--head);font-variant-numeric:tabular-nums}
.sm-card-sep{margin-top:8px;font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--mut2);font-weight:700}
.sm-card-alert{margin-top:8px;font-size:11.5px;color:#96650A;background:#FDF4E2;border-radius:6px;padding:6px 8px}
.sm-wa{display:block;margin-top:10px;text-align:center;background:#22A45D;color:#fff;border-radius:8px;
  padding:8px;font-weight:600;text-decoration:none;font-size:12.5px}
.sm-pop{position:absolute;transform:translate(-50%,calc(-100% - 14px));background:#fff;border:1px solid var(--line);
  border-radius:var(--r2);box-shadow:0 10px 24px rgba(2,8,23,.22);padding:14px 16px;z-index:20;pointer-events:auto;max-width:320px}
.sm-pop-x{position:absolute;top:6px;right:8px;border:0;background:none;font-size:18px;color:var(--mut);cursor:pointer;line-height:1}

@media (max-width:1023px){
  .wrap{grid-template-columns:1fr;height:auto}
  .side{border-right:0;border-bottom:1px solid var(--line2)}
  .mapbox{height:64vh;min-height:380px}
}
@media (max-width:639px){
  .side{padding:16px}
  #stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sm-pill{max-width:210px}
  .ctl-tr{padding:8px 10px}.ctl-tr span{font-size:11.5px}
}

/* ---- FASE 0: feiras, zonas e barra de filtros ---- */
.sm-feira{position:absolute;transform:translate(-50%,-50%);width:9px;height:9px;border-radius:50%;
  background:#E8730C;border:1.5px solid #fff;box-shadow:0 1px 2px rgba(2,8,23,.3);cursor:pointer}
.sm-zbub{position:absolute;transform:translate(-50%,-50%);border-radius:50%;cursor:pointer;
  background:color-mix(in srgb, var(--c) 22%, transparent);border:2px solid var(--c);transition:background .12s}
.sm-zbub:hover{background:color-mix(in srgb, var(--c) 38%, transparent)}
.lab{font-size:10.5px;font-weight:700;letter-spacing:.6px;color:#94A3B8;margin:18px 0 8px}
.filtros{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.filtros select,.filtros button{font-size:12px;padding:5px 8px;border-radius:7px;
  border:1px solid #E2E8F0;background:#fff;cursor:pointer;max-width:100%}
.filtros .cnt{font-size:11.5px;color:#64748B;flex-basis:100%;font-variant-numeric:tabular-nums}
.filtros .cnt.zero{color:#D24A3F;font-weight:600}
.sm-card-dl{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;margin:8px 0 0;font-size:12.5px}
.sm-card-dl dt{color:#64748B}
.sm-card-dl dd{margin:0;text-align:right;font-variant-numeric:tabular-nums;font-weight:500}

/* chip de WhatsApp desabilitado: o telefone vive no servidor, nunca no HTML */
.sm-wa.off{display:block;margin-top:9px;text-align:center;padding:7px 10px;border-radius:7px;
  border:1px dashed #CBD5E1;color:#94A3B8;font-size:12px;font-weight:600;cursor:not-allowed}

/* ---- camada Metas: etiqueta com o número da meta por município ---- */
.sm-meta{transform:translate(-50%,-50%);background:var(--c);color:#fff;border-radius:8px;
  padding:3px 8px 4px;box-shadow:0 3px 10px rgba(2,8,23,.3);text-align:center;white-space:nowrap;
  border:2px solid #fff;cursor:pointer}
.sm-meta b{display:block;font-size:12px;line-height:14px;font-weight:800;font-variant-numeric:tabular-nums}
.sm-meta span{display:block;font-size:9.5px;line-height:12px;opacity:.85;font-weight:600;
  max-width:120px;overflow:hidden;text-overflow:ellipsis}
.sm-meta-x{background:#94A3B8}
.sm-meta:hover{z-index:9;box-shadow:0 6px 16px rgba(2,8,23,.34)}
/* apoiador usa o mesmo pino do líder, só muda a cor pela variável --c */
.sm-apo svg{width:19px;height:19px}
/* tela cheia, no mesmo estilo do botão de recentrar da referência */
.ctl-fs{bottom:auto;top:86px}
.sw[aria-disabled="true"]{opacity:.4;cursor:not-allowed}
.row:has(.sw[aria-disabled="true"]) .tx{opacity:.55}

/* ---- de onde vem o dado, e o botão de buscar de novo ---- */
.lab{display:flex;align-items:center;justify-content:space-between;gap:8px}
#atualizar{display:inline-flex;align-items:center;gap:5px;border:1px solid var(--line2,#E2E8F0);
  background:#fff;border-radius:7px;padding:4px 8px;font:inherit;font-size:11px;font-weight:600;
  letter-spacing:0;text-transform:none;color:var(--mut,#64748B);cursor:pointer}
#atualizar:hover{border-color:#4A5AD4;color:#4A5AD4}
#atualizar[disabled]{opacity:.5;cursor:progress}
#atualizar.girando svg{animation:girar .9s linear infinite}
@keyframes girar{to{transform:rotate(360deg)}}
.fonte{font-size:11px;line-height:1.5;color:var(--mut,#64748B);margin:-4px 0 12px;padding:6px 9px;
  border-radius:7px;background:#F8FAFC;border:1px solid var(--line2,#E2E8F0)}
.fonte.viva{background:#E7F7F0;border-color:#BBE7D4;color:#0B6B52}
.fonte.estatica{background:#FDF6E7;border-color:#F3E2BE;color:#8A6A12}
.fonte code{font-size:10.5px;background:rgba(0,0,0,.06);padding:1px 4px;border-radius:4px}