/* Real variable-font glyphs over one unchanged, selectable heading text run. */
.hello-flex{position:relative;display:inline-block;white-space:nowrap;touch-action:pan-y pinch-zoom}
.hello-flex__overlay{position:absolute;inset:0;pointer-events:none;user-select:none;-webkit-user-select:none}
.hello-flex__glyph{position:absolute;top:0;display:block;line-height:inherit;white-space:pre}
.hello-flex--ready>.hello-flex__text{color:transparent}
.hello-flex:not(.hello-flex--ready)>.hello-flex__overlay{visibility:hidden}
.hello-flex:focus-visible{outline:2px solid var(--green);outline-offset:5px;border-radius:8px}
@media(prefers-reduced-motion:reduce){
 .hello-flex--ready>.hello-flex__text{color:inherit}
 .hello-flex>.hello-flex__overlay{visibility:hidden}
}
html[data-motion=reduce] .hello-flex--ready>.hello-flex__text{color:inherit}
html[data-motion=reduce] .hello-flex>.hello-flex__overlay{visibility:hidden}