/* Seitenwechsel wie die Filme: Overlay 500ms linear, Inhalt bleibt darunter. Papier, nicht Kino. */
html.personTransitionReady body.personPage{overflow-x:hidden}

html.personTransitionReady body.personPage .personStage{
  min-height:100svh;
  opacity:0;
  will-change:opacity;
  transition:opacity 500ms linear;
}

html.personTransitionReady body.personPage.personPageArrived .personStage{opacity:1}

html.pageArriveReady,
html.pageCovering{
  background:#fff;
}

.pageVeil,
html.pageArriveReady::before{
  position:fixed;
  inset:0;
  z-index:4000;
  background:#fff;
  pointer-events:auto;
  transition:opacity 500ms linear;
  will-change:opacity;
}

.pageVeil{
  opacity:0;
}

.pageVeil.isVisible{
  opacity:1;
}

html.pageArriveReady::before{
  content:"";
  opacity:1;
}

html.pageArriveReady.pageArrived::before{
  opacity:0;
  pointer-events:none;
}

html.pageArriveReady body.personPage .personStage{
  opacity:1;
  transition:none;
}

@media(prefers-reduced-motion:reduce){
  html.personTransitionReady body.personPage .personStage{
    opacity:1;
    transition:none;
  }

  .pageVeil,
  html.pageArriveReady::before{
    display:none;
    transition:none;
  }

  html.pageArriveReady,
  html.pageCovering{
    background:transparent;
  }
}