/* Opening screen: counts Leslie's age up to forty while the story loads. */
.site-loader{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:#000;color:#fff;font-family:Arial,Helvetica,sans-serif;overflow:hidden;animation:site-loader-failsafe 0s 15s forwards}
/* If the script never runs, the story must not stay covered. */
@keyframes site-loader-failsafe{to{visibility:hidden}}
html.is-loading .page-grain{z-index:51}
.site-loader-stage{display:grid;justify-items:center;gap:30px;margin-top:-5vh}
.site-loader-mask{clip-path:inset(0 -.4em)}
.site-loader-age{display:flex;font:italic 400 clamp(150px,25vw,380px)/1 'Instrument Serif',Georgia,serif;opacity:0;transition:opacity .5s ease,transform .75s cubic-bezier(.7,0,.25,1)}
.site-loader.has-font .site-loader-age{opacity:1}
/* Each digit turns like an odometer: a strip of numerals behind a one-line window. */
.site-loader-digit{display:block;height:1em;clip-path:inset(0 -.4em);transition:opacity .4s ease}
.site-loader-digit.is-dim{opacity:.26}
.site-loader-strip{display:flex;flex-direction:column;transition:transform .42s cubic-bezier(.16,1,.3,1)}
.site-loader-strip>span{display:block;height:1em;text-align:center}
.site-loader-caption{margin:0;font:500 12px/1 monospace;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.56);transition:opacity .35s ease,transform .35s ease}
/* The same ruler language as the story timeline, one tick per year. */
.site-loader-ruler{--progress:0;position:absolute;left:24px;right:24px;bottom:max(36px,6vh);height:72px;border-top:1px solid rgba(255,255,255,.2)}
.site-loader-ruler>i{position:absolute;top:0;width:1px;height:8px;background:rgba(255,255,255,.26);transform-origin:top;transition:background-color .25s ease,transform .45s cubic-bezier(.7,0,.25,1)}
.site-loader-ruler>i.is-five{height:14px}
.site-loader-ruler>i.is-decade{height:22px}
.site-loader-ruler>i.is-lit{background:#fff}
.site-loader-playhead{position:absolute;left:calc(var(--progress) * 100%);top:0;height:44px;border-left:1px solid #f05a24;color:#f05a24;transition:opacity .3s ease}
.site-loader-playhead>i{position:absolute;left:-5px;top:0;width:9px;height:6px;background:currentColor;clip-path:polygon(0 0,100% 0,50% 100%)}
.site-loader-playhead>span{position:absolute;top:47px;left:0;transform:translateX(-50%);white-space:nowrap;font:500 10px monospace;letter-spacing:.08em}
/* Lift the numeral out of its window, retract the ruler, then uncover the title. */
.site-loader.is-leaving{opacity:0;pointer-events:none;transition:opacity .55s ease .4s}
.site-loader.is-leaving .site-loader-age{transform:translateY(-104%)}
.site-loader.is-leaving .site-loader-caption{opacity:0;transform:translateY(-6px)}
.site-loader.is-leaving .site-loader-ruler>i{transform:scaleY(0);transition-delay:calc(var(--i) * 6ms)}
.site-loader.is-leaving .site-loader-playhead{opacity:0}
@media(prefers-reduced-motion:reduce){
 .site-loader,.site-loader *{transition-duration:.01ms!important;transition-delay:0s!important}
 .site-loader.is-leaving{transition:opacity .2s ease!important}
 .site-loader.is-leaving .site-loader-age{transform:none}
}
/* Phones get the landing screen instead; it already covers the story. */
@media(max-width:767px),(max-height:500px) and (pointer:coarse){.site-loader{display:none}}