/* Animation master - Resize */

/*
  Usage:
    <div class="t-resize">...</div>

  Put `.t-resize` on any element whose width and height
  should animate smoothly when its size changes.
*/

:root {
  --resize-dur: 300ms;
  --resize-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

.t-resize {
  transition:
    width var(--resize-dur) var(--resize-ease),
    height var(--resize-dur) var(--resize-ease);
  will-change: width, height;
}

@media (prefers-reduced-motion: reduce) {
  .t-resize {
    transition: none !important;
  }
}