index.qmd

---
title: "Mapa de riesgo de incendios"
subtitle: "AEMET OpenData · NASA FIRMS · EFFIS/Copernicus · GISCO/NUTS"
format:
  html:
    page-layout: full
    toc: false
execute:
  echo: false
  warning: false
  message: false
---

```{r setup}
library(leaflet)
library(htmltools)
library(htmlwidgets)
library(jsonlite)
library(readr)
library(dplyr)
library(purrr)

source("R/effis.R", encoding = "UTF-8")
source("R/admin.R", encoding = "UTF-8")

`%||%` <- function(x, y) {
  if (is.null(x) || length(x) == 0 || all(is.na(x)) || !nzchar(paste(x, collapse = ""))) y else x
}

read_layers_json <- function() {
  candidates <- c(
    "data/processed/layers.json",
    "assets/aemet/layers.json",
    "docs/assets/aemet/layers.json"
  )

  for (path in candidates) {
    if (file.exists(path) && file.info(path)$size > 2) {
      layers <- tryCatch(
        jsonlite::fromJSON(path, simplifyVector = FALSE),
        error = function(e) list()
      )
      if (length(layers) > 0) {
        attr(layers, "source_path") <- path
        return(layers)
      }
    }
  }

  csv_path <- "data/processed/layers.csv"
  if (file.exists(csv_path) && file.info(csv_path)$size > 0) {
    layers_csv <- readr::read_csv(csv_path, show_col_types = FALSE)
    if (nrow(layers_csv) > 0) {
      layers <- layers_csv |>
        mutate(
          bounds = purrr::map(bounds_json, jsonlite::fromJSON),
          legend_labels = strsplit(legend_labels, "\\|"),
          legend_colours = strsplit(legend_colours, "\\|")
        ) |>
        select(-bounds_json) |>
        jsonlite::toJSON(dataframe = "rows", auto_unbox = TRUE, null = "null") |>
        jsonlite::fromJSON(simplifyVector = FALSE)

      attr(layers, "source_path") <- csv_path
      return(layers)
    }
  }

  layers <- list()
  attr(layers, "source_path") <- NA_character_
  layers
}

read_firms_csv <- function() {
  candidates <- c(
    "data/processed/firms_active_fires.csv",
    "assets/firms/firms_active_fires.csv"
  )

  for (path in candidates) {
    if (file.exists(path) && file.info(path)$size > 0) {
      out <- tryCatch(
        readr::read_csv(path, show_col_types = FALSE),
        error = function(e) tibble::tibble()
      )
      if (nrow(out) > 0 && all(c("longitude", "latitude") %in% names(out))) {
        attr(out, "source_path") <- path
        return(out)
      }
    }
  }

  out <- tibble::tibble()
  attr(out, "source_path") <- NA_character_
  out
}

read_csv_optional <- function(paths) {
  for (path in paths) {
    if (file.exists(path) && file.info(path)$size > 0) {
      out <- tryCatch(
        readr::read_csv(path, show_col_types = FALSE),
        error = function(e) tibble::tibble()
      )
      attr(out, "source_path") <- path
      return(out)
    }
  }

  out <- tibble::tibble()
  attr(out, "source_path") <- NA_character_
  out
}

read_dashboard_overview <- function() {
  read_csv_optional(c(
    "data/processed/dashboard_summary.csv",
    "assets/summary/dashboard_summary.csv"
  ))
}

read_summary_ccaa <- function() {
  read_csv_optional(c(
    "data/processed/firms_summary_ccaa.csv",
    "assets/summary/firms_summary_ccaa.csv"
  ))
}

read_summary_provincias <- function() {
  read_csv_optional(c(
    "data/processed/firms_summary_provincias.csv",
    "assets/summary/firms_summary_provincias.csv"
  ))
}

read_territorial_summary <- function() {
  candidates <- c(
    "data/processed/territorial_summary.json",
    "assets/summary/territorial_summary.json"
  )

  for (path in candidates) {
    if (file.exists(path) && file.info(path)$size > 2) {
      out <- tryCatch(
        jsonlite::fromJSON(path, simplifyVector = FALSE),
        error = function(e) NULL
      )
      if (!is.null(out)) {
        attr(out, "source_path") <- path
        return(out)
      }
    }
  }

  out <- list(
    generated_at_utc = NA_character_,
    methodology = list(),
    ccaa = list(),
    provincias = list()
  )
  attr(out, "source_path") <- NA_character_
  out
}

read_operational_alerts <- function() {
  read_csv_optional(c(
    "data/processed/operational_alerts.csv",
    "assets/alerts/operational_alerts.csv"
  ))
}

read_alerts_summary <- function() {
  read_csv_optional(c(
    "data/processed/operational_alerts_summary.csv",
    "assets/alerts/operational_alerts_summary.csv"
  ))
}

safe_value <- function(x, default = "—") {
  if (length(x) == 0 || is.na(x) || identical(x, "")) default else as.character(x)
}

add_admin_boundaries <- function(
  map,
  path,
  group,
  weight = 1,
  colour = "#333333",
  fill_opacity = 0.01
) {
  if (!requireNamespace("sf", quietly = TRUE)) return(map)
  if (!file.exists(path) || file.info(path)$size == 0) return(map)

  x <- tryCatch(sf::st_read(path, quiet = TRUE), error = function(e) NULL)
  if (is.null(x) || nrow(x) == 0) return(map)

  x <- force_wgs84_lonlat(x)
  if (!"admin_name" %in% names(x)) {
    x$admin_name <- if ("NUTS_NAME" %in% names(x)) x$NUTS_NAME else x$admin_id
  }

  leaflet::addPolygons(
    map,
    data = x,
    group = group,
    layerId = ~paste(admin_level, admin_id, sep = ":"),
    color = colour,
    weight = weight,
    opacity = 0.85,
    fillColor = colour,
    fillOpacity = fill_opacity,
    label = ~paste0(admin_name, " · clic para consultar"),
    highlightOptions = highlightOptions(
      color = "#1676a3",
      weight = weight + 1,
      fillOpacity = 0.10,
      bringToFront = TRUE
    )
  )
}

read_effis_ba_summary <- function() {
  json_candidates <- c(
    "assets/effis_ba/summary.json",
    "docs/assets/effis_ba/summary.json"
  )

  for (path in json_candidates) {
    if (file.exists(path) && file.info(path)$size > 2) {
      out <- tryCatch(jsonlite::fromJSON(path, simplifyVector = TRUE), error = function(e) NULL)
      if (!is.null(out)) {
        attr(out, "source_path") <- path
        return(out)
      }
    }
  }

  csv_path <- "data/processed/effis_burnt_areas_summary.csv"
  if (file.exists(csv_path) && file.info(csv_path)$size > 0) {
    out <- tryCatch(readr::read_csv(csv_path, show_col_types = FALSE), error = function(e) NULL)
    if (!is.null(out) && nrow(out) > 0) {
      out <- as.list(out[1, ])
      attr(out, "source_path") <- csv_path
      return(out)
    }
  }

  out <- list(n_features = 0L, asset_geojson = "assets/effis_ba/effis_burnt_areas.geojson")
  attr(out, "source_path") <- NA_character_
  out
}

layers_data <- read_layers_json()
layers_source <- attr(layers_data, "source_path")

# Orden del selector AEMET en Leaflet.
# El paquete SIG clásico usa nombres down_YYYYMMDD...D00..D07,
# donde YYYYMMDD es la fecha civil del primer mapa y Dxx el horizonte.
# En el catálogo se guarda valid_date = issue_date + D.
aemet_valid_date_rank <- function(date_chr, today = Sys.Date()) {
  d <- suppressWarnings(as.Date(date_chr))
  if (is.na(d)) return(999999L)
  if (!is.na(d) && d == today) return(0L)
  if (d > today) return(as.integer(d - today))
  10000L + as.integer(today - d)
}

aemet_layer_rank <- function(layer) {
  area <- layer$area %||% ""
  area_rank <- dplyr::case_when(
    area == "p" ~ 1L,
    area == "b" ~ 2L,
    area == "c" ~ 3L,
    TRUE ~ 99L
  )

  tipo <- layer$tipo %||% ""
  tipo_rank <- dplyr::case_when(
    tipo == "previsto" ~ 1L,
    tipo == "estimado" ~ 2L,
    TRUE ~ 99L
  )

  valid_date <- layer$valid_date %||% layer$date %||% ""
  valid_rank <- aemet_valid_date_rank(valid_date)
  dia <- suppressWarnings(as.integer(layer$dia %||% 0L))
  if (is.na(dia)) dia <- 0L
  issue_date <- layer$issue_date %||% ""

  paste0(
    sprintf("%02d", area_rank), "_",
    sprintf("%06d", valid_rank), "_",
    sprintf("%02d", tipo_rank), "_",
    sprintf("%02d", dia), "_",
    issue_date
  )
}

if (length(layers_data) > 0) {
  layers_data <- layers_data[order(vapply(layers_data, aemet_layer_rank, character(1)))]
}

n_layers <- length(layers_data)
layers_json <- jsonlite::toJSON(layers_data, auto_unbox = TRUE, null = "null")
last_update <- if (n_layers > 0) {
  unique(vapply(layers_data, function(x) {
    value <- x[["valid_date"]] %||% x[["date"]]
    if (is.null(value) || length(value) == 0 || is.na(value)) NA_character_ else as.character(value)
  }, character(1)))[1]
} else {
  NA_character_
}

firms_data <- read_firms_csv()
firms_source <- attr(firms_data, "source_path")
n_firms <- nrow(firms_data)

overview_data <- read_dashboard_overview()
summary_ccaa <- read_summary_ccaa()
summary_provincias <- read_summary_provincias()
territorial_data <- read_territorial_summary()
territorial_source <- attr(territorial_data, "source_path")
territorial_json <- jsonlite::toJSON(
  territorial_data,
  auto_unbox = TRUE,
  null = "null",
  na = "null"
)
alerts_data <- read_operational_alerts()
alerts_summary <- read_alerts_summary()
effis_ba_summary <- read_effis_ba_summary()
effis_ba_source <- attr(effis_ba_summary, "source_path")
n_effis_ba <- suppressWarnings(as.integer(effis_ba_summary$n_features %||% 0L))
if (is.na(n_effis_ba)) n_effis_ba <- 0L
effis_ba_url <- as.character(effis_ba_summary$asset_geojson %||% "assets/effis_ba/effis_burnt_areas.geojson")
effis_ba_config_json <- jsonlite::toJSON(
  list(
    enabled = n_effis_ba > 0 && file.exists(effis_ba_url),
    url = effis_ba_url,
    n_features = n_effis_ba
  ),
  auto_unbox = TRUE,
  null = "null"
)

latest_layer_value <- function(layers, field) {
  values <- vapply(layers, function(layer) {
    value <- layer[[field]] %||% ""
    if (length(value) == 0 || is.na(value)) "" else as.character(value)
  }, character(1))
  values <- values[nzchar(values)]
  if (length(values) == 0) NA_character_ else max(values)
}

first_overview_value <- function(data, field) {
  if (nrow(data) == 0 || !field %in% names(data)) return(NA_character_)
  value <- data[[field]][1]
  if (length(value) == 0 || is.na(value) || !nzchar(as.character(value))) NA_character_ else as.character(value)
}

freshness_config_json <- jsonlite::toJSON(
  list(
    aemet_issue_date = latest_layer_value(layers_data, "issue_date"),
    firms_latest_detection_utc = first_overview_value(overview_data, "ultima_deteccion_utc"),
    firms_generated_at_utc = first_overview_value(overview_data, "generated_at_utc"),
    effis_generated_at_utc = as.character(effis_ba_summary$generated_at %||% NA_character_),
    effis_max_date = as.character(effis_ba_summary$max_date %||% NA_character_)
  ),
  auto_unbox = TRUE,
  null = "null",
  na = "null"
)

if (nrow(overview_data) > 0) {
  overview <- overview_data[1, ]
} else {
  overview <- tibble::tibble(
    n_firms = n_firms,
    n_firms_6h = if (n_firms > 0 && "age_hours" %in% names(firms_data)) sum(!is.na(firms_data$age_hours) & firms_data$age_hours <= 6) else 0L,
    n_firms_24h = if (n_firms > 0 && "age_hours" %in% names(firms_data)) sum(!is.na(firms_data$age_hours) & firms_data$age_hours <= 24) else 0L,
    frp_total_mw = if (n_firms > 0 && "frp" %in% names(firms_data)) round(sum(as.numeric(firms_data$frp), na.rm = TRUE), 1) else 0,
    ultima_deteccion_utc = NA_character_,
    n_ccaa_con_focos = nrow(summary_ccaa),
    n_provincias_con_focos = nrow(summary_provincias)
  )
}

effis_groups <- effis_overlay_groups()
effis_cfg <- effis_layer_config()

n_alerts <- nrow(alerts_data)
n_alerts_high <- if (n_alerts > 0 && "alerta_operativa" %in% names(alerts_data)) sum(alerts_data$alerta_operativa == "alta", na.rm = TRUE) else 0L
n_alerts_medium <- if (n_alerts > 0 && "alerta_operativa" %in% names(alerts_data)) sum(alerts_data$alerta_operativa == "media", na.rm = TRUE) else 0L
```

