/* Short, contextual feedback. Every element keeps its normal resting layout. */
.heading-reveal-pending { opacity: 0; }
body.no-motion .heading-reveal-pending { opacity: 1; }
@media (prefers-reduced-motion: reduce) {
  .heading-reveal-pending { opacity: 1; }
}

.archive-link,
.save-button,
.rail-navigation a,
.header-button {
  transition: color 180ms ease, background-color 180ms ease, border-color 180ms ease,
    opacity 180ms ease, box-shadow 180ms ease, translate 150ms ease;
}

.archive-link:active,
.save-button:active,
.header-button:active {
  translate: 0 1px;
}

.archive-link:focus-visible {
  color: var(--ivory);
  background-color: var(--ink);
}

.world-index nav a > span:first-child,
.collections-menu > a > span {
  transition: translate 200ms cubic-bezier(.2, .65, .2, 1), opacity 180ms ease;
}

.world-index nav a:focus-visible > span:first-child {
  translate: 3px 0;
}

.collections-toggle svg {
  transition: rotate 220ms cubic-bezier(.2, .65, .2, 1);
}

.collections-toggle[aria-expanded="true"] svg {
  rotate: 180deg;
}

.collections-menu:not([hidden]) {
  animation: archive-menu-arrive 180ms cubic-bezier(.2, .65, .2, 1) both;
  transform-origin: top center;
}

.floating-object .photo-mount,
.floating-object .record-disc {
  transition: scale 280ms cubic-bezier(.2, .65, .2, 1), filter 200ms ease;
}

.floating-object:focus-visible .photo-mount,
.floating-object:focus-visible .record-disc {
  scale: 1.025;
}

.floating-object:active .photo-mount,
.floating-object:active .record-disc {
  scale: 0.99;
}

@media (hover: hover) and (pointer: fine) {
  .floating-object:hover .photo-mount,
  .floating-object:hover .record-disc {
    scale: 1.025;
  }
}

@keyframes archive-menu-arrive {
  from {
    opacity: 0.65;
    translate: 0 -4px;
  }

  to {
    opacity: 1;
    translate: 0 0;
  }
}

body.no-motion .collections-menu,
body.no-motion .floating-object,
body.no-motion .floating-object .photo-mount,
body.no-motion .floating-object .record-disc,
body.no-motion .collections-toggle svg,
body.no-motion .world-index nav a > span,
body.no-motion .collections-menu > a > span,
body.no-motion .archive-link,
body.no-motion .save-button,
body.no-motion .header-button {
  animation: none !important;
  transition: none !important;
}

body.no-motion .floating-object .photo-mount,
body.no-motion .floating-object .record-disc {
  scale: 1 !important;
}

@media (prefers-reduced-motion: reduce) {
  .collections-menu,
  .floating-object,
  .floating-object .photo-mount,
  .floating-object .record-disc,
  .collections-toggle svg,
  .world-index nav a > span,
  .collections-menu > a > span,
  .archive-link,
  .save-button,
  .header-button {
    animation: none !important;
    transition: none !important;
  }

  .floating-object .photo-mount,
  .floating-object .record-disc {
    scale: 1 !important;
  }
}