.FloatingActionButton {
  --transition: transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1), background-color 0.15s, color 0.15s, opacity 0.15s;

  position: absolute;
  z-index: 2;
  right: 1rem;
  bottom: 1rem;
  transform: translateY(5rem);

  transition: var(--transition);

  &:active,
  &.clicked {
    transition: var(--transition) !important;
  }

  body.no-page-transitions & {
    transition: none !important;
  }

  &.revealed {
    transform: translateY(0);
  }

  &[dir="rtl"] {
    right: auto;
    left: 1rem;
  }
}
