/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */
@import url("/assets/markdown-e7395edb.css");
@import url("/assets/tributejs-4c1eb1da.css");

/* View Transitions */
::view-transition-group(*) {
  animation-duration: 300ms;
  animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

::view-transition-old(root) {
  animation: 150ms cubic-bezier(0.4, 0, 1, 1) both vt-fade-and-scale-out;
}

::view-transition-new(root) {
  animation: 210ms cubic-bezier(0, 0, 0.2, 1) 90ms both vt-fade-and-scale-in;
}

@keyframes vt-fade-and-scale-out {
  to {
    opacity: 0;
    transform: scale(0.98);
  }
}

@keyframes vt-fade-and-scale-in {
  from {
    opacity: 0;
    transform: scale(1.02);
  }
}

::view-transition-old(video-player),
::view-transition-new(video-player) {
  animation: none;
}

@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*) {
    animation-duration: 0.01ms !important;
  }
}

dialog::backdrop {
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

textarea:invalid {
  border: 2px dashed red;
}

textarea:valid {
  border: 2px solid lime;
}