Tighten responsive breakpoints at 360px and 768px

[Baskarayelu]

Summary

Audit critical screens at these breakpoints and fix overflow / cropped CTAs.

Background

This change improves the day-to-day experience for the people who consume this code (operators, downstream contracts, frontend engineers, support). It is not a strict bug, but the current behaviour forces workarounds and the proposed change removes them.

Acceptance criteria

• The change matches the summary above.
• No regression in the existing test suite.
• The change is documented where it is observable (README, docs/, public API reference).
• Lint, type-check, and tests all pass locally.
• PR description references this issue with Closes #<this-issue>.

Implementation hints

• Keep the public API surface backwards-compatible if possible. If a breaking change is unavoidable, document the migration step.
• Land any new constant in a single place (config/, consts.rs, or the equivalent) and re-use it everywhere.
• Update the relevant docs/ page in the same PR so reviewers see the docs change together with the code change.
• Add or update the corresponding test so the new behaviour is locked in.

Repo-specific notes

• Run npm run lint, npm run build, and the unit tests locally before pushing.
• If you change a public component prop, update the matching Storybook story and the docs/COMPONENTS.md entry.
• Respect the design tokens (CSS variables / Tailwind config); do not hard-code colours, spacing, or radii.

Out of scope

• Unrelated refactors in adjacent files.
• Stylistic-only changes (formatting, renaming) that are not required by the fix.
• Anything beyond the acceptance criteria above; surface follow-ups as separate issues.

How to claim and submit

1. Comment on this issue saying you'd like to take it on; wait for a maintainer to assign you (avoids duplicated effort).
2. Open a PR that references this issue (Closes #<this-issue>).
3. Make sure CI is green and request review from a CODEOWNERS maintainer.
4. PRs that close this issue and pass review may qualify for a reward — see the MAYBE REWARDED label and the GrantFox OSS campaign page.

---

Category: enhancement  ·  Campaign: GrantFox OSS · Official Campaign · Maybe Rewarded

[GBOYEE]

Hi! React/TypeScript dev here. I can implement this with tests. Please assign

[Ajibose]

@Ajibose has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

I would love to work on this

ℹ️ Repo Maintainers: To accept this application, review their application or assign @Ajibose to this issue.

[iyanumajekodunmi756]

@iyanumajekodunmi756 has applied to work on this issue as part of the Stellar Wave Program's 6th wave.

I would like to work on this issue

ℹ️ Repo Maintainers: To accept this application, review their application or assign @iyanumajekodunmi756 to this issue.

[drips-wave]

Congratulations, @iyanumajekodunmi756! 🎉 Your application was accepted by the repo's maintainers, and the issue is due on June 30, 2026.

🧑‍💻 @iyanumajekodunmi756: Please resolve the issue such that the repo's maintainers have enough time to review your contribution before the due date. You'll earn Points for completing the issue on-time, which will make you eligible for a share of the Stellar Wave Program's reward pool.

Warning

When opening a PR, please link it to this issue to ensure it gets tracked accurately. Points are awarded when this issue is marked as completed by the maintainer.

🤠 Repo maintainers: Please keep an eye on the contributor's progress and review their work before the due date. You can manage this issue, including adjusting its complexity and points, here.

🌊 Happy Wave 🌊