UI/UX: Align add-on dashboard with Home Assistant design conventions and theming

[DarinShapiro]

Summary
Bring the Thread Observability ingress/dashboard UI closer to Home Assistant conventions so the add-on feels native inside HA rather than like a standalone app embedded in HA.

Why

• The current add-on UI works, but it has its own visual language and interaction patterns.
• Following HA conventions should improve continuity, reduce operator friction, and make the add-on feel like part of the HA product surface.
• This likely includes using HA theme variables, spacing/typography conventions, icon usage, and interaction patterns where practical.

Scope

• Audit the current dashboard against common HA frontend conventions used in ingress panels/cards.
• Identify where we can adopt HA theme tokens/CSS variables instead of bespoke colors and styling.
• Align typography, spacing, button treatments, pills/chips, cards, form controls, and status messaging with HA patterns where practical.
• Review whether common HA components/patterns can be reused or visually mirrored in the current dashboard shell.
• Preserve product-specific visual cues only where they carry real diagnostic value.
• Keep business logic/backend payload shaping server-side; this issue is UI/UX alignment, not data-model redesign.

Examples / questions to resolve

• Can the dashboard inherit HA theme colors more directly in ingress?
• Which current components feel most out-of-family with HA: header chips, cards, graph controls, chat rail, assessment banner, tables?
• Where should we intentionally keep a custom diagnostic visual language versus matching HA exactly?
• Should this be treated as a dashboard-wide styling pass or landed incrementally by surface?

Acceptance criteria

• The dashboard follows HA visual conventions more closely for layout, color, spacing, and component treatment.
• The UI respects HA theme changes where technically practical in the ingress environment.
• Any intentionally custom styling is documented as deliberate and product-specific.
• Regression checks cover at least one themed/light-vs-dark/manual validation path.

Backlog fit

• This is adjacent to operator UX and should likely live with Bucket 1 work in documentation/08-work-buckets.md, but it may also depend on ongoing maintainability cleanup if shared UI structure needs refactoring first.