用途：在合成中为文字添加动画高亮、圈选或手绘标注效果，文字本身用 <mark> 标签包裹，效果绘制在 canvas 叠加层上，不修改文字 DOM。
主要能力：提供五种绘制模式——highlight（波浪马克笔，默认）、circle（手绘圆圈）、burst（放射线/曲线/云朵）、scribble（涂鸦划除）、sketchout（粗糙矩形框）。支持全局构造选项（animate、animationSpeed、drawingMode、height、offset、padding、easing、skewX、multiLineDelay）与各模式专属选项，并可通过 data-* 属性逐元素覆盖，或用 defineStyle 定义命名样式后以 data-highlight-style 引用。多行文本会按行分段依次动画。
使用方式：库为 ES 模块，需先转成全局脚本再以普通 script 引入：
curl -sL "https://cdn.jsdelivr.net/gh/Robincodes-Sandbox/marker-highlight@main/dist/marker-highlight.min.js"
| sed 's/export{[^}]*};$/window.MarkerHighlighter=W;/' > marker-highlight.global.js
颜色通过 <mark> 的 data-color 设置，构造前复制到 data-original-bgcolor，CSS 中设 mark { background-color: transparent } 避免闪烁。库自带 requestAnimationFrame 循环，不由 GSAP 驱动，需用 GSAP tl.call() 在时间轴特定点触发。推荐每个容器只建一个实例并设 animate: false 预绘，隐藏全部 canvas，触发时清空、显示并调用 reanimateMark()，回退时用 onReverseComplete 隐藏。
适用场景：产品发布、强调关键术语、圈注数据、教程与蓝图风格标注等。
限制：动画非 GSAP 驱动，拖动时间轴不会显示笔画中间进度；同一父容器内多个实例会冲突（初始化会清除所有 .highlight div）；canvas 叠加层相对 mark 父元素绝对定位，库会自动为容器父级设 position: relative。无库的纯 CSS+GSAP 替代方案见其 css-patterns 参考文档。