/*
 * Apuração na home — réplica da faixa de placar e do "Mapa de apuração" da home do g1 (medidos em 05/10/2026,
 * 1366 e 390 px). Valores lidos com getComputedStyle; ver web/docs/referencias/g1-apuracao-2026-10-05/.
 */
@font-face { font-family: "Open Sans Apuracao"; src: url("../fonts/opensans-latin-400.ttf") format("truetype"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Open Sans Apuracao"; src: url("../fonts/opensans-latin-600.ttf") format("truetype"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Open Sans Apuracao"; src: url("../fonts/opensans-latin-700.ttf") format("truetype"); font-weight: 700; font-display: swap; }

.aph {
    --aph-fonte: "Open Sans Apuracao", "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    --aph-acao: #c4170c;
    --aph-eleito: #34c771;
    --aph-segundo-turno: #006329;
    font-family: var(--aph-fonte);
    font-size: 16px;
    line-height: 16px;
    color: #333;
    -webkit-font-smoothing: antialiased;
}
.aph *, .aph *::before, .aph *::after { box-sizing: border-box; }
.aph a { text-decoration: none; }
.aph button { font-family: inherit; cursor: pointer; }
.aph h2, .aph h3, .aph p { margin: 0; }

/* ===================== Faixa de placar ===================== */
.aph-faixa {
    background: #fff;
    border: 1px solid #ebedef;
    border-radius: 16px;
    margin: 0 3px;
    overflow: hidden;
}
.aph-faixa__container { display: flex; align-items: stretch; height: 104px; }
.aph-faixa__janela { position: relative; flex: 1 1 auto; min-width: 0; overflow: hidden; }
.aph-faixa__lista { display: flex; height: 104px; transition: transform .35s ease; will-change: transform; }

.aph-item {
    display: block;
    position: relative;
    flex: 0 0 376px;
    width: 376px;
    height: 104px;
    padding: 8px 12px;
    border-right: 1px solid #e5e5e5;
    color: inherit;
}
.aph-item__cabeca { position: relative; display: flex; align-items: center; height: 24px; }
.aph-item__cargo { font-size: 16px; font-weight: 400; line-height: 24px; color: #6e727a; white-space: nowrap; }
.aph-item__ponto { flex: none; width: 4px; height: 4px; margin: 0 4px; border-radius: 50%; background: #999; }
.aph-item__lugar {
    overflow: hidden;
    padding: 0 2px 0 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    letter-spacing: -.14px;
    color: #16181c;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.aph-seta { display: flex; flex: none; width: 6px; height: 8px; margin: 0 0 0 5.5px; color: var(--aph-acao); }
.aph-seta svg { width: 6px; height: 8px; }

.aph-item__status {
    position: absolute;
    top: 2px;
    right: -1px;
    display: block;
    height: 20px;
    padding-right: 6px;
    line-height: 16px;
    white-space: nowrap;
    padding: 0 0 0 11px;
    border-radius: 6px;
    background: #fff;
    color: #000;
    font-weight: 600;
}
.aph-item__status b { padding: 0 0 0 4px; background: #fff; font-size: 14px; font-weight: 600; line-height: 20px; letter-spacing: -.6px; }
.aph-item__status small { margin: auto 0 0 -1px; padding: 2px 4px 0 0; font-size: 12px; font-weight: 600; line-height: 12px; }
.aph-item__status--andamento { padding: 0 2px 0 6px; background: #b5ffd4; color: #00913c; }
.aph-item__status--andamento b { background: transparent; }

.aph-item__candidatos { display: flex; justify-content: space-between; gap: 4px; height: 70px; }
.aph-candidato { display: flex; flex: 1 1 0; min-width: 0; padding: 12px 0 0; }
.aph-candidato__foto { position: relative; flex: none; display: grid; grid-template-columns: 48px; width: 48px; height: 58px; }
.aph-candidato__foto img, .aph-candidato__foto span {
    display: block;
    width: 48px;
    height: 48px;
    border: 1px solid #e5e5e5;
    border-radius: 50%;
    background: #f5f6f7;
    object-fit: cover;
}
.aph-candidato__anel {
    position: absolute;
    top: 1px;
    left: 0;
    width: 48px;
    height: 48px;
    border: 3px solid var(--aph-eleito);
    border-radius: 50%;
}
.aph-candidato__check {
    position: absolute;
    top: 31px;
    left: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: var(--aph-eleito);
    color: #fff;
}
.aph-candidato__check svg { width: 10px; height: 8px; }
.aph-candidato__info { flex: 1 1 auto; min-width: 0; overflow: hidden; padding: 4.5px 0 0 8px; }
.aph-candidato__nome {
    overflow: hidden;
    height: 14px;
    margin: 1px 0 4px;
    padding: 0 0 4px;
    font-size: 12px;
    font-weight: 400;
    line-height: 13.68px;
    letter-spacing: -.14px;
    color: #2f3134;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.aph-candidato__linha { display: flex; align-items: center; height: 17px; }
.aph-candidato__pct { font-size: 14px; font-weight: 600; line-height: 15.96px; letter-spacing: -.6px; color: #181818; white-space: nowrap; }
.aph-candidato__pct small { margin: 0 0 0 2px; font-size: 11px; font-weight: 600; line-height: 12.54px; letter-spacing: -.6px; }
.aph-selo {
    display: inline-flex;
    align-items: center;
    height: 17px;
    margin: 0 4px;
    padding: 1px 4px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 700;
    line-height: 12px;
    letter-spacing: -.6px;
    color: #fff;
    white-space: nowrap;
}
.aph-selo--segundo-turno { background: var(--aph-segundo-turno); }
.aph-selo--eleito { background: var(--aph-eleito); }

.aph-item--brasil { display: none; }

.aph-faixa__pagina {
    display: flex;
    flex: none;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 104px;
    padding: 0;
    border: 0;
    border-left: 1px solid #e5e5e5;
    border-right: 1px solid #e5e5e5;
    background: #fff;
    color: var(--aph-acao);
}
.aph-faixa__pagina svg { width: 10px; height: 16px; }
.aph-faixa__pagina[hidden] { display: none; }
.aph-faixa__pagina--anterior { border-left: 0; }

.aph-busca {
    display: flex;
    flex: none;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 18px;
    width: 288px;
    margin: 0 16px;
}
.aph .aph-busca__titulo { display: flex; align-items: center; height: 24px; font-size: 16px; font-weight: 700; line-height: 24px; color: #333; }
.aph-busca__campo { position: relative; display: flex; align-items: center; width: 288px; height: 44px; }
.aph-busca__lupa { position: absolute; top: 12px; left: 12px; width: 20px; height: 20px; color: var(--aph-acao); pointer-events: none; }
.aph-busca__campo input {
    width: 100%;
    height: 44px;
    margin: 0;
    padding: 0 14px 0 40px;
    border: 1px solid #e4e7ec;
    border-radius: 8px;
    background: #fff;
    font-family: var(--aph-fonte);
    font-size: 14px;
    line-height: 20px;
    letter-spacing: -.01em;
    color: #2f3134;
    outline: none;
    -webkit-appearance: none;
    appearance: none;
}
.aph-busca__campo input::placeholder { color: #757575; opacity: 1; }
.aph-busca__campo input::-webkit-search-cancel-button { -webkit-appearance: none; }
.aph-busca__sugestoes {
    position: absolute;
    z-index: 30;
    top: 43px;
    left: 0;
    right: 0;
    max-height: 320px;
    overflow-y: auto;
    padding: 8px 0;
    border: 1px solid #e4e7ec;
    border-radius: 0 0 8px 8px;
    background: #fff;
    box-shadow: 0 8px 20px rgba(113, 112, 140, .15);
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.aph-busca__sugestoes::-webkit-scrollbar { width: 0; height: 0; display: none; }
.aph-busca__sugestoes[hidden] { display: none; }
.aph-busca__grupo { padding: 8px 16px 4px; font-size: 12px; font-weight: 700; line-height: 16px; color: #6e727a; text-transform: uppercase; }
.aph-busca__opcao { display: flex; align-items: baseline; gap: 6px; padding: 8px 16px; font-size: 14px; line-height: 20px; color: #2f3134; }
.aph-busca__opcao b { font-weight: 600; }
.aph-busca__opcao span { font-size: 12px; color: #6e727a; }
.aph-busca__opcao:hover, .aph-busca__opcao--ativa { background: #f5f6f7; }

/* ===================== Mapa de apuração ===================== */
.aph-mapa__secao { margin: 24px 13.5px; border-radius: 12px; }
.aph-mapa__cabeca { display: flex; justify-content: space-between; padding: 0 0 16px; }
.aph-mapa__titulo {
    display: flex;
    align-items: center;
    height: 40px;
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    letter-spacing: -.3px;
    color: #4f5257;
}
.aph-mapa__ponto { width: 4px; height: 4px; margin: 0 8px; border-radius: 50%; background: #e4e7ec; }
.aph-mapa__titulo b { font-weight: 700; letter-spacing: -.5px; color: #181818; }
.aph-mapa__chevron { display: flex; margin: 0 0 0 10px; color: var(--aph-acao); }
.aph-mapa__chevron svg { width: 8px; height: 12px; }

.aph-mapa__cartao {
    display: flex;
    height: 610px;
    overflow: hidden;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 8px 20px 0 rgba(113, 112, 140, .15), 0 -4px 16px 0 rgba(113, 112, 140, .1);
}
.aph-vista {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-width: 0;
    height: 610px;
    padding: 16px;
    border-radius: 16px;
    background: #1f2123;
}
.aph-vista__topo { display: flex; justify-content: space-between; height: 28px; }
.aph-vista__rotulo { font-size: 20px; font-weight: 700; line-height: 28px; letter-spacing: -.5px; color: #fff; }
.aph-vista__area { position: relative; height: 500px; }
.aph-vista__superficie { position: absolute; inset: 0 0 -10px; }
.aph-vista__tela { display: block; width: 100%; height: 100%; cursor: pointer; }

.aph-legenda {
    position: absolute;
    bottom: 0;
    left: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    margin: 0 0 12px;
    padding: 8px;
    pointer-events: none;
}
.aph-legenda__botao {
    padding: 8px 12px;
    line-height: normal;
    border: 0;
    border-radius: 10px;
    background: rgba(255, 255, 255, .2);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: -.11px;
    color: #fff;
    pointer-events: auto;
}
.aph-escala { display: flex; flex-direction: column; gap: 4px; width: 428px; }
.aph-escala--votos { width: auto; }
.aph-escala__linhas { display: flex; gap: 2px; height: 60px; padding: 0 4px; }
.aph-escala__coluna { display: flex; flex-direction: column; justify-content: center; width: 20px; }
.aph-escala__caixa { display: flex; align-items: center; justify-content: center; width: 20px; height: 20px; }
.aph-escala__cor { width: 12px; height: 12px; border: 1px solid #fff; border-radius: 2px; }
.aph-escala__divisor { align-self: center; width: 1px; height: 48px; background: rgba(255, 255, 255, .3); }
.aph-escala__rotulos {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-self: center;
    gap: 4px;
    padding: 0 4px;
    font-size: 11px;
    line-height: 16px;
    color: #fff;
}
.aph-escala__legenda { font-size: 11px; line-height: 16px; color: #fff; white-space: nowrap; }
.aph-escala--votos { gap: 0; }
.aph-escala__bolha { display: flex; align-items: center; gap: 0; height: 25px; font-size: 11px; line-height: 14px; color: #9da3ae; }
.aph-escala__bolha svg { flex: none; width: 35px; overflow: visible; }

.aph-modos { display: flex; gap: 12px; height: 50px; margin: auto 0 0; }
.aph-modo {
    display: flex;
    flex: 1 1 0;
    align-items: center;
    justify-content: center;
    height: 50px;
    padding: 8px 12px;
    border: 0;
    border-radius: 8px;
    background: #2f3134;
    font-size: 13px;
    font-weight: 700;
    line-height: 18px;
    color: #fff;
}
.aph-modo--ativo { background: #fff; color: #2f3134; box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .25); }
.aph-modo__icone { width: 34px; height: 34px; }
.aph-modo__rotulo { margin: 0 0 0 8px; }

.aph-atualizado { font-size: 11px; line-height: 16px; color: #9da3ae; }
.aph-atualizado--celular { display: none; }

.aph-trilhas { display: flex; flex: 0 0 382px; flex-direction: column; width: 382px; height: 610px; }
.aph-trilhas__abas { padding: 12px; }
.aph-segmentado { display: flex; gap: 2px; padding: 2px; border-radius: 9px; background: rgba(229, 229, 230, .6); }
.aph-segmentado__botao {
    flex: 1 1 0;
    height: 32px;
    padding: 6px 10px;
    border: 0;
    border-radius: 7px;
    background: transparent;
    font-size: 13px;
    font-weight: 600;
    line-height: 20px;
    letter-spacing: -.13px;
    color: #181818;
}
.aph-segmentado__botao--ativo { background: #fff; box-shadow: 0 3px 8px 0 rgba(0, 0, 0, .12), 0 3px 1px 0 rgba(0, 0, 0, .04); }
.aph-trilhas__rolagem {
    height: 510px;
    margin: 0 8px 0 12px;
    padding: 0 6px 0 0;
    overflow-y: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.aph-trilhas__rolagem::-webkit-scrollbar { width: 0; height: 0; display: none; }
.aph-paginador { display: none; }
.aph-trilhas__atualizado { padding: 14px 12px; font-size: 11px; line-height: 11px; color: #6e727a; }

.aph-cartao { margin: 0 0 12px; border: 1px solid #e4e7ec; border-radius: 12px; }
.aph-cartao__cabeca { display: flex; justify-content: space-between; align-items: flex-start; padding: 14px 12px; }
.aph-cartao__nome { font-size: 20px; font-weight: 700; line-height: 24px; letter-spacing: -.5px; color: #1f2123; }
.aph-progresso { display: inline-flex; align-items: baseline; height: 20px; margin: 4px 0 0; font-size: 16px; font-weight: 600; line-height: 16px; color: #2f3134; white-space: nowrap; }
.aph-progresso small { font-size: 12px; font-weight: 600; }
.aph-cartao__lista { margin: 0; padding: 0; list-style: none; }

.aph-trilha {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    gap: 8px;
    margin: 0 4px;
    padding: 12px;
    border-radius: 8px;
}
.aph-trilha__foto { width: 64px; height: 64px; border: 2px solid #ebedef; border-radius: 50%; overflow: hidden; }
.aph-trilha__foto img { display: block; width: 60px; height: 60px; border-radius: 50%; object-fit: cover; }
.aph-trilha__cabeca { display: flex; align-items: center; gap: 4px; min-width: 0; height: 20px; color: #2f3134; }
.aph-trilha__nome { overflow: hidden; font-size: 14px; font-weight: 400; line-height: 20px; letter-spacing: -.14px; white-space: nowrap; text-overflow: ellipsis; }
.aph-trilha__separador { display: flex; flex: none; align-items: center; justify-content: center; width: 8px; height: 18px; }
.aph-trilha__separador::before { content: ""; width: 4px; height: 4px; border-radius: 50%; background: #e4e7ec; }
.aph-trilha__numero { flex: none; font-size: 14px; font-weight: 700; line-height: 20px; letter-spacing: -.14px; }
.aph-trilha__sigla {
    flex: none;
    margin: 0 0 0 auto;
    padding: 5px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 700;
    line-height: 10px;
    letter-spacing: -.12px;
    color: #fff;
}
.aph-trilha__barra { grid-column: 1 / -1; height: 3px; overflow: hidden; border-radius: 12px; background: #ebedef; }
.aph-trilha__barra i { display: block; height: 3px; }
.aph-trilha__dados { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: flex-end; gap: 4px; height: 21px; margin: -2px 0 0; line-height: 21px; }
.aph-trilha__pct { font-size: 18px; font-weight: 600; line-height: 24px; letter-spacing: -.54px; color: #333; white-space: nowrap; }
.aph-trilha__pct small { padding: 0 0 0 2px; font-size: 12px; line-height: 17px; }
.aph-trilha__selos { display: flex; flex: 1 1 auto; gap: 4px; }
.aph-trilha__selo {
    display: inline-flex;
    align-items: center;
    height: 18px;
    padding: 0 4px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    letter-spacing: -.18px;
    color: #fff;
    white-space: nowrap;
}
.aph-trilha__selo--segundo-turno { background: var(--aph-segundo-turno); }
.aph-trilha__selo--eleito { background: var(--aph-eleito); }
.aph-trilha__votos { font-size: 12px; line-height: 17px; letter-spacing: normal; color: #4f5257; white-space: nowrap; }

/* Cartões de região */
.aph-regiao .aph-cartao__cabeca { align-items: center; }
.aph-regiao .aph-cartao__nome { font-size: 16px; line-height: 22px; letter-spacing: -.3px; }
.aph-regiao__apuradas { text-align: right; }
.aph-regiao__apuradas .aph-progresso { margin: 0 0 4px; font-size: 13px; line-height: 16px; }
.aph-regiao__apuradas .aph-progresso small { font-size: 10px; }
.aph-regiao__apuradas span { display: block; font-size: 11px; line-height: 16px; color: #333; }
.aph .aph-regiao__diferenca { margin: 0 12px 4px; padding: 8px 12px; border-radius: 8px; background: #f5f6f7; font-size: 11px; line-height: 16px; color: #333; }
.aph-regiao__diferenca b { font-size: 15px; font-weight: 700; color: var(--aph-acao); }
.aph-regiao .aph-trilha { grid-template-columns: 52px minmax(0, 1fr); grid-template-rows: auto auto auto; column-gap: 12px; row-gap: 6px; padding: 8px 12px; }
.aph-regiao .aph-trilha__foto { grid-row: 1 / span 3; align-self: center; width: 52px; height: 52px; }
.aph-regiao .aph-trilha__foto img { width: 48px; height: 48px; }
.aph-regiao .aph-trilha__barra, .aph-regiao .aph-trilha__dados { grid-column: 2; }

.aph-mapa__rodape { display: flex; justify-content: space-between; align-items: center; margin: 24px 0 0; }
.aph-mapa__rodape .aph-atualizado { padding: 0 8px 0 0; }
.aph .aph-mapa__ver, .aph .aph-mapa__recirc a {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 15px;
    font-weight: 700;
    line-height: 22px;
    letter-spacing: -.3px;
    color: var(--aph-acao);
}
.aph-mapa__ver svg, .aph-mapa__recirc a svg { width: 16px; height: 16px; color: var(--aph-acao); }
.aph-mapa__recirc {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 0 13.5px 32px;
    padding: 24px;
    border: 1px solid #ebedef;
    border-radius: 12px;
    background: #fff;
}
.aph-mapa__recirc p { font-size: 14px; line-height: 20px; letter-spacing: -.14px; color: #1f2123; }
.aph .aph-mapa__recirc a { color: #181818; }

.aph-dialogo { position: fixed; z-index: 100000; inset: 0; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(0, 0, 0, .5); }
.aph-dialogo[hidden] { display: none; }
.aph-dialogo__caixa { width: 100%; max-width: 360px; padding: 24px; border-radius: 16px; background: #fff; color: #2f3134; }
.aph-dialogo__caixa h3 { margin: 0 0 8px; font-size: 16px; font-weight: 700; line-height: 22px; color: #181818; }
.aph-dialogo__caixa p { margin: 0 0 16px; font-size: 14px; line-height: 20px; }
.aph-dialogo__escala { margin: 0 0 16px; padding: 12px; border-radius: 8px; background: #1f2123; }
.aph-dialogo__caixa small { display: block; margin: 0 0 16px; font-size: 11px; line-height: 16px; color: #6e727a; }
.aph-dialogo__caixa button { width: 100%; height: 40px; border: 0; border-radius: 8px; background: #1f2123; font-size: 14px; font-weight: 700; color: #fff; }

/* ===================== Celular (g1 em 390 px) ===================== */
@media (max-width: 767px) {
    .aph-faixa { border-radius: 0; margin: 0; }
    .aph-faixa__container { flex-wrap: wrap; height: auto; }
    .aph-faixa__janela {
        flex: 0 0 100%;
        height: 104px;
        overflow-x: auto;
        overflow-y: hidden;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .aph-faixa__janela::-webkit-scrollbar { width: 0; height: 0; display: none; }
    .aph-faixa__lista { transform: none !important; transition: none; }
    .aph-faixa__pagina { display: none !important; }
    .aph-item { flex-basis: 354px; width: 354px; scroll-snap-align: start; }
    .aph-item__cargo { font-size: 14px; }
    .aph-item__lugar { font-size: 14px; line-height: 17.5px; }
    .aph-candidato__nome { height: 14px; margin: 0 0 4px; padding: 0 0 7px; font-size: 11px; line-height: 14.63px; }
    .aph-candidato__linha { height: 15px; }
    .aph-candidato__pct { font-size: 15px; line-height: 15px; letter-spacing: -.5px; }
    .aph-candidato__pct small { font-size: 11px; line-height: 11px; letter-spacing: -.5px; }
    .aph-item--brasil { display: flex; flex-basis: 354px; align-items: center; justify-content: space-between; gap: 12px; border-right: 0; }
    .aph-item__brasil-texto { display: flex; flex-direction: column; }
    .aph-item__brasil-texto b { font-size: 14px; font-weight: 700; line-height: 22px; color: #333; }
    .aph-item__brasil-texto span { font-size: 14px; font-weight: 400; line-height: 20px; color: #333; }
    .aph-item__brasil-mapa { flex: none; width: 105px; height: 93px; }
    .aph-busca { flex: 0 0 100%; width: 100%; margin: 0; gap: 0; }
    .aph .aph-busca__titulo { display: none; }
    .aph-busca__campo { width: 100%; }
    .aph-busca__campo input { border: 0; border-top: 1px solid #e4e7ec; border-radius: 0; font-size: 16px; }

    .aph-mapa { margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); background: #eee; font-size: 14px; line-height: 14px; letter-spacing: -.21px; }
    .aph-mapa__secao { margin: 0; border-radius: 0; }
    .aph-mapa__cabeca { padding: 16px 24px; }
    .aph-mapa__titulo { height: 20px; font-size: 14px; line-height: 20px; letter-spacing: -.215px; }
    .aph-mapa__titulo b { letter-spacing: -.215px; }
    .aph-mapa__ponto { margin: 0 6px; }
    .aph-mapa__chevron { margin: 0 0 0 8px; }
    .aph-mapa__cartao { flex-direction: column; height: auto; overflow: visible; border-radius: 0; background: transparent; box-shadow: none; }
    .aph-vista { gap: 12px; height: auto; padding: 12px; border-radius: 0; }
    .aph-vista__topo { height: 26px; }
    .aph-vista__rotulo { padding: 0 0 0 12px; font-size: 18px; line-height: 26px; letter-spacing: -.36px; }
    .aph-vista__area { height: auto; }
    .aph-vista__superficie { position: relative; inset: auto; aspect-ratio: 1 / 1; }
    .aph-legenda {
        position: relative;
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: end;
        height: 104px;
        margin: -25px 0 0;
        padding: 8px 0;
    }
    .aph-legenda__botao { grid-column: 2; grid-row: 1; margin: 0 0 25px; }
    .aph-legenda__escala { grid-column: 1; grid-row: 1; }
    .aph-escala { width: auto; }
    .aph-modos { height: 68px; margin: 0; }
    .aph-modo { flex-direction: column; height: 68px; border: 1px solid #4f5257; background: #1f2123; font-size: 12px; line-height: 16px; letter-spacing: -.3px; }
    .aph-modo--ativo { border-color: #e4e7ec; background: #fff; }
    .aph-modo__rotulo { margin: 0 0 0 8px; }
    .aph-progresso { font-size: 14px; line-height: 14px; }
    .aph-atualizado--celular { display: block; padding: 0 4px; }
    .aph-atualizado--desktop { display: none; }

    .aph-trilhas { flex: none; width: 100%; height: auto; background: transparent; }
    .aph-trilhas__rolagem { height: auto; margin: 0; padding: 0; overflow: visible; }
    .aph-cartao { margin: 0; border: 0; }
    .aph-cartao__lista {
        display: flex;
        gap: 12px;
        padding: 0 12px;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scroll-padding: 0 12px;
        scrollbar-width: none;
        -ms-overflow-style: none;
    }
    .aph-cartao__lista::-webkit-scrollbar { width: 0; height: 0; display: none; }
    .aph-trilha {
        position: relative;
        flex: 0 0 164px;
        height: 195px;
        overflow: hidden;
        grid-template-columns: minmax(0, 1fr);
        margin: 0;
        padding: 12px;
        border: 1px solid #e4e7ec;
        border-radius: 8px;
        background: #fff;
        scroll-snap-align: start;
    }
    .aph-trilha__foto { position: absolute; top: 12px; left: 12px; }
    .aph-trilha__cabeca { flex-wrap: nowrap; align-items: flex-start; align-content: flex-start; height: 111px; padding: 76px 0 0; gap: 2px; }
    .aph-trilha__sigla { position: absolute; top: 12px; right: 12px; }
    .aph-trilha__dados { display: grid; grid-template-columns: auto minmax(0, 1fr); justify-content: start; align-items: center; row-gap: 4px; height: 45px; margin: 0; line-height: 14px; }
    .aph-trilha__votos { grid-column: 1 / -1; justify-self: start; }
    .aph-paginador { display: flex; justify-content: center; align-items: center; gap: 6px; height: 30px; padding: 8px 12px 12px; }
    .aph-paginador i { width: 6px; height: 6px; border-radius: 50%; background: #e4e7ec; }
    .aph-paginador i.aph-ativo { width: 8px; height: 8px; background: #1f2123; }

    .aph-regiao-lista { display: flex; gap: 12px; padding: 0 12px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 12px; scrollbar-width: none; }
    .aph-regiao-lista::-webkit-scrollbar { width: 0; height: 0; display: none; }
    .aph-regiao { flex: 0 0 300px; margin: 0; border: 1px solid #e4e7ec; background: #fff; scroll-snap-align: start; }
    .aph-regiao .aph-cartao__lista { display: block; padding: 0; overflow: visible; }
    .aph-regiao .aph-trilha { position: static; display: grid; grid-template-columns: 52px minmax(0, 1fr); height: auto; overflow: visible; border: 0; background: transparent; }
    .aph-regiao .aph-trilha__foto { position: static; }
    .aph-regiao .aph-trilha__cabeca { height: 20px; padding: 0; flex-wrap: nowrap; align-items: center; }
    .aph-regiao .aph-trilha__sigla { position: static; }
    .aph-regiao .aph-trilha__dados { display: flex; align-items: flex-end; height: 21px; }
    .aph-regiao .aph-trilha__votos { justify-self: auto; }

    .aph-mapa__rodape { justify-content: flex-end; margin: 0; padding: 0 24px 24px; }
    .aph-mapa__ver { line-height: 16px; }
    .aph-mapa__recirc { flex-direction: column; align-items: flex-start; gap: 8px; margin: 12px; padding: 12px 24px; }
    .aph-mapa__recirc p { font-size: 13px; line-height: 18px; }
    .aph .aph-mapa__recirc a { color: var(--aph-acao); }
}