/* ========================================================================== IX · MOTION — global gates for the interaction pass. The kernel mirrors the effective motion level onto the body: Rules for every interaction stylesheet: · AMBIENT css animation (marquee, drift, shimmer) must be scoped: body[data-rbs-motion-level="authored"] .thing { animation: … } · FEEDBACK transitions (hover, press, focus) run at every level — they are part of the component upgrade, not the motion pass. · ENTRANCES are armed from JS only after ctx.motionOK() said yes, so they need no CSS gate — but their hidden state must be applied by JS too, never by static CSS, so a JS failure can never blank the page. The motion area itself has a fourth level, Restrained, which sits between Authored and Essential: entrances stay, endless motion stops. It rides its own attribute — body[data-rbs-motion="restrained"] — and NOT the level mirror, because in this pass `[data-rbs-motion-level="authored"]` gates the whole authored *interaction* layer (header condense, tab panels, carousel switch, input traces, testimonials lift) and, in reveal.css, force-shows every armed block. See js/areas/motion.js for the full note. ========================================================================== */ /* Pressables gain physical feedback at every level (essential included). The studied value: scale 0.97, fast, ease-out, gated to fine pointers. */ @media (hover: hover) and (pointer: fine) { body[data-rbs-motion-level] .rb-btn:active:not(:disabled), body[data-rbs-motion-level] .rb-icon-btn:active:not(:disabled), body[data-rbs-motion-level] .rb-dots__dot:active, body[data-rbs-motion-level] .rb-tabs__tab:active { transform: scale(0.97); transition-duration: var(--rb-sys-duration-1); } } /* ========================================================================== RESTRAINED — body[data-rbs-motion="restrained"] js/areas/motion.js does the general work at runtime: it walks document.getAnimations(), takes over everything with `iterations: Infinity`, and eases the playbackRate to zero (Loop rest · Settle) or holds the frame outright (· Cut). Live status indicators are excluded — a frozen progress dot reads as broken, not as calm. Once the glide has resolved the module stamps data-rbs-motion-rest="held", and this stylesheet takes over the one ambient loop that ships in CSS today — the logo drift. That ordering matters: a CSS `paused` applied on entry would freeze the glide it is here to back up. What it buys is durability — the strip stays at rest even when the logos area rebuilds its clone lists between sweeps, and it stays fully styled, masked edges and all. Nothing here may suggest the page is broken rather than quiet: the rested strip keeps its mask, its spacing and its marks. `will-change` is the one thing worth dropping — a paused transform has no compositor cost to buy. ========================================================================== */ body[data-rbs-motion="restrained"][data-rbs-motion-rest="held"][data-rbs-logos="marquee"] .rb-logostrip__strip[data-rbs-logos-armed] .rb-logostrip__list { animation-play-state: paused; will-change: auto; }