refactor(design-system): fold CSS prelude into styles.base.css

[visomi-dev]

Summary

The same CSS prelude (4× @fontsource/*, @import 'tailwindcss', and @custom-variant dark(...)) was duplicated across the three web app entry stylesheets: apps/web/app/src/styles.css, apps/web/site/src/styles/global.css, and apps/web/ui-designer/src/preview/preview.css. Each of them also imported styles.base.css from the workspace root, so the prelude ended up being declared in four places.

This PR folds the prelude into styles.base.css so each app stylesheet only needs to import the base and declare its own overrides. Order follows the design-system guidance (docs/agents/design-system.md): fonts first, then Tailwind, then the variant.

Changes

• styles.base.css — add 8 lines at the top: four @import '@fontsource/...';, @import 'tailwindcss';, and @custom-variant dark (&:where(.dark, .dark *));. Existing token block, utilities, and selectors unchanged.
• apps/web/app/src/styles.css — drop 8 duplicated lines, keep @import '../../../../styles.base.css'; and the app-specific html/body/button/input/textarea/select/a/.sr-only overrides.
• apps/web/site/src/styles/global.css — drop 8 duplicated lines, keep @import '../../../../../styles.base.css'; and the body transition / upward keyframes.
• apps/web/ui-designer/src/preview/preview.css — drop the local @import 'tailwindcss'; and @custom-variant, keep @import '../../../../../styles.base.css';, the local @source '../prototypes/*.html'; (preview-only), and the preview chrome overrides.

Verification

pnpm nx run app:build                   ✔ built dist/apps/web/app
pnpm nx run site:build                  ✔ built dist/apps/web/site
pnpm nx run ui-designer:build           ✔ built dist/apps/web/ui-designer
pnpm nx run ui-designer:build-css       ✔ produced dist/.../public/tailwind.css (23 @font-face + 462 --tw-* selectors)
pnpm nx run app:lint                    ✔ All files pass linting
pnpm nx run site:lint                   ✔ no errors
pnpm nx run ui-designer:lint            ✔ 0 errors (1 pre-existing warning)
pnpm nx run app-e2e:e2e                 ✔ 44/44 passed
pnpm nx run api-e2e:e2e                 ✔ 4/4 passed
pnpm nx run server-e2e:e2e              ✔ 4/4 passed
pnpm nx run worker-e2e:e2e              ✔ 1/1 passed
pnpm nx run realtime-e2e:e2e            ✔ 1/1 passed
pnpm nx run site-e2e:e2e                ✔ 2/2 passed
pnpm exec prettier --check              ✔ on the 4 changed files

Bundle inspection confirms Tailwind v4 picks up the prelude through the transitive @import chain in all three apps:

• dist/apps/web/app/browser/en/styles-*.css contains the 4 @font-family declarations (Inter, Manrope, JetBrains Mono, Material Symbols Outlined) plus --tw-* utilities.
• dist/apps/web/site/client/_astro/base-layout.*.css contains the same.
• dist/apps/web/ui-designer/public/tailwind.css contains 23 @font-face blocks and 462 --tw-* selectors.

Risks

None. Pure refactor, identical byte-content in the output bundles. Verified by inspecting the @font-face and --tw-* markers in all three output bundles.

Follow-ups (out of scope)

• The duplicated html, body { min-height: 100% } + button/input/textarea/select/a reset rules in apps/web/app/src/styles.css and apps/web/ui-designer/src/preview/preview.css could move into styles.base.css as a follow-up; intentionally not done here to keep this PR scoped to the prelude only.

🤖 Generated with opencode