A turning ring of light around something, for the AI at work. It wraps its content, which keeps its own surface; the ring is the wrapper's padding, painted by a conic gradient whose angle is animated.

tone picks the color (:ai amber, :learning violet, :ok, :risk). variant is :spin (one light going round), :dual (two tones going round, the second one learning) or :glow (no ring, a halo that breathes). size is the ring's width (:xs 1px, :sm 1.5px, :md 2px, :lg 2.5px). shape is the outline of the ring and of the content it hugs: :card rounded corners, :pill and :circle fully round (a :circle needs square content). speed is :normal (a turn in 2.6 s, 3.2 s for :dual) or :fast (1.4 s, the canvas's small chip). The animation stops under prefers-reduced-motion, leaving the ring still.

The ring is drawn from the tone's own colour (currentColor over a faint trail, with the lighter spark), so it is the amber, violet, green or red of the tone in both themes, and the :dual ring's trail is the line token: nothing in it is a fixed colour. The canvas paints one amber gradient; here the same gradient follows the tone.

The ring is decoration. When it marks work in progress, say so on the wrapper with aria-busy="true" (it goes through rest). The spin needs the @property --aura-angle rule of devaction_ui.css: without it the angle cannot be animated and the ring stays still.