.button
Pointer press / release | scale(1) → scale(.98) | 100 ms · ease-in-out · delay 0 ms
Release or drag away reverses from the current interpolated value. Disabled controls have no transform. |
|---|
.button, .nav-link, .input-wrap
Hover, keyboard focus or focus-within | Declared resting paint → Declared hover/focus paint | 200 ms · ease; button shadow uses ease-in-out · delay 0 ms
The next state replaces the target. No queued animation or delayed action. |
|---|
.panel-link, .extension-card
Pointer enters / leaves | translateY(0) → Panel link: translateY(-3px); extension card: translateY(-2px) | 200 ms · ease · delay 0 ms
Reverse on pointer leave. Reduced motion keeps the transform at none. |
|---|
.toggle input::before
Native checked state | translateX(0) → translateX(12px) | 200 ms · ease · delay 0 ms
A new checked value replaces the target. Checked state, label and accessibility tree update immediately. |
|---|
.tooltip
Hover or focus; Escape dismisses | opacity 0 / hidden → opacity 1 / visible | 100 ms · ease · delay 0 ms
Escape hides the tooltip until focus or pointer enters again. It owns no focus. |
|---|
.button .spinner
Visible pending specimen | rotate(0) → rotate(1turn) | 800 ms per loop · linear · delay 0 ms
A disabled pending control prevents repeat activation. Reduced motion replaces rotation with a static complete ring and visible status text. |
|---|
.skeleton
Collection loading state | background-position 0% 0% → background-position -200% 0 | 1800 ms per loop · ease-in-out · delay 0 ms
State replacement removes the loading DOM. Reduced motion uses a static fill; the Loading status remains readable. |
|---|
Native dialog; assets/reference.js
Named trigger, Escape, close button or backdrop | Closed → Open modal, then closed | 0 ms; no entrance choreography · None · delay 0 ms
Repeated open is ignored. Escape closes once and returns focus to the actual connected opener. Dismissal does not clear the search query. |
|---|
[data-local-form]
Valid submit | Editable draft → Checking, then success / error / offline | 450 ms local simulation · None; semantic state change · delay 0 ms
A pending guard ignores repeat submissions. All controls restore their previous disabled state; failed drafts remain intact. |
|---|
Native links and collection focus handlers
Follow a reference link or change page | Current document or collection page → Target document or next page of items | Native navigation; no fabricated transition duration · None · delay No artificial delay
The browser owns load cancellation and history. A collection page change focuses its first result; filtering resets its page index. |
|---|
assets/media-lifecycle.mjs
Document hidden or pagehide | Optional user-started audio/video → Paused | Synchronous event handler · None · delay 0 ms
Preserve current time while the document exists. Visibility restoration does not restart playback. Native controls own explicit resume and seeking. |
|---|
.hero-backdrop; RAY-002 exception
Page load | Frozen captured frame → Same frame | Static local reconstruction · None · delay None
Original WebGL animation is not reproduced. The WebP derivative is pixel-identical to the retained PNG; no motion-dependent information is removed. |
|---|
