Fix sidebar control font sizes overridden by the unlayered reset

[RVZO6]

Bug

The bundled, unlayered button,textarea { font: inherit } reset wins over Tailwind's layered typography utilities. In a clean Zen profile, controls render at 16px even when their size token is 13px; explicit medium weight is lost too. This is a cascade bug, not a requirement to change the user's Zen font preferences.

Fix

Use a small, scoped Firefox stylesheet with font: revert-layer, so the layered control sizes and weights apply. Keep the Chromium rem baseline at 16px without disabling normal page zoom. Declare the layer order before dependency styles can load. Generated upstream assets are unchanged, and this PR is independent of the Chrome refresh.

Validation

• pnpm test passes on this branch.
• The existing isolated Zen lifecycle test now checks actual packaged CSS: 12/13/14px buttons, 14px textarea, and medium button weight with a 20px browser font default.
• The same fixture with the old root-only workaround fails: the xs button renders at 16px and weight 430. The corrected adapter passes.
• No new test files or fixtures are added; the crucial font regression extends the existing lifecycle and bootstrap tests.

The native companion is unchanged at 1.4.12. This is a typography-only fix; responsive host sizing and the vendor refresh are separate PRs.

Summary by CodeRabbit

• Style
  • Updated typography in the Firefox sidebar, including a 16px base font size and more consistent font rendering for buttons and text areas.
• Tests
  • Added checks for sidebar font sizes and weights, text-area sizing, and stylesheet loading in Firefox.

---

Generated by GPT 6.1 Sol in Codex, using T3 Code.

Confidence Score: 5/5

No outstanding findings block merging this typography fix.

Summary

This PR restores sidebar control sizes and weights without changing generated upstream assets.

• Firefox sidebar buttons and text areas follow their declared font sizes and weights.

All three previous findings are addressed. No new actionable issues were found.

_{Reviews (2) · Last reviewed commit: "Preserve setup typography and enforce fo..." · Reviewed by Greptile}

[coderabbitai]

Warning

Review limit reached

You've used all free OSS reviews for now. Wait for the free limit to reset to keep reviewing this public repository.

Next included review available in 59 minutes.

Check out review usage here.

View limit details

Limit details: You’ve used the included review currently available.

Learn how review limits work.

Review configuration:

⚙️ Run configuration

• Configuration used: Organization UI
• Review profile: CHILL
• Plan: Advanced
• Run ID: db26dc71-942a-4c98-b886-9ae81ee6a59f

📥 Commits

Reviewing files that changed from the base of the PR and between 4a97fa8 and ca1ccc5.

📒 Files selected for processing (3)

• extension/codex-sidepanel/firefox-sidebar-typography.css
• tests/test-firefox-lifecycle-live.mjs
• tests/test-sidepanel-bootstrap.mjs

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

• Configuration used: Organization UI
• Review profile: CHILL
• Plan: Advanced
• Run ID: 948c77fd-b36d-426a-9fbf-5bf258cc9aa8

📥 Commits

Reviewing files that changed from the base of the PR and between 634eddf and 4a97fa8.

📒 Files selected for processing (4)

• extension/codex-sidepanel/firefox-sidebar-typography.css
• extension/codex-sidepanel/index.html
• tests/test-firefox-lifecycle-live.mjs
• tests/test-sidepanel-bootstrap.mjs

Included review availability: This review used your included allowance. Your plan provides up to 1 included review per hour; 0 remain after this review.

---

📝 Walkthrough

Walkthrough

The Firefox side panel sets a 16px root font size and reverts button and textarea fonts to the prior cascade layer. Bootstrap and optional Firefox lifecycle tests check the typography rules.

Changes

Firefox sidebar typography

Layer / File(s)	Summary
Define and apply sidebar typography extension/codex-sidepanel/firefox-sidebar-typography.css, extension/codex-sidepanel/index.html, tests/test-sidepanel-bootstrap.mjs	The side panel declares CSS layer order, loads typography rules, and checks the stylesheet reference, 16px font size, and revert-layer declarations.
Check typography in Firefox tests/test-firefox-lifecycle-live.mjs	The lifecycle test conditionally serves a typography fixture and checks computed font sizes and weights when the selected typography source exists. It reports whether the check ran and launches Firefox with a variable font-size preference of 20.

Priority: ⬇️ Low

Estimated code review effort: 2 (Simple) | ~10 minutes

Change: Bug fix

Suggested reviewers: sunkenintime

Merge Risk: ⚪ Minimal · up to 4a97f

No concrete merge-blocking issue is identified. Confirm runtime behavior through normal Firefox-enabled checks where configured.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Docstring Coverage		No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 2…
Linked Issues check		Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check		Check skipped because no linked issues were found for this pull request.
Description Check		Check skipped - CodeRabbit’s high-level summary is enabled.
Title check		The title clearly and concisely describes the main change: fixing sidebar control font sizes that the unlayered reset overrides.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create a new PR

• Autopilot · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[RVZO6]

Review fixes pushed in ca1ccc5.

All three review findings are addressed and their threads have replies/resolutions. Full npm test and the existing npm run test:live pass in a disposable headless Firefox 157.0.1 profile. The live fixture loads the packaged CSS and checks layered controls plus companion Copy/Try again and permission-button typography. Negative runs confirm the original stylesheet, a missing selected stylesheet, and a removed layer declaration fail.

The updated changes are ready for another review; the latest review checks are still running.