/* Topo cinético (direção A). O palco é quadrado; as quatro células são blocos chapados posicionados pelo topo.js.
   Cor: sem data-tema, as células herdam a cor do texto da página (currentColor). O sinal é sempre Vermelho Sinal. */
.topo-cinetico {
  position: relative;
  display: block;
  aspect-ratio: 1;
  contain: layout style;
}
.topo-cinetico[data-tema="claro"] { color: #16181B; }
.topo-cinetico[data-tema="escuro"] { color: #F2F3F1; }
.topo-cinetico > i {
  position: absolute;
  left: 0;
  top: 0;
  background: currentColor;
  will-change: transform;
}
.topo-cinetico > i.sinal { background: #E0321F; }