.v2-sortie { height: 170vh; background: var(--nuit); }
.v2-sortie.v2-sortie--fini { background: var(--fond); }
.v2-sortie-colle { position: sticky; top: 0; height: 100vh; overflow: clip; }
.v2-sortie-pinceau { position: absolute; left: -20vw; top: -25vh; width: 140vw; height: 150vh; overflow: visible; pointer-events: none; }
.v2-sortie-pinceau path { fill: none; stroke: var(--fond); stroke-width: 0; stroke-linecap: round; stroke-linejoin: round; pointer-events: stroke; }
@media (max-width: 767px), (max-width: 1024px) and (orientation: portrait) { .v2-sortie { height: 100vh; } }

.v2-sortie.v2-sortie--revele { height: 200vh; margin-bottom: -100vh; z-index: 4; pointer-events: none; background: transparent;
  view-timeline: --v2-sortie block; view-timeline-inset: 0px; }

.v2-sortie--revele .v2-sortie-pinceau > path { stroke-opacity: 0; pointer-events: none; }
.v2-sortie-nuit { fill: var(--nuit); pointer-events: none; }
.v2-sortie-bande { pointer-events: fill; }
.v2-sortie--revele .v2-sortie-pinceau > path.v2-sortie-lecture { stroke: #000; pointer-events: stroke; }
.v2-sortie--fini .v2-sortie-bande, .v2-sortie--revele.v2-sortie--fini .v2-sortie-pinceau > path.v2-sortie-lecture { pointer-events: none; }

@keyframes v2-sortie-suite { from { translate: 0 -100vh; } to { translate: 0 0; } }
html:not(.v2-sortie-mesure) .v2-sortie-suite.v2-sortie-suite--css > * {
  animation: v2-sortie-suite linear none; animation-duration: auto; animation-timeline: --v2-sortie; animation-range: contain 0% contain 100%; }

.v2-final .v2-sortie, html:not(.js) .v2-sortie { height: 14vh; margin-bottom: 0; z-index: 1; background: linear-gradient(to bottom, var(--nuit) 50%, var(--fond) 50%); view-timeline: none; }
.v2-final .v2-sortie-colle, html:not(.js) .v2-sortie-colle { display: none; }