diff --git a/CHANGELOG.md b/CHANGELOG.md
index 6f5887c963..508aba2f68 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -63,6 +63,16 @@ All notable changes to this project will be documented in this file.
   collapses the per-parent-dir watchers into one recursive watch rooted at the
   deepest common ancestor of the targets.
 
+- **@overeng/effect-schema-form-aria** (pilot): migrate styling from Tailwind
+  CSS v4 to StyleX (`@stylexjs/stylex`). Components consume a semantic token
+  layer (`src/tokens.stylex.ts`, exported as `tokens`) built on StyleX vars;
+  raw scales (spacing, radii, font sizes) come from `tailwind-stylex`.
+  State-dependent styling (selection) moves to React Aria render-prop
+  `className` instead of Tailwind group/data variants. Consumers import the
+  required reset from `@overeng/effect-schema-form-aria/styles.css`; the
+  publication build emits that reset and compiled component rules together.
+  Byte-identical markup baselines were regenerated with hashed StyleX class names.
+
 - **@overeng/effect-rpc-tanstack**: client request-id policy — `layerClient`
   now validates outgoing RPC request ids at the client boundary. Non-empty
   strings and non-negative, finite numbers/bigints are accepted (v4 interop);
diff --git a/genie/external.ts b/genie/external.ts
index 3ed850b539..677b06c771 100644
--- a/genie/external.ts
+++ b/genie/external.ts
@@ -351,6 +351,9 @@ export const catalog = defineCatalog({
   // Styling
   tailwindcss: '4.3.1',
   '@tailwindcss/vite': '4.3.1',
+  '@stylexjs/stylex': '0.19.0',
+  '@stylexjs/unplugin': '0.19.0',
+  'tailwind-stylex': '0.1.1',
 
   // Storybook
   storybook: '10.4.6',
@@ -443,6 +446,9 @@ export const commonPnpmPolicySettings = {
       typescript: '>=6.0.0',
       eslint: '>=10.0.0',
       vitest: '>=4.0.0',
+      // @stylexjs/unplugin@0.19 declares unplugin ^2 but works with v3;
+      // proven by the effect-schema-form-aria StyleX pilot (build + storybook).
+      unplugin: '>=3.0.0',
     },
   },
   packageImportMethod: 'auto' as const,
@@ -453,7 +459,7 @@ export const commonPnpmPolicySettings = {
   // The Effect 4 RC cohort moves fast; keep minimum-release-age strict
   // globally but let these advance immediately during the coordinated
   // migration window.
-  minimumReleaseAgeExclude: ['@types/node', ...effectV4Cohort],
+  minimumReleaseAgeExclude: ['@types/node', 'tailwind-stylex', ...effectV4Cohort],
   pmOnFail: 'ignore' as const,
   /** Disable until pnpm#10393 is resolved (install no-ops for workspace changes) */
   optimisticRepeatInstall: false as const,
diff --git a/genie/internal.ts b/genie/internal.ts
index 9d6999b44f..a35b60c2c8 100644
--- a/genie/internal.ts
+++ b/genie/internal.ts
@@ -152,9 +152,10 @@ export const commonPnpmWorkspaceData = {
   patchedDependencies: { ...effectUtilsWorkspacePatches },
   allowUnusedPatches: true as const,
   peerDependencyRules: {
+    // Merge the shared rules (e.g. `unplugin: '>=3.0.0'`) with repo-specific
+    // entries instead of shadowing them.
     allowedVersions: {
-      // bun-ffi-structs@0.2.3 (via @myobie/pty) declares typescript ^5 but the
-      // repo compiles with TS 6; resolution is proven fine.
+      ...commonPnpmPolicySettings.peerDependencyRules.allowedVersions,
       typescript: '>=6.0.0',
       eslint: '>=10.0.0',
       vitest: '>=4.0.0',
diff --git a/nix/devenv-modules/tasks/shared/tests/pnpm-source-input-refresh.integration.test.sh b/nix/devenv-modules/tasks/shared/tests/pnpm-source-input-refresh.integration.test.sh
index f438b9d861..4ce76582cf 100755
--- a/nix/devenv-modules/tasks/shared/tests/pnpm-source-input-refresh.integration.test.sh
+++ b/nix/devenv-modules/tasks/shared/tests/pnpm-source-input-refresh.integration.test.sh
@@ -32,7 +32,8 @@ printf '{"name":"fixture-root","private":true,"packageManager":"pnpm@11.8.0","de
   "$stable_stage_path" > "$workspace/package.json"
 
 install_fixture() {
-  "${pnpm_command[@]}" --dir "$workspace" install \
+  # The temporary fixture install is the behavior under test, not a workspace mutation.
+  DEVENV_TASK_PASSTHROUGH=1 "${pnpm_command[@]}" --dir "$workspace" install \
     --store-dir "$workspace/.devenv/pnpm-store" \
     --config.enable-global-virtual-store=false \
     --config.virtual-store-dir=node_modules/.pnpm \
diff --git a/nix/oxc-config-plugin.nix b/nix/oxc-config-plugin.nix
index a30bd8be82..20519a9ee2 100644
--- a/nix/oxc-config-plugin.nix
+++ b/nix/oxc-config-plugin.nix
@@ -29,7 +29,7 @@ let
     pnpm = pinnedPnpm;
   };
   packageDir = "packages/@overeng/oxc-config";
-  pnpmDepsHash = "sha256-ziA6Qj851RhfAyy7J/G2YoIBUJjVXYMGv/rT0vdSygo=";
+  pnpmDepsHash = "sha256-IO0UJfp74D+FdgMf328AgtYvjLKm32x6HQmW9gNr7L0=";
 
   srcPath =
     if builtins.isAttrs src && builtins.hasAttr "outPath" src then
diff --git a/packages/@overeng/ci-tools/nix/build.nix b/packages/@overeng/ci-tools/nix/build.nix
index d45e936519..d0b9415e53 100644
--- a/packages/@overeng/ci-tools/nix/build.nix
+++ b/packages/@overeng/ci-tools/nix/build.nix
@@ -19,7 +19,7 @@ let
     workspaceRoot = src;
     # Managed by the repo FOD refresh workflow — do not edit manually.
     depsBuilds = {
-      "." = mkSharedHash "sha256-5lXB8UByHOdKM2lfYdfV3KfFdLTCShUGRZVjcSne3u8=";
+      "." = mkSharedHash "sha256-Pxlx66Up4rzRAs2Xp36a8+kUyxgVLiBTN/phJxexMjk=";
     };
     smokeTestArgs = [ "--help" ];
     inherit gitRev commitTs dirty;
diff --git a/packages/@overeng/effect-schema-form-aria/.storybook/main.ts b/packages/@overeng/effect-schema-form-aria/.storybook/main.ts
index 2f6b73cc8d..c7dfe20e31 100644
--- a/packages/@overeng/effect-schema-form-aria/.storybook/main.ts
+++ b/packages/@overeng/effect-schema-form-aria/.storybook/main.ts
@@ -1,3 +1,3 @@
 import { createDomStorybookConfig } from '@overeng/utils/node/storybook/config'
 
-export default createDomStorybookConfig({})
+export default createDomStorybookConfig({ stylex: true })
diff --git a/packages/@overeng/effect-schema-form-aria/.storybook/preview.tsx b/packages/@overeng/effect-schema-form-aria/.storybook/preview.tsx
index 5efdabdac1..78ea54745d 100644
--- a/packages/@overeng/effect-schema-form-aria/.storybook/preview.tsx
+++ b/packages/@overeng/effect-schema-form-aria/.storybook/preview.tsx
@@ -1,11 +1,19 @@
 import type { Preview } from '@storybook/react'
+import * as stylex from '@stylexjs/stylex'
 import type { ReactNode } from 'react'
+import { spacing } from 'tailwind-stylex/tokens.stylex'
 
 import '../src/styles.css'
 
+const styles = stylex.create({
+  page: {
+    padding: spacing[4],
+  },
+})
+
 /** Wrapper providing design tokens and padding for all stories */
 const StorybookDecorator = ({ children }: { children: ReactNode }) => (
-  <div className="p-4 font-sans">{children}</div>
+  <div {...stylex.props(styles.page)}>{children}</div>
 )
 
 const preview: Preview = {
diff --git a/packages/@overeng/effect-schema-form-aria/README.md b/packages/@overeng/effect-schema-form-aria/README.md
index 3672514fad..6c336ca726 100644
--- a/packages/@overeng/effect-schema-form-aria/README.md
+++ b/packages/@overeng/effect-schema-form-aria/README.md
@@ -1,6 +1,6 @@
 # @overeng/effect-schema-form-aria
 
-Styled React Aria implementation for `@overeng/effect-schema-form`. Provides accessible, styled form components using React Aria Components and Tailwind CSS.
+Styled React Aria implementation for `@overeng/effect-schema-form`. Provides accessible, styled form components using React Aria Components and StyleX.
 
 [**Storybook**](https://overeng-effect-utils-schema-form-ar.vercel.app) - Interactive component documentation and examples
 
@@ -14,6 +14,12 @@ bun add @overeng/effect-schema-form-aria @overeng/effect-schema-form react-aria-
 
 ### Quick Start
 
+Import the package reset once in your application entry point. It preserves the form-control and box-model defaults that the components require:
+
+```tsx
+import '@overeng/effect-schema-form-aria/styles.css'
+```
+
 ```tsx
 import { AriaSchemaForm } from '@overeng/effect-schema-form-aria'
 import { Schema } from 'effect'
@@ -150,23 +156,14 @@ Automatically renders as segmented control (5 or fewer options) or dropdown (mor
 
 ## Styling
 
-Components use Tailwind CSS with semantic design tokens. Ensure your app defines these CSS variables:
-
-```css
-:root {
-  --color-ink: /* text color */;
-  --color-subtle-ink: /* secondary text */;
-  --color-muted-ink: /* muted text */;
-  --color-border: /* border color */;
-  --color-input: /* input background */;
-  --color-surface: /* surface background */;
-  --color-surface-raised: /* hover state */;
-  --color-primary: /* accent color */;
-  --color-accent: /* accent color */;
-}
+Components use StyleX with semantic variables exported as `tokens`. The package stylesheet contains only the base/reset rules required by the components; component styles are compiled from colocated `stylex.create` declarations.
+
+```tsx
+import { tokens } from '@overeng/effect-schema-form-aria'
+import '@overeng/effect-schema-form-aria/styles.css'
 ```
 
-Or customize the components by overriding the className props or creating your own renderers.
+The default semantic color values intentionally match the previous Tailwind implementation.
 
 ## Custom Renderers
 
diff --git a/packages/@overeng/effect-schema-form-aria/package.json b/packages/@overeng/effect-schema-form-aria/package.json
index 137c7539fd..97fe0f61de 100644
--- a/packages/@overeng/effect-schema-form-aria/package.json
+++ b/packages/@overeng/effect-schema-form-aria/package.json
@@ -4,35 +4,36 @@
   "private": true,
   "type": "module",
   "exports": {
-    ".": "./src/mod.ts"
+    ".": "./src/mod.ts",
+    "./styles.css": "./src/styles.css"
   },
   "publishConfig": {
     "access": "public",
     "exports": {
-      ".": "./dist/mod.js"
+      ".": "./dist/mod.js",
+      "./styles.css": "./dist/styles.css"
     }
   },
   "scripts": {
+    "build": "tsc --build tsconfig.json && vite build",
     "storybook": "storybook dev -p 6010",
     "storybook:build": "storybook build"
   },
   "dependencies": {
-    "@overeng/effect-schema-form": "workspace:^"
+    "@overeng/effect-schema-form": "workspace:^",
+    "@stylexjs/stylex": "0.19.0",
+    "tailwind-stylex": "0.1.1"
   },
   "devDependencies": {
     "@overeng/utils": "workspace:^",
     "@storybook/react": "10.4.6",
     "@storybook/react-vite": "10.4.6",
-    "@tailwindcss/vite": "4.3.1",
+    "@stylexjs/unplugin": "0.19.0",
     "@types/react": "19.2.17",
     "@types/react-dom": "19.2.3",
     "@vitejs/plugin-react": "6.0.2",
     "effect": "4.0.0-rc.111",
-    "react": "19.2.7",
-    "react-aria-components": "1.19.0",
-    "react-dom": "19.2.7",
     "storybook": "10.4.6",
-    "tailwindcss": "4.3.1",
     "typescript": "6.0.3",
     "vite": "8.0.16",
     "vitest": "4.1.9"
diff --git a/packages/@overeng/effect-schema-form-aria/package.json.genie.ts b/packages/@overeng/effect-schema-form-aria/package.json.genie.ts
index d23f2d5097..91c6c961ec 100644
--- a/packages/@overeng/effect-schema-form-aria/package.json.genie.ts
+++ b/packages/@overeng/effect-schema-form-aria/package.json.genie.ts
@@ -14,27 +14,23 @@ const runtimeDeps = catalog.compose({
   workspace: workspaceMember({ memberPath: 'packages/@overeng/effect-schema-form-aria' }),
   dependencies: {
     workspace: [schemaFormPkg],
+    external: catalog.pick('@stylexjs/stylex', 'tailwind-stylex'),
   },
   devDependencies: {
     workspace: [utilsPkg],
-    external: {
-      ...catalog.pick(
-        ...peerDepNames,
-        'effect',
-        'react',
-        '@storybook/react',
-        '@storybook/react-vite',
-        '@tailwindcss/vite',
-        '@types/react',
-        '@types/react-dom',
-        '@vitejs/plugin-react',
-        'storybook',
-        'tailwindcss',
-        'typescript',
-        'vite',
-        'vitest',
-      ),
-    },
+    external: catalog.pick(
+      'effect',
+      '@storybook/react',
+      '@storybook/react-vite',
+      '@stylexjs/unplugin',
+      '@types/react',
+      '@types/react-dom',
+      '@vitejs/plugin-react',
+      'storybook',
+      'typescript',
+      'vite',
+      'vitest',
+    ),
   },
   peerDependencies: {
     workspace: [schemaFormPkg],
@@ -48,14 +44,17 @@ export default packageJson(
     ...privatePackageDefaults,
     exports: {
       '.': exportEntry('./src/mod.ts', { environment: 'browser' }),
+      './styles.css': exportEntry('./src/styles.css', { environment: 'browser' }),
     },
     publishConfig: {
       access: 'public',
       exports: {
         '.': './dist/mod.js',
+        './styles.css': './dist/styles.css',
       },
     },
     scripts: {
+      build: 'tsc --build tsconfig.json && vite build',
       storybook: 'storybook dev -p 6010',
       'storybook:build': 'storybook build',
     },
diff --git a/packages/@overeng/effect-schema-form-aria/src/AriaSchemaForm.tsx b/packages/@overeng/effect-schema-form-aria/src/AriaSchemaForm.tsx
index 18bbbae918..fe8788e8c2 100644
--- a/packages/@overeng/effect-schema-form-aria/src/AriaSchemaForm.tsx
+++ b/packages/@overeng/effect-schema-form-aria/src/AriaSchemaForm.tsx
@@ -1,5 +1,7 @@
+import * as stylex from '@stylexjs/stylex'
 import type { Schema } from 'effect'
 import type { ReactNode } from 'react'
+import { spacing } from 'tailwind-stylex/tokens.stylex'
 
 import {
   formatLiteralLabel,
@@ -10,6 +12,13 @@ import {
 import { FieldGroup, FieldGroupEmpty } from './components/FieldGroup.tsx'
 import { ariaRenderers } from './renderers.tsx'
 
+const styles = stylex.create({
+  fieldsGrid: {
+    display: 'grid',
+    rowGap: spacing[4],
+  },
+})
+
 /** Props for AriaSchemaForm component */
 export interface AriaSchemaFormProps<T extends Record<string, unknown>> {
   /** The Effect Schema to render */
@@ -80,7 +89,12 @@ export const AriaSchemaForm = <T extends Record<string, unknown>>({
         // Render fields
         const renderedFields = (
           <div
-            className={`grid gap-4 ${tagInfo.isTagged === false || showTagHeader === false ? className : ''}`}
+            className={[
+              stylex.props(styles.fieldsGrid).className,
+              tagInfo.isTagged === false || showTagHeader === false ? className : '',
+            ]
+              .filter(Boolean)
+              .join(' ')}
           >
             {fields.map((field) => (
               <div key={field.key}>{renderField(field)}</div>
diff --git a/packages/@overeng/effect-schema-form-aria/src/components/BooleanField.tsx b/packages/@overeng/effect-schema-form-aria/src/components/BooleanField.tsx
index c97f753f7e..6dc73a12ee 100644
--- a/packages/@overeng/effect-schema-form-aria/src/components/BooleanField.tsx
+++ b/packages/@overeng/effect-schema-form-aria/src/components/BooleanField.tsx
@@ -1,9 +1,12 @@
+import * as stylex from '@stylexjs/stylex'
 import type { ReactNode } from 'react'
 import {
   CheckboxButton as AriaCheckboxButton,
   CheckboxField as AriaCheckboxField,
 } from 'react-aria-components'
+import { fontSizes, radii, spacing } from 'tailwind-stylex/tokens.stylex'
 
+import { tokens } from '../tokens.stylex.ts'
 import { FieldWrapper } from './FieldWrapper.tsx'
 
 /** Props for BooleanField component */
@@ -22,6 +25,50 @@ export interface BooleanFieldProps {
   isDisabled?: boolean | undefined
 }
 
+const styles = stylex.create({
+  root: {
+    fontSize: fontSizes.sm,
+    lineHeight: '1.25rem',
+    color: tokens.ink,
+  },
+  button: {
+    display: 'flex',
+    alignItems: 'center',
+    columnGap: spacing[2],
+    cursor: 'pointer',
+  },
+  box: {
+    width: '1rem',
+    height: '1rem',
+    flexShrink: 0,
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    borderRadius: radii.default,
+    borderWidth: 1,
+    borderStyle: 'solid',
+    borderColor: tokens.border,
+    backgroundColor: tokens.input,
+    transitionProperty: 'background-color, border-color',
+    transitionDuration: '150ms',
+  },
+  boxSelected: {
+    backgroundColor: tokens.primary,
+    borderColor: tokens.primary,
+  },
+  check: {
+    width: '0.75rem',
+    height: '0.75rem',
+    color: '#ffffff',
+    opacity: 0,
+    transitionProperty: 'opacity',
+    transitionDuration: '150ms',
+  },
+  checkVisible: {
+    opacity: 1,
+  },
+})
+
 /**
  * Accessible checkbox field using React Aria.
  */
@@ -39,13 +86,17 @@ export const BooleanField = ({
       isSelected={value}
       onChange={onChange}
       isDisabled={isDisabled}
-      className="text-sm text-ink"
+      {...stylex.props(styles.root)}
     >
-      <AriaCheckboxButton className="group flex items-center gap-2 cursor-pointer">
-        <div className="size-4 shrink-0 rounded border border-border bg-input group-data-[selected]:bg-primary group-data-[selected]:border-primary flex items-center justify-center transition-colors">
+      <AriaCheckboxButton {...stylex.props(styles.button)}>
+        <div
+          className={stylex.props(styles.box, value === true && styles.boxSelected).className ?? ''}
+        >
           <svg
             viewBox="0 0 12 12"
-            className="size-3 text-white opacity-0 group-data-[selected]:opacity-100 transition-opacity"
+            className={
+              stylex.props(styles.check, value === true && styles.checkVisible).className ?? ''
+            }
             aria-hidden="true"
           >
             <path
diff --git a/packages/@overeng/effect-schema-form-aria/src/components/FieldGroup.tsx b/packages/@overeng/effect-schema-form-aria/src/components/FieldGroup.tsx
index 218759751b..636b4e6a81 100644
--- a/packages/@overeng/effect-schema-form-aria/src/components/FieldGroup.tsx
+++ b/packages/@overeng/effect-schema-form-aria/src/components/FieldGroup.tsx
@@ -1,5 +1,9 @@
+import * as stylex from '@stylexjs/stylex'
 import type { ReactNode } from 'react'
 import { Group, Header, Text } from 'react-aria-components'
+import { fontSizes, radii, spacing } from 'tailwind-stylex/tokens.stylex'
+
+import { tokens } from '../tokens.stylex.ts'
 
 /** Props for FieldGroup component */
 export interface FieldGroupProps {
@@ -13,6 +17,60 @@ export interface FieldGroupProps {
   children: ReactNode
 }
 
+const styles = stylex.create({
+  base: {
+    borderRadius: radii.lg,
+    borderStyle: 'solid',
+    borderWidth: 1,
+  },
+  defaultVariant: {
+    borderColor: tokens.border,
+    backgroundColor: tokens.surface,
+    padding: spacing[4],
+  },
+  subtleVariant: {
+    borderColor: `color-mix(in oklab, ${tokens.border} 50%, transparent)`,
+    backgroundColor: `color-mix(in oklab, ${tokens.surface} 30%, transparent)`,
+    padding: spacing[3],
+  },
+  header: {
+    fontSize: fontSizes.sm,
+    lineHeight: '1.25rem',
+    fontWeight: 500,
+    color: tokens.ink,
+    marginBottom: spacing[3],
+  },
+  fieldsGrid: {
+    display: 'grid',
+    rowGap: spacing[4],
+  },
+})
+
+/** Styles shared with FieldGroupEmpty (subtle look). */
+export const emptyGroupStyles = stylex.create({
+  root: {
+    borderRadius: radii.lg,
+    borderWidth: 1,
+    borderStyle: 'solid',
+    borderColor: `color-mix(in oklab, ${tokens.border} 50%, transparent)`,
+    backgroundColor: `color-mix(in oklab, ${tokens.surface} 30%, transparent)`,
+    padding: spacing[3],
+  },
+  header: {
+    fontSize: fontSizes.sm,
+    lineHeight: '1.25rem',
+    fontWeight: 500,
+    color: tokens.ink,
+    marginBottom: spacing[2],
+  },
+  message: {
+    fontSize: fontSizes.xs,
+    lineHeight: '1rem',
+    fontStyle: 'italic',
+    color: tokens['subtle-ink'],
+  },
+})
+
 /**
  * Groups related form fields with an accessible header.
  * Used for tagged structs and nested field groups.
@@ -23,14 +81,18 @@ export const FieldGroup = ({
   className = '',
   children,
 }: FieldGroupProps): ReactNode => {
-  const baseClasses = 'rounded-lg border'
-  const variantClasses =
-    variant === 'subtle' ? 'border-border/50 bg-surface/30 p-3' : 'border-border bg-surface p-4'
+  const groupClassName = [
+    stylex.props(styles.base, variant === 'subtle' ? styles.subtleVariant : styles.defaultVariant)
+      .className,
+    className,
+  ]
+    .filter(Boolean)
+    .join(' ')
 
   return (
-    <Group className={`${baseClasses} ${variantClasses} ${className}`}>
-      <Header className="text-sm font-medium text-ink mb-3">{label}</Header>
-      <div className="grid gap-4">{children}</div>
+    <Group className={groupClassName}>
+      <Header {...stylex.props(styles.header)}>{label}</Header>
+      <div {...stylex.props(styles.fieldsGrid)}>{children}</div>
     </Group>
   )
 }
@@ -52,9 +114,15 @@ export const FieldGroupEmpty = ({
   label,
   message = 'No additional options',
   className = '',
-}: FieldGroupEmptyProps): ReactNode => (
-  <Group className={`rounded-lg border border-border/50 bg-surface/30 p-3 ${className}`}>
-    <Header className="text-sm font-medium text-ink mb-2">{label}</Header>
-    <Text className="text-xs text-subtle-ink italic">{message}</Text>
-  </Group>
-)
+}: FieldGroupEmptyProps): ReactNode => {
+  const rootClassName = [stylex.props(emptyGroupStyles.root).className, className]
+    .filter(Boolean)
+    .join(' ')
+
+  return (
+    <Group className={rootClassName}>
+      <Header {...stylex.props(emptyGroupStyles.header)}>{label}</Header>
+      <Text {...stylex.props(emptyGroupStyles.message)}>{message}</Text>
+    </Group>
+  )
+}
diff --git a/packages/@overeng/effect-schema-form-aria/src/components/FieldWrapper.tsx b/packages/@overeng/effect-schema-form-aria/src/components/FieldWrapper.tsx
index 19363dcb3a..22444e944d 100644
--- a/packages/@overeng/effect-schema-form-aria/src/components/FieldWrapper.tsx
+++ b/packages/@overeng/effect-schema-form-aria/src/components/FieldWrapper.tsx
@@ -1,4 +1,8 @@
+import * as stylex from '@stylexjs/stylex'
 import type { ReactNode } from 'react'
+import { spacing } from 'tailwind-stylex/tokens.stylex'
+
+import { tokens } from '../tokens.stylex.ts'
 
 /** Props for FieldWrapper component */
 export interface FieldWrapperProps {
@@ -8,13 +12,25 @@ export interface FieldWrapperProps {
   children: ReactNode
 }
 
+const styles = stylex.create({
+  root: {
+    display: 'grid',
+    rowGap: spacing['1.5'],
+  },
+  description: {
+    minHeight: '16px',
+    fontSize: '12px',
+    color: tokens['subtle-ink'],
+  },
+})
+
 /**
  * Consistent field wrapper with control row + description row.
  * Uses fixed height for description to maintain alignment across fields.
  */
 export const FieldWrapper = ({ description, children }: FieldWrapperProps): ReactNode => (
-  <div className="grid gap-1.5">
+  <div {...stylex.props(styles.root)}>
     <div>{children}</div>
-    <div className="min-h-[16px] text-[12px] text-subtle-ink">{description}</div>
+    <div {...stylex.props(styles.description)}>{description}</div>
   </div>
 )
diff --git a/packages/@overeng/effect-schema-form-aria/src/components/LiteralField.tsx b/packages/@overeng/effect-schema-form-aria/src/components/LiteralField.tsx
index 74a0b9d098..86f7848de2 100644
--- a/packages/@overeng/effect-schema-form-aria/src/components/LiteralField.tsx
+++ b/packages/@overeng/effect-schema-form-aria/src/components/LiteralField.tsx
@@ -1,3 +1,4 @@
+import * as stylex from '@stylexjs/stylex'
 import type { ReactNode } from 'react'
 import {
   Button,
@@ -10,9 +11,11 @@ import {
   ToggleButton,
   ToggleButtonGroup,
 } from 'react-aria-components'
+import { fontSizes, radii, spacing } from 'tailwind-stylex/tokens.stylex'
 
 import { formatLiteralLabel } from '@overeng/effect-schema-form'
 
+import { tokens } from '../tokens.stylex.ts'
 import { FieldWrapper } from './FieldWrapper.tsx'
 
 /** Maximum number of options before switching from segmented control to select */
@@ -38,11 +41,136 @@ export interface LiteralFieldProps {
   isDisabled?: boolean | undefined
 }
 
+const styles = stylex.create({
+  group: {
+    display: 'grid',
+    rowGap: spacing[1],
+  },
+  label: {
+    fontSize: fontSizes.sm,
+    lineHeight: '1.25rem',
+    color: tokens.ink,
+  },
+  segmentedGroup: {
+    display: 'flex',
+    borderRadius: radii.lg,
+    borderWidth: 1,
+    borderStyle: 'solid',
+    borderColor: tokens.border,
+    overflow: 'hidden',
+  },
+  segment: {
+    flexGrow: 1,
+    flexShrink: 1,
+    flexBasis: '0%',
+    paddingInline: spacing[3],
+    paddingBlock: spacing['1.5'],
+    fontSize: fontSizes.sm,
+    lineHeight: '1.25rem',
+    color: tokens.ink,
+    backgroundColor: tokens.surface,
+    borderRightWidth: 1,
+    borderRightStyle: 'solid',
+    borderRightColor: tokens.border,
+    transitionProperty: 'background-color, color',
+    transitionDuration: '150ms',
+    ':last-child': {
+      borderRightWidth: 0,
+    },
+  },
+  segmentUnselected: {
+    ':hover': {
+      backgroundColor: tokens['surface-raised'],
+    },
+  },
+  segmentSelected: {
+    backgroundColor: tokens.primary,
+    color: '#ffffff',
+  },
+  root: {
+    display: 'grid',
+    rowGap: spacing['1.5'],
+  },
+  trigger: {
+    width: '100%',
+    paddingInline: spacing['2.5'],
+    paddingBlock: spacing[2],
+    fontSize: fontSizes.sm,
+    lineHeight: '1.25rem',
+    textAlign: 'left',
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    borderRadius: radii.default,
+    borderWidth: 1,
+    borderStyle: 'solid',
+    borderColor: tokens.border,
+    backgroundColor: tokens.input,
+    color: tokens.ink,
+    outline: 'none',
+    ':focus': {
+      boxShadow: `0 0 0 1px ${tokens.primary}`,
+    },
+    ':disabled': {
+      opacity: 0.5,
+    },
+  },
+  triggerValue: {
+    flexGrow: 1,
+  },
+  chevron: {
+    width: '1rem',
+    height: '1rem',
+    color: tokens['subtle-ink'],
+  },
+  popover: {
+    width: 'var(--trigger-width)',
+    overflow: 'hidden',
+    borderRadius: radii.lg,
+    borderWidth: 1,
+    borderStyle: 'solid',
+    borderColor: tokens.border,
+    backgroundColor: tokens.surface,
+    boxShadow: '0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)',
+  },
+  listBox: {
+    outline: 'none',
+    padding: spacing[1],
+    maxHeight: 'calc(var(--spacing, 0.25rem) * 60)',
+    overflow: 'auto',
+  },
+  option: {
+    paddingInline: spacing['2.5'],
+    paddingBlock: spacing['1.5'],
+    fontSize: fontSizes.sm,
+    lineHeight: '1.25rem',
+    cursor: 'pointer',
+    borderRadius: radii.default,
+  },
+  optionUnselected: {
+    ':hover': {
+      backgroundColor: tokens['surface-raised'],
+    },
+  },
+  optionMuted: {
+    color: tokens['subtle-ink'],
+  },
+  optionInk: {
+    color: tokens.ink,
+  },
+  optionSelected: {
+    backgroundColor: tokens.primary,
+    color: '#ffffff',
+  },
+  hint: {
+    fontSize: '12px',
+    color: tokens['subtle-ink'],
+  },
+})
+
 /**
  * Literal union field.
- *
- * Renders as a segmented control for 5 or fewer options,
- * or as a select dropdown for more options.
+ * Renders a segmented toggle control for small option sets and a select dropdown for larger ones.
  */
 export const LiteralField = ({
   id,
@@ -65,8 +193,8 @@ export const LiteralField = ({
   if (segmentedOptions.length <= MAX_SEGMENTED_OPTIONS) {
     return (
       <FieldWrapper description={hint}>
-        <div className="grid gap-1">
-          {label !== undefined && <span className="text-sm text-ink">{label}</span>}
+        <div {...stylex.props(styles.group)}>
+          {label !== undefined && <span {...stylex.props(styles.label)}>{label}</span>}
           <ToggleButtonGroup
             aria-label={label ?? id}
             selectionMode="single"
@@ -76,13 +204,18 @@ export const LiteralField = ({
               onChange(selected === '' || selected === undefined ? undefined : String(selected))
             }}
             isDisabled={isDisabled}
-            className="flex rounded-lg border border-border overflow-hidden"
+            {...stylex.props(styles.segmentedGroup)}
           >
             {segmentedOptions.map((opt) => (
               <ToggleButton
                 key={opt.value}
                 id={opt.value}
-                className="flex-1 px-3 py-1.5 text-sm text-ink bg-surface hover:bg-surface-raised data-[selected]:bg-primary data-[selected]:text-white transition-colors border-r border-border last:border-r-0"
+                className={({ isSelected }) =>
+                  stylex.props(
+                    styles.segment,
+                    isSelected === true ? styles.segmentSelected : styles.segmentUnselected,
+                  ).className ?? ''
+                }
               >
                 {opt.label}
               </ToggleButton>
@@ -102,21 +235,28 @@ export const LiteralField = ({
         onChange(key === '' || key === null || key === undefined ? undefined : String(key))
       }
       isDisabled={isDisabled}
-      className="grid gap-1.5"
+      {...stylex.props(styles.root)}
     >
-      {label !== undefined && <Label className="text-sm text-ink">{label}</Label>}
-      <Button className="w-full px-2.5 py-2 text-sm rounded border border-border bg-input text-ink text-left flex items-center justify-between focus:outline-none focus:ring-1 focus:ring-primary disabled:opacity-50">
-        <SelectValue className="flex-1" />
-        <svg viewBox="0 0 16 16" className="size-4 text-subtle-ink" aria-hidden="true">
+      {label !== undefined && <Label {...stylex.props(styles.label)}>{label}</Label>}
+      <Button {...stylex.props(styles.trigger)}>
+        <SelectValue {...stylex.props(styles.triggerValue)} />
+        <svg viewBox="0 0 16 16" {...stylex.props(styles.chevron)} aria-hidden="true">
           <path d="M4 6l4 4 4-4" stroke="currentColor" strokeWidth="1.5" fill="none" />
         </svg>
       </Button>
-      <Popover className="w-[--trigger-width] overflow-hidden rounded-lg border border-border bg-surface shadow-lg">
-        <ListBox className="outline-none p-1 max-h-60 overflow-auto">
+      <Popover {...stylex.props(styles.popover)}>
+        <ListBox {...stylex.props(styles.listBox)}>
           {isOptional && (
             <ListBoxItem
               id=""
-              className="px-2.5 py-1.5 text-sm text-subtle-ink cursor-pointer rounded hover:bg-surface-raised data-[selected]:bg-primary data-[selected]:text-white"
+              textValue="— Select —"
+              className={({ isSelected }) =>
+                stylex.props(
+                  styles.option,
+                  styles.optionMuted,
+                  isSelected === true ? styles.optionSelected : styles.optionUnselected,
+                ).className ?? ''
+              }
             >
               — Select —
             </ListBoxItem>
@@ -125,14 +265,21 @@ export const LiteralField = ({
             <ListBoxItem
               key={opt.value}
               id={opt.value}
-              className="px-2.5 py-1.5 text-sm text-ink cursor-pointer rounded hover:bg-surface-raised data-[selected]:bg-primary data-[selected]:text-white"
+              textValue={opt.label}
+              className={({ isSelected }) =>
+                stylex.props(
+                  styles.option,
+                  styles.optionInk,
+                  isSelected === true ? styles.optionSelected : styles.optionUnselected,
+                ).className ?? ''
+              }
             >
               {opt.label}
             </ListBoxItem>
           ))}
         </ListBox>
       </Popover>
-      {hint !== undefined && <span className="text-[12px] text-subtle-ink">{hint}</span>}
+      {hint !== undefined && <span {...stylex.props(styles.hint)}>{hint}</span>}
     </Select>
   )
 }
diff --git a/packages/@overeng/effect-schema-form-aria/src/components/NumberField.tsx b/packages/@overeng/effect-schema-form-aria/src/components/NumberField.tsx
index 62a7914c92..e8d8d0f74d 100644
--- a/packages/@overeng/effect-schema-form-aria/src/components/NumberField.tsx
+++ b/packages/@overeng/effect-schema-form-aria/src/components/NumberField.tsx
@@ -1,6 +1,9 @@
+import * as stylex from '@stylexjs/stylex'
 import type { ReactNode } from 'react'
 import { NumberField as AriaNumberField, Input, Label, Text } from 'react-aria-components'
+import { fontSizes, radii, spacing } from 'tailwind-stylex/tokens.stylex'
 
+import { tokens } from '../tokens.stylex.ts'
 import { FieldWrapper } from './FieldWrapper.tsx'
 
 /** Props for NumberField component */
@@ -21,6 +24,87 @@ export interface NumberFieldProps {
   isDisabled?: boolean | undefined
 }
 
+const styles = stylex.create({
+  row: {
+    display: 'flex',
+    alignItems: 'center',
+    columnGap: spacing[2],
+  },
+  label: {
+    fontSize: fontSizes.sm,
+    lineHeight: '1.25rem',
+    color: tokens.ink,
+    whiteSpace: 'nowrap',
+  },
+  compactInput: {
+    width: spacing[20],
+    paddingInline: spacing[2],
+    paddingBlock: '0.125rem',
+    fontSize: fontSizes.sm,
+    lineHeight: '1.25rem',
+    borderRadius: radii.default,
+    borderWidth: 1,
+    borderStyle: 'solid',
+    borderColor: tokens.border,
+    backgroundColor: tokens.input,
+    color: tokens.ink,
+    outline: 'none',
+    ':focus': {
+      boxShadow: `0 0 0 1px ${tokens.primary}`,
+    },
+    ':disabled': {
+      opacity: 0.5,
+    },
+  },
+  toggle: {
+    width: '1rem',
+    height: '1rem',
+    flexShrink: 0,
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'center',
+    borderRadius: radii.default,
+    borderWidth: 1,
+    borderStyle: 'solid',
+    borderColor: tokens.border,
+    ':hover': {
+      backgroundColor: tokens['surface-raised'],
+    },
+    ':disabled': {
+      opacity: 0.5,
+    },
+  },
+  root: {
+    display: 'grid',
+    rowGap: spacing['1.5'],
+  },
+  input: {
+    width: '100%',
+    paddingInline: spacing['2.5'],
+    paddingBlock: spacing[2],
+    fontSize: fontSizes.sm,
+    lineHeight: '1.25rem',
+    borderRadius: radii.default,
+    borderWidth: 1,
+    borderStyle: 'solid',
+    borderColor: tokens.border,
+    backgroundColor: tokens.input,
+    color: tokens.ink,
+    outline: 'none',
+    ':focus': {
+      boxShadow: `0 0 0 1px ${tokens.primary}`,
+    },
+    ':disabled': {
+      opacity: 0.5,
+      cursor: 'not-allowed',
+    },
+  },
+  description: {
+    fontSize: '12px',
+    color: tokens['subtle-ink'],
+  },
+})
+
 /**
  * Number field component.
  *
@@ -42,8 +126,8 @@ export const NumberField = ({
   if (isOptional === true) {
     return (
       <FieldWrapper description={hint}>
-        <div className="flex items-center gap-2">
-          <label htmlFor={id} className="text-sm text-ink whitespace-nowrap">
+        <div {...stylex.props(styles.row)}>
+          <label htmlFor={id} {...stylex.props(styles.label)}>
             {label}
           </label>
           <input
@@ -55,7 +139,7 @@ export const NumberField = ({
               const target = e.target as HTMLInputElement
               onChange(target.value === '' ? undefined : Number(target.value))
             }}
-            className="w-20 px-2 py-0.5 text-sm rounded border border-border bg-input text-ink focus:outline-none focus:ring-1 focus:ring-primary disabled:opacity-50"
+            {...stylex.props(styles.compactInput)}
           />
           <button
             type="button"
@@ -64,14 +148,14 @@ export const NumberField = ({
             title={isEnabled === true ? 'Click to disable (set to undefined)' : 'Click to enable'}
             onClick={() => onChange(isEnabled === true ? undefined : 0)}
             disabled={isDisabled}
-            className="size-4 shrink-0 rounded border border-border flex items-center justify-center hover:bg-surface-raised disabled:opacity-50"
+            {...stylex.props(styles.toggle)}
           >
             {isEnabled === true ? (
               <svg
                 width="10"
                 height="10"
                 viewBox="0 0 12 12"
-                className="text-accent"
+                style={{ color: tokens.accent }}
                 aria-hidden="true"
               >
                 <path
@@ -93,18 +177,15 @@ export const NumberField = ({
   // Required field: standard number input
   return (
     <AriaNumberField
-      className="grid gap-1.5"
+      {...stylex.props(styles.root)}
       value={value ?? NaN}
       onChange={(v) => onChange(Number.isNaN(v) === true ? undefined : v)}
       isDisabled={isDisabled}
     >
-      <Label className="text-sm text-ink">{label}</Label>
-      <Input
-        id={id}
-        className="w-full px-2.5 py-2 text-sm rounded border border-border bg-input text-ink focus:outline-none focus:ring-1 focus:ring-primary disabled:opacity-50 disabled:cursor-not-allowed"
-      />
+      <Label {...stylex.props(styles.label)}>{label}</Label>
+      <Input {...stylex.props(styles.input)} id={id} />
       {hint !== undefined && (
-        <Text slot="description" className="text-[12px] text-subtle-ink">
+        <Text slot="description" {...stylex.props(styles.description)}>
           {hint}
         </Text>
       )}
diff --git a/packages/@overeng/effect-schema-form-aria/src/components/TextField.tsx b/packages/@overeng/effect-schema-form-aria/src/components/TextField.tsx
index 7ad4bc6286..e1014c1efd 100644
--- a/packages/@overeng/effect-schema-form-aria/src/components/TextField.tsx
+++ b/packages/@overeng/effect-schema-form-aria/src/components/TextField.tsx
@@ -1,5 +1,9 @@
+import * as stylex from '@stylexjs/stylex'
 import type { ReactNode } from 'react'
 import { TextField as AriaTextField, Input, Label, Text } from 'react-aria-components'
+import { fontSizes, radii, spacing } from 'tailwind-stylex/tokens.stylex'
+
+import { tokens } from '../tokens.stylex.ts'
 
 /** Props for TextField component */
 export interface TextFieldProps {
@@ -21,6 +25,46 @@ export interface TextFieldProps {
   isDisabled?: boolean | undefined
 }
 
+const styles = stylex.create({
+  root: {
+    display: 'grid',
+    rowGap: spacing['1.5'],
+  },
+  label: {
+    fontSize: fontSizes.sm,
+    lineHeight: '1.25rem',
+    color: tokens.ink,
+  },
+  input: {
+    width: '100%',
+    paddingInline: spacing['2.5'],
+    paddingBlock: spacing[2],
+    fontSize: fontSizes.sm,
+    lineHeight: '1.25rem',
+    borderRadius: radii.default,
+    borderWidth: 1,
+    borderStyle: 'solid',
+    borderColor: tokens.border,
+    backgroundColor: tokens.input,
+    color: tokens.ink,
+    outline: 'none',
+    ':focus': {
+      boxShadow: `0 0 0 1px ${tokens.primary}`,
+    },
+    '::placeholder': {
+      color: tokens['subtle-ink'],
+    },
+    ':disabled': {
+      opacity: 0.5,
+      cursor: 'not-allowed',
+    },
+  },
+  description: {
+    fontSize: '12px',
+    color: tokens['subtle-ink'],
+  },
+})
+
 /**
  * Accessible text field using React Aria.
  * Supports text, number, email, password, and url types.
@@ -35,16 +79,16 @@ export const TextField = ({
   placeholder,
   isDisabled = false,
 }: TextFieldProps): ReactNode => (
-  <AriaTextField className="grid gap-1.5" value={value} onChange={onChange} isDisabled={isDisabled}>
-    <Label className="text-sm text-ink">{label}</Label>
-    <Input
-      id={id}
-      type={type}
-      placeholder={placeholder ?? ''}
-      className="w-full px-2.5 py-2 text-sm rounded border border-border bg-input text-ink placeholder:text-subtle-ink focus:outline-none focus:ring-1 focus:ring-primary disabled:opacity-50 disabled:cursor-not-allowed"
-    />
+  <AriaTextField
+    {...stylex.props(styles.root)}
+    value={value}
+    onChange={onChange}
+    isDisabled={isDisabled}
+  >
+    <Label {...stylex.props(styles.label)}>{label}</Label>
+    <Input {...stylex.props(styles.input)} id={id} type={type} placeholder={placeholder ?? ''} />
     {hint !== undefined && (
-      <Text slot="description" className="text-[12px] text-subtle-ink">
+      <Text slot="description" {...stylex.props(styles.description)}>
         {hint}
       </Text>
     )}
diff --git a/packages/@overeng/effect-schema-form-aria/src/components/UnknownField.tsx b/packages/@overeng/effect-schema-form-aria/src/components/UnknownField.tsx
index 5eb00865b2..4ad58d642f 100644
--- a/packages/@overeng/effect-schema-form-aria/src/components/UnknownField.tsx
+++ b/packages/@overeng/effect-schema-form-aria/src/components/UnknownField.tsx
@@ -1,7 +1,11 @@
+import * as stylex from '@stylexjs/stylex'
 import type { ReactNode } from 'react'
+import { radii, spacing } from 'tailwind-stylex/tokens.stylex'
 
 import type { FieldMeta } from '@overeng/effect-schema-form'
 
+import { tokens } from '../tokens.stylex.ts'
+
 /** Props for UnknownField component */
 export interface UnknownFieldProps {
   /** The property key */
@@ -10,13 +14,35 @@ export interface UnknownFieldProps {
   meta: FieldMeta
 }
 
+const styles = stylex.create({
+  root: {
+    display: 'grid',
+    rowGap: spacing['1.5'],
+    padding: spacing[2],
+    borderWidth: 1,
+    borderStyle: 'solid',
+    borderColor: tokens.border,
+    borderRadius: radii.default,
+    backgroundColor: tokens.surface,
+  },
+  title: {
+    fontSize: '13px',
+    color: tokens['muted-ink'],
+  },
+  message: {
+    fontSize: '12px',
+    fontStyle: 'italic',
+    color: tokens['subtle-ink'],
+  },
+})
+
 /**
  * Fallback renderer for unsupported field types.
  * Shows a visual indicator that the schema type cannot be rendered.
  */
 export const UnknownField = ({ fieldKey, meta }: UnknownFieldProps): ReactNode => (
-  <div className="grid gap-1.5 p-2 border border-border rounded bg-surface">
-    <span className="text-[13px] text-muted-ink">{meta.title ?? fieldKey}</span>
-    <span className="text-[12px] text-subtle-ink italic">Unsupported schema type: {meta.type}</span>
+  <div {...stylex.props(styles.root)}>
+    <span {...stylex.props(styles.title)}>{meta.title ?? fieldKey}</span>
+    <span {...stylex.props(styles.message)}>Unsupported schema type: {meta.type}</span>
   </div>
 )
diff --git a/packages/@overeng/effect-schema-form-aria/src/mod.ts b/packages/@overeng/effect-schema-form-aria/src/mod.ts
index af9da6bc83..6541d95325 100644
--- a/packages/@overeng/effect-schema-form-aria/src/mod.ts
+++ b/packages/@overeng/effect-schema-form-aria/src/mod.ts
@@ -13,5 +13,7 @@ export { NumberField, type NumberFieldProps } from './components/NumberField.tsx
 /** Styled components for building custom field renderers */
 export { TextField, type TextFieldProps } from './components/TextField.tsx'
 export { UnknownField, type UnknownFieldProps } from './components/UnknownField.tsx'
+/** Semantic design tokens (StyleX vars) */
+export { tokens } from './tokens.stylex.ts'
 /** Field renderers for use with SchemaFormProvider */
 export { ariaRenderers } from './renderers.tsx'
diff --git a/packages/@overeng/effect-schema-form-aria/src/mod.unit.test.tsx b/packages/@overeng/effect-schema-form-aria/src/mod.unit.test.tsx
index c7535da34a..0ac5c4b646 100644
--- a/packages/@overeng/effect-schema-form-aria/src/mod.unit.test.tsx
+++ b/packages/@overeng/effect-schema-form-aria/src/mod.unit.test.tsx
@@ -43,7 +43,7 @@ describe('effect-schema-form-aria baselines (cross-major invariant)', () => {
     )
 
     expect(html).toMatchInlineSnapshot(
-      `"<div class="rounded-lg border border-border bg-surface p-4 outer" data-rac="" role="group"><header class="text-sm font-medium text-ink mb-3">Primitives &lt;世界&gt;</header><div class="grid gap-4"><div class="grid gap-1.5" data-rac="" data-disabled="true"><label class="text-sm text-ink" id="react-aria-_R_6H1_" for="react-aria-_R_6_">Email</label><input type="email" disabled="" placeholder="you@example.com" id="email" aria-labelledby="react-aria-_R_6H1_" aria-describedby="react-aria-_R_6H3_ react-aria-_R_6H4_" class="w-full px-2.5 py-2 text-sm rounded border border-border bg-input text-ink placeholder:text-subtle-ink focus:outline-none focus:ring-1 focus:ring-primary disabled:opacity-50 disabled:cursor-not-allowed" data-rac="" data-disabled="true" value=""/><span class="text-[12px] text-subtle-ink" id="react-aria-_R_6H3_" slot="description">résumé@example.com</span></div><div class="grid gap-1.5"><div><div class="text-sm text-ink" data-rac="" data-disabled="true"><label data-react-aria-pressable="true" class="group flex items-center gap-2 cursor-pointer" data-rac="" data-disabled="true"><span style="border:0;clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap"><input id="enabled" aria-describedby="react-aria-_R_q_ react-aria-_R_qH1_" disabled="" type="checkbox" data-react-aria-pressable="true"/></span><div class="size-4 shrink-0 rounded border border-border bg-input group-data-[selected]:bg-primary group-data-[selected]:border-primary flex items-center justify-center transition-colors"><svg viewBox="0 0 12 12" class="size-3 text-white opacity-0 group-data-[selected]:opacity-100 transition-opacity" aria-hidden="true"><path d="M3 6l2 2 4-5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none"></path></svg></div><span>Enabled</span></label></div></div><div class="min-h-[16px] text-[12px] text-subtle-ink"></div></div><div class="grid gap-1.5"><div><span>bare</span></div><div class="min-h-[16px] text-[12px] text-subtle-ink"></div></div></div></div>"`,
+      `"<div class="x13p3vpy x1y0btm7 xmkeg23 x1p074e9 x17o9ork xxkj7u4 outer" data-rac="" role="group"><header class="xofb7bt x8r4c90 xk50ysn x11jy40w x1j1sjht">Primitives &lt;世界&gt;</header><div class="xrvj5dj x1hejco5"><div class="xrvj5dj x1321swl" data-rac="" data-disabled="true"><label class="xofb7bt x8r4c90 x11jy40w" id="react-aria-_R_6H1_" for="react-aria-_R_6_">Email</label><input type="email" disabled="" placeholder="you@example.com" id="email" aria-labelledby="react-aria-_R_6H1_" aria-describedby="react-aria-_R_6H3_ react-aria-_R_6H4_" class="xh8yej3 x4c5rvo x1ofgve8 xofb7bt x8r4c90 x33b9pn xmkeg23 x1y0btm7 x1p074e9 xbsmrfh x11jy40w x1a2a7pz x1qhknr x1yrzk5 xijokvz x1s07b3s" data-rac="" data-disabled="true" value=""/><span class="xfifm61 x1rk8jk8" id="react-aria-_R_6H3_" slot="description">résumé@example.com</span></div><div class="xrvj5dj x1321swl"><div><div class="xofb7bt x8r4c90 x11jy40w" data-rac="" data-disabled="true"><label data-react-aria-pressable="true" class="x78zum5 x6s0dn4 x7d34b2 x1ypdohk" data-rac="" data-disabled="true"><span style="border:0;clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap"><input id="enabled" aria-describedby="react-aria-_R_q_ react-aria-_R_qH1_" disabled="" type="checkbox" data-react-aria-pressable="true"/></span><div class="xcdlrvm x1l36t39 x2lah0s x78zum5 x6s0dn4 xl56j7k x33b9pn xmkeg23 x1y0btm7 x1p074e9 xbsmrfh xts7igz xx6bhzk"><svg viewBox="0 0 12 12" class="x1jw3ynk xvle69y x1f7m26b xg01cxk x19991ni xx6bhzk" aria-hidden="true"><path d="M3 6l2 2 4-5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none"></path></svg></div><span>Enabled</span></label></div></div><div class="x1hshjfz xfifm61 x1rk8jk8"></div></div><div class="xrvj5dj x1321swl"><div><span>bare</span></div><div class="x1hshjfz xfifm61 x1rk8jk8"></div></div></div></div>"`,
     )
   })
 
@@ -76,7 +76,7 @@ describe('effect-schema-form-aria baselines (cross-major invariant)', () => {
     )
 
     expect(html).toMatchInlineSnapshot(
-      `"<div><div class="grid gap-1.5" data-rac=""><label class="text-sm text-ink" id="react-aria-_R_1H2_" for="react-aria-_R_1_">Required</label><input aria-labelledby="react-aria-_R_1H2_" id="required" type="text" autoComplete="off" inputMode="numeric" autoCorrect="off" spellCheck="false" tabindex="0" aria-describedby="react-aria-_R_1H4_ react-aria-_R_1H5_" aria-roledescription="Number field" class="w-full px-2.5 py-2 text-sm rounded border border-border bg-input text-ink focus:outline-none focus:ring-1 focus:ring-primary disabled:opacity-50 disabled:cursor-not-allowed" data-rac="" value=""/><span class="text-[12px] text-subtle-ink" id="react-aria-_R_1H4_" slot="description">NaN boundary</span></div><div class="grid gap-1.5"><div><div class="flex items-center gap-2"><label for="optional-off" class="text-sm text-ink whitespace-nowrap">Optional off</label><input id="optional-off" type="number" disabled="" class="w-20 px-2 py-0.5 text-sm rounded border border-border bg-input text-ink focus:outline-none focus:ring-1 focus:ring-primary disabled:opacity-50" value=""/><button type="button" role="switch" aria-checked="false" title="Click to enable" class="size-4 shrink-0 rounded border border-border flex items-center justify-center hover:bg-surface-raised disabled:opacity-50"></button></div></div><div class="min-h-[16px] text-[12px] text-subtle-ink"></div></div><div class="grid gap-1.5"><div><div class="flex items-center gap-2"><label for="optional-zero" class="text-sm text-ink whitespace-nowrap">Optional zero</label><input id="optional-zero" type="number" disabled="" class="w-20 px-2 py-0.5 text-sm rounded border border-border bg-input text-ink focus:outline-none focus:ring-1 focus:ring-primary disabled:opacity-50" value="0"/><button type="button" role="switch" aria-checked="true" title="Click to disable (set to undefined)" disabled="" class="size-4 shrink-0 rounded border border-border flex items-center justify-center hover:bg-surface-raised disabled:opacity-50"><svg width="10" height="10" viewBox="0 0 12 12" class="text-accent" aria-hidden="true"><path d="M3 6l2 2 4-5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none"></path></svg></button></div></div><div class="min-h-[16px] text-[12px] text-subtle-ink"></div></div></div>"`,
+      `"<div><div class="xrvj5dj x1321swl" data-rac=""><label class="xofb7bt x8r4c90 x11jy40w xuxw1ft" id="react-aria-_R_1H2_" for="react-aria-_R_1_">Required</label><input aria-labelledby="react-aria-_R_1H2_" id="required" type="text" autoComplete="off" inputMode="numeric" autoCorrect="off" spellCheck="false" tabindex="0" aria-describedby="react-aria-_R_1H4_ react-aria-_R_1H5_" aria-roledescription="Number field" class="xh8yej3 x4c5rvo x1ofgve8 xofb7bt x8r4c90 x33b9pn xmkeg23 x1y0btm7 x1p074e9 xbsmrfh x11jy40w x1a2a7pz x1qhknr xijokvz x1s07b3s" data-rac="" value=""/><span class="xfifm61 x1rk8jk8" id="react-aria-_R_1H4_" slot="description">NaN boundary</span></div><div class="xrvj5dj x1321swl"><div><div class="x78zum5 x6s0dn4 x7d34b2"><label for="optional-off" class="xofb7bt x8r4c90 x11jy40w xuxw1ft">Optional off</label><input id="optional-off" type="number" disabled="" class="x1xpqx0z x1eip5ym x1dus959 xofb7bt x8r4c90 x33b9pn xmkeg23 x1y0btm7 x1p074e9 xbsmrfh x11jy40w x1a2a7pz x1qhknr xijokvz" value=""/><button type="button" role="switch" aria-checked="false" title="Click to enable" class="xcdlrvm x1l36t39 x2lah0s x78zum5 x6s0dn4 xl56j7k x33b9pn xmkeg23 x1y0btm7 x1p074e9 xd1alm3 xijokvz"></button></div></div><div class="x1hshjfz xfifm61 x1rk8jk8"></div></div><div class="xrvj5dj x1321swl"><div><div class="x78zum5 x6s0dn4 x7d34b2"><label for="optional-zero" class="xofb7bt x8r4c90 x11jy40w xuxw1ft">Optional zero</label><input id="optional-zero" type="number" disabled="" class="x1xpqx0z x1eip5ym x1dus959 xofb7bt x8r4c90 x33b9pn xmkeg23 x1y0btm7 x1p074e9 xbsmrfh x11jy40w x1a2a7pz x1qhknr xijokvz" value="0"/><button type="button" role="switch" aria-checked="true" title="Click to disable (set to undefined)" disabled="" class="xcdlrvm x1l36t39 x2lah0s x78zum5 x6s0dn4 xl56j7k x33b9pn xmkeg23 x1y0btm7 x1p074e9 xd1alm3 xijokvz"><svg width="10" height="10" viewBox="0 0 12 12" style="color:var(--x116mk5h)" aria-hidden="true"><path d="M3 6l2 2 4-5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none"></path></svg></button></div></div><div class="x1hshjfz xfifm61 x1rk8jk8"></div></div></div>"`,
     )
   })
 
@@ -94,7 +94,7 @@ describe('effect-schema-form-aria baselines (cross-major invariant)', () => {
     )
 
     expect(html).toMatchInlineSnapshot(
-      `"<div class="grid gap-1.5"><div><div class="grid gap-1"><span class="text-sm text-ink">Role</span><div class="flex rounded-lg border border-border overflow-hidden" data-rac="" aria-label="Role" role="radiogroup" aria-orientation="horizontal" aria-disabled="false" data-orientation="horizontal"><button class="flex-1 px-3 py-1.5 text-sm text-ink bg-surface hover:bg-surface-raised data-[selected]:bg-primary data-[selected]:text-white transition-colors border-r border-border last:border-r-0" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="true" data-selected="true">—</button><button class="flex-1 px-3 py-1.5 text-sm text-ink bg-surface hover:bg-surface-raised data-[selected]:bg-primary data-[selected]:text-white transition-colors border-r border-border last:border-r-0" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="true" data-selected="true"></button><button class="flex-1 px-3 py-1.5 text-sm text-ink bg-surface hover:bg-surface-raised data-[selected]:bg-primary data-[selected]:text-white transition-colors border-r border-border last:border-r-0" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="false">Admin</button><button class="flex-1 px-3 py-1.5 text-sm text-ink bg-surface hover:bg-surface-raised data-[selected]:bg-primary data-[selected]:text-white transition-colors border-r border-border last:border-r-0" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="false">Some Value</button><button class="flex-1 px-3 py-1.5 text-sm text-ink bg-surface hover:bg-surface-raised data-[selected]:bg-primary data-[selected]:text-white transition-colors border-r border-border last:border-r-0" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="false">東京</button></div></div></div><div class="min-h-[16px] text-[12px] text-subtle-ink"></div></div>"`,
+      `"<div class="xrvj5dj x1321swl"><div><div class="xrvj5dj xp3p0lb"><span class="xofb7bt x8r4c90 x11jy40w">Role</span><div class="x78zum5 x13p3vpy xmkeg23 x1y0btm7 x1p074e9 xb3r6kr" data-rac="" aria-label="Role" role="radiogroup" aria-orientation="horizontal" aria-disabled="false" data-orientation="horizontal"><button class="x1iyjqo2 xs83m0k x1t1x2f9 x1mk5m13 x104vgks xofb7bt x8r4c90 xs1s249 x32b0ac xcojka xs2xxs2 xx6bhzk x1lpyac xr3cle6 x1f7m26b" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="true" data-selected="true">—</button><button class="x1iyjqo2 xs83m0k x1t1x2f9 x1mk5m13 x104vgks xofb7bt x8r4c90 xs1s249 x32b0ac xcojka xs2xxs2 xx6bhzk x1lpyac xr3cle6 x1f7m26b" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="true" data-selected="true"></button><button class="x1iyjqo2 xs83m0k x1t1x2f9 x1mk5m13 x104vgks xofb7bt x8r4c90 x11jy40w x17o9ork xs1s249 x32b0ac xcojka xs2xxs2 xx6bhzk x1lpyac xd1alm3" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="false">Admin</button><button class="x1iyjqo2 xs83m0k x1t1x2f9 x1mk5m13 x104vgks xofb7bt x8r4c90 x11jy40w x17o9ork xs1s249 x32b0ac xcojka xs2xxs2 xx6bhzk x1lpyac xd1alm3" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="false">Some Value</button><button class="x1iyjqo2 xs83m0k x1t1x2f9 x1mk5m13 x104vgks xofb7bt x8r4c90 x11jy40w x17o9ork xs1s249 x32b0ac xcojka xs2xxs2 xx6bhzk x1lpyac xd1alm3" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="false">東京</button></div></div></div><div class="x1hshjfz xfifm61 x1rk8jk8"></div></div>"`,
     )
   })
 
@@ -113,7 +113,7 @@ describe('effect-schema-form-aria baselines (cross-major invariant)', () => {
     )
 
     expect(html).toMatchInlineSnapshot(
-      `"<template><span class="text-[12px] text-subtle-ink">Choose</span></template><div class="grid gap-1.5" data-rac="" data-disabled="true"><button id="many" class="w-full px-2.5 py-2 text-sm rounded border border-border bg-input text-ink text-left flex items-center justify-between focus:outline-none focus:ring-1 focus:ring-primary disabled:opacity-50" data-rac="" type="button" disabled="" data-react-aria-pressable="true" aria-labelledby="react-aria-_R_2H7_ react-aria-_R_2H3_" aria-describedby="react-aria-_R_2H5_ react-aria-_R_2H6_" aria-haspopup="listbox" aria-expanded="false" data-disabled="true"><span id="react-aria-_R_2H7_" class="flex-1" data-rac="" data-placeholder="true">Select an item</span><svg viewBox="0 0 16 16" class="size-4 text-subtle-ink" aria-hidden="true"><path d="M4 6l4 4 4-4" stroke="currentColor" stroke-width="1.5" fill="none"></path></svg></button><span class="text-[12px] text-subtle-ink">Choose</span><div style="border:0;clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:fixed;width:1px;white-space:nowrap;top:0;left:0" aria-hidden="true" data-react-aria-prevent-focus="true" data-a11y-ignore="aria-hidden-focus" data-testid="hidden-select-container"><label><select tabindex="-1" disabled=""><option value="" label=" "> </option><option value="">— Select —</option><option value="one">One</option><option value="two">Two</option><option value="three">Three</option><option value="four">Four</option><option value="five">Five</option><option value="six">Six</option></select></label></div></div>"`,
+      `"<template><span class="xfifm61 x1rk8jk8">Choose</span></template><div class="xrvj5dj x1321swl" data-rac="" data-disabled="true"><button id="many" class="xh8yej3 x4c5rvo x1ofgve8 xofb7bt x8r4c90 xdpxx8g x78zum5 x6s0dn4 x1qughib x33b9pn xmkeg23 x1y0btm7 x1p074e9 xbsmrfh x11jy40w x1a2a7pz x1qhknr xijokvz" data-rac="" type="button" disabled="" data-react-aria-pressable="true" aria-labelledby="react-aria-_R_2H7_ react-aria-_R_2H3_" aria-describedby="react-aria-_R_2H5_ react-aria-_R_2H6_" aria-haspopup="listbox" aria-expanded="false" data-disabled="true"><span id="react-aria-_R_2H7_" class="x1iyjqo2" data-rac="" data-placeholder="true">Select an item</span><svg viewBox="0 0 16 16" class="xcdlrvm x1l36t39 x1rk8jk8" aria-hidden="true"><path d="M4 6l4 4 4-4" stroke="currentColor" stroke-width="1.5" fill="none"></path></svg></button><span class="xfifm61 x1rk8jk8">Choose</span><div style="border:0;clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:fixed;width:1px;white-space:nowrap;top:0;left:0" aria-hidden="true" data-react-aria-prevent-focus="true" data-a11y-ignore="aria-hidden-focus" data-testid="hidden-select-container"><label><select tabindex="-1" disabled=""><option value="" label=" "> </option><option value="">— Select —</option><option value="one">One</option><option value="two">Two</option><option value="three">Three</option><option value="four">Four</option><option value="five">Five</option><option value="six">Six</option></select></label></div></div>"`,
     )
   })
 
@@ -137,7 +137,7 @@ describe('effect-schema-form-aria baselines (cross-major invariant)', () => {
     )
 
     expect(html).toMatchInlineSnapshot(
-      `"<div><div class="grid gap-1.5 p-2 border border-border rounded bg-surface"><span class="text-[13px] text-muted-ink">items</span><span class="text-[12px] text-subtle-ink italic">Unsupported schema type: unknown</span></div><div class="rounded-lg border border-border/50 bg-surface/30 p-3 " data-rac="" role="group"><header class="text-sm font-medium text-ink mb-2">Empty Group</header><span class="text-xs text-subtle-ink italic">No additional options</span></div><div class="rounded-lg border border-border/50 bg-surface/30 p-3 extra" data-rac="" role="group"><header class="text-sm font-medium text-ink mb-2">Custom</header><span class="text-xs text-subtle-ink italic"></span></div></div>"`,
+      `"<div><div class="xrvj5dj x1321swl x1hxi7sl xmkeg23 x1y0btm7 x1p074e9 x33b9pn x17o9ork"><span class="x4z9k3i xm5lqql">items</span><span class="xfifm61 x1k4tb9n x1rk8jk8">Unsupported schema type: unknown</span></div><div class="x13p3vpy xmkeg23 x1y0btm7 xt82u6x xtwqqul x6thhyb" data-rac="" role="group"><header class="xofb7bt x8r4c90 xk50ysn x11jy40w x16xkk9h">Empty Group</header><span class="xtke9kg xl2ypbo x1k4tb9n x1rk8jk8">No additional options</span></div><div class="x13p3vpy xmkeg23 x1y0btm7 xt82u6x xtwqqul x6thhyb extra" data-rac="" role="group"><header class="xofb7bt x8r4c90 xk50ysn x11jy40w x16xkk9h">Custom</header><span class="xtke9kg xl2ypbo x1k4tb9n x1rk8jk8"></span></div></div>"`,
     )
   })
 
@@ -166,7 +166,7 @@ describe('effect-schema-form-aria baselines (cross-major invariant)', () => {
     )
 
     expect(html).toMatchInlineSnapshot(
-      `"<div class="rounded-lg border border-border/50 bg-surface/30 p-3 custom" data-rac="" role="group"><header class="text-sm font-medium text-ink mb-3">Contact Preferences</header><div class="grid gap-4"><div class="grid gap-4 "><div><div class="grid gap-1.5" data-rac=""><label class="text-sm text-ink" id="react-aria-_R_6H1_" for="react-aria-_R_6_">Name</label><input type="text" placeholder="" tabindex="0" id="schema-form-name" aria-labelledby="react-aria-_R_6H1_" aria-describedby="react-aria-_R_6H3_ react-aria-_R_6H4_" class="w-full px-2.5 py-2 text-sm rounded border border-border bg-input text-ink placeholder:text-subtle-ink focus:outline-none focus:ring-1 focus:ring-primary disabled:opacity-50 disabled:cursor-not-allowed" data-rac="" value="Ada 世界"/><span class="text-[12px] text-subtle-ink" id="react-aria-_R_6H3_" slot="description">Unicode accepted</span></div></div><div><div class="grid gap-1.5"><div><div class="flex items-center gap-2"><label for="schema-form-count" class="text-sm text-ink whitespace-nowrap">Count</label><input id="schema-form-count" type="number" disabled="" class="w-20 px-2 py-0.5 text-sm rounded border border-border bg-input text-ink focus:outline-none focus:ring-1 focus:ring-primary disabled:opacity-50" value=""/><button type="button" role="switch" aria-checked="false" title="Click to enable" class="size-4 shrink-0 rounded border border-border flex items-center justify-center hover:bg-surface-raised disabled:opacity-50"></button></div></div><div class="min-h-[16px] text-[12px] text-subtle-ink"></div></div></div><div><div class="grid gap-1.5"><div><div class="text-sm text-ink" data-rac=""><label data-react-aria-pressable="true" class="group flex items-center gap-2 cursor-pointer" data-rac=""><span style="border:0;clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap"><input id="schema-form-enabled" aria-describedby="react-aria-_R_1e_ react-aria-_R_1eH1_" type="checkbox" data-react-aria-pressable="true" tabindex="0"/></span><div class="size-4 shrink-0 rounded border border-border bg-input group-data-[selected]:bg-primary group-data-[selected]:border-primary flex items-center justify-center transition-colors"><svg viewBox="0 0 12 12" class="size-3 text-white opacity-0 group-data-[selected]:opacity-100 transition-opacity" aria-hidden="true"><path d="M3 6l2 2 4-5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none"></path></svg></div><span>enabled</span></label></div></div><div class="min-h-[16px] text-[12px] text-subtle-ink"></div></div></div><div><div class="grid gap-1.5"><div><div class="grid gap-1"><span class="text-sm text-ink">mode</span><div class="flex rounded-lg border border-border overflow-hidden" data-rac="" aria-label="mode" role="radiogroup" aria-orientation="horizontal" aria-disabled="false" data-orientation="horizontal"><button class="flex-1 px-3 py-1.5 text-sm text-ink bg-surface hover:bg-surface-raised data-[selected]:bg-primary data-[selected]:text-white transition-colors border-r border-border last:border-r-0" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="false">Email</button><button class="flex-1 px-3 py-1.5 text-sm text-ink bg-surface hover:bg-surface-raised data-[selected]:bg-primary data-[selected]:text-white transition-colors border-r border-border last:border-r-0" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="true" data-selected="true">Push Notification</button></div></div></div><div class="min-h-[16px] text-[12px] text-subtle-ink"></div></div></div><div><div class="grid gap-1.5 p-2 border border-border rounded bg-surface"><span class="text-[13px] text-muted-ink">items</span><span class="text-[12px] text-subtle-ink italic">Unsupported schema type: unknown</span></div></div></div></div></div>"`,
+      `"<div class="x13p3vpy x1y0btm7 xmkeg23 xt82u6x xtwqqul x6thhyb custom" data-rac="" role="group"><header class="xofb7bt x8r4c90 xk50ysn x11jy40w x1j1sjht">Contact Preferences</header><div class="xrvj5dj x1hejco5"><div class="xrvj5dj x1hejco5"><div><div class="xrvj5dj x1321swl" data-rac=""><label class="xofb7bt x8r4c90 x11jy40w" id="react-aria-_R_6H1_" for="react-aria-_R_6_">Name</label><input type="text" placeholder="" tabindex="0" id="schema-form-name" aria-labelledby="react-aria-_R_6H1_" aria-describedby="react-aria-_R_6H3_ react-aria-_R_6H4_" class="xh8yej3 x4c5rvo x1ofgve8 xofb7bt x8r4c90 x33b9pn xmkeg23 x1y0btm7 x1p074e9 xbsmrfh x11jy40w x1a2a7pz x1qhknr x1yrzk5 xijokvz x1s07b3s" data-rac="" value="Ada 世界"/><span class="xfifm61 x1rk8jk8" id="react-aria-_R_6H3_" slot="description">Unicode accepted</span></div></div><div><div class="xrvj5dj x1321swl"><div><div class="x78zum5 x6s0dn4 x7d34b2"><label for="schema-form-count" class="xofb7bt x8r4c90 x11jy40w xuxw1ft">Count</label><input id="schema-form-count" type="number" disabled="" class="x1xpqx0z x1eip5ym x1dus959 xofb7bt x8r4c90 x33b9pn xmkeg23 x1y0btm7 x1p074e9 xbsmrfh x11jy40w x1a2a7pz x1qhknr xijokvz" value=""/><button type="button" role="switch" aria-checked="false" title="Click to enable" class="xcdlrvm x1l36t39 x2lah0s x78zum5 x6s0dn4 xl56j7k x33b9pn xmkeg23 x1y0btm7 x1p074e9 xd1alm3 xijokvz"></button></div></div><div class="x1hshjfz xfifm61 x1rk8jk8"></div></div></div><div><div class="xrvj5dj x1321swl"><div><div class="xofb7bt x8r4c90 x11jy40w" data-rac=""><label data-react-aria-pressable="true" class="x78zum5 x6s0dn4 x7d34b2 x1ypdohk" data-rac=""><span style="border:0;clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap"><input id="schema-form-enabled" aria-describedby="react-aria-_R_1e_ react-aria-_R_1eH1_" type="checkbox" data-react-aria-pressable="true" tabindex="0"/></span><div class="xcdlrvm x1l36t39 x2lah0s x78zum5 x6s0dn4 xl56j7k x33b9pn xmkeg23 x1y0btm7 x1p074e9 xbsmrfh xts7igz xx6bhzk"><svg viewBox="0 0 12 12" class="x1jw3ynk xvle69y x1f7m26b xg01cxk x19991ni xx6bhzk" aria-hidden="true"><path d="M3 6l2 2 4-5" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" fill="none"></path></svg></div><span>enabled</span></label></div></div><div class="x1hshjfz xfifm61 x1rk8jk8"></div></div></div><div><div class="xrvj5dj x1321swl"><div><div class="xrvj5dj xp3p0lb"><span class="xofb7bt x8r4c90 x11jy40w">mode</span><div class="x78zum5 x13p3vpy xmkeg23 x1y0btm7 x1p074e9 xb3r6kr" data-rac="" aria-label="mode" role="radiogroup" aria-orientation="horizontal" aria-disabled="false" data-orientation="horizontal"><button class="x1iyjqo2 xs83m0k x1t1x2f9 x1mk5m13 x104vgks xofb7bt x8r4c90 x11jy40w x17o9ork xs1s249 x32b0ac xcojka xs2xxs2 xx6bhzk x1lpyac xd1alm3" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="false">Email</button><button class="x1iyjqo2 xs83m0k x1t1x2f9 x1mk5m13 x104vgks xofb7bt x8r4c90 xs1s249 x32b0ac xcojka xs2xxs2 xx6bhzk x1lpyac xr3cle6 x1f7m26b" data-rac="" type="button" tabindex="0" data-react-aria-pressable="true" role="radio" aria-checked="true" data-selected="true">Push Notification</button></div></div></div><div class="x1hshjfz xfifm61 x1rk8jk8"></div></div></div><div><div class="xrvj5dj x1321swl x1hxi7sl xmkeg23 x1y0btm7 x1p074e9 x33b9pn x17o9ork"><span class="x4z9k3i xm5lqql">items</span><span class="xfifm61 x1k4tb9n x1rk8jk8">Unsupported schema type: unknown</span></div></div></div></div></div>"`,
     )
   })
 
@@ -179,6 +179,6 @@ describe('effect-schema-form-aria baselines (cross-major invariant)', () => {
       />,
     )
 
-    expect(html).toMatchInlineSnapshot(`"<div class="grid gap-4 "></div>"`)
+    expect(html).toMatchInlineSnapshot(`"<div class="xrvj5dj x1hejco5"></div>"`)
   })
 })
diff --git a/packages/@overeng/effect-schema-form-aria/src/styles.css b/packages/@overeng/effect-schema-form-aria/src/styles.css
index cd71c8f5bc..5c08577d14 100644
--- a/packages/@overeng/effect-schema-form-aria/src/styles.css
+++ b/packages/@overeng/effect-schema-form-aria/src/styles.css
@@ -1,25 +1,53 @@
-@import 'tailwindcss';
+/* Base/reset layer. Component styling lives in StyleX (tokens.stylex.ts +
+ * per-component stylex.create calls); this file carries only what Tailwind's
+ * preflight used to provide implicitly. It also gives bundlers a CSS asset
+ * for StyleX CSS aggregation.
+ *
+ * Subset of Tailwind v4 preflight (MIT, tailwindlabs/tailwindcss) required
+ * for pixel parity of migrated components. If another package adopts StyleX,
+ * reuse or import this instead of re-deriving it. */
+*,
+::after,
+::before,
+::backdrop,
+::file-selector-button {
+  box-sizing: border-box;
+  margin: 0;
+  padding: 0;
+  border: 0 solid;
+}
+
+html,
+:host {
+  line-height: 1.5;
+  -webkit-text-size-adjust: 100%;
+  tab-size: 4;
+  font-family:
+    ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
+    'Noto Color Emoji';
+}
+
+body {
+  line-height: inherit;
+}
 
-:root {
-  --color-ink: #1a1a1a;
-  --color-subtle-ink: #6b7280;
-  --color-muted-ink: #9ca3af;
-  --color-border: #e5e7eb;
-  --color-input: #ffffff;
-  --color-surface: #f9fafb;
-  --color-surface-raised: #f3f4f6;
-  --color-primary: #3b82f6;
-  --color-accent: #3b82f6;
+button,
+input,
+optgroup,
+select,
+textarea {
+  font: inherit;
+  font-feature-settings: inherit;
+  font-variation-settings: inherit;
+  letter-spacing: inherit;
+  color: inherit;
+  opacity: 1;
+  background-color: transparent;
+  border-radius: 0;
 }
 
-@theme {
-  --color-ink: var(--color-ink);
-  --color-subtle-ink: var(--color-subtle-ink);
-  --color-muted-ink: var(--color-muted-ink);
-  --color-border: var(--color-border);
-  --color-input: var(--color-input);
-  --color-surface: var(--color-surface);
-  --color-surface-raised: var(--color-surface-raised);
-  --color-primary: var(--color-primary);
-  --color-accent: var(--color-accent);
+button,
+input:where([type='button'], [type='reset'], [type='submit']),
+::file-selector-button {
+  appearance: button;
 }
diff --git a/packages/@overeng/effect-schema-form-aria/src/tokens.stylex.ts b/packages/@overeng/effect-schema-form-aria/src/tokens.stylex.ts
new file mode 100644
index 0000000000..e90d1b6815
--- /dev/null
+++ b/packages/@overeng/effect-schema-form-aria/src/tokens.stylex.ts
@@ -0,0 +1,21 @@
+import * as stylex from '@stylexjs/stylex'
+
+/**
+ * Semantic design tokens for effect-schema-form-aria.
+ *
+ * Components consume only these semantic names — never raw colors or sizes.
+ * Raw scales (spacing, radii, fontSizes) come from tailwind-stylex; re-anchoring
+ * these defaults onto named scale steps is a follow-up design decision that
+ * must not require component changes.
+ */
+export const tokens = stylex.defineVars({
+  ink: '#1a1a1a',
+  'subtle-ink': '#6b7280',
+  'muted-ink': '#9ca3af',
+  border: '#e5e7eb',
+  input: '#ffffff',
+  surface: '#f9fafb',
+  'surface-raised': '#f3f4f6',
+  primary: '#3b82f6',
+  accent: '#3b82f6',
+})
diff --git a/packages/@overeng/effect-schema-form-aria/tsconfig.json b/packages/@overeng/effect-schema-form-aria/tsconfig.json
index db8e55ede3..7537451b98 100644
--- a/packages/@overeng/effect-schema-form-aria/tsconfig.json
+++ b/packages/@overeng/effect-schema-form-aria/tsconfig.json
@@ -42,7 +42,7 @@
       }
     ],
     "composite": true,
-    "rootDir": ".",
+    "rootDir": "./src",
     "tsBuildInfoFile": "./dist/tsconfig.tsbuildinfo",
     "jsx": "react-jsx"
   },
diff --git a/packages/@overeng/effect-schema-form-aria/tsconfig.json.genie.ts b/packages/@overeng/effect-schema-form-aria/tsconfig.json.genie.ts
index 2f9a3d4585..d259e12cbb 100644
--- a/packages/@overeng/effect-schema-form-aria/tsconfig.json.genie.ts
+++ b/packages/@overeng/effect-schema-form-aria/tsconfig.json.genie.ts
@@ -11,6 +11,7 @@ export default tsconfigJson({
     ...baseTsconfigCompilerOptions,
     ...packageTsconfigCompilerOptions,
     ...reactJsx,
+    rootDir: './src',
     lib: [...domLib],
   },
   include: ['src/**/*'],
diff --git a/packages/@overeng/effect-schema-form-aria/vite.config.ts b/packages/@overeng/effect-schema-form-aria/vite.config.ts
index 888ede1123..429028c870 100644
--- a/packages/@overeng/effect-schema-form-aria/vite.config.ts
+++ b/packages/@overeng/effect-schema-form-aria/vite.config.ts
@@ -1,7 +1,44 @@
-import tailwindcss from '@tailwindcss/vite'
+import { unplugin as stylex } from '@stylexjs/unplugin'
 import react from '@vitejs/plugin-react'
-import { defineConfig } from 'vite'
+import { defineConfig, type Plugin } from 'vite'
+
+const publicationEntry = new URL('./src/mod.ts', import.meta.url).pathname
+const resetStylesheet = new URL('./src/styles.css', import.meta.url).pathname
+
+const includePublicationReset = {
+  name: 'effect-schema-form-aria:publication-reset',
+  apply: 'build',
+  enforce: 'pre',
+  // oxlint-disable-next-line overeng/named-args -- Vite's Plugin transform hook has a fixed positional signature.
+  transform: (code, id) =>
+    id === publicationEntry
+      ? { code: `import ${JSON.stringify(resetStylesheet)}\n${code}`, map: null }
+      : undefined,
+} satisfies Plugin
 
 export default defineConfig({
-  plugins: [react(), tailwindcss()],
+  plugins: [
+    includePublicationReset,
+    stylex.vite({ externalPackages: ['tailwind-stylex'] }),
+    react(),
+  ],
+  build: {
+    emptyOutDir: false,
+    lib: {
+      entry: publicationEntry,
+      formats: ['es'],
+      fileName: 'mod',
+      cssFileName: 'styles',
+    },
+    rollupOptions: {
+      external: [
+        /^@overeng\/effect-schema-form(?:\/|$)/,
+        /^@stylexjs\/stylex(?:\/|$)/,
+        /^effect(?:\/|$)/,
+        /^react(?:\/|$)/,
+        /^react-aria-components(?:\/|$)/,
+      ],
+    },
+    sourcemap: true,
+  },
 })
diff --git a/packages/@overeng/effect-schema-form-aria/vitest.config.ts b/packages/@overeng/effect-schema-form-aria/vitest.config.ts
index 6b501f392c..53bb265e15 100644
--- a/packages/@overeng/effect-schema-form-aria/vitest.config.ts
+++ b/packages/@overeng/effect-schema-form-aria/vitest.config.ts
@@ -1,8 +1,16 @@
+import { unplugin as stylex } from '@stylexjs/unplugin'
+import react from '@vitejs/plugin-react'
 import { defineConfig } from 'vitest/config'
 
-// The root project config does not resolve correctly from this package task's cwd.
+// StyleX styles are compiled away at build time, so unit tests that render
+// components need the same transform the bundler applies. The token package
+// ships uncompiled StyleX source and must be inlined so the plugin can
+// transform it.
 export default defineConfig({
+  plugins: [stylex.vite({ externalPackages: ['tailwind-stylex'] }), react()],
+  ssr: { noExternal: ['tailwind-stylex'] },
   test: {
-    include: ['src/**/*.unit.test.ts', 'src/**/*.unit.test.tsx'],
+    exclude: ['**/dist/**', '**/node_modules/**'],
+    server: { deps: { inline: ['@effect/vitest'] } },
   },
 })
diff --git a/packages/@overeng/genie/nix/build.nix b/packages/@overeng/genie/nix/build.nix
index 117a1c71f0..26b0b99e91 100644
--- a/packages/@overeng/genie/nix/build.nix
+++ b/packages/@overeng/genie/nix/build.nix
@@ -26,7 +26,7 @@ let
     workspaceRoot = src;
     # Managed by the repo FOD refresh workflow — do not edit manually.
     depsBuilds = {
-      "." = mkSharedHash "sha256-J0yUHnU6yMx4qPOvmJUdI18dfF8BBJ3nJqcGw/4lH54=";
+      "." = mkSharedHash "sha256-sszG2PkPQLyYX7o5EJPnH7mPUvMqDrSglVMx9BtwOM4=";
     };
     nativeNodePackages = opentuiCoreNative.packages;
     inherit gitRev commitTs dirty;
diff --git a/packages/@overeng/megarepo/nix/build.nix b/packages/@overeng/megarepo/nix/build.nix
index e847d51b08..9b66092668 100644
--- a/packages/@overeng/megarepo/nix/build.nix
+++ b/packages/@overeng/megarepo/nix/build.nix
@@ -24,7 +24,7 @@ let
     workspaceRoot = src;
     # Managed by the repo FOD refresh workflow — do not edit manually.
     depsBuilds = {
-      "." = mkSharedHash "sha256-JJJ+hhyzFMNd5wKyALJQBVXngk2Ylfy6DLlBvmCyE2o=";
+      "." = mkSharedHash "sha256-VeOwCek8452/uHVBRt2BF/fmUamfQtpoEnJ8HP137IU=";
     };
     nativeNodePackages = opentuiCoreNative.packages;
     smokeTestArgs = [ "--help" ];
diff --git a/packages/@overeng/notion-cli/nix/build.nix b/packages/@overeng/notion-cli/nix/build.nix
index f2b77906a8..361e05fe77 100644
--- a/packages/@overeng/notion-cli/nix/build.nix
+++ b/packages/@overeng/notion-cli/nix/build.nix
@@ -33,7 +33,7 @@ let
     installRuntimeWorkspace = true;
     # Managed by the repo FOD refresh workflow — do not edit manually.
     depsBuilds = {
-      "." = mkSharedHash "sha256-aAe1XrnUtBQ2nHwkyHQP4NtMGTot3zPnCw+pWMA6VXw=";
+      "." = mkSharedHash "sha256-S5vHlu4oebOos4rD6Hn9skWl/Fs4bmZtoIAuqVUaDTY=";
     };
     nativeNodePackages = opentuiCoreNative.packages;
     inherit gitRev commitTs dirty;
diff --git a/packages/@overeng/notion-md/nix/build.nix b/packages/@overeng/notion-md/nix/build.nix
index f2f2349a5c..140f966598 100644
--- a/packages/@overeng/notion-md/nix/build.nix
+++ b/packages/@overeng/notion-md/nix/build.nix
@@ -20,7 +20,7 @@ let
     workspaceRoot = src;
     # Managed by the repo FOD refresh workflow — do not edit manually.
     depsBuilds = {
-      "." = mkSharedHash "sha256-r7cRvEZXiiMF0keqA/SL5mKMxU8fPmIM6Q3tpbNJTRI=";
+      "." = mkSharedHash "sha256-4Q4C7/D14vwwxkhi6RELaDwkEiPY8cSLEb1Cw4/weD4=";
     };
     smokeTestArgs = [ "--help" ];
     inherit gitRev commitTs dirty;
diff --git a/packages/@overeng/npm-release/nix/build.nix b/packages/@overeng/npm-release/nix/build.nix
index 22fd24e5dc..b641f9e952 100644
--- a/packages/@overeng/npm-release/nix/build.nix
+++ b/packages/@overeng/npm-release/nix/build.nix
@@ -20,7 +20,7 @@ let
     workspaceRoot = src;
     # Managed by the repo FOD refresh workflow — do not edit manually.
     depsBuilds = {
-      "." = mkSharedHash "sha256-sVdFxuhHf+CAUvCEE0jLxzI2scjS54zVXBzYXcflm2Y=";
+      "." = mkSharedHash "sha256-LnpxdiPD0Yju+14FFlhi7BwziMO3ly1V8gTI3WeGd90=";
     };
     smokeTestArgs = [ "--help" ];
     inherit gitRev commitTs dirty;
diff --git a/packages/@overeng/tui-stories/nix/build.nix b/packages/@overeng/tui-stories/nix/build.nix
index 4e1b549149..db64990c1a 100644
--- a/packages/@overeng/tui-stories/nix/build.nix
+++ b/packages/@overeng/tui-stories/nix/build.nix
@@ -21,7 +21,7 @@ let
     workspaceRoot = src;
     # Managed by the repo FOD refresh workflow — do not edit manually.
     depsBuilds = {
-      "." = mkSharedHash "sha256-b3oG3HSzjSaCGLFJuVS5/AbO1WiM9rYoiQEW3uvd+W8=";
+      "." = mkSharedHash "sha256-WhGtQktuPZ25tySU4NhAmA2pKGAmnVY2kQrjUvjJpXE=";
     };
     nativeNodePackages = opentuiCoreNative.packages;
     inherit gitRev commitTs dirty;
diff --git a/packages/@overeng/utils/package.json b/packages/@overeng/utils/package.json
index 3824710c0c..65ef734f97 100644
--- a/packages/@overeng/utils/package.json
+++ b/packages/@overeng/utils/package.json
@@ -52,6 +52,7 @@
     "@opentelemetry/api": "1.9.1",
     "@overeng/effect-distributed-lock": "workspace:^",
     "@overeng/otel-contract": "workspace:^",
+    "@stylexjs/unplugin": "0.19.0",
     "effect": "4.0.0-rc.111",
     "vitest": "4.1.9"
   },
diff --git a/packages/@overeng/utils/package.json.genie.ts b/packages/@overeng/utils/package.json.genie.ts
index eb3074f38c..001806db02 100644
--- a/packages/@overeng/utils/package.json.genie.ts
+++ b/packages/@overeng/utils/package.json.genie.ts
@@ -24,7 +24,7 @@ const runtimeDeps = catalog.compose({
   workspace: workspaceMember({ memberPath: 'packages/@overeng/utils' }),
   dependencies: {
     workspace: [effectDistributedLockPkg, otelContractPkg],
-    external: catalog.pick('@noble/hashes', '@opentelemetry/api'),
+    external: catalog.pick('@noble/hashes', '@opentelemetry/api', '@stylexjs/unplugin'),
   },
   devDependencies: {
     workspace: [utilsDevPkg],
diff --git a/packages/@overeng/utils/src/node/storybook/config/mod.ts b/packages/@overeng/utils/src/node/storybook/config/mod.ts
index 8e0d7615df..3f19ef9528 100644
--- a/packages/@overeng/utils/src/node/storybook/config/mod.ts
+++ b/packages/@overeng/utils/src/node/storybook/config/mod.ts
@@ -9,6 +9,7 @@
  */
 
 import type { StorybookConfig } from '@storybook/react-vite'
+import { unplugin as stylex } from '@stylexjs/unplugin'
 import type { InlineConfig } from 'vite'
 
 type StorybookViteFinal<TConfig extends object> = (config: TConfig) => TConfig | Promise<TConfig>
@@ -21,6 +22,8 @@ export interface DomStorybookConfigOptions {
   addons?: StorybookConfig['addons']
   /** Disable minification (useful for react-inspector to preserve function names) */
   disableMinify?: boolean
+  /** Enable the StyleX Vite plugin (`@stylexjs/unplugin`) for StyleX-based styling */
+  stylex?: boolean
 }
 
 /** Use when the consuming workspace needs its own local Vite config type for `viteFinal`. */
@@ -108,6 +111,7 @@ export const createDomStorybookConfig: CreateDomStorybookConfig = <TConfig exten
     stories = ['../src/**/*.stories.@(ts|tsx)'],
     addons,
     disableMinify = false,
+    stylex: enableStylex = false,
     viteFinal,
   } = options
 
@@ -125,6 +129,16 @@ export const createDomStorybookConfig: CreateDomStorybookConfig = <TConfig exten
         typedConfig.build = { minify: false }
       }
 
+      if (enableStylex === true) {
+        // `externalPackages` is supported at runtime (unplugin core destructures it)
+        // but missing from @stylexjs/unplugin@0.19 UserOptions typings; required so
+        // tailwind-stylex token modules compile instead of being bundled raw.
+        const stylexOptions = {
+          externalPackages: ['tailwind-stylex'],
+        } as Parameters<typeof stylex.vite>[0]
+        typedConfig.plugins = [stylex.vite(stylexOptions), ...(typedConfig.plugins ?? [])]
+      }
+
       return callUserViteFinal({ config: typedConfig, viteFinal })
     },
   } satisfies StorybookConfig
diff --git a/packages/@overeng/utils/src/node/storybook/config/mod.unit.test.ts b/packages/@overeng/utils/src/node/storybook/config/mod.unit.test.ts
new file mode 100644
index 0000000000..51b920021d
--- /dev/null
+++ b/packages/@overeng/utils/src/node/storybook/config/mod.unit.test.ts
@@ -0,0 +1,36 @@
+import { expect } from 'vitest'
+
+import { Vitest } from '@overeng/utils-dev/node-vitest'
+
+import { shouldNeverHappen } from '../../../isomorphic/core.ts'
+import { createDomStorybookConfig } from './mod.ts'
+
+const runViteFinal = async (stylex: boolean) => {
+  const existingPlugin = { name: 'existing' }
+  const viteFinal = createDomStorybookConfig({ stylex }).viteFinal
+
+  if (viteFinal === undefined) {
+    return shouldNeverHappen('Expected createDomStorybookConfig to define viteFinal')
+  }
+
+  const config = { plugins: [existingPlugin] } as Parameters<typeof viteFinal>[0]
+  const options = {} as Parameters<typeof viteFinal>[1]
+  const result = await viteFinal(config, options)
+
+  return { existingPlugin, result }
+}
+
+Vitest.describe('createDomStorybookConfig', () => {
+  Vitest.it('leaves the plugin list unchanged when StyleX is disabled', async () => {
+    const { existingPlugin, result } = await runViteFinal(false)
+
+    expect(result.plugins).toEqual([existingPlugin])
+  })
+
+  Vitest.it('prepends the StyleX plugin when explicitly enabled', async () => {
+    const { existingPlugin, result } = await runViteFinal(true)
+
+    expect(result.plugins).toHaveLength(2)
+    expect(result.plugins?.[1]).toBe(existingPlugin)
+  })
+})
diff --git a/pnpm-install-contract.json b/pnpm-install-contract.json
index c67d06f50a..f6498548ac 100644
--- a/pnpm-install-contract.json
+++ b/pnpm-install-contract.json
@@ -27,6 +27,7 @@
     "ignoreScripts": true,
     "minimumReleaseAgeExclude": [
       "@types/node",
+      "tailwind-stylex",
       "effect",
       "@effect/platform-node",
       "@effect/vitest",
@@ -48,6 +49,7 @@
       "allowedVersions": {
         "eslint": ">=10.0.0",
         "typescript": ">=6.0.0",
+        "unplugin": ">=3.0.0",
         "vitest": ">=4.0.0"
       }
     },
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 6afb591c68..95e084dfcf 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -37,7 +37,7 @@ importers:
         version: 0.4.1(typescript@6.0.3)(web-tree-sitter@0.25.10)
       '@opentui/react':
         specifier: 0.4.1
-        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.0)
+        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.3)
       effect:
         specifier: 4.0.0-rc.111
         version: 4.0.0-rc.111
@@ -377,6 +377,21 @@ importers:
       '@overeng/effect-schema-form':
         specifier: workspace:^
         version: link:../effect-schema-form
+      '@stylexjs/stylex':
+        specifier: 0.19.0
+        version: 0.19.0
+      react:
+        specifier: ^19.2.7
+        version: 19.2.7
+      react-aria-components:
+        specifier: ^1.19.0
+        version: 1.19.0(react-dom@19.2.7(react@19.2.7))(react@19.2.7)
+      react-dom:
+        specifier: ^19.2.7
+        version: 19.2.7(react@19.2.7)
+      tailwind-stylex:
+        specifier: 0.1.1
+        version: 0.1.1(@stylexjs/stylex@0.19.0)
     devDependencies:
       '@overeng/utils':
         specifier: workspace:^
@@ -387,9 +402,9 @@ importers:
       '@storybook/react-vite':
         specifier: 10.4.6
         version: 10.4.6(@types/react-dom@19.2.3(@types/react@19.2.17))(@types/react@19.2.17)(esbuild@0.27.7)(react-dom@19.2.7(react@19.2.7))(react@19.2.7)(storybook@10.4.6(@testing-library/dom@10.4.1)(@types/react-dom@19.2.3(@types/react@19.2.17))(@types/react@19.2.17)(prettier@3.8.4)(react-dom@19.2.7(react@19.2.7))(react@19.2.7)(typescript@6.0.3)(vite@8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0)))(typescript@6.0.3)(vite@8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0))
-      '@tailwindcss/vite':
-        specifier: 4.3.1
-        version: 4.3.1(vite@8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0))
+      '@stylexjs/unplugin':
+        specifier: 0.19.0
+        version: 0.19.0(unplugin@3.0.0)
       '@types/react':
         specifier: 19.2.17
         version: 19.2.17
@@ -402,21 +417,9 @@ importers:
       effect:
         specifier: 4.0.0-rc.111
         version: 4.0.0-rc.111
-      react:
-        specifier: 19.2.7
-        version: 19.2.7
-      react-aria-components:
-        specifier: 1.19.0
-        version: 1.19.0(react-dom@19.2.7(react@19.2.7))(react@19.2.7)
-      react-dom:
-        specifier: 19.2.7
-        version: 19.2.7(react@19.2.7)
       storybook:
         specifier: 10.4.6
         version: 10.4.6(@testing-library/dom@10.4.1)(@types/react-dom@19.2.3(@types/react@19.2.17))(@types/react@19.2.17)(prettier@3.8.4)(react-dom@19.2.7(react@19.2.7))(react@19.2.7)(typescript@6.0.3)(vite@8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0))
-      tailwindcss:
-        specifier: 4.3.1
-        version: 4.3.1
       typescript:
         specifier: 6.0.3
         version: 6.0.3
@@ -446,7 +449,7 @@ importers:
         version: 0.4.1(typescript@6.0.3)(web-tree-sitter@0.25.10)
       '@opentui/react':
         specifier: 0.4.1
-        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.0)
+        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.3)
       '@overeng/otel-contract':
         specifier: workspace:^
         version: link:../otel-contract
@@ -577,7 +580,7 @@ importers:
         version: 0.4.1(typescript@6.0.3)(web-tree-sitter@0.25.10)
       '@opentui/react':
         specifier: 0.4.1
-        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.0)
+        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.3)
       '@overeng/effect-path':
         specifier: workspace:^
         version: link:../effect-path
@@ -680,7 +683,7 @@ importers:
         version: 0.4.1(typescript@6.0.3)(web-tree-sitter@0.25.10)
       '@opentui/react':
         specifier: 0.4.1
-        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.0)
+        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.3)
       '@overeng/effect-path':
         specifier: workspace:^
         version: link:../effect-path
@@ -832,7 +835,7 @@ importers:
         version: 0.4.1(typescript@6.0.3)(web-tree-sitter@0.25.10)
       '@opentui/react':
         specifier: 0.4.1
-        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.0)
+        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.3)
       '@playwright/test':
         specifier: 1.61.0
         version: 1.61.0
@@ -1003,7 +1006,7 @@ importers:
         version: 4.0.0-rc.111(effect@4.0.0-rc.111)(vitest@4.1.9(@opentelemetry/api@1.9.1)(@types/node@26.0.0)(happy-dom@20.10.6)(vite@8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0)))
       '@overeng/tui-react':
         specifier: workspace:^
-        version: file:packages/@overeng/tui-react(780db229a3bf93ba66453f6aa9187305)
+        version: link:../tui-react
       '@overeng/utils-dev':
         specifier: workspace:^
         version: link:../utils-dev
@@ -1097,7 +1100,7 @@ importers:
         version: 0.4.1(typescript@6.0.3)(web-tree-sitter@0.25.10)
       '@opentui/react':
         specifier: 0.4.1
-        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.0)
+        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.3)
       '@overeng/notion-effect-client':
         specifier: workspace:^
         version: link:../notion-effect-client
@@ -1466,7 +1469,7 @@ importers:
         version: 0.4.1(typescript@6.0.3)(web-tree-sitter@0.25.10)
       '@opentui/react':
         specifier: 0.4.1
-        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.0)
+        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.3)
       '@overeng/utils-dev':
         specifier: workspace:^
         version: link:../utils-dev
@@ -1526,7 +1529,7 @@ importers:
         version: 0.4.1(typescript@6.0.3)(web-tree-sitter@0.25.10)
       '@opentui/react':
         specifier: 0.4.1
-        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.0)
+        version: 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.3)
       '@overeng/tui-core':
         specifier: workspace:^
         version: link:../tui-core
@@ -1609,6 +1612,9 @@ importers:
       '@overeng/otel-contract':
         specifier: workspace:^
         version: link:../otel-contract
+      '@stylexjs/unplugin':
+        specifier: 0.19.0
+        version: 0.19.0(unplugin@3.0.0)
       effect:
         specifier: 4.0.0-rc.111
         version: 4.0.0-rc.111
@@ -1726,6 +1732,10 @@ packages:
     peerDependencies:
       '@babel/core': ^7.0.0
 
+  '@babel/helper-plugin-utils@7.29.7':
+    resolution: {integrity: sha512-G7sHYigPY17oO5SYWnfD/0MTBwVR781S/JI643e/JhUYgVgWE/61SoW3NH9KWUKyKq5LVh3npif99Wkt6j86Jw==}
+    engines: {node: '>=6.9.0'}
+
   '@babel/helper-string-parser@7.27.1':
     resolution: {integrity: sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==}
     engines: {node: '>=6.9.0'}
@@ -1747,6 +1757,24 @@ packages:
     engines: {node: '>=6.0.0'}
     hasBin: true
 
+  '@babel/plugin-syntax-flow@7.29.7':
+    resolution: {integrity: sha512-ajMX6QPcyomotqwpzhkYGxcK2i/us0rs1Qo9QvUpa+Fca0FTmqrzKrctoIYLMxcOhGZldGT/BAVkRGTWBiR8gQ==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
+  '@babel/plugin-syntax-jsx@7.29.7':
+    resolution: {integrity: sha512-TSu8+mHCoEaaCDEZ0I3+6mvTBYR4PCxQwf2z9/r5Tbztv6NaLR3B9thGTTxX2WGuGHJqRiAbKPeGTJ5XWXVg6A==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
+  '@babel/plugin-syntax-typescript@7.29.7':
+    resolution: {integrity: sha512-ngr+82Sh0xMz25TPCZi+nC2iTzjfCdWS2ONXTp/PtSCHCgaCNBpdMqgvJ2ccdLlClVZ7sisIgB914j/JFe+RZA==}
+    engines: {node: '>=6.9.0'}
+    peerDependencies:
+      '@babel/core': ^7.0.0-0
+
   '@babel/runtime@7.29.2':
     resolution: {integrity: sha512-JiDShH45zKHWyGe4ZNVRrCjBz8Nh9TMmZG1kh4QTK8hCBTWBi8Da+i7s1fJw7/lYpM4ccepSNfqzZ/QvABBi5g==}
     engines: {node: '>=6.9.0'}
@@ -1763,6 +1791,9 @@ packages:
     resolution: {integrity: sha512-LwdZHpScM4Qz8Xw2iKSzS+cfglZzJGvofQICy7W7v4caru4EaAmyUuO6BGrbyQ2mYV11W0U8j5mBhd14dd3B0A==}
     engines: {node: '>=6.9.0'}
 
+  '@dual-bundle/import-meta-resolve@4.2.1':
+    resolution: {integrity: sha512-id+7YRUgoUX6CgV0DtuhirQWodeeA7Lf4i2x71JS/vtA5pRb/hIGWlw+G6MeXvsM+MXrz0VAydTGElX1rAfgPg==}
+
   '@effect/atom-react@4.0.0-rc.111':
     resolution: {integrity: sha512-MQgX2+ayms/J686g19vV2AkLSocMaubZmFf2VFrWN3fwPg60XXsaPtlQKdcsIy/McxVGZYgYUPXBVVtcmUjjSA==}
     peerDependencies:
@@ -2259,45 +2290,6 @@ packages:
       react-devtools-core: ^7.0.1
       ws: ^8.18.0
 
-  '@overeng/content-address@file:packages/@overeng/content-address':
-    resolution: {directory: packages/@overeng/content-address, type: directory}
-
-  '@overeng/effect-distributed-lock@file:packages/@overeng/effect-distributed-lock':
-    resolution: {directory: packages/@overeng/effect-distributed-lock, type: directory}
-    peerDependencies:
-      effect: ^4.0.0-rc.111
-
-  '@overeng/otel-contract@file:packages/@overeng/otel-contract':
-    resolution: {directory: packages/@overeng/otel-contract, type: directory}
-    peerDependencies:
-      effect: ^4.0.0-rc.111
-
-  '@overeng/tui-core@file:packages/@overeng/tui-core':
-    resolution: {directory: packages/@overeng/tui-core, type: directory}
-
-  '@overeng/tui-react@file:packages/@overeng/tui-react':
-    resolution: {directory: packages/@overeng/tui-react, type: directory}
-    peerDependencies:
-      '@effect/atom-react': ^4.0.0-rc.111
-      '@effect/platform-node': ^4.0.0-rc.111
-      '@opentui/core': ^0.4.1
-      '@opentui/react': ^0.4.1
-      '@storybook/react': ^10.4.6
-      '@types/react': ^19.2.17
-      '@types/react-reconciler': ^0.33.0
-      effect: ^4.0.0-rc.111
-      react: ^19.2.7
-      react-dom: ^19.2.7
-      react-reconciler: ^0.33.0
-
-  '@overeng/utils@file:packages/@overeng/utils':
-    resolution: {directory: packages/@overeng/utils, type: directory}
-    peerDependencies:
-      '@effect/opentelemetry': ^4.0.0-rc.111
-      '@effect/platform-node': ^4.0.0-rc.111
-      '@playwright/test': ^1.61.0
-      effect: ^4.0.0-rc.111
-
   '@oxc-parser/binding-android-arm-eabi@0.127.0':
     resolution: {integrity: sha512-0LC7ye4hvqbIKxAzThzvswgHLFu2AURKzYLeSVvLdu2TBOYWQDmHnTqPLeA597BcUCxiLqLsS4CJ5uoI5WYWCQ==}
     engines: {node: ^20.19.0 || >=22.12.0}
@@ -2842,102 +2834,22 @@ packages:
       typescript:
         optional: true
 
-  '@swc/helpers@0.5.21':
-    resolution: {integrity: sha512-jI/VAmtdjB/RnI8GTnokyX7Ug8c+g+ffD6QRLa6XQewtnGyukKkKSk3wLTM3b5cjt1jNh9x0jfVlagdN2gDKQg==}
+  '@stylexjs/babel-plugin@0.19.0':
+    resolution: {integrity: sha512-2SnVZIl047TtqKW0nRTn7Irz0kmoot1bxdGDE/HwfwfF7dJYHqwkIFg92s87v3hj7zxJobrHWwDx1p3qvQXW4g==}
 
-  '@tailwindcss/node@4.3.1':
-    resolution: {integrity: sha512-6NDaqRoAMSXD1mr/RXu0HBvNE9a2n5tHPsxu9XHLws8o4Twes5rBM2205SUUiJ9goAtadrN6xTGX0UDEwp/N4A==}
-
-  '@tailwindcss/oxide-android-arm64@4.3.1':
-    resolution: {integrity: sha512-SVlyf61g374l5cHyg8x9kf5xmLcOaxvOTsbsqDnSsDJaKOEFZ7GCvi84VAVGpxojYOs1+3K6M0UjXfqPU8vmOQ==}
-    engines: {node: '>= 20'}
-    cpu: [arm64]
-    os: [android]
+  '@stylexjs/shared@0.19.0':
+    resolution: {integrity: sha512-7Yym70cQH5sPzJHgzJX3FkL9ZCptbC3IbiRijN9YLYU/5OywB/3c519Xv1DOzvxqjv8urSxh98/9HxLaPG7sDg==}
 
-  '@tailwindcss/oxide-darwin-arm64@4.3.1':
-    resolution: {integrity: sha512-hVnWLwv+e/l7c4WKyVtHVrIPvYdqWHjRB3MDIqARynzFtnQg85kmQEFCbV9Ja0VVx4xXTIiDWY60Y7iz/iNoDA==}
-    engines: {node: '>= 20'}
-    cpu: [arm64]
-    os: [darwin]
+  '@stylexjs/stylex@0.19.0':
+    resolution: {integrity: sha512-CnUFp7YMaDLDeemsWOfJgoC/gKM5P/yBNMcpJaE6ChJmXr7s0DJwSeGTTlHJcqqwN9OW1qGtmARWLFhGZN1pTA==}
 
-  '@tailwindcss/oxide-darwin-x64@4.3.1':
-    resolution: {integrity: sha512-Cf7abu0WVgbhU7ANgPUnSAvm7nCvMweusHb8FnaHlLfv/Caq4GYaEZg7ZImzzmjx4lIAfuS8q+eLIS7A7IzxIg==}
-    engines: {node: '>= 20'}
-    cpu: [x64]
-    os: [darwin]
-
-  '@tailwindcss/oxide-freebsd-x64@4.3.1':
-    resolution: {integrity: sha512-ZZqzX2Y+GXtXXfqSfpJhDm60OoZfvLHLCgm+J7NVqgHHJjG/m9ugZI77RwTsVd4fnBJuCFP6Ae6kTJb71UdS8g==}
-    engines: {node: '>= 20'}
-    cpu: [x64]
-    os: [freebsd]
-
-  '@tailwindcss/oxide-linux-arm-gnueabihf@4.3.1':
-    resolution: {integrity: sha512-/Ah/xik0LaMYfv9DZ0S/t4pBlBNYOcqtRwusjgovHkvT8ixueWCLyJjsaF5kQIckjb4IT8Q6K6p/iPmZMixYgg==}
-    engines: {node: '>= 20'}
-    cpu: [arm]
-    os: [linux]
-
-  '@tailwindcss/oxide-linux-arm64-gnu@4.3.1':
-    resolution: {integrity: sha512-gqdFoVJlw444GvpnheZLHmvTzSxI/cOUUh2KSNejQjTcYkW062SVD+En0rUgD+QV91bz1XGIGtt1HJd48xUGbQ==}
-    engines: {node: '>= 20'}
-    cpu: [arm64]
-    os: [linux]
-    libc: [glibc]
-
-  '@tailwindcss/oxide-linux-arm64-musl@4.3.1':
-    resolution: {integrity: sha512-Bwv9KwOvE0VKa86xPFif9b9c3Y1NxOV1P0gLti/IYaWEsQYZXDlxfGEtA8mdDZ7SG3wyNXAWYT5SIn3giL57oA==}
-    engines: {node: '>= 20'}
-    cpu: [arm64]
-    os: [linux]
-    libc: [musl]
-
-  '@tailwindcss/oxide-linux-x64-gnu@4.3.1':
-    resolution: {integrity: sha512-Ymi8O8T15HYQdOUWUtTI6ldN0neHP85FC+Qz32xTcZ7iJXtem/x8ITev0o1e9e5rkqj4lONZfTRLvkmin1+tKg==}
-    engines: {node: '>= 20'}
-    cpu: [x64]
-    os: [linux]
-    libc: [glibc]
-
-  '@tailwindcss/oxide-linux-x64-musl@4.3.1':
-    resolution: {integrity: sha512-M+P/91qJ6uILLw4k2G93GMDRAXj61SMvFQYt39AqvUqYgExXpLL5aepfns7sj4HiAQeolirQF9E0lzRvdf4zPQ==}
-    engines: {node: '>= 20'}
-    cpu: [x64]
-    os: [linux]
-    libc: [musl]
-
-  '@tailwindcss/oxide-wasm32-wasi@4.3.1':
-    resolution: {integrity: sha512-zsM8uOeqvVGHsAXsJxsT28ttosFahLJKCLOTUBqRAtKnVgGSRitds9T432QiT8b77Yga7JIBkulIRRlJPtYhRA==}
-    engines: {node: '>=14.0.0'}
-    cpu: [wasm32]
-    bundledDependencies:
-      - '@napi-rs/wasm-runtime'
-      - '@emnapi/core'
-      - '@emnapi/runtime'
-      - '@tybys/wasm-util'
-      - '@emnapi/wasi-threads'
-      - tslib
-
-  '@tailwindcss/oxide-win32-arm64-msvc@4.3.1':
-    resolution: {integrity: sha512-aiNvSq9BsVk8V513lDKlrCFAgf8qBMPZTpgEhInL+NwQqs97mYmupVMrPrgBBSL8Pv/0zXu9MrMF9rMun1ZeNg==}
-    engines: {node: '>= 20'}
-    cpu: [arm64]
-    os: [win32]
-
-  '@tailwindcss/oxide-win32-x64-msvc@4.3.1':
-    resolution: {integrity: sha512-xDEyu1rg290472FEGaKHnzyDyh5QH+AlWvsU5hMoMtPpzmKlRI0jaYKCgSHDYtaQWZOYbMaduSyCwFwY4n1HmA==}
-    engines: {node: '>= 20'}
-    cpu: [x64]
-    os: [win32]
-
-  '@tailwindcss/oxide@4.3.1':
-    resolution: {integrity: sha512-yVPyo8RNkabVr3O2EhHEE0Rewu7YKzc1DhIqfL46LKveFrmu9XbDazNOJY7/GRuvw1h6u3utWnR29H/p5JPlgA==}
-    engines: {node: '>= 20'}
-
-  '@tailwindcss/vite@4.3.1':
-    resolution: {integrity: sha512-hItDHuIIlEV61R+faXu66s1K36aTurO/Qw0e45Vskz57gXl9pWOT6eg3zmcEui6CZXddbN7zd41bwmvag4JGwQ==}
+  '@stylexjs/unplugin@0.19.0':
+    resolution: {integrity: sha512-2QwNYovSwarC/M8DLD78857F6MEi4eQ3UYzgdmyg/K7562M/rV1KWptiATxcKgujlUT6ToNy778SOXf4bGK+Bw==}
     peerDependencies:
-      vite: ^5.2.0 || ^6 || ^7 || ^8
+      unplugin: ^2.3.11
+
+  '@swc/helpers@0.5.21':
+    resolution: {integrity: sha512-jI/VAmtdjB/RnI8GTnokyX7Ug8c+g+ffD6QRLa6XQewtnGyukKkKSk3wLTM3b5cjt1jNh9x0jfVlagdN2gDKQg==}
 
   '@tanstack/history@1.162.0':
     resolution: {integrity: sha512-79pf/RkhteYZTRgcR4F9kbk84P2N8rugQJswxfIqovlbRiT3yI7eBE+5QorIrZaOKktsgzRlXh1l/du/xpl4iA==}
@@ -3474,6 +3386,9 @@ packages:
     resolution: {integrity: sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==}
     engines: {node: '>= 8'}
 
+  css-mediaquery@0.1.2:
+    resolution: {integrity: sha512-COtn4EROW5dBGlE/4PiKnh6rZpAPxDeFLaEEwt4i10jpDMFt2EhQGS79QmmrO+iKCHv0PU/HrOWEhijFd1x99Q==}
+
   css.escape@1.5.1:
     resolution: {integrity: sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==}
 
@@ -3553,10 +3468,6 @@ packages:
     resolution: {integrity: sha512-i6UzDscO/XfAcNYD75CfICkmfLedpyPDdozrLMmQc5ORaQcdMoc21OnlEylMIqI7U8eniKrPMxxtj8k0vhmJhA==}
     engines: {node: '>=14'}
 
-  enhanced-resolve@5.21.6:
-    resolution: {integrity: sha512-aNnGCvbJ/RIyWo1IuhNdVjnNF+EjH9wpzpNHt+ci/m9He9LJvUN8wrCcXjp9cWsGNAuvSpVFTx/vraAFQ8qGjQ==}
-    engines: {node: '>=10.13.0'}
-
   entities@7.0.1:
     resolution: {integrity: sha512-TWrgLOFUQTH994YUyl1yT4uyavY5nNB5muff+RtWaqNVCAK408b5ZnnbNAUEWLTCpum9w6arT70i1XdQ4UeOPA==}
     engines: {node: '>=0.12'}
@@ -3713,9 +3624,6 @@ packages:
     resolution: {integrity: sha512-Wjlyrolmm8uDpm/ogGyXZXb1Z+Ca2B8NbJwqBVg0axK9GbBeoS7yGV6vjXnYdGm6X53iehEuxxbyiKp8QmN4Vw==}
     engines: {node: 18 || 20 || >=22}
 
-  graceful-fs@4.2.11:
-    resolution: {integrity: sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==}
-
   h3@2.0.1-rc.20:
     resolution: {integrity: sha512-28ljodXuUp0fZovdiSRq4G9OgrxCztrJe5VdYzXAB7ueRvI7pIUqLU14Xi3XqdYJ/khXjfpUOOD2EQa6CmBgsg==}
     engines: {node: '>=20.11.1'}
@@ -3755,6 +3663,9 @@ packages:
     resolution: {integrity: sha512-EdDDZu4A2OyIK7Lr/2zG+w5jmbuk1DVBnEwREQvBzspBJkCEbRa8GxU1lghYcaGJCnRWibjDXlq779X1/y5xwg==}
     engines: {node: '>=8'}
 
+  invariant@2.2.4:
+    resolution: {integrity: sha512-phJfQVBuaJM5raOpJjSfkiD6BpbCE4Ns//LaXl6wGYtUBY83nWS6Rf9tXm2e8VaK60JEjYldbPif/A2B1C2gNA==}
+
   is-core-module@2.16.1:
     resolution: {integrity: sha512-UfoeMA6fIJ8wTYFEUjelnaGI67v6+N7qXJEvQuIGa99l4xsCruSYOVSQ0uPANn4dAzm8lkYPaKLrrijLq7x23w==}
     engines: {node: '>= 0.4'}
@@ -3930,6 +3841,10 @@ packages:
   longest-streak@3.1.0:
     resolution: {integrity: sha512-9Ri+o0JYgehTaVBBDoMqIl8GXtbWg711O3srftcHhZ0dqnETqLaoIK0x17fUw9rFSlK/0NlsKe0Ahhyl5pXE2g==}
 
+  loose-envify@1.4.0:
+    resolution: {integrity: sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==}
+    hasBin: true
+
   loupe@3.2.1:
     resolution: {integrity: sha512-CdzqowRJCeLU72bHvWqwRBBlLcMEtIvGrlvef74kMnV2AolS9Y8xUv1I0U/MNAWMhBlKIoyuEgoJ0t/bbwHbLQ==}
 
@@ -4178,6 +4093,9 @@ packages:
     engines: {node: '>=18'}
     hasBin: true
 
+  postcss-value-parser@4.2.0:
+    resolution: {integrity: sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==}
+
   postcss@8.5.15:
     resolution: {integrity: sha512-FfR8sjd4em2T6fb3I2MwAJU7HWVMr9zba+enmQeeWFfCbm+UOC/0X4DS8XtpUTMwWMGbjKYP7xjfNekzyGmB3A==}
     engines: {node: ^10 || ^12 || >=14}
@@ -4421,16 +4339,18 @@ packages:
     resolution: {integrity: sha512-SlyRoSkdh1dYP0PzclLE7r0M9sgbFKKMFXpFRUMNuKhQSbC6VQIGzq3E0qsfvGJaUFJPGv6Ws1NZ/haTAjfbMA==}
     engines: {node: '>=12'}
 
+  styleq@0.2.1:
+    resolution: {integrity: sha512-L0TR0NQb+X4/ktDEKmjWyp27gla+LUYi/by5k5SjKXf6/pvZP7wbwEB5J+tqxdFVPgzbsuz+d4RTScO/QZquBw==}
+
   supports-preserve-symlinks-flag@1.0.0:
     resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
     engines: {node: '>= 0.4'}
 
-  tailwindcss@4.3.1:
-    resolution: {integrity: sha512-hk+TB1m+K8CYNrP6rjQaq/Y+4Zylwpa87mLYBKCunwnnQ9p+fHb7kmSfGqyEJoxF/O6CDyABWVFEafNSYKll+Q==}
-
-  tapable@2.3.3:
-    resolution: {integrity: sha512-uxc/zpqFg6x7C8vOE7lh6Lbda8eEL9zmVm/PLeTPBRhh1xCgdWaQ+J1CUieGpIfm2HdtsUpRv+HshiasBMcc6A==}
-    engines: {node: '>=6'}
+  tailwind-stylex@0.1.1:
+    resolution: {integrity: sha512-BNzbag4sUQ+d212HkAebjVYpdFGajfnBb4HnC/NwtCZnkqw0pfUbFFOee1NcsS2m9ZCpyK6qvHlv4D6ydePwJw==}
+    engines: {node: '>=22'}
+    peerDependencies:
+      '@stylexjs/stylex': '>=0.15.0'
 
   tiny-invariant@1.3.3:
     resolution: {integrity: sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==}
@@ -4804,6 +4724,8 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
+  '@babel/helper-plugin-utils@7.29.7': {}
+
   '@babel/helper-string-parser@7.27.1': {}
 
   '@babel/helper-validator-identifier@7.28.5': {}
@@ -4819,6 +4741,21 @@ snapshots:
     dependencies:
       '@babel/types': 7.29.0
 
+  '@babel/plugin-syntax-flow@7.29.7(@babel/core@7.29.0)':
+    dependencies:
+      '@babel/core': 7.29.0
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-syntax-jsx@7.29.7(@babel/core@7.29.0)':
+    dependencies:
+      '@babel/core': 7.29.0
+      '@babel/helper-plugin-utils': 7.29.7
+
+  '@babel/plugin-syntax-typescript@7.29.7(@babel/core@7.29.0)':
+    dependencies:
+      '@babel/core': 7.29.0
+      '@babel/helper-plugin-utils': 7.29.7
+
   '@babel/runtime@7.29.2': {}
 
   '@babel/template@7.28.6':
@@ -4844,6 +4781,8 @@ snapshots:
       '@babel/helper-string-parser': 7.27.1
       '@babel/helper-validator-identifier': 7.28.5
 
+  '@dual-bundle/import-meta-resolve@4.2.1': {}
+
   '@effect/atom-react@4.0.0-rc.111(effect@4.0.0-rc.111)(react@19.2.7)(scheduler@0.27.0)':
     dependencies:
       effect: 4.0.0-rc.111
@@ -5262,17 +5201,6 @@ snapshots:
     transitivePeerDependencies:
       - typescript
 
-  '@opentui/react@0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.0)':
-    dependencies:
-      '@opentui/core': 0.4.1(typescript@6.0.3)(web-tree-sitter@0.25.10)
-      react: 19.2.7
-      react-devtools-core: 7.0.1
-      react-reconciler: 0.33.0(react@19.2.7)
-      ws: 8.21.0
-    transitivePeerDependencies:
-      - typescript
-      - web-tree-sitter
-
   '@opentui/react@0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.3)':
     dependencies:
       '@opentui/core': 0.4.1(typescript@6.0.3)(web-tree-sitter@0.25.10)
@@ -5284,97 +5212,6 @@ snapshots:
       - typescript
       - web-tree-sitter
 
-  '@overeng/content-address@file:packages/@overeng/content-address':
-    dependencies:
-      '@noble/hashes': 2.2.0
-      effect: 4.0.0-rc.111
-
-  '@overeng/effect-distributed-lock@file:packages/@overeng/effect-distributed-lock(effect@4.0.0-rc.111)':
-    dependencies:
-      effect: 4.0.0-rc.111
-
-  '@overeng/otel-contract@file:packages/@overeng/otel-contract(effect@4.0.0-rc.111)':
-    dependencies:
-      '@overeng/content-address': file:packages/@overeng/content-address
-      effect: 4.0.0-rc.111
-
-  '@overeng/tui-core@file:packages/@overeng/tui-core': {}
-
-  '@overeng/tui-react@file:packages/@overeng/tui-react(780db229a3bf93ba66453f6aa9187305)':
-    dependencies:
-      '@effect/atom-react': 4.0.0-rc.111(effect@4.0.0-rc.111)(react@19.2.7)(scheduler@0.27.0)
-      '@effect/opentelemetry': 4.0.0-rc.111(@opentelemetry/api-logs@0.219.0)(@opentelemetry/api@1.9.1)(@opentelemetry/resources@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-logs@0.219.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-metrics@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-trace-base@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-trace-node@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-trace-web@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/semantic-conventions@1.41.1)(effect@4.0.0-rc.111)
-      '@effect/platform-node': 4.0.0-rc.111(effect@4.0.0-rc.111)(redis@6.2.1(@opentelemetry/api@1.9.1))
-      '@effect/vitest': 4.0.0-rc.111(effect@4.0.0-rc.111)(vitest@4.1.9(@opentelemetry/api@1.9.1)(@types/node@26.0.0)(happy-dom@20.10.6)(vite@8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0)))
-      '@opentui/core': 0.4.1(typescript@6.0.3)(web-tree-sitter@0.25.10)
-      '@opentui/react': 0.4.1(react-devtools-core@7.0.1)(react@19.2.7)(typescript@6.0.3)(web-tree-sitter@0.25.10)(ws@8.21.3)
-      '@overeng/tui-core': file:packages/@overeng/tui-core
-      '@overeng/utils': file:packages/@overeng/utils(@effect/opentelemetry@4.0.0-rc.111(@opentelemetry/api-logs@0.219.0)(@opentelemetry/api@1.9.1)(@opentelemetry/resources@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-logs@0.219.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-metrics@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-trace-base@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-trace-node@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-trace-web@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/semantic-conventions@1.41.1)(effect@4.0.0-rc.111))(@effect/platform-node@4.0.0-rc.111(effect@4.0.0-rc.111)(redis@6.2.1(@opentelemetry/api@1.9.1)))(@playwright/test@1.61.0)(@types/node@26.0.0)(effect@4.0.0-rc.111)(happy-dom@20.10.6)(vite@8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0))
-      '@playwright/test': 1.61.0
-      '@storybook/react': 10.4.6(@types/react-dom@19.2.3(@types/react@19.2.17))(@types/react@19.2.17)(react-dom@19.2.7(react@19.2.7))(react@19.2.7)(storybook@10.4.6(@testing-library/dom@10.4.1)(@types/react-dom@19.2.3(@types/react@19.2.17))(@types/react@19.2.17)(prettier@3.8.4)(react-dom@19.2.7(react@19.2.7))(react@19.2.7)(typescript@6.0.3)(vite@8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0)))(typescript@6.0.3)
-      '@types/react': 19.2.17
-      '@types/react-reconciler': 0.33.0(@types/react@19.2.17)
-      '@xterm/addon-fit': 0.11.0
-      '@xterm/addon-webgl': 0.19.0
-      '@xterm/headless': 6.0.0
-      '@xterm/xterm': 6.0.0
-      cli-truncate: 6.0.0
-      effect: 4.0.0-rc.111
-      react: 19.2.7
-      react-dom: 19.2.7(react@19.2.7)
-      react-reconciler: 0.33.0(react@19.2.7)
-      string-width: 8.2.1
-      vitest: 4.1.9(@opentelemetry/api@1.9.1)(@types/node@26.0.0)(happy-dom@20.10.6)(vite@8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0))
-      yoga-layout: 3.2.1
-    transitivePeerDependencies:
-      - '@edge-runtime/vm'
-      - '@opentelemetry/api'
-      - '@opentelemetry/api-logs'
-      - '@opentelemetry/resources'
-      - '@opentelemetry/sdk-logs'
-      - '@opentelemetry/sdk-metrics'
-      - '@opentelemetry/sdk-trace-base'
-      - '@opentelemetry/sdk-trace-node'
-      - '@opentelemetry/sdk-trace-web'
-      - '@opentelemetry/semantic-conventions'
-      - '@types/node'
-      - '@vitest/browser-playwright'
-      - '@vitest/browser-preview'
-      - '@vitest/browser-webdriverio'
-      - '@vitest/coverage-istanbul'
-      - '@vitest/coverage-v8'
-      - '@vitest/ui'
-      - happy-dom
-      - jsdom
-      - msw
-      - vite
-
-  '@overeng/utils@file:packages/@overeng/utils(@effect/opentelemetry@4.0.0-rc.111(@opentelemetry/api-logs@0.219.0)(@opentelemetry/api@1.9.1)(@opentelemetry/resources@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-logs@0.219.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-metrics@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-trace-base@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-trace-node@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-trace-web@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/semantic-conventions@1.41.1)(effect@4.0.0-rc.111))(@effect/platform-node@4.0.0-rc.111(effect@4.0.0-rc.111)(redis@6.2.1(@opentelemetry/api@1.9.1)))(@playwright/test@1.61.0)(@types/node@26.0.0)(effect@4.0.0-rc.111)(happy-dom@20.10.6)(vite@8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0))':
-    dependencies:
-      '@effect/opentelemetry': 4.0.0-rc.111(@opentelemetry/api-logs@0.219.0)(@opentelemetry/api@1.9.1)(@opentelemetry/resources@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-logs@0.219.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-metrics@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-trace-base@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-trace-node@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/sdk-trace-web@2.8.0(@opentelemetry/api@1.9.1))(@opentelemetry/semantic-conventions@1.41.1)(effect@4.0.0-rc.111)
-      '@effect/platform-node': 4.0.0-rc.111(effect@4.0.0-rc.111)(redis@6.2.1(@opentelemetry/api@1.9.1))
-      '@effect/vitest': 4.0.0-rc.111(effect@4.0.0-rc.111)(vitest@4.1.9(@opentelemetry/api@1.9.1)(@types/node@26.0.0)(happy-dom@20.10.6)(vite@8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0)))
-      '@noble/hashes': 2.2.0
-      '@opentelemetry/api': 1.9.1
-      '@overeng/effect-distributed-lock': file:packages/@overeng/effect-distributed-lock(effect@4.0.0-rc.111)
-      '@overeng/otel-contract': file:packages/@overeng/otel-contract(effect@4.0.0-rc.111)
-      '@playwright/test': 1.61.0
-      effect: 4.0.0-rc.111
-      vitest: 4.1.9(@opentelemetry/api@1.9.1)(@types/node@26.0.0)(happy-dom@20.10.6)(vite@8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0))
-    transitivePeerDependencies:
-      - '@edge-runtime/vm'
-      - '@types/node'
-      - '@vitest/browser-playwright'
-      - '@vitest/browser-preview'
-      - '@vitest/browser-webdriverio'
-      - '@vitest/coverage-istanbul'
-      - '@vitest/coverage-v8'
-      - '@vitest/ui'
-      - happy-dom
-      - jsdom
-      - msw
-      - vite
-
   '@oxc-parser/binding-android-arm-eabi@0.127.0':
     optional: true
 
@@ -5744,77 +5581,43 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  '@swc/helpers@0.5.21':
-    dependencies:
-      tslib: 2.8.1
-
-  '@tailwindcss/node@4.3.1':
+  '@stylexjs/babel-plugin@0.19.0':
     dependencies:
-      '@jridgewell/remapping': 2.3.5
-      enhanced-resolve: 5.21.6
-      jiti: 2.7.0
-      lightningcss: 1.32.0
-      magic-string: 0.30.21
-      source-map-js: 1.2.1
-      tailwindcss: 4.3.1
-
-  '@tailwindcss/oxide-android-arm64@4.3.1':
-    optional: true
-
-  '@tailwindcss/oxide-darwin-arm64@4.3.1':
-    optional: true
-
-  '@tailwindcss/oxide-darwin-x64@4.3.1':
-    optional: true
-
-  '@tailwindcss/oxide-freebsd-x64@4.3.1':
-    optional: true
-
-  '@tailwindcss/oxide-linux-arm-gnueabihf@4.3.1':
-    optional: true
-
-  '@tailwindcss/oxide-linux-arm64-gnu@4.3.1':
-    optional: true
-
-  '@tailwindcss/oxide-linux-arm64-musl@4.3.1':
-    optional: true
-
-  '@tailwindcss/oxide-linux-x64-gnu@4.3.1':
-    optional: true
-
-  '@tailwindcss/oxide-linux-x64-musl@4.3.1':
-    optional: true
+      '@babel/core': 7.29.0
+      '@babel/helper-module-imports': 7.28.6
+      '@babel/traverse': 7.29.0
+      '@babel/types': 7.29.0
+      '@dual-bundle/import-meta-resolve': 4.2.1
+      '@stylexjs/shared': 0.19.0
+      '@stylexjs/stylex': 0.19.0
+      postcss-value-parser: 4.2.0
+    transitivePeerDependencies:
+      - supports-color
 
-  '@tailwindcss/oxide-wasm32-wasi@4.3.1':
-    optional: true
+  '@stylexjs/shared@0.19.0': {}
 
-  '@tailwindcss/oxide-win32-arm64-msvc@4.3.1':
-    optional: true
+  '@stylexjs/stylex@0.19.0':
+    dependencies:
+      css-mediaquery: 0.1.2
+      invariant: 2.2.4
+      styleq: 0.2.1
 
-  '@tailwindcss/oxide-win32-x64-msvc@4.3.1':
-    optional: true
+  '@stylexjs/unplugin@0.19.0(unplugin@3.0.0)':
+    dependencies:
+      '@babel/core': 7.29.0
+      '@babel/plugin-syntax-flow': 7.29.7(@babel/core@7.29.0)
+      '@babel/plugin-syntax-jsx': 7.29.7(@babel/core@7.29.0)
+      '@babel/plugin-syntax-typescript': 7.29.7(@babel/core@7.29.0)
+      '@stylexjs/babel-plugin': 0.19.0
+      browserslist: 4.28.2
+      lightningcss: 1.32.0
+      unplugin: 3.0.0
+    transitivePeerDependencies:
+      - supports-color
 
-  '@tailwindcss/oxide@4.3.1':
-    optionalDependencies:
-      '@tailwindcss/oxide-android-arm64': 4.3.1
-      '@tailwindcss/oxide-darwin-arm64': 4.3.1
-      '@tailwindcss/oxide-darwin-x64': 4.3.1
-      '@tailwindcss/oxide-freebsd-x64': 4.3.1
-      '@tailwindcss/oxide-linux-arm-gnueabihf': 4.3.1
-      '@tailwindcss/oxide-linux-arm64-gnu': 4.3.1
-      '@tailwindcss/oxide-linux-arm64-musl': 4.3.1
-      '@tailwindcss/oxide-linux-x64-gnu': 4.3.1
-      '@tailwindcss/oxide-linux-x64-musl': 4.3.1
-      '@tailwindcss/oxide-wasm32-wasi': 4.3.1
-      '@tailwindcss/oxide-win32-arm64-msvc': 4.3.1
-      '@tailwindcss/oxide-win32-x64-msvc': 4.3.1
-
-  '@tailwindcss/vite@4.3.1(vite@8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0))':
-    dependencies:
-      '@tailwindcss/node': 4.3.1
-      '@tailwindcss/oxide': 4.3.1
-      tailwindcss: 4.3.1
-      vite: 8.0.16(@types/node@26.0.0)(esbuild@0.27.7)(jiti@2.7.0)(yaml@2.9.0)
+  '@swc/helpers@0.5.21':
+    dependencies:
+      tslib: 2.8.1
 
   '@tanstack/history@1.162.0': {}
 
@@ -6430,6 +6233,8 @@ snapshots:
       shebang-command: 2.0.0
       which: 2.0.2
 
+  css-mediaquery@0.1.2: {}
+
   css.escape@1.5.1: {}
 
   csstype@3.2.3: {}
@@ -6487,11 +6292,6 @@ snapshots:
 
   empathic@2.0.0: {}
 
-  enhanced-resolve@5.21.6:
-    dependencies:
-      graceful-fs: 4.2.11
-      tapable: 2.3.3
-
   entities@7.0.1: {}
 
   es-errors@1.3.0: {}
@@ -6665,8 +6465,6 @@ snapshots:
       minipass: 7.1.3
       path-scurry: 2.0.2
 
-  graceful-fs@4.2.11: {}
-
   h3@2.0.1-rc.20:
     dependencies:
       rou3: 0.8.1
@@ -6715,6 +6513,10 @@ snapshots:
 
   indent-string@4.0.0: {}
 
+  invariant@2.2.4:
+    dependencies:
+      loose-envify: 1.4.0
+
   is-core-module@2.16.1:
     dependencies:
       hasown: 2.0.3
@@ -6842,6 +6644,10 @@ snapshots:
 
   longest-streak@3.1.0: {}
 
+  loose-envify@1.4.0:
+    dependencies:
+      js-tokens: 4.0.0
+
   loupe@3.2.1: {}
 
   lru-cache@11.3.5: {}
@@ -7259,6 +7065,8 @@ snapshots:
     optionalDependencies:
       fsevents: 2.3.2
 
+  postcss-value-parser@4.2.0: {}
+
   postcss@8.5.15:
     dependencies:
       nanoid: 3.3.13
@@ -7560,11 +7368,13 @@ snapshots:
 
   strip-indent@4.1.1: {}
 
-  supports-preserve-symlinks-flag@1.0.0: {}
+  styleq@0.2.1: {}
 
-  tailwindcss@4.3.1: {}
+  supports-preserve-symlinks-flag@1.0.0: {}
 
-  tapable@2.3.3: {}
+  tailwind-stylex@0.1.1(@stylexjs/stylex@0.19.0):
+    dependencies:
+      '@stylexjs/stylex': 0.19.0
 
   tiny-invariant@1.3.3: {}
 
diff --git a/pnpm-workspace.yaml b/pnpm-workspace.yaml
index cf947059ed..f59ba84aef 100644
--- a/pnpm-workspace.yaml
+++ b/pnpm-workspace.yaml
@@ -54,6 +54,7 @@ peerDependencyRules:
     typescript: '>=6.0.0'
     eslint: '>=10.0.0'
     vitest: '>=4.0.0'
+    unplugin: '>=3.0.0'
 
 allowBuilds:
   '@myobie/pty': false
@@ -66,6 +67,7 @@ allowBuilds:
 
 minimumReleaseAgeExclude:
   - '@types/node'
+  - tailwind-stylex
   - effect
   - '@effect/platform-node'
   - '@effect/vitest'