Proscenium

Build a fullscreen preloader called Proscenium.

Layer three things over a near-black stage. At the back, centred, put the payoff: a wordmark in a geometric sans at weight 600, tracking -0.05em, around 10% of the stage's smaller dimension, with a small uppercase monospace line under it at 0.45em letter-spacing in a muted grey. In front of that, two panels in warm off-white, each exactly half the width, pinned to the left and right edges. On the join, a one-pixel dark hairline seam.

Run everything on one 4.6s loop with cubic-bezier(0.83, 0, 0.17, 1), an ease sharp enough that the panels feel driven rather than eased. Hold the panels closed until 26%, drive them fully off their own edges by 60%, hold open until 86%, then close by 100%. Fade the wordmark in between 30% and 56%, hold it, and drop it back out at the very end so it is never caught half-covered.

The seam is the detail that sells it: keep it at full opacity and full height until 22%, then fade it out and collapse it to 15% scaleY as the panels separate, so it reads as a join breaking rather than a line sitting in mid-air.

Centre the panels with a margin rather than a transform, since their own keyframes own transform.

Loop forever. Under prefers-reduced-motion, hold the panels open on the reveal.