<script>
  // ... codice precedente ...

  map.on('load', () => {
    // 1) Sorgente DEM per la MESH 3D (terrain)
    map.addSource('terrain-dem', {
      type: 'raster-dem',
      // Se stai usando il tuo PMTiles Terrarium:
      // url: 'pmtiles://' + `${origin}/data/terrain_terrarium.pmtiles`,
      // encoding: 'terrarium',
      // tileSize: 256, // oppure 512 se il tuo tileset lo usa

      // ESEMPIO DEM DI TEST (Terrarium pubblico):
      url: 'https://demotiles.maplibre.org/terrain-tiles/tiles.json',
      tileSize: 256
    });

    // 2) Sorgente DEM *separata* per l'HILLSHADE (stesso dataset, ID diverso)
    map.addSource('hillshade-dem', {
      type: 'raster-dem',
      // Se usi lo stesso PMTiles Terrarium, ripeti gli stessi parametri qui
      // url: 'pmtiles://' + `${origin}/data/terrain_terrarium.pmtiles`,
      // encoding: 'terrarium',
      // tileSize: 256,

      // DEM di test identico all’esempio sopra
      url: 'https://demotiles.maplibre.org/terrain-tiles/tiles.json',
      tileSize: 256
    });

    // 3) Attiva il terrain 3D sulla sola source 'terrain-dem'
    let exag = 1.6;
    map.setTerrain({ source: 'terrain-dem', exaggeration: exag });

    // 4) Inserisci l’hillshade usando la source 'hillshade-dem'
    const labelLayerId = map.getStyle().layers.find(l => l.type === 'symbol')?.id;
    map.addLayer({
      id: 'hillshade',
      type: 'hillshade',
      source: 'hillshade-dem',
      paint: {
        'hillshade-exaggeration': 0.5,
        'hillshade-illumination-direction': 315
        // (opzionale) 'hillshade-illumination-anchor': 'map'
        // ancora ‘map’ può aiutare con il terrain attivo
      }
    }, labelLayerId);

    // 5) Slider per cambiare l’exaggeration (non ricrea le sorgenti)
    const exIn = document.getElementById('exag');
    const exSp = document.getElementById('exagv');
    const setExag = (v) => {
      exSp.textContent = v.toFixed(1);
      map.setTerrain({ source: 'terrain-dem', exaggeration: v });
      // ← ora NON vedrai più il warning, perché l’hillshade usa un’altra source
    };
    exIn?.addEventListener('input', e => setExag(parseFloat(e.target.value)));
  });

  // ... codice successivo ...
</script>