使用 Three.js 实现【模型混合着色器】，具体要求：

【核心特效】
- 递归UV扭曲效果
- 动态颜色混合
- 基于距离场的色彩生成

【场景与光照】
- 环境光照明
- 无特殊光照效果

【交互与控制】
- OrbitControls 轨道控制器

【技术要求】
- Three.js 最新版本
- GLTFLoader + DRACOLoader 加载模型
- onBeforeCompile 修改材质着色器

vec3 c;
float l, z = iTime;
for(int i = 0; i < 3; i++) {
    vec2 uv, p = gl_FragCoord.xy / iResolution / 2.0;
    uv = p + 2.0;
    p -= 0.5;
    p.x *= iResolution.x / iResolution.y;
    z += 0.07;
    l = length(p);
    uv += p / l * (sin(z) + 1.0) * abs(sin(l * 9.0 - z - z));
    c[i] = 0.01 / length(mod(uv, 1.0) - 0.5);
}

function modelBlendShader(model, DOM) {
  let materials = [];
  model.traverse((c) => c.isMesh && materials.push(c.material));
  materials = [...new Set(materials)];

  materials.forEach((material) => {
    material.onBeforeCompile = (shader) => {
      shader.uniforms.iResolution = uniforms.iResolution;
      shader.uniforms.iTime = uniforms.iTime;
      // 修改着色器代码
    };
    material.needsUpdate = true;
  });

  model.render = () => (uniforms.iTime.value += 0.02);
}