## Mapa

```{r fire-map}
#| column: screen-inset

base_groups <- c("Base clara", "Satélite")
overlay_groups <- character()

map <- leaflet(width = "100%", height = "88vh", options = leafletOptions(preferCanvas = TRUE, zoomControl = TRUE)) |>
  addProviderTiles(providers$CartoDB.Positron, group = "Base clara") |>
  addProviderTiles(providers$Esri.WorldImagery, group = "Satélite") |>
  setView(lng = -3.7, lat = 40.2, zoom = 6)

# Panes: AEMET queda por debajo; EFFIS BA en medio; FIRMS/alertas por encima.
map <- map |>
  addMapPane("aemetPane", zIndex = 350) |>
  addMapPane("effisBaPane", zIndex = 520) |>
  addMapPane("firmsPane", zIndex = 650) |>
  addMapPane("alertsPane", zIndex = 670)

if (n_effis_ba > 0 && file.exists(effis_ba_url)) {
  # Marcador transparente para registrar el grupo en el control Leaflet. La
  # geometría EFFIS se descarga desde JavaScript solo cuando se activa la capa.
  map <- map |>
    addCircleMarkers(
      lng = 0,
      lat = 0,
      group = "EFFIS Burnt Areas",
      radius = 0,
      stroke = FALSE,
      fillOpacity = 0,
      options = pathOptions(pane = "effisBaPane", interactive = FALSE)
    )
  overlay_groups <- c(overlay_groups, "EFFIS Burnt Areas")
}

if (n_firms > 0) {
  firms_data <- firms_data |>
    mutate(
      age_hours = suppressWarnings(as.numeric(age_hours)),
      frp = suppressWarnings(as.numeric(frp))
    )

  if (!"popup_label" %in% names(firms_data)) {
    firms_data <- firms_data |>
      mutate(
        popup_label = paste0(
          "NASA FIRMS<br>",
          "Sensor: ", source_dataset, "<br>",
          "Fecha UTC: ", acq_datetime_utc, "<br>",
          "FRP: ", ifelse(is.na(frp), "s/d", paste0(frp, " MW"))
        )
      )
  }

  firms_data <- firms_data |>
    mutate(
      firms_colour = case_when(
        is.na(age_hours) ~ "#666666",
        age_hours <= 6 ~ "#d7191c",
        age_hours <= 24 ~ "#fdae61",
        age_hours <= 48 ~ "#ffffbf",
        TRUE ~ "#999999"
      ),
      firms_radius = pmax(4, pmin(10, ifelse(is.na(frp), 5, sqrt(frp) + 3))),
      popup = popup_label
    )

  map <- map |>
    addCircleMarkers(
      data = firms_data,
      lng = ~longitude,
      lat = ~latitude,
      group = "NASA FIRMS - focos activos",
      radius = ~firms_radius,
      color = ~firms_colour,
      fillColor = ~firms_colour,
      fillOpacity = 0.82,
      weight = 1,
      popup = ~popup,
      label = ~paste0("FIRMS · ", acq_datetime_utc),
      options = pathOptions(pane = "firmsPane")
    )
  overlay_groups <- c(overlay_groups, "NASA FIRMS - focos activos")
}

if (n_alerts > 0) {
  if (!"popup_label" %in% names(alerts_data)) {
    alerts_data <- alerts_data |>
      mutate(popup_label = paste0(cluster_id, "<br>Nivel: ", alerta_operativa))
  }

  alerts_data <- alerts_data |>
    mutate(
      longitude = suppressWarnings(as.numeric(longitude)),
      latitude = suppressWarnings(as.numeric(latitude)),
      score = suppressWarnings(as.numeric(score)),
      alert_colour = case_when(
        alerta_operativa == "alta" ~ "#7b3294",
        alerta_operativa == "media" ~ "#d7191c",
        alerta_operativa == "seguimiento" ~ "#fdae61",
        TRUE ~ "#666666"
      ),
      alert_radius = pmax(7, pmin(16, sqrt(pmax(1, score)) + 5)),
      popup = as.character(popup_label)
    ) |>
    filter(!is.na(longitude), !is.na(latitude))

  if (nrow(alerts_data) > 0) {
    map <- map |>
      addCircleMarkers(
        data = alerts_data,
        lng = ~longitude,
        lat = ~latitude,
        group = "Alertas operativas FIRMS",
        radius = ~alert_radius,
        color = ~alert_colour,
        fillColor = ~alert_colour,
        fillOpacity = 0.42,
        weight = 3,
        popup = ~popup,
        label = ~paste0(cluster_id, " · ", alerta_operativa),
        options = pathOptions(pane = "alertsPane")
      )
    overlay_groups <- c(overlay_groups, "Alertas operativas FIRMS")
  }
}

map <- add_effis_wms_layers(map)
overlay_groups <- c(overlay_groups, effis_groups)

map <- map |>
  add_admin_boundaries(
    "data/processed/admin_nuts2_ccaa.geojson",
    "CCAA (NUTS2)",
    weight = 1.2,
    colour = "#2b5d87",
    fill_opacity = 0.015
  ) |>
  add_admin_boundaries(
    "data/processed/admin_nuts3_provincias.geojson",
    "Provincias (NUTS3)",
    weight = 0.7,
    colour = "#555555",
    fill_opacity = 0.01
  )
overlay_groups <- c(overlay_groups, "CCAA (NUTS2)", "Provincias (NUTS3)")

# Las CCAA quedan visibles para habilitar la consulta territorial directa.
# Las provincias continúan siendo opcionales desde el control de capas.
hidden_groups <- intersect(
  c(effis_groups, "EFFIS Burnt Areas", "Provincias (NUTS3)"),
  unique(overlay_groups)
)

map <- map |>
  addScaleBar(position = "bottomleft") |>
  addLayersControl(
    baseGroups = base_groups,
    overlayGroups = unique(overlay_groups),
    options = layersControlOptions(collapsed = TRUE)
  )

if (length(hidden_groups) > 0) {
  map <- hideGroup(map, hidden_groups)
}

map <- map |>
  addControl(
    html = HTML(
      "Fuentes: AEMET OpenData · NASA FIRMS · EFFIS/Copernicus EMS · Eurostat/GISCO<br>
      Visor informativo; no sustituye a avisos oficiales ni a servicios de emergencia."
    ),
    position = "bottomleft"
  )

if (n_firms > 0) {
  map <- map |>
    addControl(
      html = HTML(
        "<b>NASA FIRMS</b><br>
        <span style='color:#d7191c'>●</span> &lt; 6 h<br>
        <span style='color:#fdae61'>●</span> 6–24 h<br>
        <span style='color:#bdb76b'>●</span> 24–48 h<br>
        <span style='color:#999999'>●</span> &gt; 48 h<br>
        <b>Alertas</b><br>
        <span style='color:#7b3294'>●</span> alta<br>
        <span style='color:#d7191c'>●</span> media"
      ),
      position = "bottomright"
    )
}

js_template <- r"(
function(el, x) {
  const layers = __LAYERS_JSON__;
  const effisBurntAreas = __EFFIS_BA_CONFIG__;
  const freshness = __FRESHNESS_CONFIG__;
  const territorial = __TERRITORIAL_DATA__;
  const map = this;

  if (map.createPane && !map.getPane('aemetPane')) {
    map.createPane('aemetPane');
    map.getPane('aemetPane').style.zIndex = 350;
    map.getPane('aemetPane').style.pointerEvents = 'none';
  }

  let currentOverlay = null;
  let currentOpacity = 0.68;
  let effisBaLayer = null;
  let effisBaData = null;
  let effisBaVisible = false;
  let currentLayerIndex = 0;
  let currentLayerRequest = 0;
  let playbackTimer = null;
  let selectedTerritory = null;
  let selectedTerritoryLayer = null;
  let territoryPanelRequest = 0;
  const adminLayersByKey = new Map();
  const aemetImageCache = new Map();
  const playbackIntervalMs = 1800;

  function escapeHtml(value) {
    return String(value === null || value === undefined ? '' : value)
      .replace(/&/g, '&amp;')
      .replace(/</g, '&lt;')
      .replace(/>/g, '&gt;')
      .replace(/"/g, '&quot;')
      .replace(/'/g, '&#039;');
  }

  function effisPopup(properties) {
    const p = properties || {};
    const rows = [
      ['ID', p.effis_id || p.id],
      ['Fecha', p.effis_date || p.FIREDATE],
      ['Superficie', p.effis_area_ha !== undefined ? (p.effis_area_ha + ' ha') : p.AREA_HA],
      ['País', p.COUNTRY || p.country]
    ].filter(row => row[1] !== null && row[1] !== undefined && row[1] !== '');
    return '<strong>EFFIS Burnt Area</strong>' + rows.map(row => '<br>' + escapeHtml(row[0]) + ': ' + escapeHtml(row[1])).join('');
  }

  function addEffisBurntAreas() {
    if (!effisBurntAreas || !effisBurntAreas.enabled || !effisBurntAreas.url) return;
    effisBaVisible = true;

    const attachLayer = function(data) {
      if (!effisBaVisible) return;
      if (effisBaLayer) map.removeLayer(effisBaLayer);
      effisBaLayer = L.geoJSON(data, {
        pane: 'effisBaPane',
        style: {
          color: '#5e3c99',
          weight: 1.1,
          opacity: 0.9,
          fillColor: '#fdb863',
          fillOpacity: 0.28
        },
        onEachFeature: function(feature, layer) {
          layer.bindPopup(effisPopup(feature.properties || {}));
          layer.bindTooltip('EFFIS Burnt Area');
        }
      }).addTo(map);
    };

    if (effisBaData) {
      attachLayer(effisBaData);
      return;
    }

    fetch(effisBurntAreas.url)
      .then(response => {
        if (!response.ok) throw new Error('HTTP ' + response.status);
        return response.json();
      })
      .then(data => {
        effisBaData = data;
        attachLayer(data);
      })
      .catch(error => console.error('No se pudo cargar EFFIS Burnt Areas:', error));
  }

  function removeEffisBurntAreas() {
    effisBaVisible = false;
    if (effisBaLayer) {
      map.removeLayer(effisBaLayer);
      effisBaLayer = null;
    }
  }

  map.on('overlayadd', function(event) {
    if (event && event.name === 'EFFIS Burnt Areas') addEffisBurntAreas();
    if (event && event.layer) attachTerritoryLayer(event.layer);
  });
  map.on('overlayremove', function(event) {
    if (event && event.name === 'EFFIS Burnt Areas') removeEffisBurntAreas();
  });

  function capitaliseFirst(value) {
    const text = String(value || '');
    return text ? text.charAt(0).toUpperCase() + text.slice(1) : '';
  }

  function parseIsoDateUtc(value) {
    const match = /^(\d{4})-(\d{2})-(\d{2})$/.exec(String(value || ''));
    if (!match) return null;

    const date = new Date(Date.UTC(
      parseInt(match[1], 10),
      parseInt(match[2], 10) - 1,
      parseInt(match[3], 10)
    ));

    return Number.isNaN(date.getTime()) ? null : date;
  }

  function formatAemetDate(value) {
    const date = parseIsoDateUtc(value);
    if (!date) return String(value || 'Fecha no disponible');

    const formatted = new Intl.DateTimeFormat('es-ES', {
      weekday: 'long',
      day: 'numeric',
      month: 'long',
      year: 'numeric',
      timeZone: 'UTC'
    }).format(date);

    return capitaliseFirst(formatted);
  }

  function layerForecastLabel(layer) {
    return (layer.forecast_label !== null && layer.forecast_label !== undefined && layer.forecast_label !== '')
      ? layer.forecast_label
      : ((layer.dia === null || layer.dia === undefined || layer.dia === '') ? 'Hoy' : ('D+' + layer.dia));
  }

  function labelForLayer(layer) {
    const dia = layerForecastLabel(layer);
    const tipo = layer.tipo === 'estimado' ? 'Estimado' : 'Previsto';
    const validDate = layer.valid_date || layer.date || '';
    const issueDate = layer.issue_date || '';
    const issueTxt = (issueDate && issueDate !== validDate) ? (' · emitido ' + formatAemetDate(issueDate)) : '';
    return formatAemetDate(validDate) + ' · ' + layer.area_label + ' · ' + tipo + ' · ' + dia + issueTxt;
  }

  function updateLegend(layer) {
    const legend = document.getElementById('fire-risk-legend');
    if (!legend) return;

    if (!layer || !layer.legend_labels || !layer.legend_colours) {
      legend.innerHTML = '<b>Nivel de peligro AEMET</b><br>No disponible';
      return;
    }

    const validDate = layer.valid_date || layer.date || '';
    const dia = layerForecastLabel(layer);
    const tipo = layer.tipo === 'estimado' ? 'Estimado' : 'Previsto';
    let html = '<b>Nivel de peligro AEMET</b>';
    html += '<div class="fire-legend-context">' +
      escapeHtml(formatAemetDate(validDate)) + ' · ' + escapeHtml(dia) + '<br>' +
      escapeHtml(layer.area_label || '') + ' · ' + escapeHtml(tipo) +
      '</div>';

    for (let i = 0; i < layer.legend_labels.length; i++) {
      html += '<br><span class="swatch" style="background:' + escapeHtml(layer.legend_colours[i]) + '"></span> ' + escapeHtml(layer.legend_labels[i]);
    }
    legend.innerHTML = html;
  }

  function layerSeriesKey(layer) {
    if (!layer) return '';
    return [layer.area || '', layer.tipo || '', layer.issue_date || ''].join('|');
  }

  function seriesIndices(index) {
    const layer = layers[index];
    const key = layerSeriesKey(layer);
    return layers
      .map((candidate, candidateIndex) => ({candidate, candidateIndex}))
      .filter(item => layerSeriesKey(item.candidate) === key)
      .sort((a, b) => {
        const dateA = a.candidate.valid_date || a.candidate.date || '';
        const dateB = b.candidate.valid_date || b.candidate.date || '';
        if (dateA !== dateB) return dateA.localeCompare(dateB);
        return Number(a.candidate.forecast_day || a.candidate.dia || 0) - Number(b.candidate.forecast_day || b.candidate.dia || 0);
      })
      .map(item => item.candidateIndex);
  }

  function updateTimelineControls() {
    const select = document.getElementById('fire-layer-select');
    const previous = document.getElementById('fire-layer-previous');
    const next = document.getElementById('fire-layer-next');
    const position = document.getElementById('fire-layer-position');
    const sequence = seriesIndices(currentLayerIndex);
    const sequencePosition = sequence.indexOf(currentLayerIndex);

    if (select) select.value = String(currentLayerIndex);
    if (previous) previous.disabled = sequencePosition <= 0;
    if (next) next.disabled = sequencePosition < 0 || sequencePosition >= sequence.length - 1;
    if (position) position.textContent = sequencePosition >= 0 ? ((sequencePosition + 1) + ' de ' + sequence.length) : '—';
  }

  function stopPlayback() {
    if (playbackTimer !== null) {
      window.clearInterval(playbackTimer);
      playbackTimer = null;
    }
    const button = document.getElementById('fire-layer-play');
    if (button) {
      button.innerHTML = '&#9654;';
      button.title = 'Reproducir la secuencia temporal';
      button.setAttribute('aria-label', 'Reproducir la secuencia temporal');
      button.classList.remove('is-playing');
    }
  }

  function stepLayer(delta, wrap) {
    const sequence = seriesIndices(currentLayerIndex);
    if (sequence.length === 0) return;
    let position = sequence.indexOf(currentLayerIndex);
    if (position < 0) position = 0;
    let target = position + delta;
    if (wrap) target = (target + sequence.length) % sequence.length;
    if (target < 0 || target >= sequence.length) return;
    setLayer(sequence[target]);
  }

  function togglePlayback() {
    if (playbackTimer !== null) {
      stopPlayback();
      return;
    }

    const sequence = seriesIndices(currentLayerIndex);
    if (sequence.length <= 1) return;
    const button = document.getElementById('fire-layer-play');
    if (button) {
      button.innerHTML = '&#10074;&#10074;';
      button.title = 'Pausar la secuencia temporal';
      button.setAttribute('aria-label', 'Pausar la secuencia temporal');
      button.classList.add('is-playing');
    }
    playbackTimer = window.setInterval(function() {
      stepLayer(1, true);
    }, playbackIntervalMs);
  }

  function parseUtcTimestamp(value) {
    let text = String(value || '').trim();
    if (!text) return null;
    if (/^\d{4}-\d{2}-\d{2}$/.test(text)) text += 'T00:00:00Z';
    text = text.replace(/^(\d{4}-\d{2}-\d{2})\s+(\d{2}:\d{2})/, '$1T$2');
    text = text.replace(/([+-]\d{2})(\d{2})$/, '$1:$2');
    const date = new Date(text);
    return Number.isNaN(date.getTime()) ? null : date;
  }

  function madridDateKey(date) {
    const parts = new Intl.DateTimeFormat('en-CA', {
      timeZone: 'Europe/Madrid', year: 'numeric', month: '2-digit', day: '2-digit'
    }).formatToParts(date);
    const values = {};
    parts.forEach(part => { if (part.type !== 'literal') values[part.type] = part.value; });
    return [values.year, values.month, values.day].join('-');
  }

  function calendarAgeDays(isoDate) {
    if (!/^\d{4}-\d{2}-\d{2}$/.test(String(isoDate || ''))) return null;
    const today = madridDateKey(new Date());
    const start = parseIsoDateUtc(isoDate);
    const end = parseIsoDateUtc(today);
    if (!start || !end) return null;
    return Math.floor((end.getTime() - start.getTime()) / 86400000);
  }

  function relativeAge(date) {
    if (!date) return 'sin fecha';
    const minutes = Math.max(0, Math.round((Date.now() - date.getTime()) / 60000));
    if (minutes < 60) return 'hace ' + minutes + ' min';
    const hours = Math.round(minutes / 60);
    if (hours < 48) return 'hace ' + hours + ' h';
    return 'hace ' + Math.round(hours / 24) + ' días';
  }

  function freshnessRow(source, text, status, title) {
    return '<div class="freshness-row freshness-' + status + '" title="' + escapeHtml(title || text) + '">' +
      '<span class="freshness-dot" aria-hidden="true"></span>' +
      '<span><strong>' + escapeHtml(source) + '</strong> · ' + escapeHtml(text) + '</span>' +
      '</div>';
  }

  function updateFreshnessIndicator() {
    const container = document.getElementById('data-freshness');
    if (!container) return;
    let html = '<div class="freshness-title">Actualidad de datos</div>';

    const aemetDays = calendarAgeDays(freshness && freshness.aemet_issue_date);
    if (aemetDays === null) {
      html += freshnessRow('AEMET', 'sin fecha de emisión', 'unavailable');
    } else if (aemetDays <= 0) {
      html += freshnessRow('AEMET', 'emitido hoy', 'fresh', formatAemetDate(freshness.aemet_issue_date));
    } else if (aemetDays === 1) {
      html += freshnessRow('AEMET', 'emitido ayer', 'warning', formatAemetDate(freshness.aemet_issue_date));
    } else {
      html += freshnessRow('AEMET', 'emitido hace ' + aemetDays + ' días', 'stale', formatAemetDate(freshness.aemet_issue_date));
    }

    const firmsDate = parseUtcTimestamp(freshness && freshness.firms_latest_detection_utc);
    if (!firmsDate) {
      html += freshnessRow('FIRMS', 'sin detecciones disponibles', 'unavailable');
    } else {
      const firmsHours = Math.max(0, (Date.now() - firmsDate.getTime()) / 3600000);
      const firmsStatus = firmsHours <= 6 ? 'fresh' : (firmsHours <= 24 ? 'warning' : 'stale');
      html += freshnessRow('FIRMS', 'última detección ' + relativeAge(firmsDate), firmsStatus, firmsDate.toLocaleString('es-ES', {timeZone: 'Europe/Madrid'}));
    }

    const effisDate = parseUtcTimestamp(freshness && freshness.effis_generated_at_utc);
    if (!effisDate) {
      html += freshnessRow('EFFIS', 'sin actualización disponible', 'unavailable');
    } else {
      const effisHours = Math.max(0, (Date.now() - effisDate.getTime()) / 3600000);
      const effisStatus = effisHours <= 24 ? 'fresh' : (effisHours <= 72 ? 'warning' : 'stale');
      html += freshnessRow('EFFIS', 'actualizado ' + relativeAge(effisDate), effisStatus, effisDate.toLocaleString('es-ES', {timeZone: 'Europe/Madrid'}));
    }

    container.innerHTML = html;
  }

  function normaliseTerritoryLevel(value) {
    const level = String(value || '').toLowerCase();
    if (level === 'provincia' || level === 'provincias') return 'provincia';
    return 'ccaa';
  }

  function territoryKey(level, adminId) {
    return normaliseTerritoryLevel(level) + '|' + String(adminId || '');
  }

  function territoryRows(level) {
    if (!territorial) return [];
    return normaliseTerritoryLevel(level) === 'provincia'
      ? (territorial.provincias || [])
      : (territorial.ccaa || []);
  }

  function adminPropertiesFromLayer(layer) {
    if (layer && layer.feature && layer.feature.properties) {
      return layer.feature.properties;
    }

    const layerId = layer && layer.options ? String(layer.options.layerId || '') : '';
    const parts = layerId.split(':');
    if (parts.length >= 2) {
      return {
        admin_level: parts[0],
        admin_id: parts.slice(1).join(':')
      };
    }

    return null;
  }

  function findTerritoryRecord(properties) {
    const p = properties || {};
    const level = normaliseTerritoryLevel(p.admin_level);
    const id = String(p.admin_id || p.NUTS_ID || '');
    return territoryRows(level).find(row => String(row.admin_id || '') === id) || {
      admin_level: level,
      admin_id: id,
      admin_name: p.admin_name || p.NUTS_NAME || id,
      representative_lon: null,
      representative_lat: null,
      n_focos: 0,
      n_ultimas_6h: 0,
      n_ultimas_12h: 0,
      n_ultimas_24h: 0,
      n_ultimas_48h: 0,
      frp_total_mw: 0,
      frp_media_mw: 0,
      frp_max_mw: 0,
      n_effis_30d: 0,
      effis_area_ha_30d: 0,
      n_effis_90d: 0,
      effis_area_ha_90d: 0,
      alerta_operativa: 'sin actividad'
    };
  }

  function numberValue(value, fallback) {
    const n = Number(value);
    return Number.isFinite(n) ? n : (fallback === undefined ? 0 : fallback);
  }

  function formatMetric(value, digits) {
    const n = Number(value);
    if (!Number.isFinite(n)) return '—';
    return new Intl.NumberFormat('es-ES', {
      minimumFractionDigits: digits || 0,
      maximumFractionDigits: digits || 0
    }).format(n);
  }

  function formatTerritoryDateTime(value) {
    const date = parseUtcTimestamp(value);
    if (!date) return 'Sin detecciones';
    return date.toLocaleString('es-ES', {
      timeZone: 'Europe/Madrid',
      day: '2-digit',
      month: 'short',
      year: 'numeric',
      hour: '2-digit',
      minute: '2-digit'
    });
  }

  function riskStatusClass(label) {
    const value = String(label || '').toLowerCase();
    if (value.includes('extremo') || value.includes('muy alto')) return 'risk-critical';
    if (value.includes('alto')) return 'risk-high';
    if (value.includes('moderado')) return 'risk-medium';
    if (value.includes('bajo')) return 'risk-low';
    return 'risk-unavailable';
  }

  function hexToRgb(hex) {
    const value = String(hex || '').replace('#', '');
    if (!/^[0-9a-fA-F]{6}$/.test(value)) return null;
    return {
      r: parseInt(value.slice(0, 2), 16),
      g: parseInt(value.slice(2, 4), 16),
      b: parseInt(value.slice(4, 6), 16)
    };
  }

  function mercatorY(latitude) {
    const bounded = Math.max(-85.05112878, Math.min(85.05112878, Number(latitude)));
    const rad = bounded * Math.PI / 180;
    return Math.log(Math.tan(Math.PI / 4 + rad / 2));
  }

  function loadAemetImage(url) {
    if (aemetImageCache.has(url)) return aemetImageCache.get(url);

    const promise = new Promise(function(resolve, reject) {
      const image = new Image();
      image.onload = function() {
        try {
          const canvas = document.createElement('canvas');
          canvas.width = image.naturalWidth || image.width;
          canvas.height = image.naturalHeight || image.height;
          const context = canvas.getContext('2d', {willReadFrequently: true});
          context.drawImage(image, 0, 0);
          resolve({
            width: canvas.width,
            height: canvas.height,
            context: context
          });
        } catch (error) {
          reject(error);
        }
      };
      image.onerror = function() { reject(new Error('No se pudo cargar la imagen AEMET')); };
      image.src = url;
    });

    aemetImageCache.set(url, promise);
    return promise;
  }

  function estimateAemetRisk(layer, territoryRecord) {
    if (!layer || layer.layer_kind !== 'image' || !layer.url || !layer.bounds) {
      return Promise.resolve({status: 'unavailable', label: 'No calculable'});
    }

    const lon = Number(territoryRecord && territoryRecord.representative_lon);
    const lat = Number(territoryRecord && territoryRecord.representative_lat);
    if (!Number.isFinite(lon) || !Number.isFinite(lat)) {
      return Promise.resolve({status: 'unavailable', label: 'Sin punto representativo'});
    }

    const south = Number(layer.bounds[0][0]);
    const west = Number(layer.bounds[0][1]);
    const north = Number(layer.bounds[1][0]);
    const east = Number(layer.bounds[1][1]);
    if (lon < west || lon > east || lat < south || lat > north) {
      return Promise.resolve({status: 'outside', label: 'Fuera del área de la capa'});
    }

    const colours = (layer.legend_colours || []).map(hexToRgb);
    if (colours.length === 0 || colours.some(item => !item)) {
      return Promise.resolve({status: 'unavailable', label: 'Leyenda no disponible'});
    }

    return loadAemetImage(layer.url).then(function(imageData) {
      const xRatio = (lon - west) / (east - west);
      const northY = mercatorY(north);
      const southY = mercatorY(south);
      const yRatio = (northY - mercatorY(lat)) / (northY - southY);
      const x = Math.max(0, Math.min(imageData.width - 1, Math.round(xRatio * (imageData.width - 1))));
      const y = Math.max(0, Math.min(imageData.height - 1, Math.round(yRatio * (imageData.height - 1))));
      const radius = 5;
      const x0 = Math.max(0, x - radius);
      const y0 = Math.max(0, y - radius);
      const width = Math.min(imageData.width - x0, radius * 2 + 1);
      const height = Math.min(imageData.height - y0, radius * 2 + 1);
      const pixels = imageData.context.getImageData(x0, y0, width, height).data;
      const counts = new Array(colours.length).fill(0);

      for (let i = 0; i < pixels.length; i += 4) {
        if (pixels[i + 3] < 80) continue;
        let bestIndex = -1;
        let bestDistance = Infinity;
        for (let j = 0; j < colours.length; j++) {
          const dr = pixels[i] - colours[j].r;
          const dg = pixels[i + 1] - colours[j].g;
          const db = pixels[i + 2] - colours[j].b;
          const distance = Math.sqrt(dr * dr + dg * dg + db * db);
          if (distance < bestDistance) {
            bestDistance = distance;
            bestIndex = j;
          }
        }
        if (bestIndex >= 0 && bestDistance <= 95) counts[bestIndex] += 1;
      }

      const bestCount = Math.max.apply(null, counts);
      if (!Number.isFinite(bestCount) || bestCount <= 0) {
        return {status: 'unavailable', label: 'Sin dato en el punto'};
      }

      const index = counts.indexOf(bestCount);
      return {
        status: 'ok',
        label: (layer.legend_labels || [])[index] || ('Nivel ' + (index + 1)),
        colour: (layer.legend_colours || [])[index] || '#888888',
        samples: bestCount
      };
    }).catch(function(error) {
      console.error('No se pudo estimar el nivel AEMET territorial:', error);
      return {status: 'unavailable', label: 'No disponible'};
    });
  }

  function resetSelectedTerritoryStyle() {
    if (!selectedTerritoryLayer || typeof selectedTerritoryLayer.setStyle !== 'function') return;
    const p = adminPropertiesFromLayer(selectedTerritoryLayer) || {};
    const province = normaliseTerritoryLevel(p.admin_level) === 'provincia';
    selectedTerritoryLayer.setStyle({
      color: province ? '#555555' : '#2b5d87',
      weight: province ? 0.7 : 1.2,
      fillColor: province ? '#555555' : '#2b5d87',
      fillOpacity: province ? 0.01 : 0.015
    });
  }

  function clearTerritorySelection() {
    resetSelectedTerritoryStyle();
    selectedTerritory = null;
    selectedTerritoryLayer = null;
    territoryPanelRequest += 1;
    const panel = document.getElementById('territory-panel');
    if (panel) {
      panel.classList.add('is-empty');
      panel.innerHTML =
        '<div class="territory-panel-header"><strong>Consulta territorial</strong></div>' +
        '<div class="territory-panel-empty">Haz clic en una comunidad autónoma. Activa <em>Provincias (NUTS3)</em> para consultar una provincia.</div>';
    }
  }

  function renderTerritoryPanel() {
    const panel = document.getElementById('territory-panel');
    if (!panel || !selectedTerritory) return;

    const record = selectedTerritory;
    const layer = layers[currentLayerIndex];
    const requestId = ++territoryPanelRequest;
    const levelLabel = normaliseTerritoryLevel(record.admin_level) === 'provincia' ? 'Provincia' : 'Comunidad autónoma';
    const parent = record.parent_admin_name ? (' · ' + escapeHtml(record.parent_admin_name)) : '';
    const alertLevel = String(record.alerta_operativa || 'sin actividad');
    const latestDetection = formatTerritoryDateTime(record.ultima_deteccion_utc);
    const validDate = layer ? (layer.valid_date || layer.date || '') : '';

    panel.classList.remove('is-empty');
    panel.innerHTML =
      '<div class="territory-panel-header">' +
        '<div><span class="territory-level">' + escapeHtml(levelLabel) + parent + '</span>' +
        '<strong>' + escapeHtml(record.admin_name || record.admin_id || 'Territorio') + '</strong></div>' +
        '<button id="territory-panel-close" class="territory-close" type="button" aria-label="Cerrar panel">&#215;</button>' +
      '</div>' +
      '<div class="territory-section territory-aemet">' +
        '<div class="territory-section-title">AEMET · ' + escapeHtml(formatAemetDate(validDate)) + '</div>' +
        '<div id="territory-aemet-risk" class="territory-risk risk-loading"><span class="territory-risk-swatch"></span><span>Calculando nivel…</span></div>' +
        '<small>Estimación en un punto representativo interior del territorio.</small>' +
      '</div>' +
      '<div class="territory-section">' +
        '<div class="territory-section-title">NASA FIRMS</div>' +
        '<div class="territory-window-grid">' +
          '<div><strong>' + formatMetric(record.n_ultimas_6h) + '</strong><span>6 h</span></div>' +
          '<div><strong>' + formatMetric(record.n_ultimas_12h) + '</strong><span>12 h</span></div>' +
          '<div><strong>' + formatMetric(record.n_ultimas_24h) + '</strong><span>24 h</span></div>' +
          '<div><strong>' + formatMetric(record.n_ultimas_48h) + '</strong><span>48 h</span></div>' +
        '</div>' +
        '<div class="territory-metrics">' +
          '<span>FRP máx. <strong>' + formatMetric(record.frp_max_mw, 1) + ' MW</strong></span>' +
          '<span>FRP media <strong>' + formatMetric(record.frp_media_mw, 1) + ' MW</strong></span>' +
        '</div>' +
        '<div class="territory-latest">Última detección: <strong>' + escapeHtml(latestDetection) + '</strong></div>' +
        '<div class="territory-alert territory-alert-' + escapeHtml(alertLevel.replace(/[^a-záéíóúüñ]/gi, '-').toLowerCase()) + '">Prioridad FIRMS: ' + escapeHtml(alertLevel) + '</div>' +
      '</div>' +
      '<div class="territory-section">' +
        '<div class="territory-section-title">EFFIS · áreas quemadas</div>' +
        '<div class="territory-effis-grid">' +
          '<div><strong>' + formatMetric(record.effis_area_ha_30d, 1) + ' ha</strong><span>' + formatMetric(record.n_effis_30d) + ' perímetros · 30 días</span></div>' +
          '<div><strong>' + formatMetric(record.effis_area_ha_90d, 1) + ' ha</strong><span>' + formatMetric(record.n_effis_90d) + ' perímetros · 90 días</span></div>' +
        '</div>' +
      '</div>' +
      '<div class="territory-actions">' +
        '<button id="territory-zoom" type="button">Centrar y ampliar</button>' +
      '</div>';

    const close = document.getElementById('territory-panel-close');
    if (close) close.addEventListener('click', clearTerritorySelection);
    const zoom = document.getElementById('territory-zoom');
    if (zoom && selectedTerritoryLayer) {
      zoom.addEventListener('click', function() {
        try { map.fitBounds(selectedTerritoryLayer.getBounds(), {padding: [24, 24]}); } catch (e) {}
      });
    }

    estimateAemetRisk(layer, record).then(function(result) {
      if (requestId !== territoryPanelRequest) return;
      const risk = document.getElementById('territory-aemet-risk');
      if (!risk) return;
      risk.className = 'territory-risk ' + riskStatusClass(result.label);
      const colour = result.colour || '#8a8a8a';
      risk.innerHTML = '<span class="territory-risk-swatch" style="background:' + escapeHtml(colour) + '"></span><span>' + escapeHtml(result.label) + '</span>';
    });
  }

  function selectTerritory(layer) {
    const properties = adminPropertiesFromLayer(layer);
    if (!layer || !properties) return;
    resetSelectedTerritoryStyle();
    selectedTerritoryLayer = layer;
    selectedTerritory = findTerritoryRecord(properties);
    if (typeof layer.setStyle === 'function') {
      layer.setStyle({
        color: '#005b83',
        weight: 2.6,
        fillColor: '#37a5cf',
        fillOpacity: 0.16
      });
      if (typeof layer.bringToFront === 'function') layer.bringToFront();
    }
    renderTerritoryPanel();
  }

  function attachTerritoryLayer(layer) {
    if (!layer) return;

    const properties = adminPropertiesFromLayer(layer);
    if (!properties && typeof layer.eachLayer === 'function') {
      layer.eachLayer(attachTerritoryLayer);
      return;
    }
    if (!properties || !properties.admin_id || !properties.admin_level) return;

    const key = territoryKey(properties.admin_level, properties.admin_id);
    adminLayersByKey.set(key, layer);
    if (layer.__territoryInteractionAttached) return;

    layer.__territoryInteractionAttached = true;
    layer.on('click', function(event) {
      if (event && event.originalEvent) L.DomEvent.stopPropagation(event.originalEvent);
      selectTerritory(layer);
    });
  }

  function attachTerritorialInteractions() {
    map.eachLayer(attachTerritoryLayer);
  }

  function refreshTerritoryPanel() {
    if (selectedTerritory) renderTerritoryPanel();
  }

  function colourForRisk(v, layer) {
    if (v === null || v === undefined || v === '') return '#888888';
    const n = parseInt(v);
    if (!isNaN(n) && layer.legend_colours && layer.legend_colours.length > 0) {
      const idx0 = Math.max(0, Math.min(layer.legend_colours.length - 1, n));
      const idx1 = Math.max(0, Math.min(layer.legend_colours.length - 1, n - 1));
      return layer.legend_colours[idx1] || layer.legend_colours[idx0] || '#888888';
    }
    return '#888888';
  }

  function riskValue(props) {
    if (!props) return null;
    const candidates = [
      'nivel', 'NIVEL', 'riesgo', 'RIESGO', 'peligro', 'PELIGRO',
      'level', 'LEVEL', 'value', 'VALUE', 'dn', 'DN', 'gridcode', 'GRIDCODE',
      'band1', 'Band1', 'BAND1'
    ];
    for (const k of candidates) {
      if (props[k] !== undefined && props[k] !== null) return props[k];
    }
    return null;
  }

  function setOverlayOpacity(value) {
    if (!currentOverlay) return;
    if (typeof currentOverlay.setOpacity === 'function') {
      currentOverlay.setOpacity(value);
    } else if (typeof currentOverlay.setStyle === 'function') {
      currentOverlay.setStyle({fillOpacity: value});
    }
  }

  function setLayer(index) {
    const parsedIndex = parseInt(index, 10);
    if (!Number.isInteger(parsedIndex) || parsedIndex < 0 || parsedIndex >= layers.length) return;
    currentLayerIndex = parsedIndex;
    currentLayerRequest += 1;
    const requestId = currentLayerRequest;

    if (currentOverlay) {
      map.removeLayer(currentOverlay);
      currentOverlay = null;
    }

    const layer = layers[currentLayerIndex];
    if (!layer) {
      updateLegend(null);
      return;
    }

    if (layer.layer_kind === 'geojson') {
      fetch(layer.url)
        .then(response => response.json())
        .then(data => {
          if (requestId !== currentLayerRequest) return;
          currentOverlay = L.geoJSON(data, {
            pane: 'aemetPane',
            style: function(feature) {
              const v = riskValue(feature.properties || {});
              return {
                color: colourForRisk(v, layer),
                weight: 0.2,
                fillColor: colourForRisk(v, layer),
                fillOpacity: currentOpacity
              };
            },
            onEachFeature: function(feature, lyr) {
              const p = feature.properties || {};
              const v = riskValue(p);
              lyr.bindTooltip('Nivel: ' + (v === null ? 'sin dato' : v));
            }
          }).addTo(map);
          if (!selectedTerritory) {
            try { map.fitBounds(currentOverlay.getBounds()); } catch(e) {
              try { map.fitBounds(layer.bounds); } catch(e2) {}
            }
          }
          updateLegend(layer);
          updateTimelineControls();
          refreshTerritoryPanel();
        })
        .catch(error => {
          if (requestId === currentLayerRequest) console.error('No se pudo cargar la capa AEMET:', error);
        });
    } else {
      currentOverlay = L.imageOverlay(layer.url, layer.bounds, {
        opacity: currentOpacity,
        interactive: false,
        pane: 'aemetPane'
      }).addTo(map);
      if (!selectedTerritory) {
        try { map.fitBounds(layer.bounds); } catch(e) {}
      }
      updateLegend(layer);
      updateTimelineControls();
      refreshTerritoryPanel();
    }
  }

  const panel = L.control({position: 'topright'});
  panel.onAdd = function(map) {
    const div = L.DomUtil.create('div', 'fire-panel');
    if (!layers || layers.length === 0) {
      div.innerHTML = '<b>Visor Fuego</b><br>No hay capas AEMET descargadas.<br><code>Rscript scripts/99_run_all.R</code>';
      return div;
    }

    let options = '';
    for (let i = 0; i < layers.length; i++) {
      options += '<option value="' + i + '">' + labelForLayer(layers[i]) + '</option>';
    }

    div.innerHTML =
      '<b>Visor Fuego</b>' +
      '<label>Capa AEMET</label>' +
      '<select id="fire-layer-select">' + options + '</select>' +
      '<div class="fire-timeline" role="group" aria-label="Navegación temporal AEMET">' +
        '<button id="fire-layer-previous" type="button" title="Día anterior" aria-label="Día anterior">&#9664;</button>' +
        '<button id="fire-layer-play" type="button" title="Reproducir la secuencia temporal" aria-label="Reproducir la secuencia temporal">&#9654;</button>' +
        '<button id="fire-layer-next" type="button" title="Día siguiente" aria-label="Día siguiente">&#9654;</button>' +
        '<span id="fire-layer-position" class="fire-layer-position">—</span>' +
      '</div>' +
      '<label>Opacidad AEMET</label>' +
      '<input id="fire-opacity" type="range" min="0" max="1" step="0.05" value="0.68" />' +
      '<div id="data-freshness" class="data-freshness" aria-live="polite"></div>' +
      '<small>Copernicus, FIRMS y límites se activan desde el control de capas de Leaflet.</small>';

    L.DomEvent.disableClickPropagation(div);
    return div;
  };
  panel.addTo(map);

  const territoryPanel = L.control({position: 'topleft'});
  territoryPanel.onAdd = function(map) {
    const div = L.DomUtil.create('div', 'territory-panel is-empty');
    div.id = 'territory-panel';
    div.innerHTML =
      '<div class="territory-panel-header"><strong>Consulta territorial</strong></div>' +
      '<div class="territory-panel-empty">Haz clic en una comunidad autónoma. Activa <em>Provincias (NUTS3)</em> para consultar una provincia.</div>';
    L.DomEvent.disableClickPropagation(div);
    L.DomEvent.disableScrollPropagation(div);
    return div;
  };
  territoryPanel.addTo(map);

  const legend = L.control({position: 'bottomright'});
  legend.onAdd = function(map) {
    const div = L.DomUtil.create('div', 'fire-legend');
    div.id = 'fire-risk-legend';
    div.innerHTML = '<b>Nivel de peligro AEMET</b><br>No disponible';
    return div;
  };
  legend.addTo(map);

  if (layers && layers.length > 0) {
    setLayer(0);

    const select = document.getElementById('fire-layer-select');
    const opacity = document.getElementById('fire-opacity');
    const previous = document.getElementById('fire-layer-previous');
    const play = document.getElementById('fire-layer-play');
    const next = document.getElementById('fire-layer-next');

    if (select) {
      select.addEventListener('change', function(e) {
        stopPlayback();
        setLayer(parseInt(e.target.value, 10));
      });
    }

    if (previous) {
      previous.addEventListener('click', function() {
        stopPlayback();
        stepLayer(-1, false);
      });
    }

    if (play) play.addEventListener('click', togglePlayback);

    if (next) {
      next.addEventListener('click', function() {
        stopPlayback();
        stepLayer(1, false);
      });
    }

    if (opacity) {
      opacity.addEventListener('input', function(e) {
        currentOpacity = parseFloat(e.target.value);
        setOverlayOpacity(currentOpacity);
      });
    }
  }

  attachTerritorialInteractions();
  updateFreshnessIndicator();
  window.setInterval(updateFreshnessIndicator, 60000);
}
)"

replace_js_token <- function(text, token, value) {
  parts <- strsplit(text, token, fixed = TRUE)[[1]]
  if (length(parts) != 2) stop("Token JavaScript no encontrado: ", token, call. = FALSE)
  paste0(parts[1], value, parts[2])
}

js <- replace_js_token(js_template, "__LAYERS_JSON__", layers_json)
js <- replace_js_token(js, "__EFFIS_BA_CONFIG__", effis_ba_config_json)
js <- replace_js_token(js, "__FRESHNESS_CONFIG__", freshness_config_json)
js <- replace_js_token(js, "__TERRITORIAL_DATA__", territorial_json)
htmlwidgets::onRender(map, js)
```


