.gf-clic { cursor: pointer; transition: opacity 0.15s; }
.gf-clic:hover { opacity: 0.78; }
.gf-clic:focus-visible { outline: 2px solid var(--verde-sispeq); outline-offset: 2px; }
.gf-barras, .gf-linha { display: block; width: 100%; height: 100%; }
.gf-emp { display: flex; gap: 2px; width: 100%; overflow: hidden; border-radius: 5px; }
.gf-emp i { display: block; min-width: 2px; }
.gf-barrash { display: flex; flex-direction: column; gap: 8px; width: 100%; }
.gf-bh-linha { display: grid; grid-template-columns: minmax(90px, 34%) 1fr 62px; align-items: center; gap: 10px; font-size: 12px; }
.gf-bh-rot { color: var(--grafite); line-height: 1.15; }
.gf-bh-trilho { position: relative; height: 11px; border-radius: 6px; background: #E4E9E6; }
.gf-bh-trilho i { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 6px; }
.gf-bh-trilho u { position: absolute; top: -3px; bottom: -3px; width: 2px; background: var(--grafite); }
.gf-bh-linha b { text-align: right; font-variant-numeric: tabular-nums; }
.gf-legenda { display: flex; flex-wrap: wrap; gap: 8px 14px; font-size: 11.5px; color: var(--ui-secao); }
.gf-leg { display: inline-flex; align-items: center; gap: 6px; }
.gf-leg i { flex: none; width: 11px; height: 11px; border-radius: 3px; }
.gf-leg b { color: var(--grafite); font-variant-numeric: tabular-nums; }

.partes-slot { display: inline-flex; gap: 3px; padding: 3px; border-radius: var(--raio-selo); background: var(--ui-fundo); border: 1px solid var(--ui-borda); }
.parte-botao { border: 0; background: transparent; color: var(--texto-secundario); border-radius: var(--raio-selo); padding: 6px 12px; font: 600 12.5px/1.2 var(--fonte-sans); cursor: pointer; white-space: nowrap; }
.parte-botao.ativa { background: var(--verde-sispeq); color: var(--branco); }
.parte-botao:focus-visible { outline: 2px solid var(--menta); outline-offset: 1px; }
.sum-parte { padding: 12px 10px 4px; font-size: 11px; font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--verde-sispeq); list-style: none; }
.botao-voltar { position: absolute; left: 12px; top: 10px; z-index: 8; display: none; align-items: center; gap: 6px; border: 0; border-radius: var(--raio-selo); padding: 6px 13px; font: 700 13px/1.2 var(--fonte-sans); color: var(--verde-profundo); background: var(--branco); box-shadow: var(--sombra-curta); cursor: pointer; }
.botao-voltar.visivel { display: inline-flex; }
.botao-voltar:hover { background: var(--verde-claro); }
.botao-voltar:focus-visible { outline: 2px solid var(--menta); outline-offset: 2px; }
@media (max-width: 1180px) { .controles-linha .progresso-rotulo { display: none; } }
@media (max-width: 900px) { .topo .partes-slot { display: none; } .controles-linha .partes-slot { display: none; } }
.controles-linha .ctl { white-space: nowrap; }
@media (max-width: 1320px) { .controles-linha .botao-movimento { display: none; } }
@media (max-width: 900px) {
  .controles-linha { flex-wrap: wrap; gap: 6px; padding-left: max(8px, env(safe-area-inset-left, 0px)); padding-right: max(8px, env(safe-area-inset-right, 0px)); }
  .controles-linha .topo-espaco, .controles-linha #botao-tela-cheia { display: none; }
  .controles-linha .ctl { flex: 1 1 auto; min-height: 40px; text-align: center; }
  .controles-linha #botao-leitura { order: -1; font-weight: 700; }
}
body.modo-apresentacao #doc { bottom: var(--barra-apresentacao, 0px); }
@media (max-height: 520px) {
  .controles-linha { padding-top: 3px; padding-bottom: 3px; }
  .controles-linha .ctl { min-height: 30px; padding-top: 3px; padding-bottom: 3px; }
  .seta-nav { display: none; }
}
@media (max-width: 699px) and (orientation: portrait) { #botao-modo { display: none; } }
@media (max-width: 699px) { .botao-rever, .botao-voltar:not(.visivel) { display: none; } }
@media (max-width: 900px), (max-height: 520px) {
  .botao-voltar { left: auto; top: auto; right: 6px; bottom: 6px; padding: 3px 9px; font-size: 11px; }
}
