/* Warm paper and a pearl-purple fold, with sharp content beneath it. */
html.sonder-transition-arriving::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 2147483645;
  pointer-events: none;
  background: #fff3eb;
  animation: sonder-arrival-safety 1.8s step-end forwards;
}
.sonder-page-transition {
  position: fixed;
  inset: 0;
  z-index: 2147483646;
  overflow: hidden;
  visibility: hidden;
  pointer-events: none;
  contain: strict;
}
.sonder-page-transition[data-state="leaving"],
.sonder-page-transition[data-state="arriving"],
.sonder-page-transition[data-state="revealing"] { visibility: visible; }
.sonder-transition-surface,
.sonder-transition-shader { position: absolute; inset: 0; }
.sonder-transition-shader { opacity: 1; }
/* Navigation remains fully usable before the GPU loads or without WebGL. */
.sonder-transition-surface::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(105deg, #fff3eb 12%, #f0e3f4 60%, #fff3eb 90%);
}
.sonder-transition-surface:has(canvas)::before { opacity: 0; }
[data-state="leaving"] .sonder-transition-surface::before {
  animation: sonder-curtain-cover .55s cubic-bezier(.333333, .116667, .666667, .883333) both;
}
[data-state="revealing"] .sonder-transition-surface::before {
  animation: sonder-curtain-reveal 1.05s cubic-bezier(.333333, .116667, .666667, .883333) both;
}
@keyframes sonder-curtain-cover {
  from { clip-path: inset(0 122% 0 0); }
  to { clip-path: inset(0 -12% 0 0); }
}
@keyframes sonder-curtain-reveal {
  from { clip-path: inset(0 0 0 -22%); }
  to { clip-path: inset(0 0 0 112%); }
}
@keyframes sonder-arrival-safety { to { visibility: hidden; } }
@media (prefers-reduced-motion: reduce) {
  html.sonder-transition-arriving::after,
  .sonder-page-transition { display: none !important; }
}