Convert design tokens to Design Tokens Format Module

Following our first pass at adding design tokens using Style Dictionary and its own token format, it feels like it would be a worthwhile exercise to try and convert our tokens to follow the [W3C token format specification](https://tr.designtokens.org/format/). Whilst this is still a draft it has some benefits over Style Dictionary's format in terms of structuring and organising tokens. Existing design token tooling and design tools (like Figma) are also planning to adopt this spec once standardised so it may be beneficial to use it from the start rather than having to restructure our tokens later. Obviously there may be changes as the spec is formalised, but these are likely to be smaller than having to convert from a completely different format.

[Cobalt](https://cobalt-ui.pages.dev/) is an existing tool that uses the Design Tokens Format Module rather than its own proprietary format. It is also appears to be simpler to configure and customise than Style Dictionary so may better meet our needs.

Start by reviewing the existing design-token setup that uses Style Dictionary, then compare its token structure with the W3C Design Tokens Format Module specification and Cobalt's approach. Done means the existing tokens use the specified format and the project's token tooling still supports the required configuration and output.

Written by the indexing model from the issue text.