cloisten

A sign-in flow as a motion piece. A shaft of light falls from the top left across a dark room onto a frosted glass card; dust drifts in the beam, a sheen falls into the glass and the card's 1 px rim catches the light where the beam meets it, all swaying and breathing with the light. One deterministic 13-second timeline plays the whole flow and loops seamlessly: a focus ring settles on the work-email field and alex@lanthel.studio types in, Continue is pressed and spins; the step slides out with a soft blur and "Check your inbox" slides in, the ring glides from box to box as a six-digit code goes in, the digits lift in a wave and turn lilac as it verifies, Verify spins and ticks and the light flares; the mark gives way to an avatar with a badge, "Welcome back, Alex" and a progress bar loading the workspace while Projects, Messages and Files tick off; then the welcome step slides away and the empty sign-in comes back. Product, workspace and person are invented (Cloisten, Lanthel). The beam and dust are a Canvas 2D layer; the card is HTML and CSS with backdrop blur. The square stage scales to fit any window, the room, light and vignette run on past it, and portrait screens keep the card's column in view.