Fix public page width on narrow mobile screens

[mniinio]

Motivation

• Public pages (for example the design-system route) were rendering too narrowly on small devices because the layout did not guarantee the document used the device width and the global flex shell could be widened by descendant minimums.

Description

• Add an explicit mobile viewport meta content="width=device-width, initial-scale=1" in apps/site/src/layouts/BaseLayout.astro so pages render at device width on narrow screens.
• Allow the global flex shell and its main content area to shrink by adding min-width: 0; width: 100%; to .global-site-shell and min-width: 0; to .global-site-shell > main in apps/site/src/styles/global.css.
• Add a regression integration test in apps/site/test/design-system-route.integration.test.mjs that asserts the viewport meta and the new global CSS rules are present.

Testing

• Ran node --test apps/site/test/design-system-route.integration.test.mjs and the new regression test passed (all assertions in that file succeeded).
• Ran npm run test:astro-integration, which exercised many integration tests (15 passed, 7 failed) where the failures are due to missing dist artifacts because npm run build could not complete in this environment.
• Ran npm run build, which failed because Astro requires Node.js >=22.12.0 while the environment provides Node.js 20.20.2, so a production build could not be produced in this runner.
• Ran npm run lint, which surfaced pre-existing type/lint issues (reported errors and warnings) not introduced by this change.

---

Codex Task

[cloudflare-workers-and-pages]

Deploying with    Cloudflare Workers

The latest updates on your project. Learn more about integrating Git with Workers.

Status	Name	Latest Commit	Preview URL	Updated (UTC)
✅ Deployment successful! View logs	apiops-cycles-method	4e3a61e	Commit Preview URL Branch Preview URL	Jul 23 2026, 08:10 PM