/* Shared by the studio and isolated public renderer. No backend animation work. */
.rosewater-reflections {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(
    140deg,
    transparent,
    color-mix(in srgb, var(--rosewater-color, #eeb6cf) 45%, transparent)
  );
}
.rosewater-reflections i {
  position: absolute;
  display: block;
  inset: -35%;
  border-radius: 43%;
  border: 15px solid color-mix(in srgb, var(--rosewater-highlight, #ffffff) 60%, transparent);
  box-shadow:
    0 0 15px var(--rosewater-highlight, #ffffff),
    inset 0 0 16px var(--rosewater-highlight, #ffffff);
  filter: blur(3px);
  animation: rosewater-flow 12s ease-in-out infinite alternate;
}
.rosewater-reflections i:nth-child(2) {
  inset: 20% -40% -10%;
  border-width: 7px;
  animation-delay: -7s;
  animation-duration: 17s;
}
.rosewater-reflections i:nth-child(3) {
  inset: -30% 10% 25%;
  border-width: 5px;
  animation-delay: -4s;
  animation-duration: 19s;
}
@keyframes rosewater-flow {
  0% {
    transform: rotate(-25deg) scale(0.9);
  }
  50% {
    border-radius: 60% 35% 65% 40%;
  }
  100% {
    transform: rotate(45deg) scale(1.15);
  }
}
body:has([data-rosewater-motion]:not(:checked)) .rosewater-reflections i {
  animation-play-state: paused;
}
@media (prefers-reduced-motion: reduce) {
  .rosewater-reflections i {
    animation-play-state: paused;
  }
}
@media print {
  .rosewater-reflections {
    display: none;
  }
}