/* A curtain covers the first portrait render, then reveals the page from below. */
.entry-loader{display:none}
html.is-loading{overflow:hidden}
html.is-loading .entry-loader{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;background:var(--bg);color:var(--muted);overflow:hidden;transition:transform .85s cubic-bezier(.76,0,.24,1)}
html.is-revealing .entry-loader{transform:translateY(-100%)}
.entry-loader-inner{width:min(480px,78vw);display:flex;flex-direction:column;align-items:center;gap:65px;transform:translateY(20px)}
.loader-keyboard{display:block;width:100%;height:auto;flex-shrink:0;overflow:visible;stroke:color-mix(in srgb,var(--muted) 65%,var(--bg));stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;fill:var(--bg)}
.loader-keyboard .keyboard-base{fill:var(--bg)}
.loader-key{animation:key-press 4.5s infinite;animation-delay:var(--key-delay)}
@keyframes key-press{0%,94%,100%{stroke:inherit;translate:0 0}96%,98%{stroke:var(--fg);translate:0 3px}}
.loader-meter{width:min(220px,56vw);font:14px/1.4 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.loader-track{height:1px;background:var(--line);overflow:hidden}
.loader-track span{display:block;height:100%;width:100%;background:var(--fg);transform-origin:left;transform:scaleX(0)}
.loader-caption{display:flex;justify-content:space-between;gap:20px;margin-top:18px}
.avatar-placeholder{aspect-ratio:1;display:grid;place-items:center;font-size:100px;font-weight:600}
@media(max-width:500px){.entry-loader-inner{width:78vw;gap:55px;transform:translateY(-10px)}.loader-meter{font-size:13px;width:43vw}}
@media(prefers-reduced-motion:reduce){html.is-loading .entry-loader{transition:none}.loader-key{animation:none}}