@view-transition { navigation: auto; }
::view-transition,
::view-transition-group(*),
::view-transition-image-pair(*),
::view-transition-old(*),
::view-transition-new(*) { pointer-events: none; }

::view-transition-group(lr-article-surface),
::view-transition-group(lr-site-header) {
  animation-duration: 540ms;
  animation-timing-function: cubic-bezier(.22, .78, .2, 1);
}

::view-transition-group(lr-article-orb),
::view-transition-group(lr-article-type) {
  animation-duration: 300ms;
  animation-timing-function: cubic-bezier(.22, .78, .2, 1);
}

::view-transition-old(lr-site-header),
::view-transition-new(lr-site-header) { animation: none; opacity: 1; mix-blend-mode: normal; }

::view-transition-group(root) { animation-duration: 540ms; }

::view-transition-old(lr-article-surface),
::view-transition-new(lr-article-surface) {
  height: 100%;
  border-radius: 0;
  mix-blend-mode: normal;
}

::view-transition-old(lr-article-title-old) {
  animation: lr-title-out 200ms ease both;
  mix-blend-mode: normal;
}
::view-transition-new(lr-article-title-new) {
  animation: lr-title-in 260ms 260ms cubic-bezier(.22, .78, .2, 1) both;
  mix-blend-mode: normal;
}
::view-transition-old(lr-article-title-new),
::view-transition-new(lr-article-title-old) { display: none; }

::view-transition-old(root) { animation: lr-page-out 150ms ease both; }
::view-transition-new(root) { animation: lr-page-in 260ms 260ms ease both; }

@keyframes lr-title-out {
  to { opacity: 0; transform: translateY(-4px); }
}
@keyframes lr-title-in {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes lr-page-out { to { opacity: 0; transform: translateY(-4px); } }
@keyframes lr-page-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes lr-return-entry-in { from { opacity: .35; transform: translateY(-4px) scale(1.003); } to { opacity: 1; transform: none; } }
@keyframes lr-return-accent {
  0%, 38% { color: var(--return-accent); }
  100% { color: inherit; }
}

.article-transition-active .sphere-journey { visibility: hidden; }
.site-header { view-transition-name: lr-site-header; }
.article-transition-active .article-transition-surface { border: 1px solid var(--line); }
.article-transition-active .note-transition-surface { border: 0; }
.article-return-visual-layer {
  position: fixed;
  inset: 0;
  z-index: 110;
  overflow: clip;
  pointer-events: none;
}
.article-return-visual-piece {
  position: fixed !important;
  box-sizing: border-box;
  margin: 0 !important;
  transform-origin: 0 0;
  pointer-events: none;
}
.article-return-visual-surface { display: block; }
.article-return-visual-orb { display: block; border-radius: 50%; }
.article-return-visual-title { overflow: hidden; }
.is-returned-source { animation: lr-return-highlight 720ms ease-out both; }
html.article-return-entry-fallback main { animation: lr-return-entry-in 380ms cubic-bezier(.22, .78, .2, 1) both; }
html.return-accent-blue { --return-accent: var(--math); }
html.return-accent-green { --return-accent: var(--stats); }
html.return-accent-coral { --return-accent: var(--cs); }
html.return-accent-project { --return-accent: var(--math); }
html.article-return-entry-fallback.return-accent-blue .card-blue .project-type-label,
html.article-return-entry-fallback.return-accent-green .card-green .project-type-label,
html.article-return-entry-fallback.return-accent-coral .card-coral .project-type-label {
  animation: lr-return-accent 420ms ease-out both;
}
html.article-return-entry-fallback.return-accent-blue .note-row.card-blue .note-title-link strong,
html.article-return-entry-fallback.return-accent-green .note-row.card-green .note-title-link strong,
html.article-return-entry-fallback.return-accent-coral .note-row.card-coral .note-title-link strong {
  animation: lr-return-accent 420ms ease-out both;
}
html.article-return-entry-fallback.return-accent-project #projects .section-index {
  animation: lr-return-accent 420ms ease-out both;
}
html.article-transition-active .sphere-slot[data-sphere-id="stats"] { background: var(--stats); }
html.article-transition-active .sphere-slot[data-sphere-id="cs"] { background: var(--cs); }
@keyframes lr-return-highlight {
  0% { background: color-mix(in srgb, var(--surface) 86%, transparent); }
  100% { background: transparent; }
}

@media (max-width: 760px) {
  ::view-transition-group(lr-article-surface),
  ::view-transition-group(lr-article-orb),
  ::view-transition-group(lr-article-type) { animation-duration: 360ms; }
  ::view-transition-group(lr-article-orb),
  ::view-transition-group(lr-article-type) { animation-duration: 240ms; }
  ::view-transition-new(lr-article-title-new) { animation-delay: 210ms; animation-duration: 150ms; }
}

@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
  .is-returned-source,
  html.article-return-entry-fallback main,
  html.article-return-entry-fallback .project-type-label,
  html.article-return-entry-fallback .note-title-link strong,
  html.article-return-entry-fallback #projects .section-index { animation: none; }
}