.pebble-transition {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  pointer-events: none;
  overflow: hidden;
}

/* The current static export still contains this pending profile row in its
   serialized RSC payload. Hide it without rewriting the framed RSC data. */
.info-section dl > div:has(> dd.pending) {
  display: none;
}

.pebble-transition::before {
  content: '';
  position: absolute;
  inset: 0;
  background: #f1f1f1;
  opacity: 0;
}

.pebble-transition span {
  --x: 0px;
  --y: 0px;
  --size: 20px;
  --delay: 0ms;
  position: absolute;
  top: 50%;
  left: 50%;
  width: var(--size);
  height: calc(var(--size) * .82);
  margin: calc(var(--size) * -.41) 0 0 calc(var(--size) * -.5);
  border-radius: 58% 42% 55% 45% / 47% 55% 45% 53%;
  background: #267c78;
  opacity: 0;
  transform: translate(var(--x), var(--y)) scale(.72) rotate(-8deg);
  will-change: transform, opacity;
}

.pebble-transition span:nth-child(1) { --x: -126px; --y: -72px; --size: 22px; --delay: 0ms; background: #267c78; }
.pebble-transition span:nth-child(2) { --x: -58px; --y: 84px; --size: 16px; --delay: 22ms; background: #d7e577; border-radius: 44% 56% 48% 52% / 58% 44% 56% 42%; }
.pebble-transition span:nth-child(3) { --x: 18px; --y: -104px; --size: 19px; --delay: 42ms; background: #62686a; }
.pebble-transition span:nth-child(4) { --x: 112px; --y: -44px; --size: 25px; --delay: 12ms; background: #d7e577; border-radius: 62% 38% 46% 54% / 42% 58% 42% 58%; }
.pebble-transition span:nth-child(5) { --x: 105px; --y: 72px; --size: 15px; --delay: 54ms; background: #267c78; }
.pebble-transition span:nth-child(6) { --x: 6px; --y: 110px; --size: 21px; --delay: 30ms; background: #858a87; border-radius: 47% 53% 61% 39% / 55% 45% 55% 45%; }
.pebble-transition span:nth-child(7) { --x: -108px; --y: 24px; --size: 17px; --delay: 66ms; background: #25282c; }

html.pebbles-leaving body > :not(.pebble-transition) {
  animation: pebbles-page-out 430ms ease both;
}

html.pebbles-leaving .pebble-transition::before {
  animation: pebbles-veil-in 430ms ease-out both;
}

html.pebbles-leaving .pebble-transition span {
  animation: pebbles-gather 330ms cubic-bezier(.4, 0, .2, 1) var(--delay) both;
}

html.pebbles-entering body > :not(.pebble-transition) {
  opacity: 0;
}

html.pebbles-entering .pebble-transition::before {
  opacity: 1;
}

html.pebbles-entering .pebble-transition span {
  opacity: .94;
  transform: translate(0, 0) scale(.46) rotate(0);
}

html.pebbles-entering.pebbles-enter-active body > :not(.pebble-transition) {
  animation: pebbles-page-in 470ms 40ms ease-out both;
}

html.pebbles-entering.pebbles-enter-active .pebble-transition::before {
  animation: pebbles-veil-out 500ms ease-in both;
}

html.pebbles-entering.pebbles-enter-active .pebble-transition span {
  animation: pebbles-scatter 400ms cubic-bezier(.2, .7, .2, 1) var(--delay) both;
}

@keyframes pebbles-gather {
  0% { opacity: 0; transform: translate(var(--x), var(--y)) scale(.72) rotate(-8deg); }
  24% { opacity: .82; }
  100% { opacity: .94; transform: translate(0, 0) scale(.46) rotate(0); }
}

@keyframes pebbles-scatter {
  0% { opacity: .94; transform: translate(0, 0) scale(.46) rotate(0); }
  70% { opacity: .58; }
  100% { opacity: 0; transform: translate(var(--x), var(--y)) scale(.82) rotate(10deg); }
}

@keyframes pebbles-veil-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes pebbles-veil-out {
  from { opacity: 1; }
  to { opacity: 0; }
}

@keyframes pebbles-page-out {
  from { opacity: 1; transform: translateY(0); }
  to { opacity: .35; transform: translateY(-6px); }
}

@keyframes pebbles-page-in {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (prefers-reduced-motion: reduce) {
  .pebble-transition { display: none !important; }
  html.pebbles-entering body > :not(.pebble-transition),
  html.pebbles-leaving body > :not(.pebble-transition) { opacity: 1; animation: none !important; transform: none; }
}