@keyframes entry-line {
  from { opacity: 0; transform: translate3d(0, 6px, 0); }
  to { opacity: 1; transform: translate3d(0, 0, 0); }
}

@keyframes entry-fade {
  to { opacity: 0; }
}

.avatar { animation: home-reveal 600ms var(--ease-reveal) 200ms backwards; }
.profile-card h1 { animation: home-reveal 600ms var(--ease-reveal) 300ms backwards; }
.profile-data p { animation: home-reveal 600ms var(--ease-reveal) 420ms backwards; }
.presence { animation: home-reveal 600ms var(--ease-reveal) 450ms backwards; }
.profile-footer { animation: home-reveal 600ms var(--ease-reveal) 480ms backwards; }
.scroll-cue { animation: home-reveal 600ms var(--ease-reveal) 560ms backwards; }

.entry-button,
.music-link,
.scroll-cue {
  transition: transform var(--t-press) var(--ease-ui), opacity var(--t-press) ease, color var(--t-press) ease, text-shadow var(--t-press) ease;
}

.social-links a:active,
.music-link:active,
.scroll-cue:active,
.entry-button:active {
  transition-duration: 100ms;
}

@keyframes home-reveal {
  0% {
    opacity: 0;
    translate: 0 12px;
    scale: .98;
  }
  100% {
    opacity: 1;
    translate: 0 0;
    scale: 1;
  }
}

@keyframes cursor-blink {
  0%, 100% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
}

@keyframes presence-loop {
  to {
    transform: translate3d(var(--loop), 0, 0);
  }
}

@keyframes presence-ease {
  to {
    translate: 19.2px 0;
  }
}

@keyframes audioWave {
  from {
    transform: scaleY(.5);
  }
  to {
    transform: scaleY(1.45);
  }
}