/* Masked line -> word -> character reveal (split-reveal.mjs). Words wait below their mask;
   characters wait transparent. .is-revealed runs both with per-element delays.
   Each mask reaches past its line box by --mask-t, --mask-x and --mask-b: padding, cancelled by
   equal negative margins so the lines keep their spacing. That room holds descenders under a
   tight line-height and an italic's overhang. A waiting word sits the whole reach lower, so none
   of it shows through the room. A rule that sets a mask's margin has to subtract the reach. */
.split-reveal__label{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.split-reveal__visual{display:block}
/* Once split into masks, a flex column: their negative margins then add up instead of collapsing. */
.split-reveal__visual:has(>.split-reveal__mask){display:flex;flex-direction:column}
.split-reveal{--mask-t:.12em;--mask-x:.15em;--mask-b:.28em}
.split-reveal__mask{position:relative;display:block;overflow:hidden;overflow:clip;padding:var(--mask-t) var(--mask-x) var(--mask-b);margin:calc(-1 * var(--mask-t)) calc(-1 * var(--mask-x)) calc(-1 * var(--mask-b))}
.split-reveal__line{position:relative;display:block}
.split-reveal__word{position:relative;display:inline-block;transform:translateY(calc(100% + var(--mask-t) + var(--mask-b)))}
.split-reveal__char{position:relative;display:inline-block;opacity:0}
.split-reveal.is-revealed .split-reveal__word{transform:none;transition:transform var(--split-duration,.5s) var(--split-easing,ease-out) var(--split-delay,0s)}
.split-reveal.is-revealed .split-reveal__char{opacity:1;transition:opacity var(--split-duration,.5s) var(--split-easing,ease-out) var(--split-delay,0s)}