/* Keep motion on controls, away from camera imagery and tracking overlays. */
#cuepiko-app button {
  transition: background-color 150ms ease, border-color 150ms ease, opacity 150ms ease;
  -webkit-tap-highlight-color: transparent;
}
#cuepiko-app button:active:not(:disabled) {
  opacity: .78;
}
#cuepiko-app button:focus-visible {
  outline: 3px solid #00aaff;
  outline-offset: 3px;
}
#cuepiko-app main.cp-tab-enter {
  animation: cp-tab-fade 180ms ease-out;
}
#cuepiko-app button[aria-busy="true"]::before {
  content: "";
  display: inline-block;
  width: .9em;
  height: .9em;
  margin-right: .5em;
  vertical-align: -.1em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: cp-loading-spin 800ms linear infinite;
}
@keyframes cp-tab-fade { from { opacity: .35; } to { opacity: 1; } }
@keyframes cp-loading-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  #cuepiko-app *, #cuepiko-app *::before, #cuepiko-app *::after,
  .cp-opening-brand {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}