Create a single-page HTML, CSS, and hardware-accelerated JavaScript Canvas application. The tool must render and extrude shapes continuously along uploaded SVG paths, mimicking kinetic vector art. The application must be contained entirely within one file and adhere to a strict dark mode, minimalist interface using monospace typography (Courier New), an ultra-dark background (#000000), and a fixed 380px left sidebar for controls. 1. Performance & Core Engine Path Caching: Do not use DOM methods like getPointAtLength within the render loop. Upon uploading an SVG, parse the and pre-calculate exactly 1000 coordinate points into fixed arrays (cacheA, cacheB, cacheC). Interpolation: The render loop must extract positions using high-performance linear interpolation (LERP) between these cached coordinate indices based on a 0.0 to 2.0 progress scale. 2. Canvas Layout & High-Resolution Export Provide a drop-down for aspect ratios (1:1, 9:16, 16:9, 3:4) and a base resolution number input (default 1080px). Export Engine: Include buttons to export the canvas at 1K, 2K, and 4K resolutions. The export function must dynamically scale all rendering variables (spacing, sizes, amplitudes) via a global renderScale multiplier so that stroke thickness and spacing remain perfectly proportional at higher resolutions. Include a toggle for transparent background exports. Path Scaling: Automatically calculate the SVG's native ViewBox or Bounding Box and scale it to fit the canvas centrally with a 10% padding margin. 3. Path Morphing System Include three independent file upload slots for SVG paths (Path A, Path B, and Path C). Implement a manual morph slider (0.0 to 2.0). 0.0 to 1.0 morphs Path A into Path B. 1.0 to 2.0 morphs Path B into Path C. Include a "Play Morph Anim" toggle that automates this slider using a smooth Sine wave calculation based on a dedicated speed slider. 4. Brush System & Compositing Provide native shape options (Circle, Square) and a file uploader for Custom Brushes (SVG/PNG). Off-Screen Masking: To preserve frame rates, funnel custom brushes through a pre-sized off-screen canvas buffer, applying the active gradient via a source-in global composite operation before drawing it to the main canvas. Include sliders for Base Spacing, Static Rotation, Size (Start), and Size (End). Add a layer sorting drop-down to swap the Z-index drawing order (Start on Top vs. End on Top) by reversing the coordinate rendering array. 5. Dynamic Gradient Lists Implement a dynamic colour stop UI for both the Background and the Brush. Users must be able to add, modify, and delete colour stops with native colour pickers and percentage sliders. Background Types: Flat, Linear (with a 0-360 degree angle slider), and Radial. Brush Gradient Types: Flat, Linear, Radial, and Conic. 6. Animation & Modifiers Run the application on a continuous requestAnimationFrame loop. Provide toggles and speed sliders for the following behaviours: Reveal Timeline: A mask that animates the drawing of the path from 0% to 100%, with an optional loop checkbox. Sine Modifiers: Sliders for "Spacing Wave Amp" (modulates the gap between stamps using a sine wave) and "Size Pulse Amp" (rhythmically expands and contracts the brush size as it travels). Continuous Rotation: A "Rotation Spin Speed" slider that continuously spins the individual stamped elements over time.