@keyframes terminal-boot {
  0% {
    opacity: 0;
    transform: translateY(0.75rem) scaleY(0.04);
    filter: brightness(1.5);
  }

  40% {
    opacity: 1;
    transform: translateY(0) scaleY(0.04);
  }

  75% {
    transform: scaleY(1.01);
  }

  100% {
    opacity: 1;
    transform: scaleY(1);
    filter: brightness(1);
  }
}

.terminal {
  transform-origin: center top;
  animation: terminal-boot 600ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes title-bar-enter {
  from {
    opacity: 0;
    transform: translateY(-100%);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.terminal-bar {
  animation: title-bar-enter 300ms ease-out 400ms both;
}

@keyframes terminal-title-flicker {
  0%,
  92%,
  100% {
    opacity: 1;
  }

  94% {
    opacity: 0.7;
  }

  96% {
    opacity: 1;
  }

  98% {
    opacity: 0.85;
  }
}

.terminal-title {
  animation: terminal-title-flicker 9s steps(1, end) 1.2s infinite;
}

@keyframes control-enter {
  from {
    opacity: 0;
    transform: scale(0);
  }

  65% {
    transform: scale(1.2);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

.terminal-control {
  animation: control-enter 240ms ease-out both;
}

.terminal-control:nth-child(1) {
  animation-delay: 540ms;
}

.terminal-control:nth-child(2) {
  animation-delay: 620ms;
}

.terminal-control:nth-child(3) {
  animation-delay: 700ms;
}

@keyframes online-pulse {
  0%,
  100% {
    box-shadow:
      0 0 0 0 color-mix(in srgb, var(--green) 45%, transparent);
  }

  50% {
    box-shadow: 0 0 0 0.3rem transparent;
  }
}

.status-indicator {
  animation: online-pulse 1.8s ease-out infinite;
}

@keyframes command-bar-enter {
  from {
    opacity: 0;
    transform: translateY(-0.6rem);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.command-bar {
  animation: command-bar-enter 280ms ease-out 650ms both;
}

@keyframes command-item-enter {
  from {
    opacity: 0;
    transform: translateX(-0.5rem);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.command-bar a {
  animation: command-item-enter 220ms ease-out both;
}

.command-bar a:nth-child(1) {
  animation-delay: 720ms;
}

.command-bar a:nth-child(2) {
  animation-delay: 780ms;
}

.command-bar a:nth-child(3) {
  animation-delay: 840ms;
}

.command-bar a:nth-child(4) {
  animation-delay: 900ms;
}

.command-bar a:nth-child(5) {
  animation-delay: 960ms;
}

.command-bar a:nth-child(6) {
  animation-delay: 1020ms;
}

@keyframes shell-line-enter {
  from {
    opacity: 0;
    transform: translateX(-0.75rem);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.boot-command {
  animation: shell-line-enter 280ms ease-out 1s both;
}

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

  47%,
  100% {
    opacity: 0;
  }
}

.terminal-cursor {
  animation: cursor-blink 900ms steps(1, end) infinite;
}

@keyframes profile-enter {
  from {
    opacity: 0;
    transform: translateY(0.6rem);
    clip-path: inset(0 100% 0 0);
  }

  to {
    opacity: 1;
    transform: translateY(0);
    clip-path: inset(0 0 0 0);
  }
}

.profile-panel {
  animation: profile-enter 450ms ease-out 1.08s both;
}

.summary-panel {
  animation: profile-enter 450ms ease-out 1.2s both;
}

@keyframes identity-enter {
  from {
    opacity: 0;
    transform: translateX(-0.75rem);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.identity-block {
  animation: identity-enter 350ms ease-out 1.3s both;
}

@keyframes name-enter {
  from {
    opacity: 0;
    transform: translateY(0.3rem);
    letter-spacing: 0;
  }

  to {
    opacity: 1;
    transform: translateY(0);
    letter-spacing: -0.07em;
  }
}

h1 {
  animation: name-enter 400ms ease-out 1.4s both;
}

@keyframes contact-enter {
  from {
    opacity: 0;
    transform: translateX(0.75rem);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.contact-pane {
  animation: contact-enter 350ms ease-out 1.35s both;
}

.action,
.command-bar a,
.theme-option,
.tag,
.position li,
.concept-list div {
  transition:
    background-color 120ms ease,
    border-color 120ms ease,
    color 120ms ease,
    transform 120ms ease;
}

.action:hover {
  transform: translateX(0.2rem);
}

.action:active {
  transform: translateX(0.2rem) scale(0.985);
}

.command-bar a:hover {
  transform: translateY(-1px);
}

.tag:hover {
  transform: translateY(-2px);
}

.position li:hover {
  color: var(--foreground);
  transform: translateX(0.2rem);
}

.concept-list div:hover {
  padding-left: 0.35rem;
  background:
    color-mix(in srgb, var(--surface-alt) 60%, transparent);
}

.skill-group h3::before {
  display: inline-block;
  transition: transform 160ms ease;
}

.skill-group:hover h3::before {
  transform: rotate(90deg);
}

@keyframes timeline-node-pulse {
  from {
    box-shadow:
      0 0 0 0 color-mix(in srgb, var(--orange) 50%, transparent);
  }

  to {
    box-shadow: 0 0 0 0.45rem transparent;
  }
}

.position:hover::before {
  animation: timeline-node-pulse 650ms ease-out;
}

@keyframes modified-pulse {
  0%,
  100% {
    opacity: 1;
  }

  50% {
    opacity: 0.35;
  }
}

.buffer-modified {
  animation: modified-pulse 1.4s steps(2, end) infinite;
}

.theme-option:hover {
  transform: translateX(0.15rem);
}

.theme-option:active {
  transform: translateX(0.15rem) scale(0.985);
}

@keyframes selected-theme {
  0% {
    box-shadow: inset 0 0 0 0 var(--green);
  }

  50% {
    box-shadow: inset 0 0 0 2px var(--green);
  }

  100% {
    box-shadow: inset 0 0 0 0 var(--green);
  }
}

.theme-option.is-new-selection {
  animation: selected-theme 420ms steps(2, end);
}

@keyframes theme-status-update {
  from {
    opacity: 0;
    transform: translateX(-0.4rem);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

#active-theme.is-updating {
  animation: theme-status-update 220ms ease-out;
}

@keyframes action-confirm {
  0% {
    background: var(--selected-bg);
    color: var(--selected-fg);
  }

  50% {
    background: var(--green);
    color: var(--surface);
  }

  100% {
    background: var(--selected-bg);
    color: var(--selected-fg);
  }
}

.action.is-downloading {
  animation: action-confirm 450ms steps(2, end);
}

@keyframes mode-pulse {
  0%,
  100% {
    filter: brightness(1);
  }

  50% {
    filter: brightness(1.2);
  }
}

.mode-indicator {
  animation: mode-pulse 2.2s steps(2, end) infinite;
}

@keyframes notice-enter {
  from {
    opacity: 0;
    transform: translateY(0.75rem);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes notice-exit {
  from {
    opacity: 1;
    transform: translateY(0);
  }

  to {
    opacity: 0;
    transform: translateY(0.75rem);
  }
}

.download-notice {
  animation: notice-enter 180ms ease-out both;
}

.download-notice.is-closing {
  animation: notice-exit 180ms ease-in both;
}

body,
.terminal,
.terminal-bar,
.command-bar,
.panel,
.panel-title,
.identity-block,
.contact-pane,
.action,
.skill-group,
.skill-group h3,
.tag,
.cover-meta,
.letter-buffer,
.buffer-tabs,
.buffer-status,
.theme-shell,
.theme-option,
.terminal-footer {
  transition:
    background-color 180ms ease,
    border-color 180ms ease,
    color 180ms ease,
    box-shadow 180ms ease;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation: none !important;
    transition-duration: 0.01ms !important;
  }

  .terminal-cursor {
    opacity: 1;
  }
}

@media print {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
  }
}