/* The source page owns the layout and colors. These rules only support
   keyboard interaction and the source's existing show/hide states. */
#app [data-replica-hidden="true"] {
  display: none !important;
}

#app [data-replica-bound="true"][role="button"],
#app [data-replica-bound="true"][role="tab"] {
  cursor: pointer;
}

#app [data-replica-bound="true"][role="button"]:focus-visible,
#app [data-replica-bound="true"][role="tab"]:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 5px;
}

@media (prefers-reduced-motion: reduce) {
  #app .carousel > ul {
    transition-duration: 0ms !important;
  }
}