Make functional areas table clickable

It would be nice if the rows of the tables in the functional area catalogue, when clicked, took you to the functional area details page.

I'll need to

1. Add URL to the CSV
2. Wrap the column in the link syntax
3. Make the entire row clickable using javascript

Link syntax

Something like...

markdown{% set df = pd_read_csv("docs/data/fun_area_catalog.csv").fillna("") %}
{% set df = df.assign(Name=df.apply(lambda r: "[" + r["Name"] + "](" + r["url"] + ")", axis=1)) %}
{{ df | convert_to_md_table }}

Clickable tables

docs/javascripts/clickable-rows.js
jsdocument$.subscribe(function () {
  document.querySelectorAll("article table tbody tr").forEach(function (row) {
    const link = row.querySelector("a");
    if (!link) return;
    row.style.cursor = "pointer";
    row.addEventListener("click", function (e) {
      if (e.target.closest("a")) return; // let the real link behave normally
      window.location.href = link.getAttribute("href");
    });
  });
});

docs/stylesheets/clickable-rows.css:

cssarticle table tbody tr:hover {
  background-color: var(--md-default-fg-color--lightest);
}

And reference them in the zensical.toml

extra_javascript = ["javascripts/clickable-rows.js"]
extra_css = ["stylesheets/clickable-rows.css"]

Start with docs/data/fun_area_catalog.csv, docs/javascripts/clickable-rows.js, docs/stylesheets/clickable-rows.css, and zensical.toml to understand how the catalogue table is generated and assets are loaded. Confirm that each functional-area row navigates to its detail page, direct links still behave normally, and the row hover styling appears.