/* Mapa do Brasil por município (Three.js) */
#mapa-brasil[hidden] { display: none; }
.mbr-ancora { display: block; height: 0; }
.mbr-barras { display: flex; flex-wrap: wrap; gap: 0.25rem 2rem; margin: 1rem 0 0.75rem; }
.mbr-barras .mbr-turnos { margin: 0; }
.mbr-turnos { display: flex; gap: 0.5rem; margin: 1rem 0 0.75rem; }
.mbr-cargos .mbr-turno { border-radius: var(--radius-md); }
.mbr-turno {
  display: inline-flex; flex-direction: column; align-items: center; gap: 0.1rem;
  padding: 0.5rem 1.1rem; border: 1.5px solid var(--border); border-radius: 999px;
  background: var(--surface); color: var(--ink); font: 700 0.85rem/1 inherit; font-family: inherit; cursor: pointer;
}
.mbr-turno small { font-size: 0.875rem; font-weight: 600; color: var(--ink-muted); }
.mbr-turno.ativo { background: var(--primary, #1351b4); border-color: var(--primary, #1351b4); color: #fff; }
.mbr-turno:disabled { opacity: 0.55; cursor: not-allowed; }
.mbr-turno:focus-visible { outline: 3px solid #e8a020; outline-offset: 2px; }

.mbr-resumo { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-bottom: 1rem; }
.mbr-chip {
  display: flex; align-items: center; gap: 0.6rem; flex: 1 1 240px;
  padding: 0.65rem 0.9rem; border: 1px solid var(--border-light); border-radius: var(--radius-md);
  background: var(--bg); font-size: 0.875rem; line-height: 1.35;
}
.mbr-chip em, .mbr-cand em { font-style: normal; font-size: 0.875rem; color: var(--ink-muted); }
.mbr-chip b { font-size: 1.15rem; }
.mbr-cor { flex: none; width: 12px; height: 12px; border-radius: 3px; }

.mbr-palco { position: relative; border-radius: var(--radius-md); background: radial-gradient(120% 90% at 50% 0%, #fff 0%, #f3f6fc 100%); border: 1px solid var(--border-light); }
.mbr-canvas { width: 100%; height: min(70vh, 620px); min-height: 360px; overflow: hidden; border-radius: inherit; }
.mbr-canvas canvas { display: block; width: 100%; height: 100%; cursor: grab; touch-action: pan-y; }
.mbr-controles { position: absolute; top: 0.6rem; right: 0.6rem; display: flex; flex-direction: column; gap: 0.35rem; z-index: 3; }
.mbr-btn {
  width: 36px; height: 36px; border: 1.5px solid var(--primary, #1351b4); border-radius: 10px;
  background: #fff; color: var(--primary, #1351b4); font: 700 1.1rem/1 inherit; font-family: inherit; cursor: pointer;
  box-shadow: 0 2px 8px rgba(19, 81, 180, 0.15);
}
.mbr-btn[aria-pressed='true'] { background: var(--primary, #1351b4); color: #fff; }
.mbr-btn:focus-visible { outline: 3px solid #e8a020; outline-offset: 2px; }
.mbr-dica {
  position: absolute; left: 0.75rem; bottom: 0.6rem; z-index: 2; pointer-events: none; max-width: calc(100% - 4rem);
  font-size: 0.875rem; color: var(--ink-muted); background: rgba(255, 255, 255, 0.85); padding: 0.3rem 0.6rem; border-radius: 999px;
}
.mbr-aviso {
  position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 5; pointer-events: none;
  background: rgba(11, 31, 77, 0.88); color: #fff; padding: 0.55rem 0.9rem; border-radius: 999px; font-size: 0.875rem;
}
.mbr-aviso[hidden] { display: none; }
.mbr-leg-altura { margin: 0.6rem 0 0; font-size: 0.875rem; color: var(--ink-muted); }
.mbr-tooltip small { opacity: 0.8; }
.mbr-dica-toque { display: none; }
@media (hover: none) { .mbr-dica { display: none; } .mbr-dica-toque { display: block; } }
.mbr-tooltip {
  position: absolute; z-index: 4; pointer-events: none; max-width: 180px;
  background: #0b1f4d; color: #fff; padding: 0.4rem 0.6rem; border-radius: 8px; font-size: 0.875rem; line-height: 1.4;
}
.mbr-tooltip[hidden] { display: none; }

.mbr-busca { position: relative; display: flex; align-items: center; max-width: 460px; margin: 1.25rem 0 0.75rem; }
.mbr-busca > svg {
  position: absolute; left: 0.35rem; z-index: 1; box-sizing: content-box; width: 18px; height: 18px; padding: 0.55rem;
  border-radius: 50%; background: var(--primary, #1351b4); color: #fff; pointer-events: none;
}
.mbr-busca-input {
  width: 100%; padding: 0.95rem 1.25rem 0.95rem 3.6rem; border: 2px solid var(--primary, #1351b4); border-radius: 999px;
  background: #fff; font: 600 0.95rem/1.2 inherit; font-family: inherit; color: var(--ink);
  box-shadow: 0 4px 14px rgba(19, 81, 180, 0.12); transition: box-shadow 0.18s;
}
.mbr-busca-input::placeholder { color: var(--ink-muted); font-weight: 500; }
.mbr-busca-input:focus-visible { outline: 3px solid #e8a020; outline-offset: 2px; box-shadow: 0 6px 18px rgba(19, 81, 180, 0.2); }
.mbr-sugestoes {
  position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 10; margin: 0; padding: 0.25rem; list-style: none;
  background: #fff; border: 1px solid var(--border); border-radius: var(--radius-md); box-shadow: var(--shadow-lg);
}
.mbr-sugestoes[hidden] { display: none; }
.mbr-sug { display: flex; justify-content: space-between; padding: 0.5rem 0.7rem; border-radius: 8px; font-size: 0.88rem; cursor: pointer; }
.mbr-sug span { color: var(--ink-muted); font-size: 0.875rem; }
.mbr-sug:hover, .mbr-sug.ativo { background: var(--accent-blue-bg, #eaf1fd); }

.mbr-painel { max-width: 460px; margin: 0 0 1.25rem; padding: 0.9rem 1rem; border: 1px solid var(--border-light); border-radius: var(--radius-md); background: var(--bg); min-height: 5rem; }
.mbr-painel h4 { margin: 0 0 0.5rem; font-size: 1rem; }
.mbr-painel h4 span { font-size: 0.875rem; color: var(--ink-muted); font-weight: 600; }
.mbr-linha { display: grid; grid-template-columns: 12px 1fr auto; align-items: center; gap: 0.15rem 0.5rem; margin-bottom: 0.45rem; font-size: 0.875rem; }
.mbr-linha.vence .mbr-cand { font-weight: 700; }
.mbr-barra { grid-column: 1 / -1; height: 5px; background: rgba(0, 0, 0, 0.07); border-radius: 3px; overflow: hidden; }
.mbr-barra i { display: block; height: 100%; }
.mbr-vazio { margin: 0.35rem 0 0; font-size: 0.875rem; color: var(--ink-muted); }

.mbr-legenda { margin-top: 0.5rem; }
.mbr-leg-titulo { margin: 0 0 0.35rem; font-weight: 700; font-size: 0.9rem; }
.mbr-leg-marcas { display: flex; width: 172px; margin-bottom: 0.3rem; font-size: 0.875rem; color: var(--ink-muted); }
.mbr-leg-marcas span { flex: 1; }
.mbr-leg-linha { display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.4rem; font-size: 0.875rem; }
.mbr-leg-linha small { color: var(--ink-muted); }
.mbr-leg-escala { display: flex; flex: none; width: 172px; height: 14px; border-radius: 7px; overflow: hidden; }
.mbr-leg-escala i { flex: 1; }
.mbr-fonte { margin: 0.9rem 0 0; font-size: 0.875rem; color: var(--ink-muted); }
.mbr-erro { padding: 2rem 1rem; text-align: center; font-size: 0.9rem; color: var(--ink-muted); }

@media (max-width: 600px) {
  .mbr-tabela thead th:nth-child(4), .mbr-tabela tbody td:nth-child(4) { display: none; }
  .mbr-controles { top: auto; bottom: 0.6rem; left: 0.6rem; right: 0.6rem; flex-direction: row; justify-content: center; flex-wrap: wrap; }
  .mbr-dica { display: none; }
  .mbr-canvas { height: 100vw; min-height: 320px; max-height: 520px; }
  .mbr-leg-linha { align-items: flex-start; flex-direction: column; gap: 0.2rem; }
}

.mbr-rotulos { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none; }
.mbr-linha strong small { font-weight: 500; color: var(--ink-muted); margin-left: 0.25rem; }

.mbr-tabela { margin-top: 1.25rem; }
.mbr-tabela[hidden] { display: none; }
.mbr-tabela-titulo { margin: 0 0 0.5rem; font-weight: 700; font-size: 0.9rem; }
.mbr-tabela-rolagem { max-height: 380px; overflow: auto; border: 1px solid var(--border-light); border-radius: var(--radius-md); }
.mbr-tabela table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.mbr-tabela thead th { position: sticky; top: 0; z-index: 1; background: var(--bg); text-align: left; border-bottom: 1px solid var(--border); padding: 0; }
.mbr-tabela thead button { width: 100%; padding: 0.6rem 0.75rem; border: 0; background: transparent; font: 700 0.78rem/1.2 inherit; font-family: inherit; color: var(--ink); text-align: inherit; cursor: pointer; }
.mbr-tabela thead button:focus-visible { outline: 3px solid #e8a020; outline-offset: -3px; }
.mbr-tabela .num { text-align: right; font-variant-numeric: tabular-nums; }
.mbr-tabela tbody th { text-align: left; font-weight: 600; padding: 0.5rem 0.75rem; }
.mbr-tabela td { padding: 0.5rem 0.75rem; }
.mbr-tabela tbody tr { border-bottom: 1px solid var(--border-light); cursor: pointer; }
.mbr-tabela tbody tr:hover, .mbr-tabela tbody tr.sel { background: var(--accent-blue-bg, #eaf1fd); }
.mbr-tabela tbody tr:focus-visible { outline: 3px solid #e8a020; outline-offset: -3px; }
.mbr-tabela td.vence { font-weight: 800; }
