Text/Font Colour popup should be lifted directly from Frappe Writer's design

## Reported via manual QA

The popup shown for Text Colour / Font Colour should match Frappe Writer's equivalent popup exactly — not just look similar, but be lifted directly from it (layout, sizing, interaction).

## Current behavior

The Text/Font Colour control (`frontend/src/components/toolbar/groups/TextGroup.vue`) opens a popover built around the same shared `frontend/src/components/palette-right/EspressoSwatchGrid.vue` used by the Fill/Border control — a `grid-cols-6` grid of `size-5` (20px) swatches, `gap-1.5`, all 62 colours from `frontend/src/diagram/espressoPalette.js`, plus a "None" swatch and a custom-hex row.

There's a companion issue filed for the Fill/Border popup asking for a Frappe-Slides-style compact layout — this issue is specifically about the **Text/Font Colour** surface matching **Frappe Writer** instead, which may be a different target design (different app, different reference) even though both currently share the same underlying grid component. Worth checking Frappe Writer's actual text-colour popup design directly (component source or a live reference) rather than assuming the two target designs (Slides' Fill/Stroke popup vs Writer's text-colour popup) are the same — they may not be.

## Expected behavior

The Text/Font Colour popup's layout, sizing and interaction should match Frappe Writer's text-colour picker precisely.

## Where to look

- `frontend/src/components/toolbar/groups/TextGroup.vue` — the Text/Font Colour control and its popover
- `frontend/src/components/palette-right/EspressoSwatchGrid.vue` — the currently-shared grid component (may need a variant, or Frappe Writer's actual component structure may need to be referenced/imported if it exists as a reusable pattern in the frappe-ui ecosystem)
- Frappe Writer's own text-colour popup (source, if accessible in this monorepo/workspace, or a live reference) — needed to know the exact target layout

## Related
See the companion issue for the Fill/Border popup (same underlying grid component, different target reference design — Frappe Slides there, Frappe Writer here).

Start with frontend/src/components/toolbar/groups/TextGroup.vue and frontend/src/components/palette-right/EspressoSwatchGrid.vue to trace the current Text/Font Colour popover. Then inspect Frappe Writer’s text-colour popup in its source or a live reference to identify the target layout, sizing, and interactions. Done means the popup matches that reference precisely rather than the current shared grid.

Written by the indexing model from the issue text.