RTL Drawer

Create an RTL navigation drawer. A dir="rtl" app frame with a menu button. Opening slides the drawer in from the RIGHT edge, the natural side for RTL interfaces, the mirror of the LTR default, with a spring (from x: 100% to 0, stiffness 380, damping 32) over a dimming backdrop (ink at 35% alpha, 0.2s fade). The drawer is an ink-dark panel about 58-70% wide, right-aligned text. Inside: menu items cascade in after the panel lands, each from 14px toward the opening edge (x: +14 → 0) with a spring, 0.06s stagger, so the items chase the drawer's own motion. Hovering an item nudges it 5px in the reading direction (to the LEFT in RTL) and tints it accent. A close × sits at the drawer's inner corner; closing slides the panel back out faster (0.22s). Build the layout with logical properties (inset-inline-end for the drawer's anchor, padding-inline) so the same component flips automatically between dir="rtl" and dir="ltr". Never hardcode left/right. Accessibility: the trigger uses aria-expanded; the drawer is a labeled nav landmark; focus moves in on open and returns on close; Escape and backdrop-click close. If prefers-reduced-motion is set, fade the drawer and backdrop with no slide or cascade. Build the component, not this demo of it. - Ambient motion that IS the component may loop: a drifting background, a marquee, a spinner while something is genuinely loading. - Do not add any timer, interval, loop or script that performs a person's action by itself. No auto-hover, no auto-click, no cycling through states, no pretend submitting, no replaying the interaction on a schedule. - Every state that answers a person waits for a real event from that person. - Placeholder copy and sample content are welcome. Simulated behaviour is not.