## Summary
- Refactored the TokenBar's percentage and context window display to use
a cleaner flex-based layout
- Added a centered separator dot between percentage and context window
values
- Improved visual alignment with `items-center` and consistent spacing

## Test plan
- Open a chat to view the TokenBar component
- Verify the token percentage and context window display are properly
aligned
- Check that the separator dot appears with correct styling

🤖 Generated with [Claude Code](https://claude.com/claude-code)
<!-- devin-review-badge-begin -->

---

<a href="https://app.devin.ai/review/dyad-sh/dyad/pull/2783"
target="_blank">
  <picture>
<source media="(prefers-color-scheme: dark)"
srcset="https://static.devin.ai/assets/gh-open-in-devin-review-dark.svg?v=1">
<img
src="https://static.devin.ai/assets/gh-open-in-devin-review-light.svg?v=1"
alt="Open with Devin">
  </picture>
</a>
<!-- devin-review-badge-end -->

---------
Co-authored-by: Will Chen <willchen90@gmail.com>
Co-authored-by: Claude Opus 4.5 <noreply@anthropic.com>
Co-authored-by: claude[bot] <41898282+claude[bot]@users.noreply.github.com>