/* ============================================================
   FGO — PAGE TRANSITIONS  (cover-on-navigate + loading)
   Only a *departing* page ever shows the overlay, so a loaded
   page can never be left covered. Disabled for reduced-motion.
   ============================================================ */

.fg-transition {
  position: fixed; inset: 0; z-index: 10000;
  background: var(--ofg-coral);
  display: grid; place-items: center;
  transform: translateY(100%);
  pointer-events: none;
  will-change: transform;
}
.fg-transition.is-cover {
  animation: fg-cover .45s var(--ease-hard) forwards;
  pointer-events: all;
}
@keyframes fg-cover { to { transform: translateY(0); } }

.fg-transition__inner {
  display: flex; flex-direction: column; align-items: center; gap: .8rem;
  color: var(--ofg-black); opacity: 0;
}
.fg-transition.is-cover .fg-transition__inner { animation: fg-fadein .3s .2s ease forwards; }
@keyframes fg-fadein { to { opacity: 1; } }

.fg-run { width: 56px; height: 56px; animation: fg-hop .42s steps(2) infinite; }
@keyframes fg-hop { 50% { transform: translateY(-12px); } }

.fg-transition__label {
  font-family: var(--font-mono); font-size: var(--step-micro);
  letter-spacing: var(--tracking-wide); text-transform: uppercase;
}

@media (prefers-reduced-motion: reduce) {
  .fg-transition { display: none !important; }
}