Gauge container should scale proportionally (not just text)

[kanfei-code-agent]

Context

PR #183 introduces a per-theme font-scale multiplier (0.85x–1.75x) that scales every text element in the UI, including SVG gauge labels. But the gauge SVGs themselves stay at their fixed pixel dimensions (width={260} height={260} etc.), so at higher scales the labels grow out of proportion to the dials they sit inside — readable but visually awkward, and at 1.5x+ the values start crowding the gauge geometry.

Desired behavior

Whole gauges (SVG + inner geometry) should scale alongside text. At 1.5x font, the gauge dial, needle, and value should all be ~1.5x as well, so the gauge stays internally proportioned.

Design direction (per Chris)

Default behavior: font scale and gauge scale are coupled — moving the font slider also scales gauges 1:1. Users can opt to decouple via an "Uncouple gauge scale" toggle near the slider, at which point a second slider appears that controls gauge size independently.

Open implementation questions

• The current PR converted SVG <text> fontSize attributes to CSS style.fontSize with calc(Npx * var(--font-scale)). If we scale the SVG container by setting width/height from a scale factor, the inner text will double-scale (once via the SVG growing, once via the CSS calc). Pick a path:
  • (a) Keep SVG text in CSS calc and only scale the SVG dimensions in the decoupled mode (the calc on inner text remains text-only)
  • (b) Revert SVG text to user-unit fontSize="N" attributes so they scale with the SVG natively, then drive everything from a single gaugeScale token that includes text
  • (c) Multiply at the call site: width={260 * gaugeScale} and fontSize={N * gaugeScale * fontScale} everywhere
• Gauge sizing also affects dashboard tile geometry (tiles have fixed sizes). At 1.5x gauges, tiles need to grow too, or gauges need to letterbox/crop. Decide tile-resize policy.
• WindCompass, BarometerDial, TemperatureGauge, HumidityGauge, SolarUVGauge, RainGauge are the six in scope. Charts (WindRose, WindHistory, HistoricalChart, TrendChart) probably want the same treatment for label/legend sizing.

Acceptance

• A user setting font scale to 1.5x sees gauges grow proportionally by default
• Toggle to decouple lets the user keep text at 1.5x but gauges at 1.0x (or vice versa)
• Existing custom themes (with only fontScale) backfill gauge scale to 1.0 / coupled
• 0.85x and 1.75x extremes don't break tile layouts on standard breakpoints (1080p / 1440p / 2160p)