::: {.callout-note collapse="true"}
## Fuente y actualización

Este visor combina:

- **AEMET OpenData**: riesgo meteorológico de incendios previsto.
- **NASA FIRMS**: detecciones satelitales recientes de focos activos/thermal anomalies.
- **EFFIS/Copernicus EMS**: áreas quemadas y diagnóstico WMS europeo.
- **Eurostat/GISCO NUTS**: límites de CCAA y provincias para resumen territorial.

```{r}
cat("Capas AEMET:", n_layers)
if (n_layers > 0) cat(" · Fecha:", last_update, "· Catálogo:", layers_source)

cat("\nFocos NASA FIRMS:", n_firms)
if (n_firms > 0) cat(" · Catálogo:", firms_source)

cat("\nAlertas operativas:", n_alerts, "· Altas:", n_alerts_high, "· Medias:", n_alerts_medium)

cat("\nEFFIS Burnt Areas:", n_effis_ba)
if (n_effis_ba > 0) cat(" · Catálogo:", effis_ba_source)

cat("\nEFFIS WMS:", if (effis_enabled()) paste(effis_groups, collapse = ", ") else "desactivado")
if (effis_enabled() && nrow(effis_cfg) > 0) cat(" · TIME:", effis_cfg$date[1])
```
:::


## Enlaces útiles

- [Visor oficial de incendios de AEMET](https://www.aemet.es/es/eltiempo/prediccion/incendios)
- [AEMET OpenData](https://opendata.aemet.es/)
- [NASA FIRMS](https://firms.modaps.eosdis.nasa.gov/)
- [EFFIS / Copernicus EMS](https://forest-fire.emergency.copernicus.eu/)