/* Smooth interaction layer: navigation and local actions never fade the whole page. */
.view {
  animation: none !important;
  opacity: 1 !important;
  transform: none !important;
}

button,
a,
label,
input,
textarea,
select {
  -webkit-tap-highlight-color: transparent;
}

button:active,
a:active {
  transform: none;
}

.modal-backdrop {
  animation: modal-backdrop-in .16s ease-out both;
  will-change: opacity;
}

.modal-backdrop > section {
  animation: modal-panel-in .18s cubic-bezier(.2,.8,.2,1) both;
  will-change: opacity, transform;
}

@keyframes modal-backdrop-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes modal-panel-in {
  from { opacity: 0; transform: translateY(10px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

.short-video-tools button {
  min-width: 56px;
  border-width: 1px;
  transition: color .16s ease, background-color .16s ease, border-color .16s ease, transform .16s ease;
}

.short-video-tools button:active {
  transform: scale(.94);
}

.short-video-tools .ui-icon {
  stroke-width: 2.15;
}

.short-video-tools .short-video-like.liked {
  color: #ff5f91;
  background: rgba(255, 72, 126, .2);
  border-color: rgba(255, 120, 164, .62);
}

.short-video-tools .short-video-repost.reposted {
  color: #d1b5ff;
  background: rgba(139, 92, 246, .22);
  border-color: rgba(189, 162, 255, .62);
}

.short-video-tools .short-video-comments:hover,
.short-video-tools .short-video-comments:focus-visible,
.short-video-tools .short-video-share:hover,
.short-video-tools .short-video-share:focus-visible {
  color: #fff;
  background: rgba(255, 255, 255, .16);
}

.verification-card {
  position: relative;
  overflow: hidden;
  border-color: rgba(139, 92, 246, .38);
  box-shadow: 0 10px 28px rgba(36, 18, 70, .16);
}

.verification-card .primary-btn {
  justify-self: start;
  min-height: 44px;
}

@media (prefers-reduced-motion: reduce) {
  .modal-backdrop,
  .modal-backdrop > section {
    animation: none !important;
  }
}