feat(player): scale episode title font size to its length (#81)

[chhoumann]

Summary

The player rendered every episode title at a fixed 1.125rem, so long podcast titles dominated the player pane (issue #81). This reduces the base size to 1rem and eases the title size down as the title grows, toward a readable 0.875rem floor, so short titles stay comfortable and long ones stay contained.

How it works

The episode title length feeds a --title-char-count CSS custom property on the .podcast-title heading, and the font size is a clamp():

font-size: clamp(
  0.875rem,
  calc(1rem - (var(--title-char-count, 0) - 40) * 0.0025rem),
  1rem
);

• Titles up to ~40 characters render at the 1rem base.
• Beyond that, the size eases down 0.0025rem per extra character.
• It bottoms out at a readable 0.875rem floor, reached around ~90 characters.

--title-char-count is an approximate length signal (UTF-16 code units), so it only loosely tracks rendered width for non-Latin scripts. The existing word-break: break-word remains the actual mechanism that keeps any title contained.

Verification

Runtime checked in a real Obsidian instance (isolated worktree vault) with the production bundle. Measured computed font-size on .podcast-title:

Title length	Computed size
17 chars	16px (1rem base)
47 chars	15.72px (eased)
137 chars	14px (0.875rem floor)

The long title wrapped cleanly across lines, stayed centered, and did not overflow the pane.

Local gates (Node 22):

• npm run lint pass
• npm run format:check pass
• npm run typecheck pass
• npm run check:a11y pass (0 errors, 0 warnings)
• npm run build pass
• npm run test pass (486 tests)

(docs:build not run: no user-facing docs impact for a visual sizing change.)

Review

Reviewed with a multi-agent pass plus two adversarial reviewers on the opposing model. No correctness or accessibility blockers were found. Acted-on feedback: dropped the overstated "never overflow" wording in favor of an honest note that word-break is the containment backstop, removed a duplicate comment block, and kept the heading markup on a single line to match the rest of the file.

Closes #81

[cloudflare-workers-and-pages]

Deploying podnotes with    Cloudflare Pages

Latest commit:	48aa075
Status:	✅  Deploy successful!
Preview URL:	https://826dceb8.podnotes.pages.dev
Branch Preview URL:	https://chhoumann-81-title-font-size.podnotes.pages.dev

View logs