feat(typed effect): add tumble typed effect (@d1rshan)

[d1rshan]

tumble.mp4

This PR adds a new typed effect called tumble.

When a correctly submitted word becomes typed, it creates a temporary animated clone that falls off the screen while the original word is hidden. Incorrect submitted words stay in place so error feedback remains visible.

This PR also introduces a dedicated typed-effects module for typed effects that need JavaScript behavior, so effect-specific logic does not have to live directly in test-ui.

[Copilot]

Pull request overview

Adds a new tumble typed effect for the test page, with a JS-driven animation that spawns a falling clone of correctly typed words while hiding the original word.

Changes:

• Extend typed effect config schema + settings UI to include tumble.
• Add a new frontend/src/ts/test/typed-effects.ts module to host JS-driven typed effects (currently tumble).
• Wire typed effect lifecycle into test-ui (trigger on word typed, clear on show/finish) and add corresponding SCSS + keyframes.

Reviewed changes

Copilot reviewed 6 out of 6 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
packages/schemas/src/configs.ts	Adds tumble to TypedEffectSchema enum.
frontend/src/ts/test/typed-effects.ts	Implements JS behavior for tumble (clone + fall animation + cleanup).
frontend/src/ts/test/test-ui.ts	Hooks typed-effects into word-typing flow and clears clones/styles on lifecycle events.
frontend/src/styles/test.scss	Adds typed-effect-tumble hiding rule + .tumble-clone animation styling.
frontend/src/styles/animations.scss	Adds @keyframes typedEffectTumble.
frontend/src/html/pages/settings.html	Adds tumble button to typedEffect settings.

[Copilot]

tumble-clone removal relies solely on animationend. Global @media (prefers-reduced-motion) disables animations (see styles/media-queries.scss), so animationend won’t fire and clones can accumulate + stay fixed on screen while the real word is hidden. Add a non-animation fallback (e.g., setTimeout cleanup based on duration, or immediate removal when reduced-motion is active) and consider { once: true } on the listener.

[Copilot]

triggerTumble hides words via inline opacity: 0. If the user changes typedEffect mid-test (changeRequiresRestart=false), those inline styles persist even after typed-effect-tumble class is removed, leaving already-typed words invisible under other effects. Consider clearing tumble inline styles (and any pending clones) on typedEffect config changes, or avoid inline opacity and rely on effect-specific CSS/classes instead.