/* A real destination page grows out of the selected menu link. */
html { scrollbar-gutter: stable; }
html.nav-flight-active { overflow: hidden; overscroll-behavior: none; }
.nav-flight-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  overflow: hidden;
  touch-action: none;
  cursor: progress;
}
.nav-flight-page {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  transform-origin: 0 0;
  will-change: transform, opacity;
  box-shadow: none;
  pointer-events: none;
  background: #171713;
  z-index: 1;
}
.nav-flight-pixels { position: absolute; left: 0; top: 0; display: block; pointer-events: none; image-rendering: pixelated; }
.nav-flight-page iframe { display: block; border: 0; width: 100%; height: 100%; pointer-events: none; }
.nav-flight-target { outline: 1px solid currentColor; outline-offset: 5px; }
.navigation-effects-toggle {
  position: fixed;
  right: max(16px, env(safe-area-inset-right));
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 10001;
  max-width: calc(100vw - 32px);
  min-height: 36px;
  padding: 8px 13px;
  border: 1px solid #a5937040;
  border-radius: 6px;
  background: #191b16e8;
  color: #c4b798;
  box-shadow: 0 2px 12px #0002;
  font: 12px/1.4 system-ui, sans-serif;
  letter-spacing: 0;
  text-transform: none;
  cursor: pointer;
  opacity: .75;
  transition: opacity 180ms ease;
}
.navigation-effects-toggle:hover,
.navigation-effects-toggle:focus-visible { opacity: 1; }
.navigation-effects-toggle:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.navigation-effects-toggle:disabled { cursor: default; }
html[data-theme='amiga'] .navigation-effects-toggle { background: #5965baf0; color: #fff; border-color: #ffffff80; border-radius: 0; }
html[data-theme='c64'] .navigation-effects-toggle { background: #40318df0; color: #d0caff; border-color: #a6a0ff80; border-radius: 0; }
html[data-theme='vic20'] .navigation-effects-toggle { background: #fffffff0; color: #203bb5; border-color: #203bb550; border-radius: 0; }
html[data-navigation-effects='off'] .terminal-cursor { animation: none; }
@media (prefers-reduced-motion: reduce) {
  .navigation-effects-toggle { transition: none; }
}