@media (hover: hover) and (pointer: fine) {
  .post-reactions .post-reaction-picker {
    opacity: 0;
    pointer-events: none;
  }

  .post-reactions:hover .post-reaction-picker,
  .post-reactions:focus-within .post-reaction-picker,
  .post-reactions .post-reaction-picker[open] {
    opacity: 1;
    pointer-events: auto;
  }
}

/* Keep the control available on touch screens, including hybrid devices. */
@media (any-pointer: coarse) {
  .post-reactions .post-reaction-picker {
    opacity: 1;
    pointer-events: auto;
  }

  .post-reaction-trigger {
    min-width: 2.75rem;
    min-height: 2.75rem;
  }
}