Style: Interactive Cursor Design. Type: General. Keywords: Custom cursor, cursor as tool, hover effects, cursor feedback, pointer transformation, cursor trail, magnetic cursor. Primary Colors: Brand-dependent, cursor accent color, high contrast for visibility. Secondary Colors: Trail colors, hover state colors, magnetic zone indicators, feedback colors. Effects & Animation: Cursor scale on hover, magnetic pull to elements, cursor morphing, trail effects, blend mode cursors, click feedback. Best For: Creative portfolios, interactive experiences, agency sites, product showcases, gaming, entertainment. Do Not Use For: Mobile-first (no cursor), accessibility-critical, data-heavy dashboards, forms. Light Mode: ✓ Full. Dark Mode: ✓ Full. Performance: ⚡ Good. Accessibility: ⚠ Not for touch/SR. Mobile-Friendly: ✗ No cursor. Conversion-Focused: ✓ High. Framework Compatibility: GSAP 10/10, Framer Motion 10/10, Custom JS 10/10. Era/Origin: 2025+ Interactive. Complexity: Medium. AI Prompt Keywords: Design with interactive cursor effects. Use: custom cursor, cursor morphing on hover, magnetic cursor pull, cursor trails, blend mode cursors, click feedback animations, cursor as interaction tool, pointer transformation.. CSS/Technical: cursor: none (custom), position: fixed for cursor element, mix-blend-mode: difference, transform on hover targets, magnetic effect (JS position lerp), trail with opacity fade, scale on click. Implementation Checklist: ☐ Custom cursor works, ☐ Hover morph smooth, ☐ Magnetic pull subtle, ☐ Trail performance ok, ☐ Click feedback visible, ☐ Touch fallback provided. Design System Variables: --cursor-size: 20px, --cursor-hover-scale: 1.5, --magnetic-distance: 100px, --trail-length: 10, --trail-fade: 0.1, --blend-mode: difference.