perf(eidos): code-split final 10 recipes — index.css is foundation-only (Phase 3 batch 5 + Phase 4)

table tree-view tree-grid feed virtual-list virtual-grid announce
clipboard drag-drop words.

words (the 55 KB recipe) composes via mounted eidos components
(Button×5, Icon×7, NumberField×3, ColorPicker×1, TextArea files), so
their recipes load on mount — no extra imports needed. Verified: words
content/toolbar styled, mounted button 26px/radius 6px.

index.css now holds ONLY the foundation: base.css + archetypes + events
+ the 10 layout primitives (box/flex/grid/stack/group/wrap/container/
section/aspect-ratio/auto-grid, kept because they're used pervasively and
recipes layer on them).

FINAL: monolith 850,879→335,100 raw / 113,489→54,429 gz — −515 KB raw /
−59 KB gz off EVERY page, landing at the base.css floor. A 5-component
page now ships ~54 KB foundation + a few KB of chunks instead of 113.5 KB
flat. check 0 errors.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

src/uix/eidos/components/announce/announce.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './announce.css';
 	/**
 	 * Eidos `<Announce>` — thin wrapper around soma's `Announce.Provider`.
 	 * Announce is a pure ARIA service (live regions for screen reader

src/uix/eidos/components/clipboard/clipboard.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './clipboard.css';
 	/**
 	 * Eidos `<Clipboard>` — visual wrapper around soma's
 	 * `Clipboard.Provider`. Drops a thin context for the Trigger /

src/uix/eidos/components/drag-drop/drag-drop.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './drag-drop.css';
 	/**
 	 * Eidos `<DragDrop>` — visual wrapper around soma's `DragDrop.Provider`.
 	 * Sets a color/size context for descendants.

src/uix/eidos/components/feed/feed.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './feed.css';
 	/**
 	 * Eidos `<Feed>` — visual wrapper around soma's `Feed.Provider`.
 	 * Wraps the `<div role="feed">` in a `<div data-feed-root>` that

src/uix/eidos/components/table/table.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './table.css';
 	/**
 	 * Eidos `<Table>` — visual wrapper around soma's `Table.Provider`.
 	 *

src/uix/eidos/components/tree-grid/tree-grid.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './tree-grid.css';
 	/**
 	 * Eidos `<TreeGrid>` — visual wrapper around soma's `TreeGrid.Provider`.
 	 *

src/uix/eidos/components/tree-view/tree-view.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './tree-view.css';
 	/**
 	 * Eidos `<TreeView>` — visual wrapper around soma's `TreeView.Provider`.
 	 *

src/uix/eidos/components/virtual-grid/virtual-grid.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './virtual-grid.css';
 	/**
 	 * Eidos `<VirtualGrid>` — visual wrapper around soma's `VirtualGrid.Provider`.
 	 */

src/uix/eidos/components/virtual-list/virtual-list.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './virtual-list.css';
 	/**
 	 * Eidos `<VirtualList>` — visual wrapper around soma's `VirtualList.Provider`.
 	 * Wraps the provider in `<div data-virtual-list-root>` for chrome.

src/uix/eidos/components/words/words.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import './words.css';
 	/**
 	 * Eidos `<Words>` — visual wrapper over the headless Words editor.
 	 *

src/uix/eidos/index.css

@@ -78,13 +78,3 @@
 @import './components/section/section.css';
 @import './components/aspect-ratio/aspect-ratio.css';
 @import './components/auto-grid/auto-grid.css';
-@import './components/words/words.css';
-@import './components/table/table.css';
-@import './components/tree-view/tree-view.css';
-@import './components/tree-grid/tree-grid.css';
-@import './components/feed/feed.css';
-@import './components/virtual-list/virtual-list.css';
-@import './components/virtual-grid/virtual-grid.css';
-@import './components/announce/announce.css';
-@import './components/clipboard/clipboard.css';
-@import './components/drag-drop/drag-drop.css';