fix(auth): use lighter editorial typography on the login page

[AnxForever]

Summary

The login page's heavy, tightly spaced headings made Chinese and English text feel crowded. Load Playfair Display at its actual 400 weight for this page, pair it with native Chinese serif fallbacks, and use smaller headings with more breathing room. Keep body text in the site's readable UI font.

Let taller desktop registration forms expand vertically and keep mobile inputs at 16px. Authentication behavior is unchanged. Changes are limited to the login component, its scoped stylesheet, and the existing authentication test's Next font mock.

Change Type / Scope

• fix — UI Components
• No breaking changes
• No secrets, credentials, or environment files committed

Validation

• Seven login authentication tests passed.
• Isolated release checkout: 289 test files passed; 7,952 tests passed and 1 skipped.
• Production build and separate TypeScript check passed.
• Lint: zero errors; 29 existing warnings.
• Secret scan and catalog/support/product/experience/SEO checks passed.
• All seven GitHub checks passed before merge, including 112 E2E tests passed and 1 skipped.
• Four browser scenarios passed against both the production artifact and live website: Chinese desktop login at 1920px, registration at 1366px, Chinese mobile login at 390px, and English dark registration at 320px. Actual Playfair 400 loaded, no horizontal overflow or card/header/footer overlap, mobile inputs remain 16px.

Visual review

Desktop and mobile screenshots were reviewed and retained in the local release verification records. Live: https://www.stylekit.top/zh/login. Live browser checks report zero errors. These were anonymous Chromium viewport checks; no real account sign-in or email delivery was exercised. Synthetic writes and tracking requests were intercepted.

Release

Deployed successfully on 2026-10-11 (Asia/Shanghai). The merged tree matches the locally tested production artifact. The live BUILD_ID is XL2cIY6NV-bF3ywOn7T3V; all 3,416 source hashes match, the production environment is unchanged, and both the service and health watchdog are active. The previous release and static assets remain available for rollback. Unrelated analytics and developer-tools WIP was excluded.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

• Configuration used: defaults
• Review profile: CHILL
• Plan: Advanced
• Run ID: d607578d-df67-4701-bd8f-da3cd6b308c6

---

---

📥 Commits

Reviewing files that changed from the base of the PR and between 411ad52 and 886da5a.

---

---

📒 Files selected for processing (3)

• app/login/__tests__/_content.test.tsx
• app/login/_content.tsx
• app/login/login-typography.module.css

---

---

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

---

---

---

📝 Walkthrough

📝 Walkthrough

Walkthrough

The login and registration screens now use shared typography styles, including responsive title and input rules. The page and loading wrappers set lang from the active locale. Desktop page and content wrappers no longer enforce fixed viewport heights or hidden overflow.

Changes

Login typography

Layer / File(s)	Summary
Define and configure login typography app/login/login-typography.module.css, app/login/_content.tsx, app/login/__tests__/_content.test.tsx	The CSS module defines font stacks and shared typography styles, including Chinese-language overrides and mobile input sizing. Login content configures Playfair Display, and the test mocks next/font/google.
Apply typography and page attributes app/login/_content.tsx	Login, registration, and loading views use shared typography styles. The page and loading wrappers set lang from the active locale. Desktop height constraints and hidden overflow are removed.

Priority: ⬇️ Low

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

Change: Bug fix

---

---

Merge Risk: ⚪ Minimal · up to 886da

The reviewed changes update login typography and sizing; no actionable merge-blocking risk was identified in the supplied context.

Pre-merge checks | 4 | 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage		Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 2 files. (1 skipped: 1 …	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
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.
Title check		The title clearly and concisely describes the main change: lighter editorial typography on the login page.
Description check		The description explains what changed and why, identifies the change type and scope, reports validation results, addresses security and breaking changes, and provides visual review and release notes. …

---

Full details: Docstring Coverage

Explanation

Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 2 files. (1 skipped: 1 unsupported.)

---

• Fix all pre-merge checks with AI

✨ Finishing Touches 💡 1

📝 Generate docstrings 💡

• Commit to this branch
• Create a new PR

---

---

---

🧪 Generate unit tests (beta)

• Commit to this branch
• Create a new PR

---

---

---

• Autofix · 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.}