.motion-toggle {
  justify-self: end; min-height: 44px; padding: 0 5px;
  border: 0; background: transparent; color: var(--muted);
  font: 12px/1.5 var(--font); cursor: pointer;
}
.motion-toggle:hover, .motion-toggle:focus-visible { color: var(--text); }
.motion-toggle:focus-visible { outline: 1px solid var(--accent); outline-offset: 2px; }
.guestbook-weather, .guestbook-sky, .guestbook-ripples, .guestbook-flight {
  position: fixed; inset: 0; overflow: hidden; pointer-events: none;
}
.page-backgrounds.is-weather-controlled .page-background { transform: none; transition: opacity 240ms ease; }
.guestbook-weather { z-index: -1; opacity: 0; transition: opacity 240ms ease; }
.guestbook-weather.is-raining { opacity: 1; }
.guestbook-weather__drop {
  position: absolute; top: -80px; left: var(--rain-x); width: 1px; height: var(--rain-length);
  background: linear-gradient(transparent, rgba(181, 219, 234, .52));
  opacity: var(--rain-alpha); transform: translate3d(0, -80px, 0) rotate(12deg);
  animation: guestbook-rain var(--rain-duration) linear var(--rain-delay) infinite;
  animation-play-state: paused;
}
.guestbook-weather.is-raining .guestbook-weather__drop { animation-play-state: running; }
@keyframes guestbook-rain {
  to { transform: translate3d(-12vw, calc(100dvh + 160px), 0) rotate(12deg); }
}
.guestbook-sky { z-index: -1; opacity: 0; transition: opacity 240ms ease; }
.guestbook-sky--sun { background: linear-gradient(125deg, rgba(151, 107, 53, .05), transparent 42%, rgba(211, 153, 76, .07)); }
.guestbook-sky--moon { background: linear-gradient(180deg, rgba(49, 65, 101, .16), transparent 48%, rgba(35, 59, 66, .09)); }
.guestbook-sky__orb {
  position: absolute; top: 96px; right: max(12px, calc((100vw - 980px) / 2 - 174px));
  width: 140px; height: 140px; animation: guestbook-sky-drift 24s ease-in-out infinite alternate;
  animation-play-state: paused;
}
.guestbook-sky__orb svg { display: block; width: 100%; height: 100%; }
.guestbook-sky--moon .guestbook-sky__orb { width: 126px; height: 126px; top: 112px; }
.guestbook-sky__cloud {
  position: absolute; top: 162px; right: max(-72px, calc((100vw - 980px) / 2 - 244px));
  width: 300px; height: 85px; animation: guestbook-cloud-drift 32s ease-in-out infinite alternate;
  animation-play-state: paused;
}
.guestbook-sky--moon .guestbook-sky__cloud { top: 186px; animation-duration: 40s; }
.guestbook-sky__stars {
  position: absolute; right: max(20px, calc((100vw - 980px) / 2 - 194px));
  top: 98px; width: 180px; height: 240px;
}
.guestbook-sky__stars i { position: absolute; width: 2px; height: 2px; border-radius: 50%; background: #dce5dc; opacity: .3; animation: guestbook-star 5s ease-in-out infinite alternate; animation-play-state: paused; }
.guestbook-sky__stars i:nth-child(1) { left: 13%; top: 14%; }
.guestbook-sky__stars i:nth-child(2) { left: 79%; top: 7%; animation-delay: -2s; }
.guestbook-sky__stars i:nth-child(3) { left: 87%; top: 58%; animation-delay: -4s; }
.guestbook-sky__stars i:nth-child(4) { left: 39%; top: 84%; animation-delay: -1s; }
.guestbook-sky.is-playing .guestbook-sky__orb,
.guestbook-sky.is-playing .guestbook-sky__cloud,
.guestbook-sky.is-playing .guestbook-sky__stars i { animation-play-state: running; }
@keyframes guestbook-sky-drift { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(-7px, -9px, 0); } }
@keyframes guestbook-cloud-drift { from { transform: translate3d(-22px, 0, 0); } to { transform: translate3d(22px, 4px, 0); } }
@keyframes guestbook-star { from { opacity: .16; } to { opacity: .48; } }
.guestbook-ripples { z-index: 2; }
.guestbook-ripple { position: absolute; width: 0; height: 0; }
.guestbook-ripple i {
  position: absolute; left: -64px; top: -29px; width: 128px; height: 58px;
  border: 1px solid rgba(176, 219, 232, .66); border-radius: 50%;
  box-shadow: 0 1px 0 rgba(219, 242, 249, .12), inset 0 1px 0 rgba(219, 242, 249, .12);
  opacity: 0; animation: guestbook-ripple 1400ms cubic-bezier(.16, .65, .35, 1) both;
}
.guestbook-ripple i:nth-child(2) { animation-delay: 160ms; }
.guestbook-ripple i:nth-child(3) { animation-delay: 320ms; }
@keyframes guestbook-ripple {
  0% { transform: scale(.08); opacity: 0; }
  12% { opacity: .72; }
  100% { transform: scale(1.7); opacity: 0; }
}
.guestbook-flight { z-index: 25; }
.guestbook-plane {
  position: absolute; width: 38px; height: 38px; color: #d9edf3;
  filter: drop-shadow(0 3px 5px rgba(2, 12, 17, .35));
}
.guestbook-plane svg { display: block; width: 100%; height: 100%; }
@media (max-width: 600px) {
  .guestbook-weather__drop:nth-child(n + 21) { display: none; }
  .guestbook-plane { width: 32px; height: 32px; }
  .guestbook-sky__orb, .guestbook-sky--moon .guestbook-sky__orb { width: 80px; height: 80px; right: 118px; top: 54px; }
  .guestbook-sky__cloud, .guestbook-sky--moon .guestbook-sky__cloud { width: 170px; height: 48px; right: 94px; top: 82px; }
  .guestbook-sky__stars { width: 88px; height: 120px; right: 112px; top: 54px; }
}
@media (prefers-reduced-motion: reduce) {
  .page-backgrounds.is-weather-controlled .page-background { transition: none; }
  .guestbook-weather, .guestbook-sky, .guestbook-ripples, .guestbook-flight { display: none !important; transition: none; }
  .guestbook-weather__drop, .guestbook-ripple i, .guestbook-sky__orb, .guestbook-sky__cloud, .guestbook-sky__stars i { animation: none !important; }
}