Fix/dashboard theme layout shift

[AllardQuek]

What does this PR do?

Switching between dashboard themes caused visible layout shifts across four axes: font sizes varied by up to 3px, spacing scaled by up to 40% (compact/spacious density), the rose navbar was taller due to an orphaned lineHeight: 1.7, and the cyberpunk theme caused text to wrap earlier than other themes due to extra letterSpacing: 0.02em on top of an already-wide monospace font.

The root cause was that each built-in theme independently hardcoded typography and layout values rather than inheriting from DEFAULT_TYPOGRAPHY. Divergence was silent — no single author made a wrong decision, but the values accumulated without a shared constraint.

The fix spreads DEFAULT_TYPOGRAPHY into every per-theme typography object, removing explicit overrides for baseSize, density, lineHeight (rose), and letterSpacing (cyberpunk). Layout-affecting values now default to a shared baseline; themes retain their distinct identity through palette, font family, border-radius, and stylistic typographic choices.

Related Issue

Fixes #17229

Type of Change

• 🐛 Bug fix (non-breaking change that fixes an issue)

Changes Made

• web/src/themes/presets.ts:
  • All five non-default themes now spread ...DEFAULT_TYPOGRAPHY, removing independent baseSize values and converging on 15px
  • mono, cyberpunk, rose: density changed to "comfortable" (was compact, compact, spacious)
  • rose: lineHeight: "1.7" removed — now inherits 1.55 via spread (was orphaned after density normalization, causing nav item height drift)
  • cyberpunk: letterSpacing changed from "0.02em" to "0" — extra tracking on a monospace font caused text to wrap earlier than other themes

How to Test

1. Run hermes dashboard and navigate to the Skills page — note how many skill rows are visible.
2. Open Settings → Theme and cycle through all six themes (default, midnight, ember, mono, cyberpunk, rose).
3. After each switch, confirm:
   • The number of visible skill rows does not change
   • The font size does not visibly change
   • The sidebar nav item height is consistent
   • The badge label "Dark-themed SVG architecture/cloud/infra diagrams as HTML." does not wrap in cyberpunk when it doesn't wrap in other themes
4. Confirm each theme still looks visually distinct (colors, font family, border-radius differ as expected).

Checklist

Code

• I've read the Contributing Guide
• My commit messages follow Conventional Commits (fix(scope):, feat(scope):, etc.)
• I searched for existing PRs to make sure this isn't a duplicate
• My PR contains only changes related to this fix/feature (no unrelated commits)
• I've run pytest tests/ -q and all tests pass
• I've added tests for my changes (required for bug fixes, strongly encouraged for features)
• I've tested on my platform: macOS 15

Documentation & Housekeeping

• I've updated relevant documentation (README, docs/, docstrings) — or N/A
• I've updated cli-config.yaml.example if I added/changed config keys — or N/A
• I've updated CONTRIBUTING.md or AGENTS.md if I changed architecture or workflows — or N/A
• I've considered cross-platform impact (Windows, macOS) per the compatibility guide — or N/A
• I've updated tool descriptions/schemas if I changed tool behavior — or N/A

Screenshots / Logs

Before

After

[alt-glitch]

Fixes #17229.

[AllardQuek]

Referencing the discussion here #17229 (comment), acceptance of this PR would depend on whether our direction is to have separation of concerns between visual identity (e.g. colors, fonts, corner radius) and layout density, versus opinionated themes where each theme sets their own font sizes, densities, etc.

The latest commit supports the former direction, further improving layout consistency across themes with usage of the already existing DEFAULT_LAYOUT (now the skills in the screenshot are aligned horizontally taking similar heights):