diff --git a/workspaces/docs/metro.config.js b/workspaces/docs/metro.config.js
index 5465f2d..40c4d31 100644
--- a/workspaces/docs/metro.config.js
+++ b/workspaces/docs/metro.config.js
@@ -5,13 +5,17 @@ const path = require('path');
 module.exports = (() => {
 	const projectRoot = __dirname;
 	const monorepoRoot = path.resolve(projectRoot, '../..');
+	const packageRoot = path.resolve(monorepoRoot, 'workspaces/package');
 
 	const config = getDefaultConfig(__dirname);
 	const { transformer, resolver } = config;
 
 	// Monorepo support: keep Metro focused on the app and hoisted dependencies.
 	// Watching the repository root makes web export crawl server/generated files.
-	config.watchFolders = [path.resolve(monorepoRoot, 'node_modules')];
+	config.watchFolders = [
+		packageRoot,
+		path.resolve(monorepoRoot, 'node_modules'),
+	];
 	config.resolver.nodeModulesPaths = [
 		path.resolve(projectRoot, 'node_modules'),
 		path.resolve(monorepoRoot, 'node_modules'),
@@ -19,6 +23,13 @@ module.exports = (() => {
 
 	const defaultResolveRequest = config.resolver.resolveRequest;
 	config.resolver.resolveRequest = (context, moduleName, platform) => {
+		if (moduleName === 'react-native-cross-elements') {
+			return {
+				type: 'sourceFile',
+				filePath: path.resolve(packageRoot, 'src/index.ts'),
+			};
+		}
+
 		if (moduleName === 'react') {
 			return {
 				type: 'sourceFile',
diff --git a/workspaces/docs/styles/app.css b/workspaces/docs/styles/app.css
index 4908a0a..13c245e 100644
--- a/workspaces/docs/styles/app.css
+++ b/workspaces/docs/styles/app.css
@@ -51,6 +51,6 @@ body {
 .docs-flat-input:-webkit-autofill:hover,
 .docs-flat-input:-webkit-autofill:focus {
 	-webkit-text-fill-color: #e4e4e7;
-	box-shadow: 0 0 0 1000px transparent inset !important;
+	-webkit-box-shadow: 0 0 0 1000px transparent inset !important;
 	transition: background-color 9999s ease-out;
 }