.drawer-backdrop {
  animation: detail-backdrop-in 180ms ease-out both;
}

.drawer-backdrop .detail-drawer {
  transform-origin: center bottom;
  animation: detail-drawer-rise 260ms cubic-bezier(.2, .8, .2, 1) both;
}

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

@keyframes detail-drawer-rise {
  from { opacity: 0; transform: translateY(36px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  .drawer-backdrop,
  .drawer-backdrop .detail-drawer { animation: none; }
}