diff --git a/.github/workflows/rust.yml b/.github/workflows/rust.yml
index 7952bcc..cb39c2b 100644
--- a/.github/workflows/rust.yml
+++ b/.github/workflows/rust.yml
@@ -9,8 +9,6 @@ jobs:
     steps:
       - uses: actions/checkout@v3
       - uses: dtolnay/rust-toolchain@master
-        with:
-          toolchain: stable
       - run: cargo check
 
   test:
@@ -19,8 +17,6 @@ jobs:
     steps:
       - uses: actions/checkout@v3
       - uses: dtolnay/rust-toolchain@master
-        with:
-          toolchain: stable
       - name: Install alsa and udev
         run: sudo apt-get update; sudo apt-get install --no-install-recommends libasound2-dev libudev-dev
         if: runner.os == 'linux'
@@ -33,7 +29,6 @@ jobs:
       - uses: actions/checkout@v3
       - uses: dtolnay/rust-toolchain@master
         with:
-          toolchain: stable
           components: rustfmt
       - run: cargo fmt --all -- --check
 
@@ -44,6 +39,5 @@ jobs:
       - uses: actions/checkout@v3
       - uses: dtolnay/rust-toolchain@master
         with:
-          toolchain: stable
           components: clippy
       - run: cargo clippy -- -D warnings
diff --git a/.prototools b/.prototools
new file mode 100644
index 0000000..36d6482
--- /dev/null
+++ b/.prototools
@@ -0,0 +1,4 @@
+lefthook = "2.0.2"
+
+[plugins.tools]
+lefthook = "https://raw.githubusercontent.com/ageha734/proto-plugins/refs/heads/master/toml/lefthook.toml"
diff --git a/ARCHITECTURE_REVIEW.md b/ARCHITECTURE_REVIEW.md
new file mode 100644
index 0000000..c34828b
--- /dev/null
+++ b/ARCHITECTURE_REVIEW.md
@@ -0,0 +1,571 @@
+# `seldom_pixel` Architecture Review & Implementation Plan
+
+_Last updated: 2025-12-23_
+
+This document captures an architectural review of `seldom_pixel` plus a concrete implementation plan, prioritizing easy, high-value improvements.
+
+---
+
+## 1. High-Level Intent
+
+- Bevy plugin for limited-palette 2D pixel art games.
+- Renders into a logical pixel buffer (`ScreenSize`) using 8-bit palette indices, then uploads as an `R8Uint` texture.
+- A WGSL shader (`src/screen.wgsl`) maps indices to RGB via a uniform palette.
+- Features:
+  - Sprites (`sprite.rs`)
+  - Tilemaps (`map.rs`)
+  - Text / typefaces (`text.rs`)
+  - Filters (`filter.rs`)
+  - UI layout (`ui.rs`)
+  - Particles (`particle.rs`, feature-gated)
+  - Lines (`line.rs`, feature-gated)
+  - Cursor and camera (`cursor.rs`, `camera.rs`)
+
+`PxLayer` (user type, usually via `#[px_layer]`) drives z-ordering and layer semantics across rendering, filters, and picking.
+
+---
+
+## 2. Project Direction (2025-12)
+
+These are the goals driving the next architectural changes and should guide refactors.
+
+1. **Decouple frame generation from sprites.**
+   - Frames should be produced by a separate, composable module.
+   - Sprites should consume frames, not embed animation logic.
+2. **Make animation optional and fully controllable.**
+   - Animation should be an opt-in system that can be replaced or driven externally.
+   - Users should be able to control frame selection directly (e.g., manual index changes or linear-algebra time mapping).
+3. **Enable pixel-perfect picking at the current frame.**
+   - Picking must be able to test mouse hits against the actual rendered pixel of the current frame, not just a rectangle.
+   - The architecture should remain open to supporting future masking or per-pixel collision logic.
+4. **Support composite sprites formed from multiple frame parts.**
+   - Users should be able to assemble sprites from multiple pieces (equipment, layers, effects).
+   - Composition should work as baked assets, runtime composition, or entity-based assembly.
+   - Frame selection should be driven by a single master frame with per-part bindings.
+
+---
+
+## 3. Key Architectural Decisions
+
+### 3.1 Plugin composition
+
+- `PxPlugin<L>` (`src/lib.rs`) wires together:
+- `animation`, `blink`, `camera`, `cursor`, `palette`, `picking`, `position`,
+  `screen`, `filter`, `line`, `map`, `rect`, `sprite`, `text`, `ui`.
+- Each module exposes a `plug` function; they are domain-focused but tightly integrated.
+
+### 3.2 Headed vs headless
+
+- `headed` feature gates window, render graph, picking, and input integration.
+- Core components / resources exist without `headed`, so logic can run headless.
+
+### 3.3 CPU-side renderer
+
+- `src/screen.rs`’s `PxRenderNode<L>`:
+  - Queries render-world ECS for maps, tiles, sprites, texts, rects, lines, filters.
+  - Groups them by layer into a `BTreeMap<L, LayerContents>`.
+  - Draws each layer into a CPU `PxImage` (palette indices) and then uploads that to a GPU `R8Uint` texture.
+  - A full-screen quad (`screen.wgsl`) turns indices into colors via a 256-entry palette uniform.
+
+### 3.4 Palette-centric asset pipeline
+
+- `Palette` asset (`palette.rs`) describes the allowed colors; top-left pixel is background, colors are packed from the rest of the image.
+- A global static palette (`ASSET_PALETTE`) is initialized once at startup.
+- Asset loaders for sprites (`sprite.rs`), tilesets (`map.rs`), filters (`filter.rs`), typefaces (`text.rs`) call `asset_palette().await` and convert RGBA textures into `PxImage` palette indices at load time.
+
+### 3.5 Animation abstraction
+
+- `Frames` trait (`animation.rs`) describes “things with frames backed by a `PxImage`”.
+- `AnimatedAssetComponent` ties ECS components to assets and exposes `max_frame_count`.
+- `PxAnimation`, `PxFrameSelector`, `PxFrameTransition`:
+  - Control which frame is used (by index or normalized progress).
+  - Optional ordered dithering to blend between frames.
+- `draw_frame` and `draw_spatial` centralize “draw this animated asset into a `PxImageSliceMut` at a position/anchor/canvas, with filters”.
+- Today, animation is effectively embedded in sprites via these traits and component bindings, which makes it harder to compose or override animation behavior from outside.
+
+### 3.6 World vs camera space
+
+- `PxCanvas` (`camera.rs`) distinguishes:
+  - `World`: positions relative to world, offset by `PxCamera`.
+  - `Camera`: positions relative to the camera (HUD/UI).
+- `draw_spatial` applies `PxCamera` for world objects and keeps camera-space sprites fixed.
+
+### 3.7 UI as layout over pixel primitives
+
+- `ui.rs` defines layout structures:
+  - Containers: `PxRow`, `PxGrid`, `PxStack`, `PxScroll`.
+  - Decoration: `PxMinSize`, `PxMargin`.
+  - Root marker: `PxUiRoot`.
+- `calc_min_size` and `layout_inner` compute per-frame layout in pixel space against `Screen::computed_size`.
+- UI is built from the same primitives as the renderer: `PxRect`, `PxText`, `PxSprite`, `PxFilterLayers<L>`.
+
+### 3.8 Filters as palette-to-palette maps
+
+- `PxFilterAsset` wraps a `PxImage` mapping `[palette_index, frame] -> palette_index`.
+- `PxFilter` attaches a filter to a single entity.
+- `PxFilterLayers<L>` lets a filter apply to:
+  - A single layer (`Single { layer, clip }`)
+  - A range of layers (`Range(RangeInclusive<L>)`)
+  - A list of layers (`Many(Vec<L>)`)
+- `clip` vs `over` distinguishes “pre-layer only entity pixels” vs “post-layer including background”.
+
+### 3.9 Picking integration
+
+- `picking.rs` integrates with `bevy_picking`:
+  - Uses `PxRect` + `PxFilterLayers<L>` as hit regions.
+  - Computes per-layer depths with a `BTreeMap` rather than a fixed z.
+- Current picking is rectangle-based and does not inspect actual sprite pixels or current animation frames.
+
+---
+
+## 4. Potential Problems / Code Smells
+
+### 4.1 `init_screen` never marks itself initialized
+
+**Location:** `src/screen.rs`
+
+```rust
+fn init_screen(
+    mut initialized: Local<bool>,
+    // ...
+) {
+    if *initialized {
+        return;
+    }
+
+    let Some(palette) = palettes.get(&**palette) else {
+        return;
+    };
+
+    // set screen.palette ...
+
+    *initialized = false;
+}
+```
+
+- `initialized` starts as `false`; once a palette is present, this system keeps running every frame.
+- Intended behavior appears to be “run once on successful palette load”, but we never set it to `true`.
+- Results: unnecessary palette copy per frame and redundant overlap with `update_screen_palette`.
+
+### 4.2 `PxImage::trim_right` can shrink width to zero
+
+**Location:** `src/image.rs`
+
+- `trim_right` trims trailing all-zero columns by:
+  - Testing the last column for zero.
+  - Removing it from each row.
+  - Decrementing `self.width`.
+- If the entire image is all zero, `self.width` can reach `0` while the loop still calls `self.height()` (`len / width`), causing division by zero.
+- Likely only triggered by fully transparent/misconfigured assets, but still a correctness bug.
+
+### 4.3 Palette size > 255 not enforced
+
+**Location:** `src/palette.rs` (`Palette::new`)
+
+- Assumes “up to 255 colors” (index 0 is special, rest are color entries).
+- `indices` map uses `i as u8` for color index, without checking how many colors are in the palette.
+- More than 255 colors overflows silently and wraps indices modulo 256 → very confusing visual results.
+
+### 4.4 `Palette::new` uses `unwrap` inside loader
+
+**Location:** `src/palette.rs`
+
+- `image.convert(TextureFormat::Rgba8UnormSrgb).unwrap()` will panic if conversion fails.
+- The loader already returns `Result<Palette, _>`; this should be reported as an error instead.
+
+### 4.5 Global static `ASSET_PALETTE`
+
+**Location:** `src/palette.rs`
+
+- Uses `static mut ASSET_PALETTE`, `AtomicBool`, and `Event` to coordinate palette initialization.
+- The current code is carefully guarded, but the pattern:
+  - Is non-idiomatic in Bevy (compared to resource-based approaches).
+  - Is easy to get wrong if extended (unsafe invariants).
+
+### 4.6 `PxImageSliceMut::for_each_mut` allocates on every call
+
+**Location:** `src/image.rs`
+
+```rust
+self.image.iter_mut().enumerate().collect::<Vec<_>>()[..]
+    .iter_mut()
+    .for_each(|(i, row)| {
+        row.iter_mut().enumerate().collect::<Vec<_>>()[..]
+            .iter_mut()
+            .for_each(|(j, pixel)| {
+                f(slice_idx, image_idx, pixel);
+            });
+    });
+```
+
+- Each call allocates:
+  - A `Vec` of rows with their indices.
+  - For each row, another `Vec` of columns and pixels.
+- This is a hot path used to draw sprites, tilemaps, text, filters, etc. The allocations are unnecessary and expensive.
+
+### 4.7 `PxRect` and `PxLine` draw over entire images
+
+**Locations:** `src/rect.rs`, `src/line.rs`
+
+- `PxRect`’s `draw` loops over `0..image.image_width()` × `0..image.image_height()`, then checks `contains_pixel` and `invert` to decide whether to apply the filter.
+- `PxLine`:
+  - Builds a `HashSet<IVec2>` of all Bresenham positions.
+  - Loops over the entire image, checking membership.
+- These approaches scale poorly with screen size and number of rects/lines.
+
+### 4.8 Minor API / ergonomics issues
+
+- `update_screen_palette` takes two `PaletteHandle` resources (`palette_handle`, `palette`) and uses them differently: confusing naming.
+- `update_key_fields` (`ui.rs`) uses a slightly odd pattern to pick a key event; not wrong, but non-obvious.
+- `PxTiles::pos` depends on `tile_poses` map, which can retain stale entries if tiles are despawned directly.
+
+---
+
+## 5. Easy Wins: Correctness & Performance
+
+These are low-risk, localized changes that are good starting points.
+
+### 5.1 Fix `init_screen` initialization logic
+
+**Change:**
+
+- In `init_screen`, set `*initialized = true` after successfully updating `screen.palette`.
+- Keep `update_screen_palette` as the mechanism for responding to palette changes.
+
+**Benefits:**
+
+- Avoids unnecessary palette copying every frame.
+- Clarifies the intended “run once on initialization” semantics.
+
+---
+
+### 5.2 Harden `PxImage::trim_right`
+
+**Change:**
+
+- Add guards to ensure:
+  - If `self.image.is_empty()` or `self.width == 0`, return immediately.
+  - If trimming would make `self.width` become `0`, stop trimming.
+- Optionally add a small unit test (once a test harness exists) for:
+  - Fully transparent images.
+  - Images with a non-empty last column.
+
+**Benefits:**
+
+- Eliminates a potential division-by-zero crash on malformed assets.
+- Makes trimming behavior explicit and safe.
+
+---
+
+### 5.3 Enforce palette size limit and avoid `unwrap`
+
+**Changes:**
+
+1. In `Palette::new`:
+   - Replace `.convert(...).unwrap()` with an error mapping, e.g.:
+
+     ```rust
+     let image = image
+         .convert(TextureFormat::Rgba8UnormSrgb)
+         .ok_or("could not convert palette image to Rgba8UnormSrgb")?;
+     ```
+
+2. After building `colors`, enforce `colors.len() <= 256`:
+   - If exceeded, return an error like `"palette contains more than 255 colors (max 255)"`.
+
+**Benefits:**
+
+- Avoids panics in the asset loader.
+- Gives clear feedback when a palette image is misconfigured.
+
+---
+
+### 5.4 Implement `PxImageSliceMut::for_each_mut` without allocations
+
+**Change (conceptual):**
+
+- Re-implement `for_each_mut` as:
+  - Precompute:
+    - `row_min`, `row_max` from `slice.min.y` / `slice.max.y`.
+    - `col_min`, `col_max` from `slice.min.x` / `slice.max.x`.
+  - Nested loops:
+
+    ```rust
+    let slice_width = self.slice.width();
+    for (row_index, row) in self.image[row_min..row_max].iter_mut().enumerate() {
+        let y = row_index + row_min;
+        for x in col_min..col_max {
+            let slice_i =
+                (y - self.slice.min.y) * slice_width + (x - self.slice.min.x);
+            let image_i = y * self.width + x;
+            let pixel = &mut row[x];
+            f(slice_i as usize, image_i as usize, pixel);
+        }
+    }
+    ```
+
+- No `Vec` allocations; everything is index arithmetic.
+
+**Benefits:**
+
+- Removes per-call allocations from hot paths.
+- Likely a noticeable improvement at higher resolutions or entity counts.
+
+---
+
+### 5.5 Restrict `PxRect` and `PxLine` drawing to affected regions
+
+**Rect (`PxRect` in `src/rect.rs`):**
+
+- Compute rect bounds in image space once (using the existing position/anchor and slice offsets).
+- Intersect the rect with slice bounds, and iterate only over that intersection, applying filter to image pixels inside / outside as per `invert`.
+
+**Line (`PxLine` in `src/line.rs`):**
+
+- Instead of:
+  - Building a `HashSet` of all Bresenham points, then
+  - Scanning the full image,
+- Use only the Bresenham output:
+  - For each point, map to image coordinates.
+  - Check whether it lies in the slice; if so, apply filter to that pixel.
+  - For `invert`, you may still need some complementary logic, but you can avoid scanning the entire image.
+
+**Benefits:**
+
+- Complexity becomes proportional to object size, not full screen size.
+- Particularly important for larger logical screens or many UI elements.
+
+---
+
+## 6. Baseline Architectural Improvements
+
+These are more structural and can be tackled after (or alongside) the easy wins.
+
+### 6.1 Modularize `screen.rs` and `ui.rs`
+
+**Goal:** Reduce file size and clarify responsibilities.
+
+**Directions:**
+
+- `screen`:
+  - `screen/pipeline.rs` – render graph, `PxPipeline`, `PxUniform`, `PxUniformBuffer`, node registration.
+  - `screen/node.rs` – `PxRenderNode`, queries, layer aggregation.
+  - `screen/draw.rs` – per-type drawing (maps, sprites, text, rects, lines, filters, cursor).
+- `ui`:
+  - `ui/layout.rs` – `calc_min_size`, `layout_inner`, `layout`.
+  - `ui/input.rs` – `PxKeyField`, `PxTextField`, and their update systems.
+  - `ui/widgets.rs` – `PxRow`, `PxGrid`, `PxStack`, `PxScroll`, etc.
+
+**Benefits:**
+
+- Easier navigation and reasoning.
+- Clearer extension points for new drawables and UI patterns.
+
+---
+
+### 6.2 Clarify palette lifecycle and ownership
+
+**Goal:** Reduce reliance on globals and make palette use explicit.
+
+**Potential future refactor:**
+
+- Store “asset palette” as a normal resource and/or asset, referenced by handle.
+- Pass palette information into loaders via settings or context rather than `asset_palette()` global.
+- Keep `Screen::palette` as the runtime palette used by the shader, with `update_screen_palette` as the only mutator.
+
+**Benefits:**
+
+- Safer and easier to test.
+- Opens the door for multiple palettes, palette blending, etc.
+
+---
+
+### 6.3 Sharpen layering / filtering semantics
+
+**Goal:** Make it easier to understand and reuse `PxFilterLayers<L>`.
+
+**Ideas:**
+
+- Provide helper constructors for common patterns:
+  - “Filter exactly this layer, clipped”.
+  - “Overlay filter over these layers, including background”.
+  - “Filter all layers in a UI group”.
+- Consider separating “visual filter layers” from “picking layers” if they diverge further.
+
+**Benefits:**
+
+- Reduces boilerplate and potential mistakes in specifying layer ranges.
+- Makes behavior more discoverable.
+
+---
+
+## 7. Longer-Term Performance Directions
+
+### 7.1 Reuse CPU and GPU buffers
+
+**Idea:**
+
+- Introduce a `PxRenderBuffer` resource containing:
+  - CPU `PxImage` backing storage sized to `Screen::computed_size`.
+  - GPU `Texture` reused across frames.
+- On screen resize:
+  - Reallocate both buffers.
+- In `PxRenderNode`:
+  - Clear the existing buffer each frame.
+  - Upload new data into the existing texture (no `create_texture` per frame).
+
+**Benefit:**
+
+- Less allocation / texture churn at high frame rates.
+
+### 7.2 Explore GPU-centric palette rendering
+
+**Idea:**
+
+- Keep assets palette-indexed but:
+  - Upload sprites/tiles/typefaces as `R8Uint` textures.
+  - Draw them directly into a render target using instancing / batching, with palette lookup and filters in shaders.
+- Use CPU compositing only when necessary (advanced spatial filters, special effects).
+
+**Benefit:**
+
+- Better scalability for large scenes and resolutions.
+- Retains palette-driven art style while leveraging GPU strengths.
+
+---
+
+## 8. Directional Architecture Changes (Aligned with Project Goals)
+
+These changes align directly with the 2025-12 project goals and should be considered alongside the existing roadmap.
+
+### 8.1 Frame generation as a standalone module
+
+**Idea:**
+
+- Introduce a small set of reusable components and traits:
+  - `PxFrameSource` (asset or runtime source of frames).
+  - `PxFrameView` (current frame index + optional metadata like size or anchor).
+  - `PxFrameControl` (explicit or computed frame selection).
+- Sprites and other drawables should depend only on `PxFrameView`, not on animation traits.
+
+**Benefit:**
+
+- Frames become composable; animation logic can be swapped or driven externally.
+
+### 8.2 Animation as a separate, optional system
+
+**Idea:**
+
+- Move animation into a module that updates `PxFrameControl` based on:
+  - Manual steps (events, state machines).
+  - Time-based functions (linear mapping, easing, or custom math).
+  - Deterministic stepping (fixed tick rate independent of frame rate).
+- The animation system should not be required for rendering.
+
+**Benefit:**
+
+- Users gain precise control of frame progression and can opt out entirely.
+
+### 8.3 Pixel-perfect picking for current frame
+
+**Idea:**
+
+- Extend picking to support:
+  - A `PxHitMask` source (derived from the current `PxFrameView`).
+  - Querying a pixel at cursor position to test transparency or a specific index.
+- Keep the existing rectangle picking for coarse/fast checks, but allow pixel-perfect refinement when needed.
+
+**Benefit:**
+
+- Enables precise mouse interaction and future collision logic based on pixels.
+
+---
+
+### 8.4 Composite sprites from multiple frame parts
+
+**Idea:**
+
+- Treat composite sprites as another `Frames + Spatial` source.
+- Introduce a small frame-binding layer so parts derive their frame from a master:
+  - `Inherit` (normalized master progress).
+  - `Map(Vec<usize>)` (explicit per-part frame mapping).
+  - Optional `Offset`/`Scale` (simple timing adjustments).
+- Support three implementations behind the same interface:
+  1. **Baked composite asset** (`PxCompositeSpriteAsset`) that compiles parts into a single sheet.
+  2. **Runtime composite** (`PxCompositeSprite`) that draws parts into a shared slice each frame.
+  3. **Entity-per-part** helpers that propagate the master frame to children.
+
+**Benefit:**
+
+- One animation source controls many visual parts.
+- Composition is flexible without duplicating renderer logic.
+- Baked assets preserve the GPU path, while runtime composition enables customization.
+
+---
+
+## 9. Implementation Strategy (Prioritized)
+
+### Phase 1 – Quick, Safe Wins (Completed)
+
+1. **Fix `init_screen` flag** (done)
+   - Set `*initialized = true` after palette is first applied.
+   - Confirm palette still updates via `update_screen_palette`.
+
+2. **Harden `PxImage::trim_right`** (done)
+   - Add width/empty checks.
+   - Ensure no division-by-zero when trimming fully transparent images.
+
+3. **Improve `Palette::new` robustness** (done)
+   - Replace `unwrap` on `convert`.
+   - Enforce `<= 255` colors and emit a clear error otherwise.
+
+4. **Optimize `PxImageSliceMut::for_each_mut`** (done)
+   - Remove all `Vec` allocations; use index arithmetic loops.
+
+5. **Constrain `PxRect` drawing** (done)
+   - Limit iteration to intersecting region of rect and slice.
+
+6. **Constrain `PxLine` drawing** (done)
+   - Draw only along Bresenham path (plus any required inverted region handling) without scanning full image.
+
+### Phase 2 – Structural Clean-up (Completed)
+
+7. **Refactor `screen.rs` into submodules** (done)
+   - Keep public API stable; this is internal re-organization.
+
+8. **Refactor `ui.rs` into layout/input/widgets modules** (done)
+   - Simplify and clarify key/text field flows.
+
+### Phase 3 – Palette & Layers
+
+9. **Redesign palette lifecycle** (done)
+   - Replace global `ASSET_PALETTE` with resource-centric approach.
+   - Adjust loaders to use explicit palette context.
+
+10. **Enhance `PxFilterLayers` ergonomics** (done)
+    - Add helpers for common patterns and clearer docs.
+
+### Phase 4 – Advanced Optimization
+
+11. **Add `PxRenderBuffer` for buffer reuse** (done)
+    - Reuse CPU/GPU buffers across frames.
+
+12. **Prototype GPU-centric palette pipeline** (prototype done: sprites only)
+    - Add `gpu_palette` feature flag and GPU sprite pass (palette lookup in shader).
+    - Opt-in via `PxGpuSprite`; CPU renderer skips those sprites.
+    - Current limits: sprites only, no filters, no dithering, drawn after CPU pass.
+
+### Phase 5 – Frame / Animation / Picking Goals
+
+13. **Introduce frame-view components** (done)
+    - Added `PxFrameView` and `PxFrameControl` to decouple frame selection from sprites.
+
+14. **Extract animation to a separate module** (done)
+    - Frame selection and drawing moved to `frame` module; `PxAnimationPlugin` is opt-in.
+
+15. **Add pixel-perfect picking** (done)
+    - `PxPixelPick` enables per-pixel picking for sprites using current frame data.
+
+---
+
+This plan starts with the smallest, safest changes (Phase 1), which you can implement and ship incrementally, and then moves toward deeper refactors and optimizations as needed.
diff --git a/CHANGELOG.md b/CHANGELOG.md
index b81a4dd..167d072 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,23 +1,51 @@
 # Changelog
 
+## 0.9.0-dev (Unreleased)
+
+### Added
+
+- Frame view/control API: `PxFrameView`, `PxFrameControl`, `PxFrameSelector`, `PxFrameTransition`, and
+  `PxFrame` alias for manual or externally-driven frame selection.
+- `PxAnimationPlugin` so animation systems are opt-in.
+- Pixel-perfect sprite picking with `PxPixelPick` (uses the current frame, including dithering).
+- `gpu_palette` feature with `PxGpuSprite` and a GPU sprite pass (sprites only; filters and dithering
+  are not supported yet). See `ARCHITECTURE_REVIEW.md` for details.
+- New examples: `pixel_pick` and `gpu_palette`.
+
+### Changed
+
+- Animation systems are no longer part of `PxPlugin`; add `PxAnimationPlugin` explicitly.
+- Rendering now reuses screen buffers across frames to reduce allocations.
+- `PxFilterLayers` gained helper constructors for common layer/filter patterns.
+
+### Fixed
+
+- `PxImage::trim_right` no longer risks shrinking to zero width.
+- Palette loading now reports conversion errors and rejects palettes with more than 255 colors.
+
+### Performance
+
+- Eliminated per-call allocations in `PxImageSliceMut::for_each_mut`.
+- `PxRect` and `PxLine` drawing now iterates only over affected pixels instead of the full screen.
+
 ## 0.8 (2025-01-01)
 
 ### Added
 
 - `PxSprite` and `PxFilter` components to be used instead of `Handle<Px{Sprite,Filter}Asset>` (which
-were called `Handle<Px{Sprite,Filter}>`)
+  were called `Handle<Px{Sprite,Filter}>`)
 - `PxAnimation` component
 - `PxMap` component, which contains `PxTiles`, which was previously called `PxMap` and is no longer
-a component
+  a component
 - `ScreenSize` enum, with a variant that allows dynamically changing draw resolution as the window's
-aspect ratio changes. `PxPlugin` now accepts an `impl Into<ScreenSize>` for the screen size (which
-may be a `UVec2`, like before).
+  aspect ratio changes. `PxPlugin` now accepts an `impl Into<ScreenSize>` for the screen size (which
+  may be a `UVec2`, like before).
 - `PaletteHandle` resources, which contains the current `Handle<Palette>`
 - `SelectLayerFn` trait, which layer selection functions must now implement. It has the additional
-bound of `Clone`.
+  bound of `Clone`.
 - `PaletteLoader` (`.px_palette.png`), `PxSpriteLoader` (`.px_sprite.png`), `PxFilterLoader`
-(`.px_filter.png`), `PxTypefaceLoader` (`.px_typeface.png`) and `PxTilesetLoader`
-(`.px_tileset.png`)
+  (`.px_filter.png`), `PxTypefaceLoader` (`.px_typeface.png`) and `PxTilesetLoader`
+  (`.px_tileset.png`)
 - `PxButtonSprite` and `PxButtonFilter` components
 - `Orthogonal` and `Diagonal` math types
 
@@ -25,16 +53,16 @@ bound of `Clone`.
 
 - Updated `bevy` to 0.15
 - `seldom_pixel` entities are extracted to the render world and drawn there. Involved components
-implement `ExtractComponent` and involved resources implement `ExtractResource`. Due to this change,
-entities on the same layer Z-fight. This behavior may change in the future.
+  implement `ExtractComponent` and involved resources implement `ExtractResource`. Due to this change,
+  entities on the same layer Z-fight. This behavior may change in the future.
 - `PxSpriteData`, `PxFilter`, and `PxTilesetData` are now called `PxSpriteAsset`, `PxFilterAsset`,
-and `PxTileset` respectively
+  and `PxTileset` respectively
 - `PxAnimationDirection`, `PxAnimationDuration`, `PxAnimationFinishBehavior`, and
-`PxAnimationFrameTransition` are no longer components and are instead fields of the new
-`PxAnimation` component
+  `PxAnimationFrameTransition` are no longer components and are instead fields of the new
+  `PxAnimation` component
 - `PxText` has a `Handle<PxTypeface>` component, replacing the handle's use as a component
 - `PxEmitterFrequency` and `PxEmitterSimulation` are no longer components and are instead fields of
-the new `PxEmitter` component
+  the new `PxEmitter` component
 - `Palette` is an asset instead of a resource
 - `#[px_layer]` derives `ExtractComponent`
 - `PxAnimationFinished`, `PxHover`, and `PxClick` are table components. They were sparse set.
@@ -42,12 +70,12 @@ the new `PxEmitter` component
 ### Removed
 
 - The built-in asset management (`PxAsset`, `PxAssets`, `PxAssetTrait`, `PxAssetData`, and
-`LoadingAssets`) in favor of the new asset loaders.
+  `LoadingAssets`) in favor of the new asset loaders.
 - Bundles (`PxSpriteBundle`, `PxFilterBundle`, `PxAnimationBundle`, `PxTextBundle`, `PxMapBundle`,
-`PxTileBundle`, `PxEmitterBundle`, `PxButtonSpriteBundle`, and `PxButtonFilterBundle`) in favor of
-required components
+  `PxTileBundle`, `PxEmitterBundle`, `PxButtonSpriteBundle`, and `PxButtonFilterBundle`) in favor of
+  required components
 - `PxEmitterSprites`, `PxEmitterRange`, and `PxEmitterFn` in favor of `Vec<Handle<PxSprite>>`,
-`IRect`, and `Box<dyn Fn(&mut EntityCommands) + Send + Sync>` fields in `PxEmitter`
+  `IRect`, and `Box<dyn Fn(&mut EntityCommands) + Send + Sync>` fields in `PxEmitter`
 - `PxIdleSprite`, `PxHoverSprite`, and `PxClickSprite` in favor of `PxButtonSprite`
 - `PxIdleFilter`, `PxHoverFilter`, and `PxClickFilter` in favor of `PxButtonFilter`
 - `PxAnimationStart` in favor of an `Instant` field in `PxAnimation`
diff --git a/Cargo.toml b/Cargo.toml
index c2a1c2d..2078506 100644
--- a/Cargo.toml
+++ b/Cargo.toml
@@ -20,6 +20,7 @@ headed = [
     "bevy_input_focus",
 ]
 default = ["headed"]
+gpu_palette = ["headed"]
 line = ["line_drawing"]
 nav = ["seldom_map_nav"]
 particle = ["bevy_turborand"]
@@ -32,6 +33,7 @@ serde = "1.0"
 line_drawing = { version = "1.0", optional = true }
 bevy_utils = { version = "0.17.1", default-features = false }
 bevy_math = { version = "0.17.1", default-features = false }
+bevy_mesh = { version = "0.17.1", default-features = false }
 bevy_transform = { version = "0.17.1", default-features = false }
 bevy_color = { version = "0.17.1", default-features = false }
 bevy_platform = { version = "0.17.1", default-features = false }
@@ -51,21 +53,31 @@ bevy_shader = { version = "0.17.1", default-features = false, optional = true }
 bevy_core_pipeline = { version = "0.17.1", default-features = false, optional = true }
 bevy_picking = { version = "0.17.1", default-features = false, optional = true }
 bevy_input_focus = { version = "0.17.1", default-features = false, optional = true }
-bevy_turborand = { version = "0.11.0", optional = true }
-seldom_map_nav = { version = "0.9.0", optional = true }
+bytemuck = { version = "1.16.2", features = ["derive"] }
+bevy_turborand = { version = "0.12.0", optional = true }
+seldom_map_nav = { version = "0.10.0", optional = true }
 seldom_pixel_macros = { version = "0.3.0-dev", path = "macros" }
-seldom_state = { version = "0.14.0", optional = true }
+seldom_state = { version = "0.15.0", optional = true }
 
 [dev-dependencies]
 bevy = "0.17.1"
-leafwing-input-manager = "0.17.0"
+leafwing-input-manager = "0.18.0"
 rand = "0.8.5"
-seldom_state = { version = "0.14.0", features = ["leafwing_input"] }
+insta = "1.39.0"
+seldom_state = { version = "0.15.0", features = ["leafwing_input"] }
 
 [[example]]
 name = "line"
 required-features = ["line"]
 
+[[example]]
+name = "gpu_palette"
+required-features = ["gpu_palette"]
+
+[[example]]
+name = "composite_gpu"
+required-features = ["gpu_palette"]
+
 [[example]]
 name = "particles"
 required-features = ["particle"]
diff --git a/GOALS.md b/GOALS.md
new file mode 100644
index 0000000..9316b01
--- /dev/null
+++ b/GOALS.md
@@ -0,0 +1,28 @@
+# seldom_pixel Goals
+
+Last updated: 2025-12-22
+
+## Product Goals
+
+- Make frame generation a standalone, composable concern.
+- Keep animation optional and fully controllable (manual or math-driven).
+- Support pixel-perfect picking against the current frame.
+- Support composite sprites composed from multiple frame parts (baked, runtime, or entity-based).
+
+## Design Goals
+
+- Separate data (frames) from behavior (animation) cleanly.
+- Keep rendering predictable: drawables consume a "current frame" view.
+- Preserve headless capability and maintain palette-indexed assets.
+
+## Non-Goals (for now)
+
+- A fully GPU-only rendering path.
+- Overhauling the public API in a breaking way.
+- Removing the existing rectangle-based picking.
+
+## Open Questions
+
+- Should pixel-perfect picking use raw frame data, post-filter data, or both?
+- How should frame selection be expressed: component, resource, or trait object?
+- What is the simplest public API that still allows manual control?
diff --git a/README.md b/README.md
index eba9d91..673891f 100644
--- a/README.md
+++ b/README.md
@@ -84,6 +84,11 @@ seldom_pixel = "*"
 
 Then add `PxPlugin` to your app. Check out the examples for further usage.
 
+### GPU palette path (experimental)
+
+Enable the `gpu_palette` feature and add `PxGpuSprite` or `PxGpuComposite` to entities you want
+rendered via the GPU palette pass. Filters and dithering are not supported on this path yet.
+
 ## Compatibility
 
 | Bevy | `seldom_state` | `seldom_map_nav` | `seldom_interop` | `bevy_ecs_tilemap` | `seldom_pixel` |
diff --git a/examples/animated_filters.rs b/examples/animated_filters.rs
index f76627a..d36bbb9 100644
--- a/examples/animated_filters.rs
+++ b/examples/animated_filters.rs
@@ -14,6 +14,7 @@ fn main() {
                 ..default()
             }),
             PxPlugin::<Layer>::new(UVec2::new(51, 35), "palette/palette_1.palette.png"),
+            PxAnimationPlugin,
         ))
         .insert_resource(ClearColor(Color::BLACK))
         .add_systems(Startup, init)
diff --git a/examples/animated_sprites.rs b/examples/animated_sprites.rs
index edf4a08..b76a812 100644
--- a/examples/animated_sprites.rs
+++ b/examples/animated_sprites.rs
@@ -14,6 +14,7 @@ fn main() {
                 ..default()
             }),
             PxPlugin::<Layer>::new(UVec2::new(51, 35), "palette/palette_1.palette.png"),
+            PxAnimationPlugin,
         ))
         .insert_resource(ClearColor(Color::BLACK))
         .add_systems(Startup, init)
diff --git a/examples/animated_text.rs b/examples/animated_text.rs
index 2dd3d21..ee11d60 100644
--- a/examples/animated_text.rs
+++ b/examples/animated_text.rs
@@ -14,6 +14,7 @@ fn main() {
                 ..default()
             }),
             PxPlugin::<Layer>::new(UVec2::splat(64), "palette/palette_1.palette.png"),
+            PxAnimationPlugin,
         ))
         .insert_resource(ClearColor(Color::BLACK))
         .add_systems(Startup, init)
diff --git a/examples/animated_tilemap.rs b/examples/animated_tilemap.rs
index 31fed87..83eb85d 100644
--- a/examples/animated_tilemap.rs
+++ b/examples/animated_tilemap.rs
@@ -15,6 +15,7 @@ fn main() {
                 ..default()
             }),
             PxPlugin::<Layer>::new(UVec2::splat(16), "palette/palette_1.palette.png"),
+            PxAnimationPlugin,
         ))
         .insert_resource(ClearColor(Color::BLACK))
         .add_systems(Startup, init)
diff --git a/examples/composite_animation.rs b/examples/composite_animation.rs
new file mode 100644
index 0000000..1284fbf
--- /dev/null
+++ b/examples/composite_animation.rs
@@ -0,0 +1,67 @@
+// In this program, a composed sprite is animated by driving a master frame manually.
+
+use bevy::prelude::*;
+use seldom_pixel::prelude::*;
+
+#[derive(Component)]
+struct CompositeAnimator;
+
+fn main() {
+    App::new()
+        .add_plugins((
+            DefaultPlugins.set(WindowPlugin {
+                primary_window: Some(Window {
+                    resolution: UVec2::splat(512).into(),
+                    ..default()
+                }),
+                ..default()
+            }),
+            PxPlugin::<Layer>::new(UVec2::splat(16), "palette/palette_1.palette.png"),
+        ))
+        .insert_resource(ClearColor(Color::BLACK))
+        .add_systems(Startup, init)
+        .add_systems(Update, animate_composite)
+        .run();
+}
+
+fn init(assets: Res<AssetServer>, mut commands: Commands) {
+    commands.spawn(Camera2d);
+
+    let runner = assets.load("sprite/runner.px_sprite.png");
+
+    let composite = PxCompositeSprite::new(vec![
+        PxCompositePart {
+            sprite: runner.clone(),
+            offset: IVec2::ZERO,
+            frame: PxFrameBinding::default(),
+            filter: None,
+        },
+        PxCompositePart {
+            sprite: runner,
+            offset: IVec2::new(8, 0),
+            frame: PxFrameBinding::default(),
+            filter: None,
+        },
+    ]);
+
+    commands.spawn((
+        composite,
+        PxPosition(IVec2::splat(8)),
+        PxFrameControl::from(PxFrameSelector::Normalized(0.)),
+        CompositeAnimator,
+    ));
+}
+
+fn animate_composite(
+    time: Res<Time>,
+    mut query: Query<&mut PxFrameControl, With<CompositeAnimator>>,
+) {
+    let progress = (time.elapsed_secs() * 1.5).fract();
+    for mut frame in &mut query {
+        frame.selector = PxFrameSelector::Normalized(progress);
+        frame.transition = PxFrameTransition::None;
+    }
+}
+
+#[px_layer]
+struct Layer;
diff --git a/examples/composite_gpu.rs b/examples/composite_gpu.rs
new file mode 100644
index 0000000..5920c6d
--- /dev/null
+++ b/examples/composite_gpu.rs
@@ -0,0 +1,48 @@
+// In this program, a composite sprite is rendered via the GPU palette path.
+
+use bevy::prelude::*;
+use seldom_pixel::prelude::*;
+
+fn main() {
+    App::new()
+        .add_plugins((
+            DefaultPlugins.set(WindowPlugin {
+                primary_window: Some(Window {
+                    resolution: UVec2::splat(512).into(),
+                    ..default()
+                }),
+                ..default()
+            }),
+            PxPlugin::<Layer>::new(UVec2::splat(16), "palette/palette_1.palette.png"),
+        ))
+        .insert_resource(ClearColor(Color::BLACK))
+        .add_systems(Startup, init)
+        .run();
+}
+
+fn init(assets: Res<AssetServer>, mut commands: Commands) {
+    commands.spawn(Camera2d);
+
+    let base = assets.load("sprite/mage.px_sprite.png");
+    let overlay = assets.load("sprite/snow_2.px_sprite.png");
+
+    let composite = PxCompositeSprite::new(vec![
+        PxCompositePart {
+            sprite: base,
+            offset: IVec2::ZERO,
+            frame: PxFrameBinding::default(),
+            filter: None,
+        },
+        PxCompositePart {
+            sprite: overlay,
+            offset: IVec2::new(2, 6),
+            frame: PxFrameBinding::default(),
+            filter: None,
+        },
+    ]);
+
+    commands.spawn((composite, PxGpuComposite, PxPosition(IVec2::splat(8))));
+}
+
+#[px_layer]
+struct Layer;
diff --git a/examples/composite_sprite.rs b/examples/composite_sprite.rs
new file mode 100644
index 0000000..138cafb
--- /dev/null
+++ b/examples/composite_sprite.rs
@@ -0,0 +1,48 @@
+// In this program, a sprite is composed from multiple sprite parts.
+
+use bevy::prelude::*;
+use seldom_pixel::prelude::*;
+
+fn main() {
+    App::new()
+        .add_plugins((
+            DefaultPlugins.set(WindowPlugin {
+                primary_window: Some(Window {
+                    resolution: UVec2::splat(512).into(),
+                    ..default()
+                }),
+                ..default()
+            }),
+            PxPlugin::<Layer>::new(UVec2::splat(16), "palette/palette_1.palette.png"),
+        ))
+        .insert_resource(ClearColor(Color::BLACK))
+        .add_systems(Startup, init)
+        .run();
+}
+
+fn init(assets: Res<AssetServer>, mut commands: Commands) {
+    commands.spawn(Camera2d);
+
+    let base = assets.load("sprite/mage.px_sprite.png");
+    let effect = assets.load("sprite/snow_1.px_sprite.png");
+
+    let composite = PxCompositeSprite::new(vec![
+        PxCompositePart {
+            sprite: base,
+            offset: IVec2::ZERO,
+            frame: PxFrameBinding::default(),
+            filter: None,
+        },
+        PxCompositePart {
+            sprite: effect,
+            offset: IVec2::new(4, 6),
+            frame: PxFrameBinding::default(),
+            filter: None,
+        },
+    ]);
+
+    commands.spawn((composite, PxPosition(IVec2::splat(8))));
+}
+
+#[px_layer]
+struct Layer;
diff --git a/examples/filter_layers.rs b/examples/filter_layers.rs
index 8c256a5..5011966 100644
--- a/examples/filter_layers.rs
+++ b/examples/filter_layers.rs
@@ -85,9 +85,8 @@ fn change_filter(
                 1 => PxFilterLayers::single_over(Layer::Middle(0)),
                 // Filters the Back and Front layers specifically
                 2 => PxFilterLayers::Many(vec![Layer::Back, Layer::Front]),
-                // Filters every layer matched by this `Fn`
-                // Use `.into()` to convert a `Fn(&Layer) -> bool` to a `PxFilterLayers::Select`
-                3 => (|layer: &Layer| matches!(layer, Layer::Middle(layer) if *layer >= 0)).into(),
+                // Filters all Middle(n) layers where n >= 0 (using layer ordering)
+                3 => PxFilterLayers::Range(Layer::Middle(0)..=Layer::Middle(i32::MAX)),
                 _ => unreachable!(),
             },
         ));
diff --git a/examples/gpu_palette.rs b/examples/gpu_palette.rs
new file mode 100644
index 0000000..2f08b52
--- /dev/null
+++ b/examples/gpu_palette.rs
@@ -0,0 +1,63 @@
+// Demonstrates the experimental GPU palette sprite path.
+
+use bevy::prelude::*;
+use seldom_pixel::prelude::*;
+
+fn main() {
+    App::new()
+        .add_plugins((
+            DefaultPlugins.set(WindowPlugin {
+                primary_window: Some(Window {
+                    resolution: UVec2::splat(512).into(),
+                    ..default()
+                }),
+                ..default()
+            }),
+            PxPlugin::<Layer>::new(UVec2::new(48, 32), "palette/palette_1.palette.png"),
+        ))
+        .insert_resource(ClearColor(Color::BLACK))
+        .add_systems(Startup, init)
+        .run();
+}
+
+fn init(assets: Res<AssetServer>, mut commands: Commands) {
+    commands.spawn(Camera2d);
+
+    let mage = assets.load("sprite/mage.px_sprite.png");
+    let runner = assets.load("sprite/runner.px_sprite.png");
+    let mage_cast = assets.load("sprite/mage_cast.px_sprite.png");
+
+    // CPU sprite on the back layer (left).
+    commands.spawn((
+        PxSprite(mage_cast),
+        PxPosition(IVec2::new(2, 10)),
+        PxAnchor::BottomLeft,
+        Layer::Back,
+    ));
+
+    // GPU palette sprite in the middle layer (center).
+    commands.spawn((
+        PxSprite(runner),
+        PxGpuSprite,
+        PxPosition(IVec2::new(18, 10)),
+        PxAnchor::BottomLeft,
+        Layer::Middle,
+    ));
+
+    // CPU sprite on the front layer (right) to demonstrate depth ordering.
+    commands.spawn((
+        PxSprite(mage),
+        PxPosition(IVec2::new(34, 10)),
+        PxAnchor::BottomLeft,
+        Layer::Front,
+    ));
+}
+
+// Layers are in render order: back to front.
+#[px_layer]
+enum Layer {
+    #[default]
+    Back,
+    Middle,
+    Front,
+}
diff --git a/examples/particles.rs b/examples/particles.rs
index cc6d6bb..838bf4f 100644
--- a/examples/particles.rs
+++ b/examples/particles.rs
@@ -16,6 +16,7 @@ fn main() {
                 ..default()
             }),
             PxPlugin::<Layer>::new(UVec2::splat(32), "palette/palette_1.palette.png"),
+            PxAnimationPlugin,
         ))
         .insert_resource(ClearColor(Color::BLACK))
         .add_systems(Startup, init)
diff --git a/examples/pixel_pick.rs b/examples/pixel_pick.rs
new file mode 100644
index 0000000..43be20c
--- /dev/null
+++ b/examples/pixel_pick.rs
@@ -0,0 +1,100 @@
+// In this program, clicking a sprite highlights the clicked pixel with a filter.
+
+use bevy::prelude::*;
+use bevy_picking::prelude::{
+    Click, InteractionPlugin, Pickable, PickingPlugin, Pointer, PointerButton, PointerInputPlugin,
+};
+use seldom_pixel::prelude::*;
+
+#[derive(Resource, Default)]
+struct PickedPixel(Option<Entity>);
+
+fn main() {
+    let mut app = App::new();
+    app.add_plugins((
+        DefaultPlugins.set(WindowPlugin {
+            primary_window: Some(Window {
+                resolution: UVec2::splat(512).into(),
+                ..default()
+            }),
+            ..default()
+        }),
+        PxPlugin::<Layer>::new(UVec2::splat(32), "palette/palette_1.palette.png"),
+        (PointerInputPlugin, PickingPlugin, InteractionPlugin),
+    ));
+
+    app.insert_resource(ClearColor(Color::BLACK))
+        .init_resource::<PickedPixel>()
+        .add_systems(Startup, init)
+        .add_systems(Update, highlight_on_click)
+        .run();
+}
+
+fn init(assets: Res<AssetServer>, mut commands: Commands) {
+    commands.spawn(Camera2d);
+
+    let sprite = assets.load("sprite/mage.px_sprite.png");
+
+    commands.spawn((
+        PxSprite(sprite),
+        PxPixelPick,
+        PxPosition(IVec2::new(8, 8)),
+        PxAnchor::BottomLeft,
+        PxCanvas::Camera,
+    ));
+}
+
+fn highlight_on_click(
+    mut clicks: MessageReader<Pointer<Click>>,
+    cursor: Res<PxCursorPosition>,
+    camera: Res<PxCamera>,
+    sprites: Query<(&Layer, &PxCanvas), With<PxPixelPick>>,
+    mut commands: Commands,
+    mut picked: ResMut<PickedPixel>,
+    assets: Res<AssetServer>,
+) {
+    let Some(cursor) = **cursor else {
+        return;
+    };
+    let cursor = cursor.as_ivec2();
+
+    for click in clicks.read() {
+        if click.event.button != PointerButton::Primary {
+            continue;
+        }
+
+        let Ok((layer, canvas)) = sprites.get(click.entity) else {
+            continue;
+        };
+
+        let mut highlight_pos = cursor;
+        if matches!(canvas, PxCanvas::World) {
+            highlight_pos += **camera;
+        }
+
+        let entity = if let Some(entity) = picked.0 {
+            entity
+        } else {
+            let entity = commands
+                .spawn((
+                    PxRect(UVec2::ONE),
+                    PxAnchor::BottomLeft,
+                    PxFilter(assets.load("filter/invert.px_filter.png")),
+                    Pickable::IGNORE,
+                ))
+                .id();
+            picked.0 = Some(entity);
+            entity
+        };
+
+        commands.entity(entity).insert((
+            PxPosition(highlight_pos),
+            layer.clone(),
+            *canvas,
+            PxFilterLayers::single_clip(layer.clone()),
+        ));
+    }
+}
+
+#[px_layer]
+struct Layer;
diff --git a/examples/rect.rs b/examples/rect.rs
new file mode 100644
index 0000000..673df29
--- /dev/null
+++ b/examples/rect.rs
@@ -0,0 +1,40 @@
+// In this program, a rectangle filter is applied over a region
+
+use bevy::prelude::*;
+use seldom_pixel::prelude::*;
+
+fn main() {
+    App::new()
+        .add_plugins((
+            DefaultPlugins.set(WindowPlugin {
+                primary_window: Some(Window {
+                    resolution: UVec2::splat(512).into(),
+                    ..default()
+                }),
+                ..default()
+            }),
+            PxPlugin::<Layer>::new(UVec2::splat(32), "palette/palette_1.palette.png"),
+        ))
+        .insert_resource(ClearColor(Color::BLACK))
+        .add_systems(Startup, init)
+        .run();
+}
+
+fn init(assets: Res<AssetServer>, mut commands: Commands) {
+    commands.spawn(Camera2d);
+
+    let mage = assets.load("sprite/mage.px_sprite.png");
+
+    commands.spawn((PxSprite(mage), PxPosition(IVec2::splat(16))));
+
+    // Apply a filter only within a rectangular region.
+    commands.spawn((
+        PxRect(UVec2::new(12, 10)),
+        PxPosition(IVec2::new(10, 22)),
+        PxFilterLayers::single_over(Layer),
+        PxFilter(assets.load("filter/invert.px_filter.png")),
+    ));
+}
+
+#[px_layer]
+struct Layer;
diff --git a/examples/state.rs b/examples/state.rs
index cebff9f..d0e38fd 100644
--- a/examples/state.rs
+++ b/examples/state.rs
@@ -17,8 +17,9 @@ fn main() {
                 ..default()
             }),
             InputManagerPlugin::<Action>::default(),
-            StateMachinePlugin,
+            StateMachinePlugin::default(),
             PxPlugin::<Layer>::new(UVec2::splat(16), "palette/palette_1.palette.png"),
+            PxAnimationPlugin,
         ))
         .insert_resource(ClearColor(Color::BLACK))
         .add_systems(Startup, init)
@@ -43,10 +44,7 @@ fn init(assets: Res<AssetServer>, mut commands: Commands) {
     commands.spawn((
         PxSprite(idle.clone()),
         PxPosition(IVec2::splat(8)),
-        InputManagerBundle {
-            input_map: InputMap::default().with(Action::Cast, KeyCode::Space),
-            ..default()
-        },
+        InputMap::default().with(Action::Cast, KeyCode::Space),
         StateMachine::default()
             .trans::<Idle, _>(just_pressed(Action::Cast), Cast)
             .on_enter::<Cast>(move |entity| {
diff --git a/examples/text.rs b/examples/text.rs
index ecc5bab..7f93b7d 100644
--- a/examples/text.rs
+++ b/examples/text.rs
@@ -23,12 +23,15 @@ fn main() {
 fn init(assets: Res<AssetServer>, mut cmd: Commands) {
     cmd.spawn(Camera2d);
 
-    // Spawn text. Since we want the text wrap automatically, we wrap it in UI.
-    PxContainer::build(PxText::build(
-        "THE MITOCHONDRIA IS THE POWERHOUSE OF THE CELL",
-        assets.load("typeface/typeface.px_typeface.png"),
-    ))
-    .spawn(&mut cmd);
+    // Spawn text. Since we want the text to wrap automatically, we wrap it in UI.
+    cmd.spawn((
+        Layer,
+        PxUiRoot,
+        PxText::new(
+            "THE MITOCHONDRIA IS THE POWERHOUSE OF THE CELL",
+            assets.load("typeface/typeface.px_typeface.png"),
+        ),
+    ));
 }
 
 #[px_layer]
diff --git a/examples/text_filter.rs b/examples/text_filter.rs
index dbaba95..f7ed1c2 100644
--- a/examples/text_filter.rs
+++ b/examples/text_filter.rs
@@ -23,15 +23,16 @@ fn main() {
 fn init(assets: Res<AssetServer>, mut cmd: Commands) {
     cmd.spawn(Camera2d);
 
-    // Spawn text. Since we want the text wrap automatically, we wrap it in UI.
-    PxContainer::build(
-        PxText::build(
+    // Spawn text. Since we want the text to wrap automatically, we wrap it in UI.
+    cmd.spawn((
+        Layer,
+        PxUiRoot,
+        PxText::new(
             "THE MITOCHONDRIA IS THE POWERHOUSE OF THE CELL",
             assets.load("typeface/typeface.px_typeface.png"),
-        )
-        .filter(assets.load("filter/dim.px_filter.png")),
-    )
-    .spawn(&mut cmd);
+        ),
+        PxFilter(assets.load("filter/dim.px_filter.png")),
+    ));
 }
 
 #[px_layer]
diff --git a/lefthook.yml b/lefthook.yml
new file mode 100644
index 0000000..3797f35
--- /dev/null
+++ b/lefthook.yml
@@ -0,0 +1,12 @@
+pre-commit:
+  parallel: true
+  commands:
+    rustfmt-check:
+      run: cargo fmt --all -- --check
+    cargo-clippy:
+      run: cargo clippy
+
+pre-push:
+  commands:
+    tests:
+      run: cargo test --lib
diff --git a/rust-toolchain.toml b/rust-toolchain.toml
new file mode 100644
index 0000000..d0ead5e
--- /dev/null
+++ b/rust-toolchain.toml
@@ -0,0 +1,3 @@
+[toolchain]
+channel = "stable"
+components = ["clippy", "rustfmt"]
diff --git a/src/animation.rs b/src/animation.rs
index cd82501..be4ecb6 100644
--- a/src/animation.rs
+++ b/src/animation.rs
@@ -1,80 +1,65 @@
 //! Animation
+//!
+//! Optional animation systems that drive [`PxFrameControl`] updates.
 
 use std::time::Duration;
 
 use bevy_platform::time::Instant;
 
-use crate::position::Spatial;
-use crate::{image::PxImageSliceMut, prelude::*, set::PxSet};
+pub use crate::frame::{
+    PxFrame, PxFrameControl, PxFrameCount, PxFrameSelector, PxFrameTransition, PxFrameView,
+};
+use bevy_asset::AssetEvent;
+
+use crate::{prelude::*, set::PxSet};
+
+/// Optional plugin that installs the default animation systems.
+#[derive(Default)]
+pub struct PxAnimationPlugin;
+
+impl Plugin for PxAnimationPlugin {
+    fn build(&self, app: &mut App) {
+        plug(app);
+    }
+}
 
 pub(crate) fn plug(app: &mut App) {
     app.add_systems(
         PostUpdate,
         (
-            update_animations::<PxSprite>,
-            update_animations::<PxFilter>,
-            update_animations::<PxText>,
-            update_animations::<PxMap>,
+            sync_frame_counts_on_component_change::<PxSprite>,
+            sync_frame_counts_on_component_change::<PxFilter>,
+            sync_frame_counts_on_component_change::<PxText>,
+            sync_frame_counts_on_component_change::<PxMap>,
+            sync_frame_counts_on_asset_event::<PxSprite>,
+            sync_frame_counts_on_asset_event::<PxFilter>,
+            sync_frame_counts_on_asset_event::<PxText>,
+            sync_frame_counts_on_asset_event::<PxMap>,
+            update_animations,
         )
+            .chain()
             .in_set(PxSet::FinishAnimations),
     );
 }
 
-#[derive(Clone, Copy)]
-pub enum PxFrameSelector {
-    Index(f32),
-    Normalized(f32),
-}
-
-impl Default for PxFrameSelector {
-    fn default() -> Self {
-        Self::Normalized(0.)
-    }
-}
-
-/// Method the animation uses to interpolate between frames
-#[derive(Clone, Copy, Debug, Default)]
-pub enum PxFrameTransition {
-    /// Frames are not interpolated
-    #[default]
-    None,
-    /// Dithering is used to interpolate between frames, smoothing the animation
-    Dither,
-}
-
-#[derive(Component, Default, Clone, Copy)]
-pub struct PxFrame {
-    pub selector: PxFrameSelector,
-    pub transition: PxFrameTransition,
-}
-
-impl From<PxFrameSelector> for PxFrame {
-    fn from(value: PxFrameSelector) -> Self {
-        Self {
-            selector: value,
-            ..default()
-        }
-    }
-}
-
-/// Direction the animation plays
+/// Direction the animation plays.
 #[derive(Clone, Copy, Debug, Default)]
 pub enum PxAnimationDirection {
-    /// The animation plays foreward
+    /// The animation plays foreward.
     #[default]
     Foreward,
-    /// The animation plays backward
+    /// The animation plays backward.
     Backward,
 }
 
-/// Animation duration
+/// Animation duration.
 #[derive(Clone, Copy, Debug)]
 pub enum PxAnimationDuration {
     /// Duration of the entire animation. When used on a tilemap, each tile's animation
-    /// takes the same amount of time, but their frames may desync
+    /// takes the same amount of time, but their frames may desync.
     PerAnimation(Duration),
     /// Duration of each frame. When used on a tilemap, each frame will take the same amount
-    /// of time, but the tile's animations may desync
+    /// of time, but the tile's animations may desync.
     PerFrame(Duration),
 }
 
@@ -85,43 +70,43 @@ impl Default for PxAnimationDuration {
 }
 
 impl PxAnimationDuration {
-    /// Creates a [`PxAnimationDuration::PerAnimation`] with the given number of milliseconds
+    /// Creates a [`PxAnimationDuration::PerAnimation`] with the given number of milliseconds.
     pub fn millis_per_animation(millis: u64) -> Self {
         Self::PerAnimation(Duration::from_millis(millis))
     }
 
-    /// Creates a [`PxAnimationDuration::PerFrame`] with the given number of milliseconds
+    /// Creates a [`PxAnimationDuration::PerFrame`] with the given number of milliseconds.
     pub fn millis_per_frame(millis: u64) -> Self {
         Self::PerFrame(Duration::from_millis(millis))
     }
 }
 
-/// Specifies what the animation does when it finishes
+/// Specifies what the animation does when it finishes.
 #[derive(Clone, Copy, Debug, Default)]
 pub enum PxAnimationFinishBehavior {
-    /// The entity is despawned when the animation finishes
+    /// The entity is despawned when the animation finishes.
     #[default]
     Despawn,
-    /// [`PxAnimationFinished`] is added to the entity when the animation finishes
+    /// [`PxAnimationFinished`] is added to the entity when the animation finishes.
     Mark,
-    /// A successful [`Done`] is added to the entity when the animation finishes
+    /// A successful [`Done`] is added to the entity when the animation finishes.
     #[cfg(feature = "state")]
     Done,
-    /// The animation loops when it finishes
+    /// The animation loops when it finishes.
     Loop,
 }
 
 /// Animates an entity. Works on sprites, filters, text, tilemaps, rectangles, and lines.
 #[derive(Component, Clone, Copy, Debug)]
-#[require(PxFrame)]
+#[require(PxFrameView, PxFrameControl, PxFrameCount)]
 pub struct PxAnimation {
-    /// A [`PxAnimationDirection`]
+    /// A [`PxAnimationDirection`].
     pub direction: PxAnimationDirection,
-    /// A [`PxAnimationDuration`]
+    /// A [`PxAnimationDuration`].
     pub duration: PxAnimationDuration,
-    /// A [`PxAnimationFinishBehavior`]
+    /// A [`PxAnimationFinishBehavior`].
     pub on_finish: PxAnimationFinishBehavior,
-    /// Time when the animation started
+    /// Time when the animation started.
     pub start: Instant,
 }
 
@@ -137,23 +122,10 @@ impl Default for PxAnimation {
 }
 
 /// Marks an animation that has finished. Automatically added to animations
-/// with [`PxAnimationFinishBehavior::Mark`]
+/// with [`PxAnimationFinishBehavior::Mark`].
 #[derive(Component, Debug)]
 pub struct PxAnimationFinished;
 
-pub(crate) trait Frames {
-    type Param;
-
-    fn frame_count(&self) -> usize;
-    fn draw(
-        &self,
-        param: Self::Param,
-        image: &mut PxImageSliceMut,
-        frame: impl Fn(UVec2) -> usize,
-        filter: impl Fn(u8) -> u8,
-    );
-}
-
 pub(crate) trait AnimatedAssetComponent: Component {
     type Asset: Asset;
 
@@ -161,156 +133,96 @@ pub(crate) trait AnimatedAssetComponent: Component {
     fn max_frame_count(asset: &Self::Asset) -> usize;
 }
 
-const DITHERING: [u16; 16] = [
-    0b0000_0000_0000_0000,
-    0b1000_0000_0000_0000,
-    0b1000_0000_0010_0000,
-    0b1010_0000_0010_0000,
-    0b1010_0000_1010_0000,
-    0b1010_0100_1010_0000,
-    0b1010_0100_1010_0001,
-    0b1010_0101_1010_0001,
-    0b1010_0101_1010_0101,
-    0b1110_0101_1010_0101,
-    0b1110_0101_1011_0101,
-    0b1111_0101_1011_0101,
-    0b1111_0101_1111_0101,
-    0b1111_1101_1111_0101,
-    0b1111_1101_1111_0111,
-    0b1111_1111_1111_0111,
-];
-
-pub(crate) fn animate(frame: PxFrame, frame_count: usize) -> impl Fn(UVec2) -> usize {
-    let index = match frame.selector {
-        PxFrameSelector::Normalized(frame) => frame * (frame_count - 1) as f32,
-        PxFrameSelector::Index(frame) => frame,
-    };
-
-    let dithering = match frame.transition {
-        PxFrameTransition::Dither => DITHERING[(index.fract() * 16.) as usize % 16],
-        PxFrameTransition::None => 0,
-    };
-    let index = index.floor() as usize;
-
-    move |pos| {
-        (index + ((0b1000_0000_0000_0000 >> (pos.x % 4 + pos.y % 4 * 4)) & dithering != 0) as usize)
-            % frame_count
-    }
-}
-
-pub(crate) fn draw_frame<'a, A: Frames>(
-    animation: &A,
-    param: A::Param,
-    image: &mut PxImageSliceMut,
-    frame: Option<PxFrame>,
-    filters: impl IntoIterator<Item = &'a PxFilterAsset>,
-) {
-    let frame_count = animation.frame_count();
-    if frame_count == 0 {
-        return;
-    }
-
-    let mut filter: Box<dyn Fn(u8) -> u8> = Box::new(|pixel| pixel);
-    for filter_part in filters {
-        let filter_part = filter_part.as_fn();
-        filter = Box::new(move |pixel| filter_part(filter(pixel)));
-    }
-
-    if let Some(frame) = frame {
-        let frame = animate(frame, frame_count);
-
-        animation.draw(param, image, frame, filter);
-    } else {
-        let frame = |_| 0;
-        animation.draw(param, image, frame, filter);
-    }
-}
-
-pub(crate) fn draw_spatial<'a, A: Frames + Spatial>(
-    spatial: &A,
-    param: <A as Frames>::Param,
-    image: &mut PxImageSliceMut,
-    position: PxPosition,
-    anchor: PxAnchor,
-    canvas: PxCanvas,
-    frame: Option<PxFrame>,
-    filters: impl IntoIterator<Item = &'a PxFilterAsset>,
-    camera: PxCamera,
-) {
-    let size = spatial.frame_size();
-    let position = *position - anchor.pos(size).as_ivec2();
-    let position = match canvas {
-        PxCanvas::World => position - *camera,
-        PxCanvas::Camera => position,
-    };
-    let position = IVec2::new(position.x, image.height() as i32 - position.y);
-    let size = size.as_ivec2();
-
-    let mut image = image.slice_mut(IRect {
-        min: position - IVec2::new(0, size.y),
-        max: position + IVec2::new(size.x, 0),
-    });
-
-    draw_frame(spatial, param, &mut image, frame, filters);
-}
-
-fn update_animations<A: AnimatedAssetComponent>(
+fn update_animations(
     mut cmd: Commands,
-    assets: Res<Assets<A::Asset>>,
     time: Res<Time<Real>>,
     mut animations: Query<(
         Entity,
-        &mut PxFrame,
+        &mut PxFrameControl,
         &PxAnimation,
         Has<PxAnimationFinished>,
-        &A,
+        &PxFrameCount,
     )>,
 ) {
-    for (id, mut frame, animation, finished, a) in &mut animations {
-        if let Some(asset) = assets.get(a.handle()) {
-            let elapsed = time.last_update().unwrap_or_else(|| time.startup()) - animation.start;
-            let max_frame_count = A::max_frame_count(asset);
-            let lifetime = match animation.duration {
-                PxAnimationDuration::PerAnimation(duration) => duration,
-                PxAnimationDuration::PerFrame(duration) => duration * max_frame_count as u32,
-            };
-
-            let ratio = elapsed.div_duration_f32(lifetime);
-            let ratio = match animation.on_finish {
-                PxAnimationFinishBehavior::Despawn | PxAnimationFinishBehavior::Mark => {
-                    ratio.min(1.)
-                }
-                #[cfg(feature = "state")]
-                PxAnimationFinishBehavior::Done => ratio.min(1.),
-                PxAnimationFinishBehavior::Loop => ratio.fract(),
-            };
-            let ratio = match animation.direction {
-                PxAnimationDirection::Foreward => ratio,
-                PxAnimationDirection::Backward => 1. + -ratio,
-            };
+    for (id, mut control, animation, finished, frame_count) in &mut animations {
+        let max_frame_count = frame_count.0;
+        if max_frame_count == 0 {
+            continue;
+        }
 
-            match frame.selector {
-                PxFrameSelector::Index(ref mut index) => *index = max_frame_count as f32 * ratio,
-                PxFrameSelector::Normalized(ref mut normalized) => *normalized = ratio,
-            }
+        let elapsed = time.last_update().unwrap_or_else(|| time.startup()) - animation.start;
+        let lifetime = match animation.duration {
+            PxAnimationDuration::PerAnimation(duration) => duration,
+            PxAnimationDuration::PerFrame(duration) => duration * max_frame_count as u32,
+        };
+
+        let ratio = elapsed.div_duration_f32(lifetime);
+        let ratio = match animation.on_finish {
+            PxAnimationFinishBehavior::Despawn | PxAnimationFinishBehavior::Mark => ratio.min(1.),
+            #[cfg(feature = "state")]
+            PxAnimationFinishBehavior::Done => ratio.min(1.),
+            PxAnimationFinishBehavior::Loop => ratio.fract(),
+        };
+        let ratio = match animation.direction {
+            PxAnimationDirection::Foreward => ratio,
+            PxAnimationDirection::Backward => 1. + -ratio,
+        };
+
+        match control.selector {
+            PxFrameSelector::Index(ref mut index) => *index = max_frame_count as f32 * ratio,
+            PxFrameSelector::Normalized(ref mut normalized) => *normalized = ratio,
+        }
 
-            if elapsed >= lifetime {
-                match animation.on_finish {
-                    PxAnimationFinishBehavior::Despawn => {
-                        cmd.entity(id).despawn();
-                    }
-                    PxAnimationFinishBehavior::Mark => {
-                        if !finished {
-                            cmd.entity(id).insert(PxAnimationFinished);
-                        }
-                    }
-                    #[cfg(feature = "state")]
-                    PxAnimationFinishBehavior::Done => {
-                        commands.entity(entity).insert(Done::Success);
+        if elapsed >= lifetime {
+            match animation.on_finish {
+                PxAnimationFinishBehavior::Despawn => {
+                    cmd.entity(id).despawn();
+                }
+                PxAnimationFinishBehavior::Mark => {
+                    if !finished {
+                        cmd.entity(id).insert(PxAnimationFinished);
                     }
-                    PxAnimationFinishBehavior::Loop => (),
                 }
+                #[cfg(feature = "state")]
+                PxAnimationFinishBehavior::Done => {
+                    cmd.entity(id).insert(Done::Success);
+                }
+                PxAnimationFinishBehavior::Loop => (),
             }
         }
     }
 }
+
+fn sync_frame_counts_on_component_change<A: AnimatedAssetComponent>(
+    assets: Res<Assets<A::Asset>>,
+    mut query: Query<
+        (&A, &mut PxFrameCount),
+        (With<PxAnimation>, Or<(Changed<A>, Added<PxAnimation>)>),
+    >,
+) {
+    for (component, mut count) in &mut query {
+        let Some(asset) = assets.get(component.handle()) else {
+            count.0 = 0;
+            continue;
+        };
+        count.0 = A::max_frame_count(asset);
+    }
+}
+
+fn sync_frame_counts_on_asset_event<A: AnimatedAssetComponent>(
+    assets: Res<Assets<A::Asset>>,
+    mut events: MessageReader<AssetEvent<A::Asset>>,
+    mut query: Query<(&A, &mut PxFrameCount), With<PxAnimation>>,
+) {
+    if events.read().next().is_none() {
+        return;
+    }
+
+    for (component, mut count) in &mut query {
+        let Some(asset) = assets.get(component.handle()) else {
+            count.0 = 0;
+            continue;
+        };
+        count.0 = A::max_frame_count(asset);
+    }
+}
diff --git a/src/filter.rs b/src/filter.rs
index ec835df..b28c126 100644
--- a/src/filter.rs
+++ b/src/filter.rs
@@ -1,6 +1,6 @@
 //! Filtering
 
-use std::{error::Error, ops::RangeInclusive};
+use std::{error::Error, ops::RangeInclusive, path::PathBuf};
 
 use bevy_asset::{AssetLoader, LoadContext, io::Reader, uuid_handle};
 use bevy_derive::{Deref, DerefMut};
@@ -16,31 +16,32 @@ use bevy_render::{
 };
 
 use crate::{
-    animation::{AnimatedAssetComponent, Frames, draw_frame},
+    animation::AnimatedAssetComponent,
+    frame::{Frames, draw_frame},
     image::{PxImage, PxImageSliceMut},
-    palette::asset_palette,
+    palette::Palette,
     position::PxLayer,
     prelude::*,
 };
 
+/// A built-in filter asset that leaves pixels unchanged.
 pub const TRANSPARENT_FILTER: Handle<PxFilterAsset> =
     uuid_handle!("798C57A4-A83C-5DD6-8FA6-1426E31A84CA");
 
-pub(crate) fn plug<L: PxLayer>(app: &mut App) {
+pub(crate) fn plug<L: PxLayer>(app: &mut App, palette_path: PathBuf) {
     #[cfg(feature = "headed")]
     app.add_plugins((
         RenderAssetPlugin::<PxFilterAsset>::default(),
         SyncComponentPlugin::<PxFilterLayers<L>>::default(),
     ));
 
+    app.init_asset::<PxFilterAsset>()
+        .register_asset_loader(PxFilterLoader::new(palette_path));
+    app.insert_resource(InsertDefaultPxFilterLayers::new::<L>());
+
     // R-A workaround
-    Assets::insert(
-        &mut app
-            .init_asset::<PxFilterAsset>()
-            .init_asset_loader::<PxFilterLoader>()
-            .insert_resource(InsertDefaultPxFilterLayers::new::<L>())
-            .world_mut()
-            .resource_mut::<Assets<PxFilterAsset>>(),
+    let _ = Assets::insert(
+        &mut app.world_mut().resource_mut::<Assets<PxFilterAsset>>(),
         TRANSPARENT_FILTER.id(),
         PxFilterAsset(PxImage::empty(uvec2(16, 16))),
     );
@@ -51,8 +52,15 @@ pub(crate) fn plug<L: PxLayer>(app: &mut App) {
         .add_systems(ExtractSchedule, extract_filters::<L>);
 }
 
-#[derive(Default)]
-struct PxFilterLoader;
+struct PxFilterLoader {
+    palette_path: PathBuf,
+}
+
+impl PxFilterLoader {
+    fn new(palette_path: PathBuf) -> Self {
+        Self { palette_path }
+    }
+}
 
 impl AssetLoader for PxFilterLoader {
     type Asset = PxFilterAsset;
@@ -68,7 +76,13 @@ impl AssetLoader for PxFilterLoader {
         let image = ImageLoader::new(CompressedImageFormats::NONE)
             .load(reader, settings, load_context)
             .await?;
-        let palette = asset_palette().await;
+        let palette = load_context
+            .loader()
+            .immediate()
+            .load::<Palette>(self.palette_path.clone())
+            .await
+            .map_err(|err| err.to_string())?;
+        let palette = palette.get();
         let indices = PxImage::palette_indices(palette, &image).map_err(|err| err.to_string())?;
 
         let mut filter = Vec::with_capacity(indices.area());
@@ -200,7 +214,8 @@ impl AnimatedAssetComponent for PxFilter {
     }
 }
 
-/// Determines which layers a filter appies to
+/// Determines which layers a filter appies to. Range and Many filters always clip to entity
+/// pixels; use `Single` with `clip: false` to filter the composed layer instead.
 #[derive(Component, Clone)]
 #[require(PxFilter)]
 #[cfg_attr(feature = "headed", require(Visibility))]
@@ -214,8 +229,10 @@ pub enum PxFilterLayers<L: PxLayer> {
         /// is rendered, including the background color.
         clip: bool,
     },
+    /// Filter applies to a range of layers. Uses layer ordering for enum variants with data.
+    /// Always clips to entity pixels.
     Range(RangeInclusive<L>),
-    /// Filter applies to a set list of layers
+    /// Filter applies to a set list of layers. Always clips to entity pixels.
     Many(Vec<L>),
 }
 
@@ -241,6 +258,16 @@ impl<L: PxLayer> PxFilterLayers<L> {
     pub fn single_over(layer: L) -> Self {
         Self::Single { layer, clip: false }
     }
+
+    /// Creates a [`PxFilterLayers::Range`] that clips to entity pixels.
+    pub fn range_clip(range: RangeInclusive<L>) -> Self {
+        Self::Range(range)
+    }
+
+    /// Creates a [`PxFilterLayers::Many`] that clips to entity pixels.
+    pub fn many_clip(layers: impl Into<Vec<L>>) -> Self {
+        Self::Many(layers.into())
+    }
 }
 
 #[derive(Resource, Deref)]
@@ -262,13 +289,10 @@ fn insert_default_px_filter_layers(mut world: DeferredWorld, ctx: HookContext) {
         let insert_default_px_filter_layers = world
             .remove_resource::<InsertDefaultPxFilterLayers>()
             .unwrap();
-        if let Ok(mut entity) = world.get_entity_mut(ctx.entity) {
-            if let Some(default) = entity.get::<DefaultPxFilterLayers>() {
-                insert_default_px_filter_layers(
-                    default.clip,
-                    entity.remove::<DefaultPxFilterLayers>(),
-                );
-            }
+        if let Ok(mut entity) = world.get_entity_mut(ctx.entity)
+            && let Some(default) = entity.get::<DefaultPxFilterLayers>()
+        {
+            insert_default_px_filter_layers(default.clip, entity.remove::<DefaultPxFilterLayers>());
         }
         world.insert_resource(insert_default_px_filter_layers);
     })
@@ -286,6 +310,7 @@ impl Default for DefaultPxFilterLayers {
     }
 }
 
+/// Marks that a filter should apply outside a shape rather than inside it.
 #[derive(Component, Default)]
 pub struct PxInvertMask;
 
@@ -295,6 +320,35 @@ pub(crate) type FilterComponents<L> = (
     Option<&'static PxFrame>,
 );
 
+#[cfg(test)]
+mod tests {
+    use super::*;
+    use crate::{frame::draw_frame, image::PxImage};
+
+    fn pixels(image: &PxImage) -> Vec<u8> {
+        let size = image.size();
+        let mut out = Vec::with_capacity((size.x * size.y) as usize);
+        for y in 0..size.y as i32 {
+            for x in 0..size.x as i32 {
+                out.push(image.pixel(IVec2::new(x, y)));
+            }
+        }
+        out
+    }
+
+    #[test]
+    fn filter_maps_palette_indices() {
+        let filter = PxFilterAsset(PxImage::new(vec![0, 2, 3, 1], 4));
+        let mut image = PxImage::new(vec![1, 2, 1, 2], 2);
+        let mut slice = image.slice_all_mut();
+
+        draw_frame(&filter, (), &mut slice, None, []);
+
+        let expected = vec![2, 3, 2, 3];
+        assert_eq!(pixels(&image), expected);
+    }
+}
+
 #[cfg(feature = "headed")]
 fn extract_filters<L: PxLayer>(
     filters: Extract<
diff --git a/src/frame.rs b/src/frame.rs
new file mode 100644
index 0000000..0690429
--- /dev/null
+++ b/src/frame.rs
@@ -0,0 +1,322 @@
+//! Frame selection and drawing helpers.
+
+use crate::{
+    animation::PxAnimation, filter::PxFilterAsset, image::PxImageSliceMut, position::Spatial,
+    prelude::*, set::PxSet,
+};
+
+pub(crate) fn plug(app: &mut App) {
+    app.add_systems(
+        PostUpdate,
+        seed_animation_control.before(PxSet::FinishAnimations),
+    )
+    .add_systems(PostUpdate, sync_frame_view.after(PxSet::FinishAnimations));
+}
+
+/// Selects a frame by absolute index or normalized progress.
+#[derive(Clone, Copy)]
+pub enum PxFrameSelector {
+    /// Direct frame index (may be fractional for transitions).
+    Index(f32),
+    /// Normalized progress from 0.0 to 1.0.
+    Normalized(f32),
+}
+
+impl Default for PxFrameSelector {
+    fn default() -> Self {
+        Self::Normalized(0.)
+    }
+}
+
+/// Method the animation uses to interpolate between frames.
+#[derive(Clone, Copy, Debug, Default)]
+pub enum PxFrameTransition {
+    /// Frames are not interpolated.
+    #[default]
+    None,
+    /// Dithering is used to interpolate between frames, smoothing the animation.
+    Dither,
+}
+
+/// Maps a master frame selection to a part-specific frame selection.
+#[derive(Clone, Debug, Default)]
+pub enum PxFrameBinding {
+    /// Use the master's normalized progress.
+    #[default]
+    Inherit,
+    /// Map master frame indices to explicit part frame indices.
+    Map(Vec<usize>),
+    /// Offset the master frame index by the given amount.
+    Offset(i32),
+    /// Scale the master's normalized progress.
+    Scale(f32),
+}
+
+/// Per-entity frame view consumed by drawables.
+#[derive(Component, Default, Clone, Copy)]
+pub struct PxFrameView {
+    /// Frame selection mode.
+    pub selector: PxFrameSelector,
+    /// Frame interpolation mode.
+    pub transition: PxFrameTransition,
+}
+
+/// Cached frame count for the entity's active frame source.
+#[derive(Component, Default, Clone, Copy, Debug)]
+pub struct PxFrameCount(pub usize);
+
+/// Backwards-compatible alias for the frame view.
+pub type PxFrame = PxFrameView;
+
+impl From<PxFrameSelector> for PxFrameView {
+    fn from(value: PxFrameSelector) -> Self {
+        Self {
+            selector: value,
+            ..default()
+        }
+    }
+}
+
+/// Per-entity frame control input (e.g., for animation or manual control).
+#[derive(Component, Default, Clone, Copy)]
+pub struct PxFrameControl {
+    /// Frame selection mode.
+    pub selector: PxFrameSelector,
+    /// Frame interpolation mode.
+    pub transition: PxFrameTransition,
+}
+
+impl From<PxFrameSelector> for PxFrameControl {
+    fn from(value: PxFrameSelector) -> Self {
+        Self {
+            selector: value,
+            ..default()
+        }
+    }
+}
+
+impl From<PxFrameView> for PxFrameControl {
+    fn from(value: PxFrameView) -> Self {
+        Self {
+            selector: value.selector,
+            transition: value.transition,
+        }
+    }
+}
+
+impl From<PxFrameControl> for PxFrameView {
+    fn from(value: PxFrameControl) -> Self {
+        Self {
+            selector: value.selector,
+            transition: value.transition,
+        }
+    }
+}
+
+fn sync_frame_view(
+    mut commands: Commands,
+    mut frames: Query<(Entity, &PxFrameControl, Option<&mut PxFrameView>), Changed<PxFrameControl>>,
+) {
+    for (entity, control, view) in &mut frames {
+        match view {
+            Some(mut view) => {
+                *view = (*control).into();
+            }
+            None => {
+                commands.entity(entity).insert(PxFrameView::from(*control));
+            }
+        }
+    }
+}
+
+fn seed_animation_control(
+    mut animations: Query<(&PxFrameView, &mut PxFrameControl), Added<PxAnimation>>,
+) {
+    for (view, mut control) in &mut animations {
+        *control = (*view).into();
+    }
+}
+
+pub(crate) trait Frames {
+    type Param;
+
+    fn frame_count(&self) -> usize;
+    fn draw(
+        &self,
+        param: Self::Param,
+        image: &mut PxImageSliceMut,
+        frame: impl Fn(UVec2) -> usize,
+        filter: impl Fn(u8) -> u8,
+    );
+}
+
+const DITHERING: [u16; 16] = [
+    0b0000_0000_0000_0000,
+    0b1000_0000_0000_0000,
+    0b1000_0000_0010_0000,
+    0b1010_0000_0010_0000,
+    0b1010_0000_1010_0000,
+    0b1010_0100_1010_0000,
+    0b1010_0100_1010_0001,
+    0b1010_0101_1010_0001,
+    0b1010_0101_1010_0101,
+    0b1110_0101_1010_0101,
+    0b1110_0101_1011_0101,
+    0b1111_0101_1011_0101,
+    0b1111_0101_1111_0101,
+    0b1111_1101_1111_0101,
+    0b1111_1101_1111_0111,
+    0b1111_1111_1111_0111,
+];
+
+pub(crate) fn animate(frame: PxFrameView, frame_count: usize) -> impl Fn(UVec2) -> usize {
+    let index = match frame.selector {
+        PxFrameSelector::Normalized(frame) => frame * (frame_count - 1) as f32,
+        PxFrameSelector::Index(frame) => frame,
+    };
+
+    let dithering = match frame.transition {
+        PxFrameTransition::Dither => DITHERING[(index.fract() * 16.) as usize % 16],
+        PxFrameTransition::None => 0,
+    };
+    let index = index.floor() as usize;
+
+    move |pos| {
+        (index + ((0b1000_0000_0000_0000 >> (pos.x % 4 + pos.y % 4 * 4)) & dithering != 0) as usize)
+            % frame_count
+    }
+}
+
+fn frame_index_f32(frame: PxFrameView, frame_count: usize) -> f32 {
+    match frame.selector {
+        PxFrameSelector::Normalized(progress) => {
+            if frame_count <= 1 {
+                0.
+            } else {
+                progress.clamp(0., 1.) * (frame_count - 1) as f32
+            }
+        }
+        PxFrameSelector::Index(index) => index.max(0.),
+    }
+}
+
+fn frame_index(frame: PxFrameView, frame_count: usize) -> usize {
+    frame_index_f32(frame, frame_count).floor() as usize
+}
+
+fn frame_progress(frame: PxFrameView, frame_count: usize) -> f32 {
+    match frame.selector {
+        PxFrameSelector::Normalized(progress) => progress.clamp(0., 1.),
+        PxFrameSelector::Index(index) => {
+            if frame_count <= 1 {
+                0.
+            } else {
+                (index.max(0.) / (frame_count - 1) as f32).clamp(0., 1.)
+            }
+        }
+    }
+}
+
+pub(crate) fn resolve_frame_binding(
+    master: Option<PxFrameView>,
+    master_count: usize,
+    part_count: usize,
+    binding: &PxFrameBinding,
+) -> Option<PxFrameView> {
+    let master = master?;
+    if part_count == 0 {
+        return None;
+    }
+
+    match binding {
+        PxFrameBinding::Inherit => Some(PxFrameView {
+            selector: PxFrameSelector::Normalized(frame_progress(master, master_count)),
+            transition: master.transition,
+        }),
+        PxFrameBinding::Map(map) => {
+            if map.is_empty() {
+                return None;
+            }
+            let index = frame_index(master, map.len());
+            let mapped = map.get(index).copied().unwrap_or(0) as f32;
+            Some(PxFrameView {
+                selector: PxFrameSelector::Index(mapped),
+                transition: master.transition,
+            })
+        }
+        PxFrameBinding::Offset(offset) => {
+            let index = frame_index(master, master_count) as i32 + offset;
+            let index = index.rem_euclid(part_count as i32) as f32;
+            Some(PxFrameView {
+                selector: PxFrameSelector::Index(index),
+                transition: master.transition,
+            })
+        }
+        PxFrameBinding::Scale(scale) => {
+            let progress = frame_progress(master, master_count) * *scale;
+            let progress = progress - progress.floor();
+            Some(PxFrameView {
+                selector: PxFrameSelector::Normalized(progress),
+                transition: master.transition,
+            })
+        }
+    }
+}
+
+pub(crate) fn draw_frame<'a, A: Frames>(
+    animation: &A,
+    param: A::Param,
+    image: &mut PxImageSliceMut,
+    frame: Option<PxFrameView>,
+    filters: impl IntoIterator<Item = &'a PxFilterAsset>,
+) {
+    let frame_count = animation.frame_count();
+    if frame_count == 0 {
+        return;
+    }
+
+    let mut filter: Box<dyn Fn(u8) -> u8> = Box::new(|pixel| pixel);
+    for filter_part in filters {
+        let filter_part = filter_part.as_fn();
+        filter = Box::new(move |pixel| filter_part(filter(pixel)));
+    }
+
+    if let Some(frame) = frame {
+        let frame = animate(frame, frame_count);
+
+        animation.draw(param, image, frame, filter);
+    } else {
+        let frame = |_| 0;
+        animation.draw(param, image, frame, filter);
+    }
+}
+
+pub(crate) fn draw_spatial<'a, A: Frames + Spatial>(
+    spatial: &A,
+    param: <A as Frames>::Param,
+    image: &mut PxImageSliceMut,
+    position: PxPosition,
+    anchor: PxAnchor,
+    canvas: PxCanvas,
+    frame: Option<PxFrameView>,
+    filters: impl IntoIterator<Item = &'a PxFilterAsset>,
+    camera: PxCamera,
+) {
+    // Coordinate convention: image space has origin at top-left.
+    // World/camera positions are bottom-left, so Y is flipped here.
+    let size = spatial.frame_size();
+    let position = *position - anchor.pos(size).as_ivec2();
+    let position = match canvas {
+        PxCanvas::World => position - *camera,
+        PxCanvas::Camera => position,
+    };
+    let position = IVec2::new(position.x, image.height() as i32 - position.y);
+    let size = size.as_ivec2();
+
+    let mut image = image.slice_mut(IRect {
+        min: position - IVec2::new(0, size.y),
+        max: position + IVec2::new(size.x, 0),
+    });
+
+    draw_frame(spatial, param, &mut image, frame, filters);
+}
diff --git a/src/gpu_sprite.wgsl b/src/gpu_sprite.wgsl
new file mode 100644
index 0000000..a89686d
--- /dev/null
+++ b/src/gpu_sprite.wgsl
@@ -0,0 +1,41 @@
+struct PxUniform {
+    palette: array<vec3<f32>, 256>,
+    fit_factor: vec2<f32>,
+};
+
+@group(0) @binding(0) var texture: texture_2d<u32>;
+@group(0) @binding(1) var depth_texture: texture_2d<u32>;
+@group(0) @binding(2) var<uniform> uniform: PxUniform;
+
+struct VertexIn {
+    @location(0) position: vec2<f32>,
+    @location(1) uv: vec2<f32>,
+    @location(2) layer: u32,
+};
+
+struct VertexOut {
+    @builtin(position) position: vec4<f32>,
+    @location(0) uv: vec2<f32>,
+    @location(1) layer: u32,
+};
+
+@vertex fn vertex(in: VertexIn) -> VertexOut {
+    return VertexOut(vec4(in.position, 0., 1.), in.uv, in.layer);
+}
+
+@fragment fn fragment(in: VertexOut) -> @location(0) vec4<f32> {
+    let dims = vec2<f32>(textureDimensions(texture));
+    let coord = vec2<i32>(dims * in.uv);
+    let index = textureLoad(texture, coord, 0).r;
+    let depth = textureLoad(depth_texture, coord, 0).r;
+
+    if depth > in.layer {
+        discard;
+    }
+
+    if index == 0u {
+        return vec4(0.);
+    }
+
+    return vec4(uniform.palette[index], 1.);
+}
diff --git a/src/image.rs b/src/image.rs
index 15b2a72..f86936b 100644
--- a/src/image.rs
+++ b/src/image.rs
@@ -85,13 +85,18 @@ impl PxImage {
         self.image.len()
     }
 
+    #[cfg(feature = "gpu_palette")]
+    pub(crate) fn data(&self) -> &[u8] {
+        &self.image
+    }
+
     #[expect(unused)]
     pub(crate) fn iter_mut(&mut self) -> impl Iterator<Item = &mut u8> {
         self.image.iter_mut()
     }
 
     #[expect(unused)]
-    pub(crate) fn slice_mut(&mut self, slice: IRect) -> PxImageSliceMut {
+    pub(crate) fn slice_mut(&mut self, slice: IRect) -> PxImageSliceMut<'_> {
         PxImageSliceMut {
             slice,
             image: self.image.chunks_exact_mut(self.width).collect(),
@@ -99,7 +104,7 @@ impl PxImage {
         }
     }
 
-    pub(crate) fn slice_all_mut(&mut self) -> PxImageSliceMut {
+    pub(crate) fn slice_all_mut(&mut self) -> PxImageSliceMut<'_> {
         PxImageSliceMut {
             slice: IRect {
                 min: IVec2::splat(0),
@@ -138,7 +143,13 @@ impl PxImage {
     }
 
     pub(crate) fn trim_right(&mut self) {
-        while (0..self.height()).all(|row| self.image[self.width * (row + 1) - 1] == 0) {
+        if self.width == 0 || self.image.is_empty() {
+            return;
+        }
+
+        while self.width > 1
+            && (0..self.height()).all(|row| self.image[self.width * (row + 1) - 1] == 0)
+        {
             for row in (0..self.height()).rev() {
                 self.image.remove(row * self.width + self.width - 1);
             }
@@ -200,26 +211,25 @@ impl<'a> PxImageSliceMut<'a> {
 
     /// First `usize` is the index in the slice. Second `usize` is the index in the image.
     pub(crate) fn for_each_mut(&mut self, f: impl Fn(usize, usize, &mut u8)) {
-        let row_min = self.slice.min.x.clamp(0, self.width as i32) as usize;
-        let row_max = self.slice.max.x.clamp(0, self.width as i32) as usize;
+        // Slice coordinates are in image space; `slice` tracks absolute bounds.
+        let x_min = self.slice.min.x.clamp(0, self.width as i32) as usize;
+        let x_max = self.slice.max.x.clamp(0, self.width as i32) as usize;
         let max_y = self.image.len() as i32;
-
-        self.image.iter_mut().enumerate().collect::<Vec<_>>()
-            [self.slice.min.y.clamp(0, max_y) as usize..self.slice.max.y.clamp(0, max_y) as usize]
-            .iter_mut()
-            .for_each(|(i, row)| {
-                row.iter_mut().enumerate().collect::<Vec<_>>()[row_min..row_max]
-                    .iter_mut()
-                    .for_each(|(j, pixel)| {
-                        f(
-                            ((*i as i32 - self.slice.min.y) * (self.slice.max.x - self.slice.min.x)
-                                + (*j as i32 - self.slice.min.x))
-                                as usize,
-                            *i * self.width + *j,
-                            pixel,
-                        );
-                    });
-            });
+        let y_min = self.slice.min.y.clamp(0, max_y) as usize;
+        let y_max = self.slice.max.y.clamp(0, max_y) as usize;
+
+        let slice_width = (self.slice.max.x - self.slice.min.x).max(0) as usize;
+
+        for (row_index, row) in self.image[y_min..y_max].iter_mut().enumerate() {
+            let y = y_min + row_index;
+            for x in x_min..x_max {
+                let slice_index = ((y as i32 - self.slice.min.y) * slice_width as i32
+                    + (x as i32 - self.slice.min.x)) as usize;
+                let image_index = y * self.width + x;
+                let pixel = &mut row[x];
+                f(slice_index, image_index, pixel);
+            }
+        }
     }
 
     pub(crate) fn contains_pixel(&self, position: IVec2) -> bool {
@@ -271,7 +281,7 @@ impl<'a> PxImageSliceMut<'a> {
         self.slice.min
     }
 
-    pub(crate) fn slice_mut(&mut self, slice: IRect) -> PxImageSliceMut {
+    pub(crate) fn slice_mut(&mut self, slice: IRect) -> PxImageSliceMut<'_> {
         PxImageSliceMut {
             image: self.image.iter_mut().map(|row| &mut **row).collect(),
             width: self.width,
diff --git a/src/lib.rs b/src/lib.rs
index b171b9b..15e3e97 100644
--- a/src/lib.rs
+++ b/src/lib.rs
@@ -16,6 +16,7 @@ pub mod blink;
 mod camera;
 pub mod cursor;
 pub mod filter;
+pub mod frame;
 mod image;
 #[cfg(feature = "line")]
 mod line;
@@ -42,6 +43,8 @@ use prelude::*;
 
 /// Add to your [`App`] to enable `seldom_pixel`. The type parameter is your custom layer type
 /// used for z-ordering. You can make one using [`px_layer`].
+///
+/// Add [`animation::PxAnimationPlugin`] if you want the built-in animation systems.
 #[derive(Debug)]
 pub struct PxPlugin<L: PxLayer> {
     screen_size: ScreenSize,
@@ -66,10 +69,10 @@ impl<L: PxLayer> Plugin for PxPlugin<L> {
     fn build(&self, app: &mut App) {
         app.add_plugins((
             (
-                animation::plug,
                 blink::plug,
                 camera::plug,
                 cursor::plug,
+                frame::plug,
                 palette::plug(self.palette_path.clone()),
                 #[cfg(feature = "headed")]
                 picking::plug::<L>,
@@ -77,17 +80,19 @@ impl<L: PxLayer> Plugin for PxPlugin<L> {
                 screen::Plug::<L>::new(self.screen_size),
             ),
             (
-                filter::plug::<L>,
                 #[cfg(feature = "line")]
                 line::plug::<L>,
-                map::plug::<L>,
                 rect::plug::<L>,
-                sprite::plug::<L>,
-                text::plug::<L>,
                 ui::plug::<L>,
                 #[cfg(feature = "particle")]
                 (RngPlugin::default(), particle::plug::<L>),
             ),
         ));
+
+        let palette_path = self.palette_path.clone();
+        filter::plug::<L>(app, palette_path.clone());
+        map::plug::<L>(app, palette_path.clone());
+        sprite::plug::<L>(app, palette_path.clone());
+        text::plug::<L>(app, palette_path);
     }
 }
diff --git a/src/line.rs b/src/line.rs
index fa67343..fb08f30 100644
--- a/src/line.rs
+++ b/src/line.rs
@@ -1,12 +1,12 @@
 use bevy_derive::{Deref, DerefMut};
 use bevy_math::{ivec2, uvec2};
 use bevy_platform::collections::HashSet;
-use bevy_render::{sync_world::RenderEntity, Extract, RenderApp};
+use bevy_render::{Extract, RenderApp, sync_world::RenderEntity};
 use line_drawing::Bresenham;
 
 use crate::{
-    animation::{draw_frame, Frames},
     filter::DefaultPxFilterLayers,
+    frame::{Frames, draw_frame},
     image::PxImageSliceMut,
     position::{PxLayer, Spatial},
     prelude::*,
@@ -55,24 +55,42 @@ impl Frames for (&PxLine, &PxFilterAsset) {
         _: impl Fn(u8) -> u8,
     ) {
         let (line, PxFilterAsset(filter)) = self;
-        let mut poses = HashSet::new();
+        let slice_offset = image.offset();
+        let image_width = image.image_width() as i32;
+        let image_height = image.image_height() as i32;
 
-        for (start, end) in line.iter().zip(line.iter().skip(1)) {
-            let start = *start + offset;
-            let end = *end + offset;
+        if invert {
+            let mut line_points = Vec::new();
+
+            for (segment_index, (start, end)) in line.iter().zip(line.iter().skip(1)).enumerate() {
+                let start = *start + offset;
+                let end = *end + offset;
+
+                for (step, pos) in Bresenham::new(start.into(), end.into()).enumerate() {
+                    if segment_index > 0 && step == 0 {
+                        continue;
+                    }
 
-            for pos in Bresenham::new(start.into(), end.into()) {
-                poses.insert(IVec2::from(pos));
+                    line_points.push(IVec2::from(pos));
+                }
             }
-        }
 
-        let offset = image.offset();
+            let mut originals = Vec::with_capacity(line_points.len());
 
-        for x in 0..image.image_width() as i32 {
-            for y in 0..image.image_height() as i32 {
-                let pos = ivec2(x, y);
+            for world_pos in &line_points {
+                let pos = *world_pos + slice_offset;
 
-                if poses.contains(&(pos - offset)) != invert {
+                if pos.x < 0 || pos.y < 0 || pos.x >= image_width || pos.y >= image_height {
+                    continue;
+                }
+
+                let pixel = *image.image_pixel_mut(pos);
+                originals.push((pos, pixel));
+            }
+
+            for y in 0..image_height {
+                for x in 0..image_width {
+                    let pos = ivec2(x, y);
                     let pixel = image.image_pixel_mut(pos);
                     *pixel = filter.pixel(ivec2(
                         *pixel as i32,
@@ -80,6 +98,39 @@ impl Frames for (&PxLine, &PxFilterAsset) {
                     ));
                 }
             }
+
+            for (pos, pixel) in originals {
+                *image.image_pixel_mut(pos) = pixel;
+            }
+        } else {
+            let mut poses = HashSet::new();
+
+            for (segment_index, (start, end)) in line.iter().zip(line.iter().skip(1)).enumerate() {
+                let start = *start + offset;
+                let end = *end + offset;
+
+                for (step, pos) in Bresenham::new(start.into(), end.into()).enumerate() {
+                    if segment_index > 0 && step == 0 {
+                        continue;
+                    }
+
+                    poses.insert(IVec2::from(pos));
+                }
+            }
+
+            for world_pos in poses {
+                let pos = world_pos + slice_offset;
+
+                if pos.x < 0 || pos.y < 0 || pos.x >= image_width || pos.y >= image_height {
+                    continue;
+                }
+
+                let pixel = image.image_pixel_mut(pos);
+                *pixel = filter.pixel(ivec2(
+                    *pixel as i32,
+                    frame(uvec2(pos.x as u32, pos.y as u32)) as i32,
+                ));
+            }
         }
     }
 }
@@ -151,3 +202,72 @@ pub(crate) fn draw_line(
         [],
     );
 }
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+    use crate::{camera::PxCamera, filter::PxFilterAsset, image::PxImage};
+
+    fn filter_asset() -> PxFilterAsset {
+        PxFilterAsset(PxImage::new(vec![0, 2, 0, 0], 4))
+    }
+
+    fn pixels(image: &PxImage) -> Vec<u8> {
+        let size = image.size();
+        let mut out = Vec::with_capacity((size.x * size.y) as usize);
+        for y in 0..size.y as i32 {
+            for x in 0..size.x as i32 {
+                out.push(image.pixel(IVec2::new(x, y)));
+            }
+        }
+        out
+    }
+
+    #[test]
+    fn line_draws_only_line_pixels() {
+        let mut image = PxImage::new(vec![1; 25], 5);
+        let mut slice = image.slice_all_mut();
+        let filter = filter_asset();
+        let line = PxLine(vec![IVec2::new(1, 1), IVec2::new(3, 1)]);
+
+        draw_line(
+            &line,
+            &filter,
+            false,
+            &mut slice,
+            PxCanvas::Camera,
+            None,
+            PxCamera::default(),
+        );
+
+        let expected = vec![
+            1, 1, 1, 1, 1, 1, 2, 2, 2, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1, 1,
+        ];
+
+        assert_eq!(pixels(&image), expected);
+    }
+
+    #[test]
+    fn line_invert_draws_outside_only() {
+        let mut image = PxImage::new(vec![1; 25], 5);
+        let mut slice = image.slice_all_mut();
+        let filter = filter_asset();
+        let line = PxLine(vec![IVec2::new(1, 1), IVec2::new(3, 1)]);
+
+        draw_line(
+            &line,
+            &filter,
+            true,
+            &mut slice,
+            PxCanvas::Camera,
+            None,
+            PxCamera::default(),
+        );
+
+        let expected = vec![
+            2, 2, 2, 2, 2, 2, 1, 1, 1, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2, 2,
+        ];
+
+        assert_eq!(pixels(&image), expected);
+    }
+}
diff --git a/src/map.rs b/src/map.rs
index a39114f..be17cd5 100644
--- a/src/map.rs
+++ b/src/map.rs
@@ -1,4 +1,4 @@
-use std::{error::Error, mem::replace};
+use std::{error::Error, mem::replace, path::PathBuf};
 
 use bevy_asset::{AssetLoader, LoadContext, io::Reader};
 use bevy_ecs::entity::EntityHashMap;
@@ -15,13 +15,13 @@ use serde::{Deserialize, Serialize};
 use crate::{
     animation::{AnimatedAssetComponent, PxAnimation},
     image::PxImage,
-    palette::asset_palette,
+    palette::Palette,
     position::{DefaultLayer, PxLayer, Spatial},
     prelude::*,
     sprite::PxSpriteAsset,
 };
 
-pub(crate) fn plug<L: PxLayer>(app: &mut App) {
+pub(crate) fn plug<L: PxLayer>(app: &mut App, palette_path: PathBuf) {
     #[cfg(feature = "headed")]
     app.add_plugins((
         RenderAssetPlugin::<PxTileset>::default(),
@@ -29,7 +29,7 @@ pub(crate) fn plug<L: PxLayer>(app: &mut App) {
         SyncComponentPlugin::<PxTile>::default(),
     ));
     app.init_asset::<PxTileset>()
-        .init_asset_loader::<PxTilesetLoader>();
+        .register_asset_loader(PxTilesetLoader::new(palette_path));
     #[cfg(feature = "headed")]
     app.sub_app_mut(RenderApp)
         .add_systems(ExtractSchedule, (extract_maps::<L>, extract_tiles));
@@ -50,8 +50,15 @@ impl Default for PxTilesetLoaderSettings {
     }
 }
 
-#[derive(Default)]
-struct PxTilesetLoader;
+struct PxTilesetLoader {
+    palette_path: PathBuf,
+}
+
+impl PxTilesetLoader {
+    fn new(palette_path: PathBuf) -> Self {
+        Self { palette_path }
+    }
+}
 
 impl AssetLoader for PxTilesetLoader {
     type Asset = PxTileset;
@@ -67,7 +74,13 @@ impl AssetLoader for PxTilesetLoader {
         let image = ImageLoader::new(CompressedImageFormats::NONE)
             .load(reader, &settings.image_loader_settings, load_context)
             .await?;
-        let palette = asset_palette().await;
+        let palette = load_context
+            .loader()
+            .immediate()
+            .load::<Palette>(self.palette_path.clone())
+            .await
+            .map_err(|err| err.to_string())?;
+        let palette = palette.get();
         let indices = PxImage::palette_indices(palette, &image).map_err(|err| err.to_string())?;
         let tile_size = settings.tile_size;
         let tile_area = tile_size.x * tile_size.y;
@@ -238,6 +251,79 @@ impl Default for PxTiles {
     }
 }
 
+#[cfg(test)]
+mod tests {
+    use super::*;
+    use crate::{camera::PxCamera, frame::draw_spatial, image::PxImage, sprite::PxSpriteAsset};
+    use bevy_ecs::entity::Entity;
+    use bevy_platform::collections::HashMap;
+
+    fn pixels(image: &PxImage) -> Vec<u8> {
+        let size = image.size();
+        let mut out = Vec::with_capacity((size.x * size.y) as usize);
+        for y in 0..size.y as i32 {
+            for x in 0..size.x as i32 {
+                out.push(image.pixel(IVec2::new(x, y)));
+            }
+        }
+        out
+    }
+
+    #[test]
+    fn map_draws_tiles_in_order() {
+        let tileset = PxTileset {
+            tileset: vec![
+                PxSpriteAsset {
+                    data: PxImage::new(vec![2], 1),
+                    frame_size: 1,
+                },
+                PxSpriteAsset {
+                    data: PxImage::new(vec![3], 1),
+                    frame_size: 1,
+                },
+            ],
+            tile_size: UVec2::ONE,
+            max_frame_count: 1,
+        };
+
+        let mut tiles = PxTiles::new(UVec2::new(2, 1));
+        let tile_a = Entity::from_raw_u32(1).unwrap();
+        let tile_b = Entity::from_raw_u32(2).unwrap();
+        tiles.set(Some(tile_a), UVec2::new(0, 0));
+        tiles.set(Some(tile_b), UVec2::new(1, 0));
+
+        let mut tile_components = HashMap::new();
+        tile_components.insert(tile_a, PxTile { texture: 0 });
+        tile_components.insert(tile_b, PxTile { texture: 1 });
+
+        let mut image = PxImage::new(vec![1; 2], 2);
+        let mut slice = image.slice_all_mut();
+
+        for x in 0..2 {
+            let pos = UVec2::new(x, 0);
+            let Some(tile_entity) = tiles.get(pos) else {
+                continue;
+            };
+            let tile = tile_components.get(&tile_entity).unwrap();
+            let tile_asset = &tileset.tileset[tile.texture as usize];
+            draw_spatial(
+                tile_asset,
+                (),
+                &mut slice,
+                PxPosition(pos.as_ivec2()),
+                PxAnchor::BottomLeft,
+                PxCanvas::Camera,
+                None,
+                [],
+                PxCamera::default(),
+            );
+        }
+
+        let expected = vec![2, 3];
+        assert_eq!(pixels(&image), expected);
+    }
+}
+
 impl<'a> Spatial for (&'a PxTiles, &'a PxTileset) {
     fn frame_size(&self) -> UVec2 {
         let (tiles, tileset) = self;
diff --git a/src/palette.rs b/src/palette.rs
index 18b6976..a16d0ad 100644
--- a/src/palette.rs
+++ b/src/palette.rs
@@ -1,17 +1,15 @@
 //! Color palettes
+//!
+//! Asset loading uses a single global palette; runtime palette swaps only affect rendering.
+//! This keeps assets palette-indexed but couples loaders to a shared, immutable palette.
 
-use std::{
-    error::Error,
-    path::PathBuf,
-    sync::atomic::{AtomicBool, Ordering},
-};
+use std::{error::Error, path::PathBuf};
 
 use bevy_asset::{AssetLoader, LoadContext, io::Reader};
 use bevy_derive::{Deref, DerefMut};
 use bevy_image::{CompressedImageFormats, ImageLoader, ImageLoaderSettings};
 use bevy_platform::collections::HashMap;
 use bevy_render::render_resource::TextureFormat;
-use event_listener::Event;
 
 use crate::prelude::*;
 
@@ -19,11 +17,7 @@ pub(crate) fn plug(palette_path: PathBuf) -> impl Fn(&mut App) {
     move |app| {
         app.init_asset::<Palette>()
             .init_asset_loader::<PaletteLoader>()
-            .add_systems(Startup, init_palette(palette_path.clone()))
-            .add_systems(
-                PreUpdate,
-                load_asset_palette.run_if(resource_exists::<LoadingAssetPaletteHandle>),
-            );
+            .add_systems(Startup, init_palette(palette_path.clone()));
     }
 }
 
@@ -72,13 +66,12 @@ pub struct Palette {
 #[derive(Resource, Deref, DerefMut)]
 pub struct PaletteHandle(pub Handle<Palette>);
 
-#[derive(Resource, Deref)]
-struct LoadingAssetPaletteHandle(Handle<Palette>);
-
 impl Palette {
     /// Create a palette from an [`Image`]
     pub fn new(image: &Image) -> Result<Palette> {
-        let image = image.convert(TextureFormat::Rgba8UnormSrgb).unwrap();
+        let image = image
+            .convert(TextureFormat::Rgba8UnormSrgb)
+            .ok_or("could not convert palette image to `Rgba8UnormSrgb`")?;
         let data = image.data.ok_or("image is uninitialized")?;
 
         if data.get(3) != Some(&0) {
@@ -105,6 +98,10 @@ impl Palette {
                 },
             );
 
+        if colors.len() > 256 {
+            return Err("palette contains more than 255 colors".into());
+        }
+
         Ok(Palette {
             size: UVec2::new(
                 image.texture_descriptor.size.width,
@@ -124,58 +121,6 @@ impl Palette {
 fn init_palette(path: PathBuf) -> impl Fn(Commands, Res<AssetServer>) {
     move |mut commands, assets| {
         let palette = assets.load(path.clone());
-        commands.insert_resource(PaletteHandle(palette.clone()));
-        commands.insert_resource(LoadingAssetPaletteHandle(palette));
-    }
-}
-
-/// # Safety
-///
-/// Must not be read before `ASSET_PALETTE_INITIALIZED` is set. Must not be mutated after
-/// `ASSET_PALETTE_INITIALIZED` is set.
-static mut ASSET_PALETTE: Option<Palette> = None;
-/// Must not be unset after it has been set
-static ASSET_PALETTE_INITIALIZED: AtomicBool = AtomicBool::new(false);
-/// Notifies after `ASSET_PALETTE_INITIALIZED` is set
-static ASSET_PALETTE_JUST_INITIALIZED: Event = Event::new();
-
-#[expect(static_mut_refs)]
-pub(crate) async fn asset_palette() -> &'static Palette {
-    if ASSET_PALETTE_INITIALIZED.load(Ordering::SeqCst) {
-        // SAFETY: Checked above
-        return unsafe { ASSET_PALETTE.as_ref() }.unwrap();
-    }
-
-    let just_initialized = ASSET_PALETTE_JUST_INITIALIZED.listen();
-
-    if ASSET_PALETTE_INITIALIZED.load(Ordering::SeqCst) {
-        // SAFETY: Checked above
-        return unsafe { ASSET_PALETTE.as_ref() }.unwrap();
-    }
-
-    just_initialized.await;
-    // SAFETY: `just_initialized` finished waiting, so `ASSET_PALETTE_INITIALIZED` is set
-    unsafe { ASSET_PALETTE.as_ref() }.unwrap()
-}
-
-fn load_asset_palette(
-    palette: Res<LoadingAssetPaletteHandle>,
-    palettes: Res<Assets<Palette>>,
-    mut cmd: Commands,
-) {
-    let Some(palette) = palettes.get(&**palette) else {
-        return;
-    };
-
-    if ASSET_PALETTE_INITIALIZED.load(Ordering::SeqCst) {
-        panic!("Tried to set the asset palette after it was initialized");
+        commands.insert_resource(PaletteHandle(palette));
     }
-
-    let palette = Some(palette.clone());
-    // SAFETY: Checked above
-    unsafe { ASSET_PALETTE = palette };
-    ASSET_PALETTE_INITIALIZED.store(true, Ordering::SeqCst);
-    ASSET_PALETTE_JUST_INITIALIZED.notify(usize::MAX);
-
-    cmd.remove_resource::<LoadingAssetPaletteHandle>();
 }
diff --git a/src/picking.rs b/src/picking.rs
index f71ae78..e9a3e36 100644
--- a/src/picking.rs
+++ b/src/picking.rs
@@ -2,12 +2,104 @@ use std::collections::BTreeMap;
 
 use bevy_picking::backend::prelude::*;
 
-use crate::{cursor::PxCursorPosition, math::RectExt, prelude::*, set::PxSet};
+use crate::{
+    cursor::PxCursorPosition,
+    frame::{Frames, PxFrameControl, PxFrameView, animate, resolve_frame_binding},
+    math::RectExt,
+    position::Spatial,
+    prelude::*,
+    screen::Screen,
+    set::PxSet,
+    sprite::PxSpriteAsset,
+};
+
+/// Enable pixel-perfect picking for a sprite.
+#[derive(Component, Default, Clone, Copy, Debug)]
+pub struct PxPixelPick;
 
 pub(crate) fn plug<L: PxLayer>(app: &mut App) {
     app.add_systems(PostUpdate, pick::<L>.in_set(PxSet::Picking));
 }
 
+fn layer_depth<L: PxLayer>(layer_depths: &mut BTreeMap<L, f32>, layer: &L) -> f32 {
+    if let Some(&depth) = layer_depths.get(layer) {
+        return depth;
+    }
+
+    let depth = match (
+        layer_depths.range(..layer).last(),
+        layer_depths.range(layer..).next(),
+    ) {
+        (Some((_, &lower)), Some((_, &upper))) => (lower + upper) / 2.,
+        (Some((_, &lower)), None) => lower - 1.,
+        (None, Some((_, &upper))) => upper + 1.,
+        (None, None) => 0.,
+    };
+
+    // R-A workaround
+    BTreeMap::insert(layer_depths, layer.clone(), depth);
+    depth
+}
+
+fn spatial_rect(
+    size: UVec2,
+    position: PxPosition,
+    anchor: PxAnchor,
+    canvas: PxCanvas,
+    cam_pos: IVec2,
+) -> IRect {
+    let position = *position - anchor.pos(size).as_ivec2();
+    let position = match canvas {
+        PxCanvas::World => position - cam_pos,
+        PxCanvas::Camera => position,
+    };
+
+    IRect {
+        min: position,
+        max: position.saturating_add(size.as_ivec2()),
+    }
+}
+
+fn sprite_pixel_visible<'a>(
+    sprite: &PxSpriteAsset,
+    frame: Option<PxFrameView>,
+    filters: impl IntoIterator<Item = &'a PxFilterAsset>,
+    local_pos: UVec2,
+) -> bool {
+    let size = sprite.frame_size();
+    if size.x == 0 || size.y == 0 {
+        return false;
+    }
+    if local_pos.x >= size.x || local_pos.y >= size.y {
+        return false;
+    }
+
+    let frame_count = sprite.frame_count();
+    if frame_count == 0 {
+        return false;
+    }
+
+    let frame_index = match frame {
+        Some(frame) => animate(frame, frame_count)(local_pos),
+        None => 0,
+    };
+
+    let pixel_y = frame_index as i32 * size.y as i32 + local_pos.y as i32;
+    let mut pixel = sprite.data.pixel(IVec2::new(local_pos.x as i32, pixel_y));
+    if pixel == 0 {
+        return false;
+    }
+
+    for filter in filters {
+        pixel = filter.as_fn()(pixel);
+        if pixel == 0 {
+            return false;
+        }
+    }
+
+    true
+}
+
 // TODO Pick other entities in a generic way
 // TODO Other pointers support
 fn pick<L: PxLayer>(
@@ -22,10 +114,44 @@ fn pick<L: PxLayer>(
         &InheritedVisibility,
         Entity,
     )>,
+    sprites: Query<
+        (
+            &PxSprite,
+            &PxPosition,
+            &PxAnchor,
+            &L,
+            &PxCanvas,
+            Option<&PxFrameView>,
+            Option<&PxFrameControl>,
+            Option<&PxFilter>,
+            &InheritedVisibility,
+            Entity,
+        ),
+        With<PxPixelPick>,
+    >,
+    composites: Query<
+        (
+            &PxCompositeSprite,
+            &PxPosition,
+            &PxAnchor,
+            &L,
+            &PxCanvas,
+            Option<&PxFrameView>,
+            Option<&PxFrameControl>,
+            Option<&PxFilter>,
+            &InheritedVisibility,
+            Entity,
+        ),
+        With<PxPixelPick>,
+    >,
+    sprite_assets: Res<Assets<PxSpriteAsset>>,
+    filters: Res<Assets<PxFilterAsset>>,
     cursor: Res<PxCursorPosition>,
     px_camera: Res<PxCamera>,
+    screen: Res<Screen>,
     cameras: Query<(&Camera, Entity)>,
 ) {
+    // Note: PxPixelPick enables per-pixel picking; rects remain rectangle-based.
     let Some(cursor) = **cursor else {
         return;
     };
@@ -36,73 +162,238 @@ fn pick<L: PxLayer>(
     };
 
     let cam_pos = **px_camera;
-
+    if screen.computed_size.y == 0 || screen.computed_size.x == 0 {
+        return;
+    }
     for &pointer in &pointers {
         let PointerId::Mouse = pointer else {
             continue;
         };
 
         let mut layer_depths = BTreeMap::new();
+        let mut picks = Vec::new();
+
+        for (&rect, layer, &pos, &anchor, canvas, visibility, id) in &rects {
+            if !visibility.get() {
+                continue;
+            }
+
+            let layer = match layer {
+                PxFilterLayers::Single { layer, .. } => Some(layer),
+                PxFilterLayers::Many(layers) => layers.iter().max(),
+                // TODO Can't pick rects with this variant
+                PxFilterLayers::Range(range) => Some(range.end()),
+            };
+            let Some(layer) = layer else {
+                continue;
+            };
+
+            let depth = layer_depth(&mut layer_depths, layer);
+            let rect = spatial_rect(*rect, pos, anchor, *canvas, cam_pos);
+
+            if rect.contains_exclusive(cursor) {
+                picks.push((
+                    id,
+                    HitData {
+                        camera: camera_id,
+                        depth,
+                        position: None,
+                        normal: None,
+                    },
+                ));
+            }
+        }
+
+        for (
+            sprite,
+            &pos,
+            &anchor,
+            layer,
+            &canvas,
+            frame_view,
+            frame_control,
+            filter,
+            visibility,
+            id,
+        ) in &sprites
+        {
+            if !visibility.get() {
+                continue;
+            }
+
+            let Some(sprite) = sprite_assets.get(&**sprite) else {
+                continue;
+            };
+
+            let size = sprite.frame_size();
+            if size.x == 0 || size.y == 0 {
+                continue;
+            }
+
+            let rect = spatial_rect(size, pos, anchor, canvas, cam_pos);
+
+            if !rect.contains_exclusive(cursor) {
+                continue;
+            }
+
+            let depth = layer_depth(&mut layer_depths, layer);
+
+            let frame = frame_view
+                .copied()
+                .or_else(|| frame_control.copied().map(PxFrameView::from));
+
+            let local = cursor - rect.min;
+            let local_x = local.x as u32;
+            let local_y = local.y as u32;
+            let local_y = size.y.saturating_sub(1).saturating_sub(local_y);
+
+            let local_pos = UVec2::new(local_x, local_y);
+            let filter = filter.and_then(|filter| filters.get(&**filter));
+            if !sprite_pixel_visible(sprite, frame, filter.into_iter(), local_pos) {
+                continue;
+            }
+
+            picks.push((
+                id,
+                HitData {
+                    camera: camera_id,
+                    depth,
+                    position: None,
+                    normal: None,
+                },
+            ));
+        }
+
+        for (
+            composite,
+            &pos,
+            &anchor,
+            layer,
+            &canvas,
+            frame_view,
+            frame_control,
+            filter,
+            visibility,
+            id,
+        ) in &composites
+        {
+            if !visibility.get() {
+                continue;
+            }
+
+            let metrics = if composite.size.x == 0 || composite.size.y == 0 {
+                composite.metrics_with(|handle| {
+                    let sprite = sprite_assets.get(handle)?;
+                    Some(crate::sprite::PxCompositePartMetrics {
+                        size: sprite.frame_size(),
+                        frame_count: sprite.frame_count(),
+                    })
+                })
+            } else {
+                Some(crate::sprite::PxCompositeMetrics {
+                    size: composite.size,
+                    origin: composite.origin,
+                    frame_count: composite.frame_count,
+                })
+            };
+            let Some(metrics) = metrics else {
+                continue;
+            };
+
+            let rect = spatial_rect(metrics.size, pos, anchor, canvas, cam_pos);
+            if !rect.contains_exclusive(cursor) {
+                continue;
+            }
+
+            let depth = layer_depth(&mut layer_depths, layer);
+            let frame = frame_view
+                .copied()
+                .or_else(|| frame_control.copied().map(PxFrameView::from));
+            let master_count = metrics.frame_count;
+            let local = cursor - rect.min;
+            let entity_filter = filter.and_then(|filter| filters.get(&**filter));
+
+            let mut hit = false;
+            for part in &composite.parts {
+                let Some(sprite) = sprite_assets.get(&part.sprite) else {
+                    continue;
+                };
+
+                let part_size = sprite.frame_size().as_ivec2();
+                if part_size.x == 0 || part_size.y == 0 {
+                    continue;
+                }
+
+                let part_origin = part.offset - metrics.origin;
+                let part_local = local - part_origin;
+                if part_local.x < 0
+                    || part_local.y < 0
+                    || part_local.x >= part_size.x
+                    || part_local.y >= part_size.y
+                {
+                    continue;
+                }
+
+                let part_frame =
+                    resolve_frame_binding(frame, master_count, sprite.frame_count(), &part.frame);
+                let local_x = part_local.x as u32;
+                let local_y = part_local.y as u32;
+                let local_y = part_size.y as u32 - 1 - local_y;
+                let local_pos = UVec2::new(local_x, local_y);
+                let part_filter = part.filter.as_ref().and_then(|filter| filters.get(filter));
+                if sprite_pixel_visible(
+                    sprite,
+                    part_frame,
+                    [part_filter, entity_filter].into_iter().flatten(),
+                    local_pos,
+                ) {
+                    hit = true;
+                    break;
+                }
+            }
+
+            if hit {
+                picks.push((
+                    id,
+                    HitData {
+                        camera: camera_id,
+                        depth,
+                        position: None,
+                        normal: None,
+                    },
+                ));
+            }
+        }
 
         hits.write(PointerHits {
             pointer,
-            picks: rects
-                .iter()
-                .filter_map(|(&rect, layer, &pos, &anchor, canvas, visibility, id)| {
-                    if !visibility.get() {
-                        return None;
-                    }
-
-                    let layer = match layer {
-                        PxFilterLayers::Single { layer, .. } => Some(layer),
-                        PxFilterLayers::Many(layers) => layers.iter().max(),
-                        // TODO Can't pick rects with this variant
-                        PxFilterLayers::Range(range) => Some(range.end()),
-                    }?;
-
-                    let depth = if let Some(&depth) = layer_depths.get(layer) {
-                        depth
-                    } else {
-                        let depth = match (
-                            layer_depths.range(..layer).last(),
-                            layer_depths.range(layer..).next(),
-                        ) {
-                            (Some((_, &lower)), Some((_, &upper))) => (lower + upper) / 2.,
-                            (Some((_, &lower)), None) => lower - 1.,
-                            (None, Some((_, &upper))) => upper + 1.,
-                            (None, None) => 0.,
-                        };
-
-                        // R-A workaround
-                        BTreeMap::insert(&mut layer_depths, layer.clone(), depth);
-                        depth
-                    };
-
-                    // TODO This is duplicated from `draw_spatial`
-                    let size = *rect;
-                    let position = *pos - anchor.pos(size).as_ivec2();
-                    let position = match canvas {
-                        PxCanvas::World => position - cam_pos,
-                        PxCanvas::Camera => position,
-                    };
-
-                    IRect {
-                        min: position,
-                        max: position.saturating_add(size.as_ivec2()),
-                    }
-                    .contains_exclusive(cursor)
-                    .then_some((
-                        id,
-                        HitData {
-                            camera: camera_id,
-                            depth,
-                            position: None,
-                            normal: None,
-                        },
-                    ))
-                })
-                .collect(),
+            picks,
             order: camera.order as f32,
         });
     }
 }
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+    use crate::frame::{PxFrameSelector, PxFrameTransition};
+    use crate::image::PxImage;
+
+    #[test]
+    fn pixel_pick_uses_local_pos_for_dither() {
+        let sprite = PxSpriteAsset {
+            data: PxImage::new(vec![0, 0, 0, 0, 1, 0, 0, 0], 2),
+            frame_size: 4,
+        };
+        let frame = PxFrameView {
+            selector: PxFrameSelector::Index(0.5),
+            transition: PxFrameTransition::Dither,
+        };
+
+        let hit_a = sprite_pixel_visible(&sprite, Some(frame), [], UVec2::new(0, 0));
+        let hit_b = sprite_pixel_visible(&sprite, Some(frame), [], UVec2::new(1, 0));
+
+        assert!(hit_a);
+        assert!(!hit_b);
+    }
+}
diff --git a/src/prelude.rs b/src/prelude.rs
index 02f09c3..12c941b 100644
--- a/src/prelude.rs
+++ b/src/prelude.rs
@@ -28,15 +28,23 @@ pub(crate) use seldom_state::prelude::*;
 
 pub(crate) const OK: Result = Ok(());
 
+pub use crate::frame::{
+    PxFrame, PxFrameBinding, PxFrameControl, PxFrameCount, PxFrameSelector, PxFrameTransition,
+    PxFrameView,
+};
 #[cfg(feature = "line")]
 pub use crate::line::PxLine;
 #[cfg(feature = "particle")]
 pub use crate::particle::{PxEmitter, PxEmitterFrequency, PxEmitterSimulation, PxParticleLifetime};
+#[cfg(feature = "headed")]
+pub use crate::picking::PxPixelPick;
+#[cfg(feature = "gpu_palette")]
+pub use crate::sprite::{PxGpuComposite, PxGpuSprite};
 pub use crate::{
     PxPlugin,
     animation::{
         PxAnimation, PxAnimationDirection, PxAnimationDuration, PxAnimationFinishBehavior,
-        PxAnimationFinished, PxFrame, PxFrameSelector, PxFrameTransition,
+        PxAnimationFinished, PxAnimationPlugin,
     },
     camera::{PxCamera, PxCanvas},
     cursor::{PxCursor, PxCursorPosition},
@@ -46,7 +54,7 @@ pub use crate::{
     position::{PxAnchor, PxLayer, PxPosition, PxSubPosition, PxVelocity},
     rect::PxRect,
     screen::ScreenSize,
-    sprite::{PxSprite, PxSpriteAsset},
+    sprite::{PxCompositePart, PxCompositeSprite, PxSprite, PxSpriteAsset},
     text::{PxText, PxTypeface},
     ui::{
         PxCaret, PxGrid, PxGridRow, PxGridRows, PxKeyField, PxKeyFieldUpdate, PxMargin, PxMinSize,
diff --git a/src/rect.rs b/src/rect.rs
index 6bc667e..9853aad 100644
--- a/src/rect.rs
+++ b/src/rect.rs
@@ -4,7 +4,7 @@ use bevy_math::{ivec2, uvec2};
 use bevy_render::{Extract, RenderApp, sync_world::RenderEntity};
 
 use crate::{
-    animation::Frames, filter::DefaultPxFilterLayers, image::PxImageSliceMut, position::Spatial,
+    filter::DefaultPxFilterLayers, frame::Frames, image::PxImageSliceMut, position::Spatial,
     prelude::*,
 };
 
@@ -42,10 +42,50 @@ impl Frames for (PxRect, &PxFilterAsset) {
     ) {
         let (_, PxFilterAsset(filter)) = self;
 
-        for x in 0..image.image_width() as i32 {
-            for y in 0..image.image_height() as i32 {
-                let pos = ivec2(x, y);
-                if image.contains_pixel(pos) != invert {
+        if invert {
+            let image_width = image.image_width() as i32;
+            let image_height = image.image_height() as i32;
+            let rect_min = image.offset();
+            let rect_max = rect_min + IVec2::new(image.width() as i32, image.height() as i32);
+            let x_min = rect_min.x.clamp(0, image_width);
+            let x_max = rect_max.x.clamp(0, image_width);
+            let y_min = rect_min.y.clamp(0, image_height);
+            let y_max = rect_max.y.clamp(0, image_height);
+
+            for y in 0..y_min {
+                for x in 0..image_width {
+                    let pos = ivec2(x, y);
+                    let pixel = image.image_pixel_mut(pos);
+                    *pixel = filter_fn(filter.pixel(ivec2(
+                        *pixel as i32,
+                        frame(uvec2(x as u32, y as u32)) as i32,
+                    )));
+                }
+            }
+
+            for y in y_max..image_height {
+                for x in 0..image_width {
+                    let pos = ivec2(x, y);
+                    let pixel = image.image_pixel_mut(pos);
+                    *pixel = filter_fn(filter.pixel(ivec2(
+                        *pixel as i32,
+                        frame(uvec2(x as u32, y as u32)) as i32,
+                    )));
+                }
+            }
+
+            for y in y_min..y_max {
+                for x in 0..x_min {
+                    let pos = ivec2(x, y);
+                    let pixel = image.image_pixel_mut(pos);
+                    *pixel = filter_fn(filter.pixel(ivec2(
+                        *pixel as i32,
+                        frame(uvec2(x as u32, y as u32)) as i32,
+                    )));
+                }
+
+                for x in x_max..image_width {
+                    let pos = ivec2(x, y);
                     let pixel = image.image_pixel_mut(pos);
                     *pixel = filter_fn(filter.pixel(ivec2(
                         *pixel as i32,
@@ -53,10 +93,72 @@ impl Frames for (PxRect, &PxFilterAsset) {
                     )));
                 }
             }
+        } else {
+            let image_width = image.image_width();
+            image.for_each_mut(|_, image_index, pixel| {
+                let x = (image_index % image_width) as u32;
+                let y = (image_index / image_width) as u32;
+                *pixel = filter_fn(filter.pixel(ivec2(*pixel as i32, frame(uvec2(x, y)) as i32)));
+            });
         }
     }
 }
 
+#[cfg(test)]
+mod tests {
+    use super::*;
+    use crate::{filter::PxFilterAsset, frame::draw_frame, image::PxImage};
+
+    fn filter_asset() -> PxFilterAsset {
+        PxFilterAsset(PxImage::new(vec![0, 2, 0, 0], 4))
+    }
+
+    fn pixels(image: &PxImage) -> Vec<u8> {
+        let size = image.size();
+        let mut out = Vec::with_capacity((size.x * size.y) as usize);
+        for y in 0..size.y as i32 {
+            for x in 0..size.x as i32 {
+                out.push(image.pixel(IVec2::new(x, y)));
+            }
+        }
+        out
+    }
+
+    #[test]
+    fn rect_draws_inside_only() {
+        let mut image = PxImage::new(vec![1; 16], 4);
+        let mut slice = image.slice_all_mut();
+        let mut rect_slice = slice.slice_mut(IRect {
+            min: ivec2(1, 1),
+            max: ivec2(3, 3),
+        });
+        let rect = PxRect(UVec2::new(2, 2));
+        let filter = filter_asset();
+
+        draw_frame(&(rect, &filter), false, &mut rect_slice, None, []);
+
+        let expected = vec![1, 1, 1, 1, 1, 2, 2, 1, 1, 2, 2, 1, 1, 1, 1, 1];
+        assert_eq!(pixels(&image), expected);
+    }
+
+    #[test]
+    fn rect_invert_draws_outside_only() {
+        let mut image = PxImage::new(vec![1; 16], 4);
+        let mut slice = image.slice_all_mut();
+        let mut rect_slice = slice.slice_mut(IRect {
+            min: ivec2(1, 1),
+            max: ivec2(3, 3),
+        });
+        let rect = PxRect(UVec2::new(2, 2));
+        let filter = filter_asset();
+
+        draw_frame(&(rect, &filter), true, &mut rect_slice, None, []);
+
+        let expected = vec![2, 2, 2, 2, 2, 1, 1, 2, 2, 1, 1, 2, 2, 2, 2, 2];
+        assert_eq!(pixels(&image), expected);
+    }
+}
+
 impl Spatial for (PxRect, &PxFilterAsset) {
     fn frame_size(&self) -> UVec2 {
         *self.0
diff --git a/src/screen.rs b/src/screen.rs
index 459b907..2516082 100644
--- a/src/screen.rs
+++ b/src/screen.rs
@@ -1,55 +1,68 @@
 //! Screen and rendering
+//!
+//! Data flow: gather render-world components by layer, draw into a CPU `PxImage`,
+//! then upload to a reusable `R8Uint` texture and present via a fullscreen quad.
+//! This is the single compositing path for sprites, text, tilemaps, rects, lines, and filters.
 
-// TODO Split out a module
+mod draw;
+#[cfg(feature = "gpu_palette")]
+mod gpu_sprite;
+mod node;
+mod pipeline;
 
-use std::{collections::BTreeMap, iter::empty, marker::PhantomData};
+use std::marker::PhantomData;
+#[cfg(feature = "gpu_palette")]
+use std::sync::RwLock;
 
 use bevy_asset::uuid_handle;
 #[cfg(feature = "headed")]
 use bevy_core_pipeline::core_2d::graph::{Core2d, Node2d};
-use bevy_derive::{Deref, DerefMut};
-use bevy_image::TextureFormatPixelInfo;
-use bevy_math::{ivec2, uvec2};
+use bevy_math::UVec2;
 #[cfg(feature = "headed")]
 use bevy_render::{
     Render, RenderApp, RenderSystems,
     extract_resource::{ExtractResource, ExtractResourcePlugin},
-    render_asset::RenderAssets,
-    render_graph::{
-        NodeRunError, RenderGraphContext, RenderGraphExt, RenderLabel, ViewNode, ViewNodeRunner,
-    },
-    render_resource::{
-        BindGroupEntries, BindGroupLayout, BindGroupLayoutEntries, CachedRenderPipelineId,
-        ColorTargetState, ColorWrites, DynamicUniformBuffer, Extent3d, FragmentState,
-        PipelineCache, RenderPassColorAttachment, RenderPassDescriptor, RenderPipelineDescriptor,
-        ShaderStages, ShaderType, TexelCopyBufferLayout, TextureDimension, TextureFormat,
-        TextureSampleType, TextureViewDescriptor, TextureViewDimension, VertexState,
-        binding_types::{texture_2d, uniform_buffer},
-    },
-    renderer::{RenderContext, RenderDevice, RenderQueue},
-    view::ViewTarget,
+    render_graph::{RenderGraphExt, RenderLabel, ViewNodeRunner},
 };
 #[cfg(feature = "headed")]
 use bevy_window::{PrimaryWindow, WindowResized};
 
-#[cfg(feature = "line")]
-use crate::line::{LineComponents, draw_line};
+#[cfg(feature = "gpu_palette")]
+use crate::filter::PxFilter;
+
 use crate::{
-    animation::draw_spatial,
-    cursor::{CursorState, PxCursorPosition},
-    filter::{FilterComponents, draw_filter},
-    image::{PxImage, PxImageSliceMut},
-    map::{MapComponents, PxTile, TileComponents},
     palette::{Palette, PaletteHandle},
     position::PxLayer,
     prelude::*,
-    rect::RectComponents,
-    sprite::SpriteComponents,
-    text::TextComponents,
 };
 
+#[cfg(feature = "gpu_palette")]
+use gpu_sprite::{PxGpuSpriteBuffer, PxGpuSpriteNode, PxGpuSpritePipeline};
+use node::PxRenderNode;
+use pipeline::{PxPipeline, PxRenderBuffer, PxUniformBuffer, prepare_uniform};
+
 #[cfg(feature = "headed")]
 const SCREEN_SHADER_HANDLE: Handle<Shader> = uuid_handle!("48CE4F2C-8B78-5954-08A8-461F62E10E84");
+#[cfg(feature = "gpu_palette")]
+const GPU_SPRITE_SHADER_HANDLE: Handle<Shader> =
+    uuid_handle!("1845F452-7396-4858-A665-9FC8B796AF31");
+
+#[cfg(feature = "gpu_palette")]
+#[derive(Resource, Default)]
+pub(crate) struct PxLayerOrder<L: PxLayer> {
+    inner: RwLock<Vec<L>>,
+}
+
+#[cfg(feature = "gpu_palette")]
+impl<L: PxLayer> PxLayerOrder<L> {
+    pub(crate) fn set(&self, layers: Vec<L>) {
+        *self.inner.write().unwrap() = layers;
+    }
+
+    pub(crate) fn read(&self) -> std::sync::RwLockReadGuard<'_, Vec<L>> {
+        self.inner.read().unwrap()
+    }
+}
 
 pub(crate) struct Plug<L: PxLayer> {
     size: ScreenSize,
@@ -76,33 +89,67 @@ impl<L: PxLayer> Plugin for Plug<L> {
 
         // R-A workaround
         #[cfg(feature = "headed")]
-        Assets::insert(
-            &mut app
-                .add_systems(PostUpdate, resize_screen)
-                .world_mut()
-                .resource_mut::<Assets<Shader>>(),
-            SCREEN_SHADER_HANDLE.id(),
-            Shader::from_wgsl(include_str!("screen.wgsl"), "screen.wgsl"),
-        );
+        {
+            app.add_systems(PostUpdate, resize_screen);
+            let mut shaders = app.world_mut().resource_mut::<Assets<Shader>>();
+            let _ = Assets::insert(
+                &mut shaders,
+                SCREEN_SHADER_HANDLE.id(),
+                Shader::from_wgsl(include_str!("screen.wgsl"), "screen.wgsl"),
+            );
+            #[cfg(feature = "gpu_palette")]
+            let _ = Assets::insert(
+                &mut shaders,
+                GPU_SPRITE_SHADER_HANDLE.id(),
+                Shader::from_wgsl(include_str!("gpu_sprite.wgsl"), "gpu_sprite.wgsl"),
+            );
+        }
 
         #[cfg(feature = "headed")]
-        app.sub_app_mut(RenderApp)
-            .add_render_graph_node::<ViewNodeRunner<PxRenderNode<L>>>(Core2d, PxRender)
-            .add_render_graph_edges(
+        {
+            let render_app = app.sub_app_mut(RenderApp);
+            render_app.add_render_graph_node::<ViewNodeRunner<PxRenderNode<L>>>(Core2d, PxRender);
+            #[cfg(feature = "gpu_palette")]
+            render_app.add_render_graph_node::<ViewNodeRunner<PxGpuSpriteNode<L>>>(
+                Core2d,
+                PxGpuSpriteRender,
+            );
+            #[cfg(feature = "gpu_palette")]
+            render_app.add_render_graph_edges(
                 Core2d,
                 (
                     Node2d::Tonemapping,
                     PxRender,
+                    PxGpuSpriteRender,
                     Node2d::EndMainPassPostProcessing,
                 ),
-            )
-            .init_resource::<PxUniformBuffer>()
-            .add_systems(Render, prepare_uniform.in_set(RenderSystems::Prepare));
+            );
+            #[cfg(not(feature = "gpu_palette"))]
+            render_app.add_render_graph_edges(
+                Core2d,
+                (
+                    Node2d::Tonemapping,
+                    PxRender,
+                    Node2d::EndMainPassPostProcessing,
+                ),
+            );
+
+            render_app
+                .init_resource::<PxUniformBuffer>()
+                .add_systems(Render, prepare_uniform.in_set(RenderSystems::Prepare));
+        }
     }
 
     fn finish(&self, _app: &mut App) {
         #[cfg(feature = "headed")]
-        _app.sub_app_mut(RenderApp).init_resource::<PxPipeline>();
+        _app.sub_app_mut(RenderApp)
+            .init_resource::<PxPipeline>()
+            .init_resource::<PxRenderBuffer>();
+        #[cfg(feature = "gpu_palette")]
+        _app.sub_app_mut(RenderApp)
+            .init_resource::<PxGpuSpritePipeline>()
+            .init_resource::<PxGpuSpriteBuffer>()
+            .init_resource::<PxLayerOrder<L>>();
     }
 }
 
@@ -158,6 +205,31 @@ impl Screen {
     }
 }
 
+#[cfg(feature = "gpu_palette")]
+pub(crate) fn gpu_sprite_supported(frame: Option<PxFrame>, filter: Option<&PxFilter>) -> bool {
+    if filter.is_some() {
+        return false;
+    }
+
+    match frame {
+        Some(frame) => !matches!(frame.transition, PxFrameTransition::Dither),
+        None => true,
+    }
+}
+
+#[cfg(feature = "gpu_palette")]
+pub(crate) fn gpu_composite_supported(
+    composite: &PxCompositeSprite,
+    frame: Option<PxFrame>,
+    filter: Option<&PxFilter>,
+) -> bool {
+    if !gpu_sprite_supported(frame, filter) {
+        return false;
+    }
+
+    composite.parts.iter().all(|part| part.filter.is_none())
+}
+
 pub(crate) fn screen_scale(screen_size: UVec2, window_size: Vec2) -> Vec2 {
     let aspect = screen_size.y as f32 / screen_size.x as f32;
 
@@ -220,7 +292,7 @@ fn init_screen(
 
     screen.palette = screen_palette;
 
-    *initialized = false;
+    *initialized = true;
 }
 
 #[cfg(feature = "headed")]
@@ -233,930 +305,13 @@ fn resize_screen(mut window_resized: MessageReader<WindowResized>, mut screen: R
     }
 }
 
-#[cfg(feature = "headed")]
-#[derive(ShaderType)]
-struct PxUniform {
-    palette: [Vec3; 256],
-    fit_factor: Vec2,
-}
-
-#[cfg(feature = "headed")]
-#[derive(Resource, Deref, DerefMut, Default)]
-struct PxUniformBuffer(DynamicUniformBuffer<PxUniform>);
-
-#[cfg(feature = "headed")]
-fn prepare_uniform(
-    mut buffer: ResMut<PxUniformBuffer>,
-    screen: Res<Screen>,
-    device: Res<RenderDevice>,
-    queue: Res<RenderQueue>,
-) {
-    let Some(mut writer) = buffer.get_writer(1, &device, &queue) else {
-        return;
-    };
-
-    let aspect_ratio_ratio =
-        screen.computed_size.x as f32 / screen.computed_size.y as f32 / screen.window_aspect_ratio;
-    writer.write(&PxUniform {
-        palette: screen.palette,
-        fit_factor: if aspect_ratio_ratio > 1. {
-            Vec2::new(1., 1. / aspect_ratio_ratio)
-        } else {
-            Vec2::new(aspect_ratio_ratio, 1.)
-        },
-    });
-}
-
-#[cfg(feature = "headed")]
-#[derive(Resource)]
-struct PxPipeline {
-    layout: BindGroupLayout,
-    id: CachedRenderPipelineId,
-}
-
-#[cfg(feature = "headed")]
-impl FromWorld for PxPipeline {
-    fn from_world(world: &mut World) -> Self {
-        let render_device = world.resource::<RenderDevice>();
-
-        let layout = render_device.create_bind_group_layout(
-            "px_bind_group_layout",
-            &BindGroupLayoutEntries::sequential(
-                ShaderStages::FRAGMENT,
-                (
-                    texture_2d(TextureSampleType::Uint),
-                    uniform_buffer::<PxUniform>(false).visibility(ShaderStages::VERTEX_FRAGMENT),
-                ),
-            ),
-        );
-
-        Self {
-            id: world.resource_mut::<PipelineCache>().queue_render_pipeline(
-                RenderPipelineDescriptor {
-                    label: Some("px_pipeline".into()),
-                    layout: vec![layout.clone()],
-                    vertex: VertexState {
-                        shader: SCREEN_SHADER_HANDLE,
-                        shader_defs: Vec::new(),
-                        entry_point: Some("vertex".into()),
-                        buffers: Vec::new(),
-                    },
-                    fragment: Some(FragmentState {
-                        shader: SCREEN_SHADER_HANDLE,
-                        shader_defs: Vec::new(),
-                        entry_point: Some("fragment".into()),
-                        targets: vec![Some(ColorTargetState {
-                            format: TextureFormat::bevy_default(),
-                            blend: None,
-                            write_mask: ColorWrites::ALL,
-                        })],
-                    }),
-                    primitive: default(),
-                    depth_stencil: None,
-                    multisample: default(),
-                    push_constant_ranges: Vec::new(),
-                    zero_initialize_workgroup_memory: true,
-                },
-            ),
-            layout,
-        }
-    }
-}
-
 #[cfg(feature = "headed")]
 #[derive(RenderLabel, Hash, Eq, PartialEq, Clone, Debug)]
 struct PxRender;
 
-struct PxRenderNode<L: PxLayer> {
-    maps: QueryState<MapComponents<L>>,
-    tiles: QueryState<TileComponents>,
-    // image_to_sprites: QueryState<ImageToSpriteComponents<L>>,
-    sprites: QueryState<SpriteComponents<L>>,
-    texts: QueryState<TextComponents<L>>,
-    rects: QueryState<RectComponents<L>>,
-    #[cfg(feature = "line")]
-    lines: QueryState<LineComponents<L>>,
-    filters: QueryState<FilterComponents<L>, Without<PxCanvas>>,
-}
-
-impl<L: PxLayer> FromWorld for PxRenderNode<L> {
-    fn from_world(world: &mut World) -> Self {
-        Self {
-            maps: world.query(),
-            tiles: world.query(),
-            // image_to_sprites: world.query(),
-            sprites: world.query(),
-            texts: world.query(),
-            rects: world.query(),
-            #[cfg(feature = "line")]
-            lines: world.query(),
-            filters: world.query_filtered(),
-        }
-    }
-}
-
-#[cfg(feature = "headed")]
-impl<L: PxLayer> ViewNode for PxRenderNode<L> {
-    type ViewQuery = &'static ViewTarget;
-
-    fn update(&mut self, world: &mut World) {
-        self.maps.update_archetypes(world);
-        self.tiles.update_archetypes(world);
-        // self.image_to_sprites.update_archetypes(world);
-        self.sprites.update_archetypes(world);
-        self.texts.update_archetypes(world);
-        self.rects.update_archetypes(world);
-        #[cfg(feature = "line")]
-        self.lines.update_archetypes(world);
-        self.filters.update_archetypes(world);
-    }
-
-    fn run<'w>(
-        &self,
-        _: &mut RenderGraphContext,
-        render_context: &mut RenderContext<'w>,
-        target: &ViewTarget,
-        world: &'w World,
-    ) -> Result<(), NodeRunError> {
-        let &camera = world.resource::<PxCamera>();
-        let screen = world.resource::<Screen>();
-
-        let mut image = Image::new_fill(
-            Extent3d {
-                width: screen.computed_size.x,
-                height: screen.computed_size.y,
-                depth_or_array_layers: 1,
-            },
-            TextureDimension::D2,
-            &[0],
-            TextureFormat::R8Uint,
-            default(),
-        );
-
-        #[cfg(feature = "line")]
-        let mut layer_contents = BTreeMap::<
-            _,
-            (
-                Vec<_>,
-                Vec<_>,
-                Vec<_>,
-                Vec<_>,
-                Vec<_>,
-                Vec<_>,
-                Vec<_>,
-                Vec<_>,
-                Vec<_>,
-            ),
-        >::default();
-        #[cfg(not(feature = "line"))]
-        let mut layer_contents = BTreeMap::<
-            _,
-            (
-                Vec<_>,
-                Vec<_>,
-                Vec<_>,
-                Vec<_>,
-                (),
-                Vec<_>,
-                Vec<_>,
-                (),
-                Vec<_>,
-            ),
-        >::default();
-
-        for (map, &pos, layer, &canvas, animation, filter) in self.maps.iter_manual(world) {
-            let map = (map, pos, canvas, animation, filter);
-
-            if let Some((maps, _, _, _, _, _, _, _, _)) = layer_contents.get_mut(layer) {
-                maps.push(map);
-            } else {
-                BTreeMap::insert(
-                    &mut layer_contents,
-                    layer.clone(),
-                    (
-                        vec![map],
-                        Vec::new(),
-                        Vec::new(),
-                        Vec::new(),
-                        default(),
-                        Vec::new(),
-                        Vec::new(),
-                        default(),
-                        Vec::new(),
-                    ),
-                );
-            }
-        }
-
-        // for (image, position, anchor, layer, canvas, filter) in
-        //     self.image_to_sprites.iter_manual(world)
-        // {
-        //     if let Some((_, image_to_sprites, _, _, _, _, _, _)) = layer_contents.get_mut(layer) {
-        //         image_to_sprites.push((image, position, anchor, canvas, filter));
-        //     } else {
-        //         layer_contents.insert(
-        //             layer.clone(),
-        //             (
-        //                 default(),
-        //                 vec![(image, position, anchor, canvas, filter)],
-        //                 default(),
-        //                 default(),
-        //                 default(),
-        //                 default(),
-        //                 default(),
-        //                 default(),
-        //             ),
-        //         );
-        //     }
-        // }
-
-        for (sprite, &position, &anchor, layer, &canvas, animation, filter) in
-            self.sprites.iter_manual(world)
-        {
-            let sprite = (sprite, position, anchor, canvas, animation, filter);
-
-            if let Some((_, sprites, _, _, _, _, _, _, _)) = layer_contents.get_mut(layer) {
-                sprites.push(sprite);
-            } else {
-                BTreeMap::insert(
-                    &mut layer_contents,
-                    layer.clone(),
-                    (
-                        Vec::new(),
-                        vec![sprite],
-                        Vec::new(),
-                        Vec::new(),
-                        default(),
-                        Vec::new(),
-                        Vec::new(),
-                        default(),
-                        Vec::new(),
-                    ),
-                );
-            }
-        }
-
-        for (text, &pos, &alignment, layer, &canvas, animation, filter) in
-            self.texts.iter_manual(world)
-        {
-            let text = (text, pos, alignment, canvas, animation, filter);
-
-            if let Some((_, _, texts, _, _, _, _, _, _)) = layer_contents.get_mut(layer) {
-                texts.push(text);
-            } else {
-                BTreeMap::insert(
-                    &mut layer_contents,
-                    layer.clone(),
-                    (
-                        Vec::new(),
-                        Vec::new(),
-                        vec![text],
-                        Vec::new(),
-                        default(),
-                        Vec::new(),
-                        Vec::new(),
-                        default(),
-                        Vec::new(),
-                    ),
-                );
-            }
-        }
-
-        for (&rect, filter, layers, &pos, &anchor, &canvas, animation, invert) in
-            self.rects.iter_manual(world)
-        {
-            for (layer, clip) in match layers {
-                PxFilterLayers::Single { layer, clip } => vec![(layer.clone(), *clip)],
-                // TODO Need to do this after all layers have been extracted
-                PxFilterLayers::Range(range) => layer_contents
-                    .keys()
-                    .filter(|layer| range.contains(layer))
-                    .map(|layer| (layer.clone(), true))
-                    .collect(),
-                PxFilterLayers::Many(layers) => {
-                    layers.iter().map(|layer| (layer.clone(), true)).collect()
-                }
-            }
-            .into_iter()
-            {
-                let rect = (rect, filter, pos, anchor, canvas, animation, invert);
-
-                if let Some((_, _, _, clip_rects, _, _, over_rects, _, _)) =
-                    layer_contents.get_mut(&layer)
-                {
-                    if clip { clip_rects } else { over_rects }.push(rect);
-                } else {
-                    let rects = vec![rect];
-
-                    BTreeMap::insert(
-                        &mut layer_contents,
-                        layer,
-                        if clip {
-                            (
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                rects,
-                                default(),
-                                Vec::new(),
-                                Vec::new(),
-                                default(),
-                                Vec::new(),
-                            )
-                        } else {
-                            (
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                default(),
-                                Vec::new(),
-                                rects,
-                                default(),
-                                Vec::new(),
-                            )
-                        },
-                    );
-                }
-            }
-        }
-
-        #[cfg(feature = "line")]
-        for (line, filter, layers, &canvas, animation, invert) in self.lines.iter_manual(world) {
-            let line = (line, filter, canvas, animation, invert);
-
-            for (layer, clip) in match layers {
-                PxFilterLayers::Single { layer, clip } => vec![(layer.clone(), *clip)],
-                PxFilterLayers::Range(range) => layer_contents
-                    .keys()
-                    .filter(|layer| range.contains(layer))
-                    .map(|layer| (layer.clone(), true))
-                    .collect(),
-                PxFilterLayers::Many(layers) => {
-                    layers.iter().map(|layer| (layer.clone(), true)).collect()
-                }
-            }
-            .into_iter()
-            {
-                if let Some((_, _, _, _, clip_lines, _, _, over_lines, _)) =
-                    layer_contents.get_mut(&layer)
-                {
-                    if clip { clip_lines } else { over_lines }.push(line);
-                } else {
-                    let lines = vec![line];
-
-                    BTreeMap::insert(
-                        &mut layer_contents,
-                        layer,
-                        if clip {
-                            (
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                lines,
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                            )
-                        } else {
-                            (
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                lines,
-                                Vec::new(),
-                            )
-                        },
-                    );
-                }
-            }
-        }
-
-        for (filter, layers, animation) in self.filters.iter_manual(world) {
-            let filter = (filter, animation);
-
-            for (layer, clip) in match layers {
-                PxFilterLayers::Single { layer, clip } => vec![(layer.clone(), *clip)],
-                PxFilterLayers::Range(range) => layer_contents
-                    .keys()
-                    .filter(|layer| range.contains(layer))
-                    .map(|layer| (layer.clone(), true))
-                    .collect(),
-                PxFilterLayers::Many(layers) => {
-                    layers.iter().map(|layer| (layer.clone(), true)).collect()
-                }
-            }
-            .into_iter()
-            {
-                if let Some((_, _, _, _, _, clip_filters, _, _, over_filters)) =
-                    layer_contents.get_mut(&layer)
-                {
-                    if clip { clip_filters } else { over_filters }.push(filter);
-                } else {
-                    let filters = vec![filter];
-
-                    BTreeMap::insert(
-                        &mut layer_contents,
-                        layer,
-                        if clip {
-                            (
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                default(),
-                                filters,
-                                Vec::new(),
-                                default(),
-                                Vec::new(),
-                            )
-                        } else {
-                            (
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                Vec::new(),
-                                default(),
-                                Vec::new(),
-                                Vec::new(),
-                                default(),
-                                filters,
-                            )
-                        },
-                    );
-                }
-            }
-        }
-
-        let tilesets = world.resource::<RenderAssets<PxTileset>>();
-        // let images = world.resource::<RenderAssets<GpuImage>>();
-        let sprite_assets = world.resource::<RenderAssets<PxSpriteAsset>>();
-        let typefaces = world.resource::<RenderAssets<PxTypeface>>();
-        let filters = world.resource::<RenderAssets<PxFilterAsset>>();
-
-        let mut layer_image = PxImage::empty_from_image(&image);
-        let mut image_slice = PxImageSliceMut::from_image_mut(&mut image).unwrap();
-
-        #[allow(unused_variables)]
-        for (
-            _,
-            (
-                maps,
-                // image_to_sprites,
-                sprites,
-                texts,
-                clip_rects,
-                clip_lines,
-                clip_filters,
-                over_rects,
-                over_lines,
-                over_filters,
-            ),
-        ) in layer_contents.into_iter()
-        {
-            layer_image.clear();
-            let mut layer_slice = layer_image.slice_all_mut();
-
-            for (map, position, canvas, frame, map_filter) in maps {
-                let Some(tileset) = tilesets.get(&map.tileset) else {
-                    continue;
-                };
-
-                let map_filter = map_filter.and_then(|map_filter| filters.get(&**map_filter));
-                let size = map.tiles.size();
-
-                for x in 0..size.x {
-                    for y in 0..size.y {
-                        let pos = UVec2::new(x, y);
-
-                        let Some(tile) = map.tiles.get(pos) else {
-                            continue;
-                        };
-
-                        let Ok((&PxTile { texture }, tile_filter)) =
-                            self.tiles.get_manual(world, tile)
-                        else {
-                            continue;
-                        };
-
-                        let Some(tile) = tileset.tileset.get(texture as usize) else {
-                            error!(
-                                "tile texture index out of bounds: the len is {}, but the index is {texture}",
-                                tileset.tileset.len()
-                            );
-                            continue;
-                        };
-
-                        draw_spatial(
-                            tile,
-                            (),
-                            &mut layer_slice,
-                            (*position + pos.as_ivec2() * tileset.tile_size().as_ivec2()).into(),
-                            PxAnchor::BottomLeft,
-                            canvas,
-                            frame.copied(),
-                            [
-                                tile_filter.and_then(|tile_filter| filters.get(&**tile_filter)),
-                                map_filter,
-                            ]
-                            .into_iter()
-                            .flatten(),
-                            camera,
-                        );
-                    }
-                }
-            }
-
-            // I was trying to make `ImageToSprite` work without 1-frame lag, but this
-            // fundamentally needs GPU readback or something bc you can't just get image data
-            // from a `GpuImage`. I think those represent images that're actually on the GPU. So
-            // here's where I left off with that. I don't need `ImageToSprite` at the moment, so
-            // this will be left incomplete until I need it, if I ever do.
-
-            // // TODO Use more helpers
-            // // TODO Feature gate
-            // // TODO Immediate function version
-            // for (image, position, anchor, canvas, filter) in image_to_sprites {
-            //     // let palette = screen.palette
-            //     //     .colors
-            //     //     .iter()
-            //     //     .map(|&color| Oklaba::from(Srgba::from_u8_array_no_alpha(color)).to_vec3())
-            //     //     .collect::<Vec<Vec3>>();
-
-            //     let palette_tree = ImmutableKdTree::from(
-            //         &screen
-            //             .palette
-            //             .iter()
-            //             .map(|&color| color.into())
-            //             .collect::<Vec<[f32; 3]>>()[..],
-            //     );
-
-            //     let dither = &image.dither;
-            //     let Some(image) = images.get(&image.image) else {
-            //         continue;
-            //     };
-
-            //     // TODO https://github.com/bevyengine/bevy/blob/v0.14.1/examples/app/headless_renderer.rs
-            //     let size = image.size;
-            //     let data = PxImage::empty(size);
-
-            //     let mut sprite = PxSprite {
-            //         frame_size: data.area(),
-            //         data,
-            //     };
-
-            //     let mut pixels = image
-            //         .data
-            //         .chunks_exact(4)
-            //         .zip(sprite.data.iter_mut())
-            //         .enumerate()
-            //         .collect::<Vec<_>>();
-
-            //     pixels.par_chunk_map_mut(ComputeTaskPool::get(), 20, |_, pixels| {
-            //         use DitherAlgorithm::*;
-            //         use ThresholdMap::*;
-
-            //         match *dither {
-            //             None => dither_slice::<ClosestAlg, 1>(
-            //                 pixels,
-            //                 0.,
-            //                 size,
-            //                 &screen.palette_tree,
-            //                 &screen.palette,
-            //             ),
-            //             Some(Dither {
-            //                 algorithm: Ordered,
-            //                 threshold,
-            //                 threshold_map: X2_2,
-            //             }) => dither_slice::<OrderedAlg, 4>(
-            //                 pixels,
-            //                 threshold,
-            //                 size,
-            //                 &screen.palette_tree,
-            //                 &screen.palette,
-            //             ),
-            //             Some(Dither {
-            //                 algorithm: Ordered,
-            //                 threshold,
-            //                 threshold_map: X4_4,
-            //             }) => dither_slice::<OrderedAlg, 16>(
-            //                 pixels,
-            //                 threshold,
-            //                 size,
-            //                 &screen.palette_tree,
-            //                 &screen.palette,
-            //             ),
-            //             Some(Dither {
-            //                 algorithm: Ordered,
-            //                 threshold,
-            //                 threshold_map: X8_8,
-            //             }) => dither_slice::<OrderedAlg, 64>(
-            //                 pixels,
-            //                 threshold,
-            //                 size,
-            //                 &screen.palette_tree,
-            //                 &screen.palette,
-            //             ),
-            //             Some(Dither {
-            //                 algorithm: Pattern,
-            //                 threshold,
-            //                 threshold_map: X2_2,
-            //             }) => dither_slice::<PatternAlg, 4>(
-            //                 pixels,
-            //                 threshold,
-            //                 size,
-            //                 &screen.palette_tree,
-            //                 &screen.palette,
-            //             ),
-            //             Some(Dither {
-            //                 algorithm: Pattern,
-            //                 threshold,
-            //                 threshold_map: X4_4,
-            //             }) => dither_slice::<PatternAlg, 16>(
-            //                 pixels,
-            //                 threshold,
-            //                 size,
-            //                 &screen.palette_tree,
-            //                 &screen.palette,
-            //             ),
-            //             Some(Dither {
-            //                 algorithm: Pattern,
-            //                 threshold,
-            //                 threshold_map: X8_8,
-            //             }) => dither_slice::<PatternAlg, 64>(
-            //                 pixels,
-            //                 threshold,
-            //                 size,
-            //                 &screen.palette_tree,
-            //                 &screen.palette,
-            //             ),
-            //         }
-            //     });
-
-            //     draw_spatial(
-            //         &sprite,
-            //         (),
-            //         &mut layer_image,
-            //         *position,
-            //         *anchor,
-            //         *canvas,
-            //         None,
-            //         filter.and_then(|filter| filters.get(filter)),
-            //         camera,
-            //     );
-            // }
-
-            for (sprite, position, anchor, canvas, frame, filter) in sprites {
-                let Some(sprite) = sprite_assets.get(&**sprite) else {
-                    continue;
-                };
-
-                draw_spatial(
-                    sprite,
-                    (),
-                    &mut layer_slice,
-                    position,
-                    anchor,
-                    canvas,
-                    frame.copied(),
-                    filter.and_then(|filter| filters.get(&**filter)),
-                    camera,
-                );
-            }
-
-            for (text, pos, alignment, canvas, frame, filter) in texts {
-                let Some(typeface) = typefaces.get(&text.typeface) else {
-                    continue;
-                };
-
-                let line_break_count = text.line_breaks.len() as u32;
-                let mut size = uvec2(
-                    0,
-                    (line_break_count + 1) * typeface.height + line_break_count,
-                );
-                let mut x = 0;
-                let mut y = 0;
-                let mut chars = Vec::new();
-                let mut line_break_index = 0;
-
-                for (index, char) in text.value.chars().enumerate() {
-                    if let Some(char) = typeface.characters.get(&char) {
-                        if x != 0 {
-                            x += 1;
-                        }
-
-                        chars.push((x, y, char));
-                        x += char.data.size().x;
-
-                        if x > size.x {
-                            size.x = x;
-                        }
-                    } else if let Some(separator) = typeface.separators.get(&char) {
-                        x += separator.width;
-                    } else {
-                        error!(r#"character "{char}" in text isn't in typeface"#);
-                    }
-
-                    if text.line_breaks.get(line_break_index).copied() == Some(index as u32) {
-                        line_break_index += 1;
-                        y += typeface.height + 1;
-                        x = 0;
-                    }
-                }
-
-                let top_left = *pos - alignment.pos(size).as_ivec2() + ivec2(0, size.y as i32 - 1);
-
-                for (x, y, char) in chars {
-                    draw_spatial(
-                        char,
-                        (),
-                        &mut layer_slice,
-                        PxPosition(top_left + ivec2(x as i32, -(y as i32))),
-                        PxAnchor::TopLeft,
-                        canvas,
-                        frame.copied(),
-                        filter.and_then(|filter| filters.get(&**filter)),
-                        camera,
-                    );
-                }
-            }
-
-            for (rect, filter, pos, anchor, canvas, frame, invert) in clip_rects {
-                if let Some(filter) = filters.get(&**filter) {
-                    draw_spatial(
-                        &(rect, filter),
-                        invert,
-                        &mut layer_slice,
-                        pos,
-                        anchor,
-                        canvas,
-                        frame.copied(),
-                        empty(),
-                        camera,
-                    );
-                }
-            }
-
-            // This is where I draw the line! /j
-            #[cfg(feature = "line")]
-            for (line, filter, canvas, frame, invert) in clip_lines {
-                if let Some(filter) = filters.get(&**filter) {
-                    draw_line(
-                        line,
-                        filter,
-                        invert,
-                        &mut layer_slice,
-                        canvas,
-                        frame.copied(),
-                        camera,
-                    );
-                }
-            }
-
-            for (filter, frame) in clip_filters {
-                if let Some(filter) = filters.get(&**filter) {
-                    draw_filter(filter, frame.copied(), &mut layer_slice);
-                }
-            }
-
-            image_slice.draw(&layer_image);
-
-            for (rect, filter, pos, anchor, canvas, frame, invert) in over_rects {
-                if let Some(filter) = filters.get(&**filter) {
-                    draw_spatial(
-                        &(rect, filter),
-                        invert,
-                        &mut image_slice,
-                        pos,
-                        anchor,
-                        canvas,
-                        frame.copied(),
-                        empty(),
-                        camera,
-                    );
-                }
-            }
-
-            #[cfg(feature = "line")]
-            for (line, filter, canvas, frame, invert) in over_lines {
-                if let Some(filter) = filters.get(&**filter) {
-                    draw_line(
-                        line,
-                        filter,
-                        invert,
-                        &mut image_slice,
-                        canvas,
-                        frame.copied(),
-                        camera,
-                    );
-                }
-            }
-
-            for (filter, frame) in over_filters {
-                if let Some(filter) = filters.get(&**filter) {
-                    draw_filter(filter, frame.copied(), &mut image_slice);
-                }
-            }
-        }
-
-        let cursor = world.resource::<CursorState>();
-
-        if let PxCursor::Filter {
-            idle,
-            left_click,
-            right_click,
-        } = world.resource()
-            && let Some(cursor_pos) = **world.resource::<PxCursorPosition>()
-            && let Some(PxFilterAsset(filter)) = filters.get(match cursor {
-                CursorState::Idle => idle,
-                CursorState::Left => left_click,
-                CursorState::Right => right_click,
-            })
-            && let mut image = PxImageSliceMut::from_image_mut(&mut image).unwrap()
-            && let Some(pixel) = image.get_pixel_mut(IVec2::new(
-                cursor_pos.x as i32,
-                image.height() as i32 - 1 - cursor_pos.y as i32,
-            ))
-        {
-            if let Some(new_pixel) = filter.get_pixel(IVec2::new(*pixel as i32, 0)) {
-                *pixel = new_pixel;
-            } else {
-                error!("`PxCursor` filter is the wrong size");
-            }
-        }
-
-        let Some(uniform_binding) = world.resource::<PxUniformBuffer>().binding() else {
-            return Ok(());
-        };
-
-        let texture = render_context
-            .render_device()
-            .create_texture(&image.texture_descriptor);
-
-        let Ok(pixel_size) = image.texture_descriptor.format.pixel_size() else {
-            return Ok(());
-        };
-
-        world.resource::<RenderQueue>().write_texture(
-            texture.as_image_copy(),
-            image.data.as_ref().unwrap(),
-            TexelCopyBufferLayout {
-                offset: 0,
-                bytes_per_row: Some(image.width() * pixel_size as u32),
-                rows_per_image: None,
-            },
-            image.texture_descriptor.size,
-        );
-
-        let texture_view = texture.create_view(&TextureViewDescriptor {
-            label: Some("px_texture_view"),
-            format: Some(image.texture_descriptor.format),
-            dimension: Some(TextureViewDimension::D2),
-            ..default()
-        });
-
-        let px_pipeline = world.resource::<PxPipeline>();
-        let Some(pipeline) = world
-            .resource::<PipelineCache>()
-            .get_render_pipeline(px_pipeline.id)
-        else {
-            return Ok(());
-        };
-
-        let post_process = target.post_process_write();
-
-        let bind_group = render_context.render_device().create_bind_group(
-            "px_bind_group",
-            &px_pipeline.layout,
-            &BindGroupEntries::sequential((&texture_view, uniform_binding.clone())),
-        );
-
-        let mut render_pass = render_context.begin_tracked_render_pass(RenderPassDescriptor {
-            label: Some("px_pass"),
-            color_attachments: &[Some(RenderPassColorAttachment {
-                view: post_process.destination,
-                depth_slice: None,
-                resolve_target: None,
-                ops: default(),
-            })],
-            depth_stencil_attachment: None,
-            timestamp_writes: None,
-            occlusion_query_set: None,
-        });
-
-        render_pass.set_render_pipeline(pipeline);
-        render_pass.set_bind_group(0, &bind_group, &[]);
-        render_pass.draw(0..6, 0..1);
-
-        Ok(())
-    }
-}
+#[cfg(feature = "gpu_palette")]
+#[derive(RenderLabel, Hash, Eq, PartialEq, Clone, Debug)]
+struct PxGpuSpriteRender;
 
 fn update_screen_palette(
     mut waiting_for_load: Local<bool>,
diff --git a/src/screen/draw.rs b/src/screen/draw.rs
new file mode 100644
index 0000000..d7b9b3c
--- /dev/null
+++ b/src/screen/draw.rs
@@ -0,0 +1,708 @@
+use std::collections::BTreeMap;
+
+#[cfg(feature = "headed")]
+use bevy_ecs::{query::QueryState, world::World};
+#[cfg(feature = "headed")]
+use bevy_render::render_asset::RenderAssets;
+#[cfg(feature = "gpu_palette")]
+use bytemuck::cast_slice_mut;
+
+#[cfg(feature = "line")]
+use crate::line::draw_line;
+use crate::{
+    cursor::{CursorState, PxCursorPosition},
+    filter::{PxFilterAsset, draw_filter},
+    frame::{Frames, draw_spatial, resolve_frame_binding},
+    image::{PxImage, PxImageSliceMut},
+    map::{PxTile, PxTileset},
+    position::Spatial,
+    prelude::*,
+    sprite::{PxCompositeSprite, PxSpriteAsset},
+    text::PxTypeface,
+};
+
+#[cfg(feature = "headed")]
+use super::pipeline::{PxRenderBuffer, PxRenderBufferInner};
+use crate::map::TileComponents;
+
+pub(crate) type MapEntry<'a> = (
+    &'a PxMap,
+    PxPosition,
+    PxCanvas,
+    Option<&'a PxFrame>,
+    Option<&'a PxFilter>,
+);
+
+pub(crate) type SpriteEntry<'a> = (
+    &'a PxSprite,
+    PxPosition,
+    PxAnchor,
+    PxCanvas,
+    Option<&'a PxFrame>,
+    Option<&'a PxFilter>,
+);
+
+pub(crate) type CompositeSpriteEntry<'a> = (
+    &'a PxCompositeSprite,
+    PxPosition,
+    PxAnchor,
+    PxCanvas,
+    Option<&'a PxFrame>,
+    Option<&'a PxFilter>,
+);
+
+pub(crate) type TextEntry<'a> = (
+    &'a PxText,
+    PxPosition,
+    PxAnchor,
+    PxCanvas,
+    Option<&'a PxFrame>,
+    Option<&'a PxFilter>,
+);
+
+pub(crate) type RectEntry<'a> = (
+    PxRect,
+    &'a PxFilter,
+    PxPosition,
+    PxAnchor,
+    PxCanvas,
+    Option<&'a PxFrame>,
+    bool,
+);
+
+#[cfg(feature = "line")]
+pub(crate) type LineEntry<'a> = (
+    &'a PxLine,
+    &'a PxFilter,
+    PxCanvas,
+    Option<&'a PxFrame>,
+    bool,
+);
+
+pub(crate) type FilterEntry<'a> = (&'a PxFilter, Option<&'a PxFrame>);
+
+#[cfg(feature = "line")]
+pub(crate) type LayerContents<'a> = (
+    Vec<MapEntry<'a>>,
+    Vec<SpriteEntry<'a>>,
+    Vec<CompositeSpriteEntry<'a>>,
+    Vec<TextEntry<'a>>,
+    Vec<RectEntry<'a>>,
+    Vec<LineEntry<'a>>,
+    Vec<FilterEntry<'a>>,
+    Vec<RectEntry<'a>>,
+    Vec<LineEntry<'a>>,
+    Vec<FilterEntry<'a>>,
+);
+
+#[cfg(not(feature = "line"))]
+pub(crate) type LayerContents<'a> = (
+    Vec<MapEntry<'a>>,
+    Vec<SpriteEntry<'a>>,
+    Vec<CompositeSpriteEntry<'a>>,
+    Vec<TextEntry<'a>>,
+    Vec<RectEntry<'a>>,
+    (),
+    Vec<FilterEntry<'a>>,
+    Vec<RectEntry<'a>>,
+    (),
+    Vec<FilterEntry<'a>>,
+);
+
+pub(crate) type LayerContentsMap<'a, L> = BTreeMap<L, LayerContents<'a>>;
+
+#[cfg(feature = "headed")]
+pub(crate) fn draw_layers<'w, L: PxLayer>(
+    world: &'w World,
+    render_buffer: &PxRenderBuffer,
+    camera: PxCamera,
+    layer_contents: LayerContentsMap<'w, L>,
+    tiles: &QueryState<TileComponents>,
+    #[cfg(feature = "gpu_palette")] layer_order: &[L],
+) {
+    let tilesets = world.resource::<RenderAssets<PxTileset>>();
+    let sprite_assets = world.resource::<RenderAssets<PxSpriteAsset>>();
+    let typefaces = world.resource::<RenderAssets<PxTypeface>>();
+    let filters = world.resource::<RenderAssets<PxFilterAsset>>();
+
+    {
+        let mut inner = render_buffer.write_inner();
+        let PxRenderBufferInner {
+            image,
+            #[cfg(feature = "gpu_palette")]
+            depth_image,
+            ..
+        } = &mut *inner;
+        let image = image.as_mut().unwrap();
+        #[cfg(feature = "gpu_palette")]
+        let mut depth_data = depth_image
+            .as_mut()
+            .and_then(|depth| depth.data.as_mut())
+            .map(|data| cast_slice_mut::<u8, u16>(data.as_mut_slice()));
+        #[cfg(feature = "gpu_palette")]
+        let (image_width, image_height, image_height_i32) = {
+            let height = image.height() as usize;
+            (image.width() as usize, height, height as i32)
+        };
+        let mut layer_image = PxImage::empty_from_image(image);
+        let mut image_slice = PxImageSliceMut::from_image_mut(image).unwrap();
+
+        #[allow(unused_variables)]
+        for (
+            layer,
+            (
+                maps,
+                sprites,
+                composites,
+                texts,
+                clip_rects,
+                clip_lines,
+                clip_filters,
+                over_rects,
+                over_lines,
+                over_filters,
+            ),
+        ) in layer_contents.into_iter()
+        {
+            #[cfg(feature = "gpu_palette")]
+            let base_depth = layer_index_for(layer_order, &layer);
+            #[cfg(feature = "gpu_palette")]
+            let over_depth = base_depth.map(|depth| depth.saturating_add(1));
+            layer_image.clear();
+            let mut layer_slice = layer_image.slice_all_mut();
+
+            for (map, position, canvas, frame, map_filter) in maps {
+                let Some(tileset) = tilesets.get(&map.tileset) else {
+                    continue;
+                };
+
+                let map_filter = map_filter.and_then(|map_filter| filters.get(&**map_filter));
+                let size = map.tiles.size();
+
+                for x in 0..size.x {
+                    for y in 0..size.y {
+                        let pos = UVec2::new(x, y);
+
+                        let Some(tile) = map.tiles.get(pos) else {
+                            continue;
+                        };
+
+                        let Ok((&PxTile { texture }, tile_filter)) = tiles.get_manual(world, tile)
+                        else {
+                            continue;
+                        };
+
+                        let Some(tile) = tileset.tileset.get(texture as usize) else {
+                            error!(
+                                "tile texture index out of bounds: the len is {}, but the index is {texture}",
+                                tileset.tileset.len()
+                            );
+                            continue;
+                        };
+
+                        draw_spatial(
+                            tile,
+                            (),
+                            &mut layer_slice,
+                            (*position + pos.as_ivec2() * tileset.tile_size().as_ivec2()).into(),
+                            PxAnchor::BottomLeft,
+                            canvas,
+                            frame.copied(),
+                            [
+                                tile_filter.and_then(|tile_filter| filters.get(&**tile_filter)),
+                                map_filter,
+                            ]
+                            .into_iter()
+                            .flatten(),
+                            camera,
+                        );
+                    }
+                }
+            }
+
+            for (sprite, position, anchor, canvas, frame, filter) in sprites {
+                let Some(sprite) = sprite_assets.get(&**sprite) else {
+                    continue;
+                };
+
+                draw_spatial(
+                    sprite,
+                    (),
+                    &mut layer_slice,
+                    position,
+                    anchor,
+                    canvas,
+                    frame.copied(),
+                    filter.and_then(|filter| filters.get(&**filter)),
+                    camera,
+                );
+            }
+
+            for (composite, position, anchor, canvas, frame, filter) in composites {
+                let metrics = if composite.size.x == 0 || composite.size.y == 0 {
+                    composite.metrics_with(|handle| {
+                        let sprite = sprite_assets.get(handle)?;
+                        Some(crate::sprite::PxCompositePartMetrics {
+                            size: sprite.frame_size(),
+                            frame_count: sprite.frame_count(),
+                        })
+                    })
+                } else {
+                    Some(crate::sprite::PxCompositeMetrics {
+                        size: composite.size,
+                        origin: composite.origin,
+                        frame_count: composite.frame_count,
+                    })
+                };
+                let Some(metrics) = metrics else {
+                    continue;
+                };
+
+                let base_pos = *position - anchor.pos(metrics.size).as_ivec2();
+                let master = frame.copied();
+                let master_count = metrics.frame_count;
+
+                for part in &composite.parts {
+                    let Some(sprite) = sprite_assets.get(&part.sprite) else {
+                        continue;
+                    };
+
+                    let part_frame = resolve_frame_binding(
+                        master,
+                        master_count,
+                        sprite.frame_count(),
+                        &part.frame,
+                    );
+                    let part_pos = base_pos + (part.offset - metrics.origin);
+                    let part_filter = part.filter.as_ref().and_then(|handle| filters.get(handle));
+                    let entity_filter = filter.and_then(|filter| filters.get(&**filter));
+
+                    draw_spatial(
+                        sprite,
+                        (),
+                        &mut layer_slice,
+                        part_pos.into(),
+                        PxAnchor::BottomLeft,
+                        canvas,
+                        part_frame,
+                        [part_filter, entity_filter].into_iter().flatten(),
+                        camera,
+                    );
+                }
+            }
+
+            for (text, pos, alignment, canvas, frame, filter) in texts {
+                let Some(typeface) = typefaces.get(&text.typeface) else {
+                    continue;
+                };
+
+                let line_break_count = text.line_breaks.len() as u32;
+                let mut size = uvec2(
+                    0,
+                    (line_break_count + 1) * typeface.height + line_break_count,
+                );
+                let mut x = 0;
+                let mut y = 0;
+                let mut chars = Vec::new();
+                let mut line_break_index = 0;
+
+                for (index, char) in text.value.chars().enumerate() {
+                    if let Some(char) = typeface.characters.get(&char) {
+                        if x != 0 {
+                            x += 1;
+                        }
+
+                        chars.push((x, y, char));
+                        x += char.data.size().x;
+
+                        if x > size.x {
+                            size.x = x;
+                        }
+                    } else if let Some(separator) = typeface.separators.get(&char) {
+                        x += separator.width;
+                    } else {
+                        error!(r#"character "{char}" in text isn't in typeface"#);
+                    }
+
+                    if text.line_breaks.get(line_break_index).copied() == Some(index as u32) {
+                        line_break_index += 1;
+                        y += typeface.height + 1;
+                        x = 0;
+                    }
+                }
+
+                let top_left = *pos - alignment.pos(size).as_ivec2() + ivec2(0, size.y as i32 - 1);
+
+                for (x, y, char) in chars {
+                    draw_spatial(
+                        char,
+                        (),
+                        &mut layer_slice,
+                        PxPosition(top_left + ivec2(x as i32, -(y as i32))),
+                        PxAnchor::TopLeft,
+                        canvas,
+                        frame.copied(),
+                        filter.and_then(|filter| filters.get(&**filter)),
+                        camera,
+                    );
+                }
+            }
+
+            for (rect, filter, pos, anchor, canvas, frame, invert) in clip_rects {
+                if let Some(filter) = filters.get(&**filter) {
+                    draw_spatial(
+                        &(rect, filter),
+                        invert,
+                        &mut layer_slice,
+                        pos,
+                        anchor,
+                        canvas,
+                        frame.copied(),
+                        std::iter::empty(),
+                        camera,
+                    );
+                }
+            }
+
+            #[cfg(feature = "line")]
+            for (line, filter, canvas, frame, invert) in clip_lines {
+                if let Some(filter) = filters.get(&**filter) {
+                    draw_line(
+                        line,
+                        filter,
+                        invert,
+                        &mut layer_slice,
+                        canvas,
+                        frame.copied(),
+                        camera,
+                    );
+                }
+            }
+
+            for (filter, frame) in clip_filters {
+                if let Some(filter) = filters.get(&**filter) {
+                    draw_filter(filter, frame.copied(), &mut layer_slice);
+                }
+            }
+
+            image_slice.draw(&layer_image);
+            #[cfg(feature = "gpu_palette")]
+            if let (Some(depth), Some(base_depth)) = (depth_data.as_mut(), base_depth) {
+                update_depth_from_layer(depth, layer_image.data(), base_depth);
+            }
+
+            for (rect, filter, pos, anchor, canvas, frame, invert) in over_rects {
+                if let Some(filter) = filters.get(&**filter) {
+                    draw_spatial(
+                        &(rect, filter),
+                        invert,
+                        &mut image_slice,
+                        pos,
+                        anchor,
+                        canvas,
+                        frame.copied(),
+                        std::iter::empty(),
+                        camera,
+                    );
+                }
+                #[cfg(feature = "gpu_palette")]
+                if let (Some(depth), Some(over_depth)) = (depth_data.as_mut(), over_depth) {
+                    let bounds =
+                        spatial_bounds(rect.0, pos, anchor, canvas, camera, image_height_i32);
+                    update_depth_rect(depth, image_width, image_height, bounds, invert, over_depth);
+                }
+            }
+
+            #[cfg(feature = "line")]
+            for (line, filter, canvas, frame, invert) in over_lines {
+                if let Some(filter) = filters.get(&**filter) {
+                    draw_line(
+                        line,
+                        filter,
+                        invert,
+                        &mut image_slice,
+                        canvas,
+                        frame.copied(),
+                        camera,
+                    );
+                }
+                #[cfg(all(feature = "gpu_palette", feature = "line"))]
+                if let (Some(depth), Some(over_depth)) = (depth_data.as_mut(), over_depth) {
+                    update_depth_line(
+                        depth,
+                        image_width,
+                        image_height,
+                        line,
+                        canvas,
+                        camera,
+                        invert,
+                        over_depth,
+                    );
+                }
+            }
+
+            for (filter, frame) in over_filters {
+                if let Some(filter) = filters.get(&**filter) {
+                    draw_filter(filter, frame.copied(), &mut image_slice);
+                }
+                #[cfg(feature = "gpu_palette")]
+                if let (Some(depth), Some(over_depth)) = (depth_data.as_mut(), over_depth) {
+                    depth.fill(over_depth);
+                }
+            }
+        }
+    }
+
+    let cursor = world.resource::<CursorState>();
+
+    if let PxCursor::Filter {
+        idle,
+        left_click,
+        right_click,
+    } = world.resource()
+        && let Some(cursor_pos) = **world.resource::<PxCursorPosition>()
+        && let Some(PxFilterAsset(filter)) = filters.get(match cursor {
+            CursorState::Idle => idle,
+            CursorState::Left => left_click,
+            CursorState::Right => right_click,
+        })
+    {
+        let mut inner = render_buffer.write_inner();
+        let PxRenderBufferInner {
+            image,
+            #[cfg(feature = "gpu_palette")]
+            depth_image,
+            ..
+        } = &mut *inner;
+        let image = image.as_mut().unwrap();
+        let mut cursor_image = PxImageSliceMut::from_image_mut(image).unwrap();
+        let cursor_pos = IVec2::new(
+            cursor_pos.x as i32,
+            cursor_image.height() as i32 - 1 - cursor_pos.y as i32,
+        );
+        if let Some(pixel) = cursor_image.get_pixel_mut(cursor_pos) {
+            if let Some(new_pixel) = filter.get_pixel(IVec2::new(*pixel as i32, 0)) {
+                *pixel = new_pixel;
+            } else {
+                error!("`PxCursor` filter is the wrong size");
+            }
+        }
+        #[cfg(feature = "gpu_palette")]
+        if let Some(depth) = depth_image.as_mut().and_then(|depth| depth.data.as_mut()) {
+            let width = cursor_image.image_width() as usize;
+            if cursor_pos.x >= 0 && cursor_pos.y >= 0 {
+                let x = cursor_pos.x as usize;
+                let y = cursor_pos.y as usize;
+                if x < width && y < cursor_image.image_height() as usize {
+                    let depth = cast_slice_mut::<u8, u16>(depth);
+                    depth[y * width + x] = u16::MAX;
+                }
+            }
+        }
+    }
+}
+
+#[cfg(feature = "gpu_palette")]
+fn layer_index_for<L: PxLayer>(layers: &[L], layer: &L) -> Option<u16> {
+    let index = layers.binary_search(layer).ok()?;
+    let base = (index + 1).checked_mul(2)?;
+    u16::try_from(base).ok()
+}
+
+#[cfg(feature = "gpu_palette")]
+fn update_depth_from_layer(depth: &mut [u16], layer_data: &[u8], depth_value: u16) {
+    for (index, value) in layer_data.iter().enumerate() {
+        if *value != 0 {
+            depth[index] = depth_value;
+        }
+    }
+}
+
+#[cfg(feature = "gpu_palette")]
+fn spatial_bounds(
+    size: UVec2,
+    position: PxPosition,
+    anchor: PxAnchor,
+    canvas: PxCanvas,
+    camera: PxCamera,
+    image_height: i32,
+) -> IRect {
+    let position = *position - anchor.pos(size).as_ivec2();
+    let position = match canvas {
+        PxCanvas::World => position - *camera,
+        PxCanvas::Camera => position,
+    };
+    let position = IVec2::new(position.x, image_height - position.y);
+    let size = size.as_ivec2();
+
+    IRect {
+        min: position - IVec2::new(0, size.y),
+        max: position + IVec2::new(size.x, 0),
+    }
+}
+
+#[cfg(feature = "gpu_palette")]
+fn update_depth_rect(
+    depth: &mut [u16],
+    width: usize,
+    height: usize,
+    rect: IRect,
+    invert: bool,
+    depth_value: u16,
+) {
+    let x_min = rect.min.x.clamp(0, width as i32) as usize;
+    let x_max = rect.max.x.clamp(0, width as i32) as usize;
+    let y_min = rect.min.y.clamp(0, height as i32) as usize;
+    let y_max = rect.max.y.clamp(0, height as i32) as usize;
+
+    if invert {
+        for y in 0..height {
+            for x in 0..width {
+                let inside = x >= x_min && x < x_max && y >= y_min && y < y_max;
+                if !inside {
+                    depth[y * width + x] = depth_value;
+                }
+            }
+        }
+    } else {
+        for y in y_min..y_max {
+            for x in x_min..x_max {
+                depth[y * width + x] = depth_value;
+            }
+        }
+    }
+}
+
+#[cfg(all(feature = "gpu_palette", feature = "line"))]
+fn update_depth_line(
+    depth: &mut [u16],
+    width: usize,
+    height: usize,
+    line: &PxLine,
+    canvas: PxCanvas,
+    camera: PxCamera,
+    invert: bool,
+    depth_value: u16,
+) {
+    use bevy_platform::collections::HashSet;
+    use line_drawing::Bresenham;
+
+    let offset = match canvas {
+        PxCanvas::World => -*camera,
+        PxCanvas::Camera => IVec2::ZERO,
+    };
+
+    let mut poses = HashSet::new();
+    for (segment_index, (start, end)) in line.iter().zip(line.iter().skip(1)).enumerate() {
+        let start = *start + offset;
+        let end = *end + offset;
+
+        for (step, pos) in Bresenham::new(start.into(), end.into()).enumerate() {
+            if segment_index > 0 && step == 0 {
+                continue;
+            }
+            poses.insert(IVec2::from(pos));
+        }
+    }
+
+    if invert {
+        for y in 0..height as i32 {
+            for x in 0..width as i32 {
+                if !poses.contains(&IVec2::new(x, y)) {
+                    depth[y as usize * width + x as usize] = depth_value;
+                }
+            }
+        }
+    } else {
+        for pos in poses {
+            if pos.x >= 0 && pos.y >= 0 && (pos.x as usize) < width && (pos.y as usize) < height {
+                depth[pos.y as usize * width + pos.x as usize] = depth_value;
+            }
+        }
+    }
+}
+
+#[cfg(all(test, feature = "gpu_palette"))]
+mod tests {
+    use super::*;
+    use insta::assert_snapshot;
+
+    fn depth_to_string(depth: &[u16], width: usize, height: usize) -> String {
+        let mut out = String::new();
+        for y in 0..height {
+            for x in 0..width {
+                if x > 0 {
+                    out.push(' ');
+                }
+                out.push_str(&depth[y * width + x].to_string());
+            }
+            if y + 1 < height {
+                out.push('\n');
+            }
+        }
+        out
+    }
+
+    #[test]
+    fn depth_updates_snapshot() {
+        let width = 4;
+        let height = 4;
+        let mut depth = vec![0u16; width * height];
+        let layer_image = vec![0, 0, 0, 0, 0, 1, 1, 0, 0, 1, 1, 0, 0, 0, 0, 0];
+
+        update_depth_from_layer(&mut depth, &layer_image, 2);
+        let mut out = String::new();
+        out.push_str("after_layer_image:\n");
+        out.push_str(&depth_to_string(&depth, width, height));
+        out.push('\n');
+
+        update_depth_rect(
+            &mut depth,
+            width,
+            height,
+            IRect {
+                min: IVec2::new(0, 0),
+                max: IVec2::new(4, 1),
+            },
+            false,
+            3,
+        );
+        out.push_str("after_over_rect:\n");
+        out.push_str(&depth_to_string(&depth, width, height));
+        out.push('\n');
+
+        update_depth_rect(
+            &mut depth,
+            width,
+            height,
+            IRect {
+                min: IVec2::new(2, 2),
+                max: IVec2::new(4, 4),
+            },
+            true,
+            4,
+        );
+        out.push_str("after_invert_rect:\n");
+        out.push_str(&depth_to_string(&depth, width, height));
+
+        assert_snapshot!(
+            "depth_updates",
+            out,
+            @r###"after_layer_image:
+0 0 0 0
+0 2 2 0
+0 2 2 0
+0 0 0 0
+after_over_rect:
+3 3 3 3
+0 2 2 0
+0 2 2 0
+0 0 0 0
+after_invert_rect:
+4 4 4 4
+4 4 4 4
+4 4 2 0
+4 4 0 0"###
+        );
+    }
+}
diff --git a/src/screen/gpu_sprite.rs b/src/screen/gpu_sprite.rs
new file mode 100644
index 0000000..88e8fff
--- /dev/null
+++ b/src/screen/gpu_sprite.rs
@@ -0,0 +1,605 @@
+use std::{
+    collections::{BTreeMap, HashMap, hash_map::Entry},
+    mem::size_of,
+    ops::Range,
+    sync::RwLock,
+};
+
+use bevy_ecs::query::QueryState;
+use bevy_mesh::VertexBufferLayout;
+use bevy_render::{
+    render_asset::RenderAssets,
+    render_graph::{NodeRunError, RenderGraphContext, ViewNode},
+    render_resource::{
+        BindGroup, BindGroupEntries, BindGroupLayout, BindGroupLayoutEntries, BlendState, Buffer,
+        BufferDescriptor, BufferUsages, CachedRenderPipelineId, ColorTargetState, ColorWrites,
+        FragmentState, PipelineCache, RenderPassColorAttachment, RenderPassDescriptor,
+        RenderPipelineDescriptor, ShaderStages, TextureFormat, TextureSampleType,
+        TextureViewDescriptor, VertexAttribute, VertexFormat, VertexState, VertexStepMode,
+        binding_types::{texture_2d, uniform_buffer},
+    },
+    renderer::{RenderContext, RenderDevice, RenderQueue},
+    view::ViewTarget,
+};
+use bytemuck::{Pod, Zeroable};
+
+use crate::{
+    frame::{PxFrameView, resolve_frame_binding},
+    prelude::*,
+    sprite::{
+        CompositeSpriteComponents, PxGpuComposite, PxGpuSprite, PxSpriteAsset, PxSpriteGpu,
+        SpriteComponents,
+    },
+};
+
+use super::{
+    GPU_SPRITE_SHADER_HANDLE, PxLayerOrder, Screen, gpu_composite_supported, gpu_sprite_supported,
+    pipeline::{PxRenderBuffer, PxUniform, PxUniformBuffer},
+};
+
+#[repr(C)]
+#[derive(Clone, Copy, Pod, Zeroable)]
+struct SpriteVertex {
+    position: [f32; 2],
+    uv: [f32; 2],
+    layer: u32,
+}
+
+impl SpriteVertex {
+    fn layout() -> VertexBufferLayout {
+        const ATTRIBUTES: [VertexAttribute; 3] = [
+            VertexAttribute {
+                format: VertexFormat::Float32x2,
+                offset: 0,
+                shader_location: 0,
+            },
+            VertexAttribute {
+                format: VertexFormat::Float32x2,
+                offset: 8,
+                shader_location: 1,
+            },
+            VertexAttribute {
+                format: VertexFormat::Uint32,
+                offset: 16,
+                shader_location: 2,
+            },
+        ];
+
+        VertexBufferLayout {
+            array_stride: size_of::<SpriteVertex>() as u64,
+            step_mode: VertexStepMode::Vertex,
+            attributes: Vec::from(ATTRIBUTES),
+        }
+    }
+}
+
+pub(crate) struct PxGpuSpriteNode<L: PxLayer> {
+    sprites: QueryState<SpriteComponents<L>, With<PxGpuSprite>>,
+    composites: QueryState<CompositeSpriteComponents<L>, With<PxGpuComposite>>,
+}
+
+impl<L: PxLayer> FromWorld for PxGpuSpriteNode<L> {
+    fn from_world(world: &mut World) -> Self {
+        Self {
+            sprites: world.query_filtered(),
+            composites: world.query_filtered(),
+        }
+    }
+}
+
+#[derive(Resource)]
+pub(crate) struct PxGpuSpritePipeline {
+    pub(crate) layout: BindGroupLayout,
+    pub(crate) id: CachedRenderPipelineId,
+}
+
+impl FromWorld for PxGpuSpritePipeline {
+    fn from_world(world: &mut World) -> Self {
+        let render_device = world.resource::<bevy_render::renderer::RenderDevice>();
+
+        let layout = render_device.create_bind_group_layout(
+            "px_gpu_sprite_bind_group_layout",
+            &BindGroupLayoutEntries::sequential(
+                ShaderStages::FRAGMENT,
+                (
+                    texture_2d(TextureSampleType::Uint),
+                    texture_2d(TextureSampleType::Uint),
+                    uniform_buffer::<PxUniform>(false).visibility(ShaderStages::VERTEX_FRAGMENT),
+                ),
+            ),
+        );
+
+        let id =
+            world
+                .resource_mut::<PipelineCache>()
+                .queue_render_pipeline(RenderPipelineDescriptor {
+                    label: Some("px_gpu_sprite_pipeline".into()),
+                    layout: vec![layout.clone()],
+                    vertex: VertexState {
+                        shader: GPU_SPRITE_SHADER_HANDLE,
+                        shader_defs: Vec::new(),
+                        entry_point: Some("vertex".into()),
+                        buffers: vec![SpriteVertex::layout()],
+                    },
+                    fragment: Some(FragmentState {
+                        shader: GPU_SPRITE_SHADER_HANDLE,
+                        shader_defs: Vec::new(),
+                        entry_point: Some("fragment".into()),
+                        targets: vec![Some(ColorTargetState {
+                            format: TextureFormat::bevy_default(),
+                            blend: Some(BlendState::ALPHA_BLENDING),
+                            write_mask: ColorWrites::ALL,
+                        })],
+                    }),
+                    primitive: default(),
+                    depth_stencil: None,
+                    multisample: default(),
+                    push_constant_ranges: Vec::new(),
+                    zero_initialize_workgroup_memory: true,
+                });
+
+        Self { layout, id }
+    }
+}
+
+#[derive(Resource)]
+pub(crate) struct PxGpuSpriteBuffer {
+    inner: RwLock<PxGpuSpriteBufferInner>,
+}
+
+struct PxGpuSpriteBufferInner {
+    buffer: Option<Buffer>,
+    capacity: usize,
+}
+
+impl Default for PxGpuSpriteBuffer {
+    fn default() -> Self {
+        Self {
+            inner: RwLock::new(PxGpuSpriteBufferInner {
+                buffer: None,
+                capacity: 0,
+            }),
+        }
+    }
+}
+
+impl PxGpuSpriteBuffer {
+    fn write(
+        &self,
+        device: &RenderDevice,
+        queue: &RenderQueue,
+        data: &[SpriteVertex],
+    ) -> Option<Buffer> {
+        if data.is_empty() {
+            return None;
+        }
+
+        let bytes = bytemuck::cast_slice(data);
+        let mut inner = self.inner.write().unwrap();
+        let required = bytes.len();
+
+        if inner.buffer.is_none() || required > inner.capacity {
+            let capacity = required.next_power_of_two().max(256);
+            inner.buffer = Some(device.create_buffer(&BufferDescriptor {
+                label: Some("px_gpu_sprite_vertices"),
+                size: capacity as u64,
+                usage: BufferUsages::VERTEX | BufferUsages::COPY_DST,
+                mapped_at_creation: false,
+            }));
+            inner.capacity = capacity;
+        }
+
+        let buffer = inner.buffer.as_ref().unwrap();
+        queue.write_buffer(buffer, 0, bytes);
+        Some(buffer.clone())
+    }
+}
+
+struct SpriteItem {
+    sprite: Handle<PxSpriteAsset>,
+    position: PxPosition,
+    anchor: PxAnchor,
+    canvas: PxCanvas,
+    frame: Option<PxFrameView>,
+}
+
+struct SpriteDraw<'a> {
+    range: Range<u32>,
+    sprite: &'a PxSpriteGpu,
+    handle: Handle<PxSpriteAsset>,
+}
+
+impl<L: PxLayer> ViewNode for PxGpuSpriteNode<L> {
+    type ViewQuery = &'static ViewTarget;
+
+    fn update(&mut self, world: &mut World) {
+        self.sprites.update_archetypes(world);
+        self.composites.update_archetypes(world);
+    }
+
+    fn run<'w>(
+        &self,
+        _: &mut RenderGraphContext,
+        render_context: &mut RenderContext<'w>,
+        target: &ViewTarget,
+        world: &'w World,
+    ) -> Result<(), NodeRunError> {
+        let uniform_binding = match world.resource::<PxUniformBuffer>().binding() {
+            Some(binding) => binding,
+            None => return Ok(()),
+        };
+
+        let screen = world.resource::<Screen>();
+        if screen.computed_size.x == 0 || screen.computed_size.y == 0 {
+            return Ok(());
+        }
+
+        let layer_order = world.resource::<PxLayerOrder<L>>();
+        let layer_order = layer_order.read();
+
+        let fit_factor = fit_factor(screen);
+        let screen_size = Vec2::new(screen.computed_size.x as f32, screen.computed_size.y as f32);
+        let screen_height = screen.computed_size.y as i32;
+        let camera = *world.resource::<PxCamera>();
+
+        let depth_view = {
+            let render_buffer = world.resource::<PxRenderBuffer>();
+            let inner = render_buffer.read_inner();
+            let Some(depth_texture) = inner.depth_texture.as_ref() else {
+                return Ok(());
+            };
+            depth_texture.create_view(&TextureViewDescriptor::default())
+        };
+
+        let sprite_assets = world.resource::<RenderAssets<PxSpriteGpu>>();
+        let mut sprites_by_layer: BTreeMap<L, Vec<SpriteItem>> = BTreeMap::new();
+
+        for (sprite, &position, &anchor, layer, &canvas, frame, filter) in
+            self.sprites.iter_manual(world)
+        {
+            if !gpu_sprite_supported(frame.copied(), filter) {
+                continue;
+            }
+
+            sprites_by_layer
+                .entry(layer.clone())
+                .or_default()
+                .push(SpriteItem {
+                    sprite: sprite.clone().0,
+                    position,
+                    anchor,
+                    canvas,
+                    frame: frame.copied(),
+                });
+        }
+
+        for (composite, &position, &anchor, layer, &canvas, frame, filter) in
+            self.composites.iter_manual(world)
+        {
+            if !gpu_composite_supported(composite, frame.copied(), filter) {
+                continue;
+            }
+
+            let metrics = if composite.size.x == 0 || composite.size.y == 0 {
+                composite.metrics_with(|handle| {
+                    let sprite = sprite_assets.get(handle)?;
+                    let part_count = frame_count(sprite);
+                    let part_size = match frame_height(sprite) {
+                        Some(height) => UVec2::new(sprite.size.x, height),
+                        None => return None,
+                    };
+                    Some(crate::sprite::PxCompositePartMetrics {
+                        size: part_size,
+                        frame_count: part_count,
+                    })
+                })
+            } else {
+                Some(crate::sprite::PxCompositeMetrics {
+                    size: composite.size,
+                    origin: composite.origin,
+                    frame_count: composite.frame_count,
+                })
+            };
+            let Some(metrics) = metrics else {
+                continue;
+            };
+
+            let base_pos = *position - anchor.pos(metrics.size).as_ivec2();
+            let master = frame.copied();
+            let master_count = metrics.frame_count;
+
+            for part in &composite.parts {
+                let Some(sprite_gpu) = sprite_assets.get(&part.sprite) else {
+                    continue;
+                };
+
+                let part_count = frame_count(sprite_gpu);
+                let part_frame =
+                    resolve_frame_binding(master, master_count, part_count, &part.frame);
+                let part_pos = base_pos + (part.offset - metrics.origin);
+
+                sprites_by_layer
+                    .entry(layer.clone())
+                    .or_default()
+                    .push(SpriteItem {
+                        sprite: part.sprite.clone(),
+                        position: PxPosition(part_pos),
+                        anchor: PxAnchor::BottomLeft,
+                        canvas,
+                        frame: part_frame,
+                    });
+            }
+        }
+
+        if sprites_by_layer.is_empty() {
+            return Ok(());
+        }
+
+        let mut vertices: Vec<SpriteVertex> = Vec::new();
+        let mut draws: Vec<SpriteDraw<'_>> = Vec::new();
+
+        for (layer, items) in sprites_by_layer.into_iter() {
+            let Some(layer_index) = layer_index_for(&layer_order, &layer) else {
+                continue;
+            };
+
+            for item in items {
+                let Some(sprite_gpu) = sprite_assets.get(&item.sprite) else {
+                    continue;
+                };
+
+                let frame_height = match frame_height(sprite_gpu) {
+                    Some(height) => height,
+                    None => continue,
+                };
+
+                let frame_count = frame_count(sprite_gpu);
+                if frame_count == 0 {
+                    continue;
+                }
+
+                let frame_index = frame_index(item.frame, frame_count) as u32;
+                let frame_top = frame_index.saturating_mul(frame_height);
+                let frame_bottom = frame_top.saturating_add(frame_height);
+                if frame_bottom > sprite_gpu.size.y {
+                    continue;
+                }
+
+                let size = UVec2::new(sprite_gpu.size.x, frame_height);
+                let mut position = *item.position - item.anchor.pos(size).as_ivec2();
+                if matches!(item.canvas, PxCanvas::World) {
+                    position -= *camera;
+                }
+
+                let image_pos = IVec2::new(position.x, screen_height - position.y);
+                let min = image_pos - IVec2::new(0, size.y as i32);
+                let max = image_pos + IVec2::new(size.x as i32, 0);
+
+                let top_left = Vec2::new(min.x as f32, min.y as f32);
+                let bottom_right = Vec2::new(max.x as f32, max.y as f32);
+                let bottom_left = Vec2::new(min.x as f32, max.y as f32);
+                let top_right = Vec2::new(max.x as f32, min.y as f32);
+
+                let ndc_top_left = pixel_to_ndc(top_left, screen_size, fit_factor);
+                let ndc_bottom_left = pixel_to_ndc(bottom_left, screen_size, fit_factor);
+                let ndc_bottom_right = pixel_to_ndc(bottom_right, screen_size, fit_factor);
+                let ndc_top_right = pixel_to_ndc(top_right, screen_size, fit_factor);
+
+                let v_min = frame_top as f32 / sprite_gpu.size.y as f32;
+                let v_max = frame_bottom as f32 / sprite_gpu.size.y as f32;
+
+                let start = vertices.len() as u32;
+                vertices.extend_from_slice(&[
+                    SpriteVertex {
+                        position: ndc_top_left,
+                        uv: [0.0, v_min],
+                        layer: layer_index,
+                    },
+                    SpriteVertex {
+                        position: ndc_bottom_left,
+                        uv: [0.0, v_max],
+                        layer: layer_index,
+                    },
+                    SpriteVertex {
+                        position: ndc_bottom_right,
+                        uv: [1.0, v_max],
+                        layer: layer_index,
+                    },
+                    SpriteVertex {
+                        position: ndc_top_left,
+                        uv: [0.0, v_min],
+                        layer: layer_index,
+                    },
+                    SpriteVertex {
+                        position: ndc_bottom_right,
+                        uv: [1.0, v_max],
+                        layer: layer_index,
+                    },
+                    SpriteVertex {
+                        position: ndc_top_right,
+                        uv: [1.0, v_min],
+                        layer: layer_index,
+                    },
+                ]);
+
+                draws.push(SpriteDraw {
+                    range: start..start + 6,
+                    sprite: sprite_gpu,
+                    handle: item.sprite.clone(),
+                });
+            }
+        }
+
+        if vertices.is_empty() {
+            return Ok(());
+        }
+
+        let render_device = render_context.render_device();
+        let render_queue = world.resource::<RenderQueue>();
+        let Some(vertex_buffer) =
+            world
+                .resource::<PxGpuSpriteBuffer>()
+                .write(render_device, render_queue, &vertices)
+        else {
+            return Ok(());
+        };
+
+        let px_pipeline = world.resource::<PxGpuSpritePipeline>();
+        let Some(pipeline) = world
+            .resource::<PipelineCache>()
+            .get_render_pipeline(px_pipeline.id)
+        else {
+            return Ok(());
+        };
+
+        let post_process = target.post_process_write();
+
+        let mut bind_groups: HashMap<Handle<PxSpriteAsset>, BindGroup> = HashMap::new();
+        for draw in &draws {
+            match bind_groups.entry(draw.handle.clone()) {
+                Entry::Occupied(_) => {}
+                Entry::Vacant(entry) => {
+                    let texture_view = draw
+                        .sprite
+                        .texture
+                        .create_view(&TextureViewDescriptor::default());
+                    let bind_group = render_device.create_bind_group(
+                        "px_gpu_sprite_bind_group",
+                        &px_pipeline.layout,
+                        &BindGroupEntries::sequential((
+                            &texture_view,
+                            &depth_view,
+                            uniform_binding.clone(),
+                        )),
+                    );
+                    entry.insert(bind_group);
+                }
+            }
+        }
+
+        let mut render_pass = render_context.begin_tracked_render_pass(RenderPassDescriptor {
+            label: Some("px_gpu_sprite_pass"),
+            color_attachments: &[Some(RenderPassColorAttachment {
+                view: post_process.destination,
+                depth_slice: None,
+                resolve_target: None,
+                ops: default(),
+            })],
+            depth_stencil_attachment: None,
+            timestamp_writes: None,
+            occlusion_query_set: None,
+        });
+
+        render_pass.set_render_pipeline(pipeline);
+        render_pass.set_vertex_buffer(0, vertex_buffer.slice(..));
+
+        for draw in &draws {
+            let Some(bind_group) = bind_groups.get(&draw.handle) else {
+                continue;
+            };
+            render_pass.set_bind_group(0, bind_group, &[]);
+            render_pass.draw(draw.range.clone(), 0..1);
+        }
+
+        Ok(())
+    }
+}
+
+fn frame_height(sprite: &PxSpriteGpu) -> Option<u32> {
+    let width = sprite.size.x as usize;
+    if width == 0 || sprite.frame_size == 0 || sprite.frame_size % width != 0 {
+        return None;
+    }
+
+    Some((sprite.frame_size / width) as u32)
+}
+
+fn frame_count(sprite: &PxSpriteGpu) -> usize {
+    let area = sprite.size.x as usize * sprite.size.y as usize;
+    if sprite.frame_size == 0 {
+        return 0;
+    }
+
+    area / sprite.frame_size
+}
+
+fn layer_index_for<L: PxLayer>(layers: &[L], layer: &L) -> Option<u32> {
+    let index = layers.binary_search(layer).ok()?;
+    u32::try_from((index + 1) * 2).ok()
+}
+
+fn frame_index(frame: Option<PxFrameView>, frame_count: usize) -> usize {
+    if frame_count == 0 {
+        return 0;
+    }
+
+    let frame = match frame {
+        Some(frame) => frame,
+        None => return 0,
+    };
+
+    let index = match frame.selector {
+        PxFrameSelector::Normalized(value) => value * (frame_count.saturating_sub(1)) as f32,
+        PxFrameSelector::Index(value) => value,
+    };
+
+    let index = index.floor() as i32;
+    index.rem_euclid(frame_count as i32) as usize
+}
+
+fn fit_factor(screen: &Screen) -> Vec2 {
+    let aspect_ratio_ratio =
+        screen.computed_size.x as f32 / screen.computed_size.y as f32 / screen.window_aspect_ratio;
+    if aspect_ratio_ratio > 1.0 {
+        Vec2::new(1.0, 1.0 / aspect_ratio_ratio)
+    } else {
+        Vec2::new(aspect_ratio_ratio, 1.0)
+    }
+}
+
+fn pixel_to_ndc(pos: Vec2, screen_size: Vec2, fit_factor: Vec2) -> [f32; 2] {
+    let ndc = Vec2::new(
+        (pos.x / screen_size.x) * 2.0 - 1.0,
+        1.0 - (pos.y / screen_size.y) * 2.0,
+    );
+    (ndc * fit_factor).to_array()
+}
+
+#[cfg(all(test, feature = "gpu_palette"))]
+mod tests {
+    use super::*;
+    use insta::assert_snapshot;
+
+    #[test]
+    fn frame_index_wraps() {
+        let frame_count = 4;
+        let cases = [
+            ("index 0.0", PxFrameSelector::Index(0.0)),
+            ("index 5.2", PxFrameSelector::Index(5.2)),
+            ("index -1.0", PxFrameSelector::Index(-1.0)),
+            ("normalized 1.8", PxFrameSelector::Normalized(1.8)),
+            ("normalized -0.2", PxFrameSelector::Normalized(-0.2)),
+        ];
+        let mut out = String::from("frame_count=4\n");
+        for (label, selector) in cases {
+            let frame = PxFrameView {
+                selector,
+                transition: PxFrameTransition::None,
+            };
+            let index = frame_index(Some(frame), frame_count);
+            out.push_str(&format!("{label} -> {index}\n"));
+        }
+
+        assert_snapshot!(
+            "frame_index_wraps",
+            out,
+            @r###"frame_count=4
+index 0.0 -> 0
+index 5.2 -> 1
+index -1.0 -> 3
+normalized 1.8 -> 1
+normalized -0.2 -> 3
+"###
+        );
+    }
+}
diff --git a/src/screen/node.rs b/src/screen/node.rs
new file mode 100644
index 0000000..832eba9
--- /dev/null
+++ b/src/screen/node.rs
@@ -0,0 +1,599 @@
+use std::collections::BTreeMap;
+#[cfg(feature = "gpu_palette")]
+use std::collections::BTreeSet;
+
+#[cfg(feature = "gpu_palette")]
+use bevy_ecs::query::Has;
+use bevy_ecs::query::QueryState;
+use bevy_image::TextureFormatPixelInfo;
+#[cfg(feature = "headed")]
+use bevy_render::{
+    render_graph::{NodeRunError, RenderGraphContext, ViewNode},
+    render_resource::{
+        BindGroupEntries, PipelineCache, RenderPassColorAttachment, RenderPassDescriptor,
+        TexelCopyBufferLayout, TextureViewDescriptor, TextureViewDimension,
+    },
+    renderer::{RenderContext, RenderDevice, RenderQueue},
+    view::ViewTarget,
+};
+
+#[cfg(feature = "line")]
+use crate::line::LineComponents;
+#[cfg(feature = "gpu_palette")]
+use crate::sprite::{PxGpuComposite, PxGpuSprite};
+use crate::{
+    filter::FilterComponents,
+    map::{MapComponents, TileComponents},
+    position::PxLayer,
+    prelude::*,
+    rect::RectComponents,
+    sprite::{CompositeSpriteComponents, SpriteComponents},
+    text::TextComponents,
+};
+
+#[cfg(feature = "gpu_palette")]
+use super::{PxLayerOrder, gpu_composite_supported, gpu_sprite_supported};
+use super::{
+    Screen,
+    draw::{self, LayerContentsMap},
+    pipeline::{PxPipeline, PxRenderBuffer, PxUniformBuffer},
+};
+
+pub(crate) struct PxRenderNode<L: PxLayer> {
+    maps: QueryState<MapComponents<L>>,
+    tiles: QueryState<TileComponents>,
+    // image_to_sprites: QueryState<ImageToSpriteComponents<L>>,
+    #[cfg(feature = "gpu_palette")]
+    sprites: QueryState<(SpriteComponents<L>, Has<PxGpuSprite>)>,
+    #[cfg(not(feature = "gpu_palette"))]
+    sprites: QueryState<SpriteComponents<L>>,
+    #[cfg(feature = "gpu_palette")]
+    composites: QueryState<(CompositeSpriteComponents<L>, Has<PxGpuComposite>)>,
+    #[cfg(not(feature = "gpu_palette"))]
+    composites: QueryState<CompositeSpriteComponents<L>>,
+    texts: QueryState<TextComponents<L>>,
+    rects: QueryState<RectComponents<L>>,
+    #[cfg(feature = "line")]
+    lines: QueryState<LineComponents<L>>,
+    filters: QueryState<FilterComponents<L>, Without<PxCanvas>>,
+}
+
+impl<L: PxLayer> FromWorld for PxRenderNode<L> {
+    fn from_world(world: &mut World) -> Self {
+        Self {
+            maps: world.query(),
+            tiles: world.query(),
+            // image_to_sprites: world.query(),
+            #[cfg(feature = "gpu_palette")]
+            sprites: world.query(),
+            #[cfg(not(feature = "gpu_palette"))]
+            sprites: world.query(),
+            #[cfg(feature = "gpu_palette")]
+            composites: world.query(),
+            #[cfg(not(feature = "gpu_palette"))]
+            composites: world.query(),
+            texts: world.query(),
+            rects: world.query(),
+            #[cfg(feature = "line")]
+            lines: world.query(),
+            filters: world.query_filtered(),
+        }
+    }
+}
+
+#[cfg(feature = "headed")]
+impl<L: PxLayer> ViewNode for PxRenderNode<L> {
+    type ViewQuery = &'static ViewTarget;
+
+    fn update(&mut self, world: &mut World) {
+        self.maps.update_archetypes(world);
+        self.tiles.update_archetypes(world);
+        // self.image_to_sprites.update_archetypes(world);
+        self.sprites.update_archetypes(world);
+        self.composites.update_archetypes(world);
+        self.texts.update_archetypes(world);
+        self.rects.update_archetypes(world);
+        #[cfg(feature = "line")]
+        self.lines.update_archetypes(world);
+        self.filters.update_archetypes(world);
+    }
+
+    fn run<'w>(
+        &self,
+        _: &mut RenderGraphContext,
+        render_context: &mut RenderContext<'w>,
+        target: &ViewTarget,
+        world: &'w World,
+    ) -> Result<(), NodeRunError> {
+        // Compose each layer into a CPU buffer, then blit to the GPU texture once per frame.
+        let &camera = world.resource::<PxCamera>();
+        let screen = world.resource::<Screen>();
+
+        let device = world.resource::<RenderDevice>();
+        let render_buffer = world.resource::<PxRenderBuffer>();
+        render_buffer.ensure_size(device, screen.computed_size);
+        render_buffer.clear();
+
+        let mut layer_contents: LayerContentsMap<'w, L> = BTreeMap::default();
+        #[cfg(feature = "gpu_palette")]
+        let mut layer_set: BTreeSet<L> = BTreeSet::new();
+
+        for (map, &pos, layer, &canvas, animation, filter) in self.maps.iter_manual(world) {
+            let map = (map, pos, canvas, animation, filter);
+            #[cfg(feature = "gpu_palette")]
+            {
+                layer_set.insert(layer.clone());
+            }
+
+            if let Some((maps, _, _, _, _, _, _, _, _, _)) = layer_contents.get_mut(layer) {
+                maps.push(map);
+            } else {
+                BTreeMap::insert(
+                    &mut layer_contents,
+                    layer.clone(),
+                    (
+                        vec![map],
+                        Vec::new(),
+                        Vec::new(),
+                        Vec::new(),
+                        default(),
+                        default(),
+                        Vec::new(),
+                        default(),
+                        default(),
+                        Vec::new(),
+                    ),
+                );
+            }
+        }
+
+        #[cfg(feature = "gpu_palette")]
+        for ((sprite, &position, &anchor, layer, &canvas, animation, filter), has_gpu) in
+            self.sprites.iter_manual(world)
+        {
+            layer_set.insert(layer.clone());
+            let gpu_eligible = has_gpu && gpu_sprite_supported(animation.copied(), filter);
+            if gpu_eligible {
+                continue;
+            }
+
+            let sprite = (sprite, position, anchor, canvas, animation, filter);
+
+            if let Some((_, sprites, _, _, _, _, _, _, _, _)) = layer_contents.get_mut(layer) {
+                sprites.push(sprite);
+            } else {
+                BTreeMap::insert(
+                    &mut layer_contents,
+                    layer.clone(),
+                    (
+                        Vec::new(),
+                        vec![sprite],
+                        Vec::new(),
+                        Vec::new(),
+                        default(),
+                        default(),
+                        Vec::new(),
+                        default(),
+                        default(),
+                        Vec::new(),
+                    ),
+                );
+            }
+        }
+
+        #[cfg(not(feature = "gpu_palette"))]
+        for (sprite, &position, &anchor, layer, &canvas, animation, filter) in
+            self.sprites.iter_manual(world)
+        {
+            let sprite = (sprite, position, anchor, canvas, animation, filter);
+
+            if let Some((_, sprites, _, _, _, _, _, _, _, _)) = layer_contents.get_mut(layer) {
+                sprites.push(sprite);
+            } else {
+                BTreeMap::insert(
+                    &mut layer_contents,
+                    layer.clone(),
+                    (
+                        Vec::new(),
+                        vec![sprite],
+                        Vec::new(),
+                        Vec::new(),
+                        Vec::new(),
+                        default(),
+                        Vec::new(),
+                        Vec::new(),
+                        default(),
+                        Vec::new(),
+                    ),
+                );
+            }
+        }
+
+        #[cfg(feature = "gpu_palette")]
+        for ((composite, &position, &anchor, layer, &canvas, animation, filter), has_gpu) in
+            self.composites.iter_manual(world)
+        {
+            layer_set.insert(layer.clone());
+            let gpu_eligible =
+                has_gpu && gpu_composite_supported(composite, animation.copied(), filter);
+            if gpu_eligible {
+                continue;
+            }
+
+            let composite = (composite, position, anchor, canvas, animation, filter);
+
+            if let Some((_, _, composites, _, _, _, _, _, _, _)) = layer_contents.get_mut(layer) {
+                composites.push(composite);
+            } else {
+                BTreeMap::insert(
+                    &mut layer_contents,
+                    layer.clone(),
+                    (
+                        Vec::new(),
+                        Vec::new(),
+                        vec![composite],
+                        Vec::new(),
+                        Vec::new(),
+                        default(),
+                        Vec::new(),
+                        Vec::new(),
+                        default(),
+                        Vec::new(),
+                    ),
+                );
+            }
+        }
+
+        #[cfg(not(feature = "gpu_palette"))]
+        for (composite, &position, &anchor, layer, &canvas, animation, filter) in
+            self.composites.iter_manual(world)
+        {
+            let composite = (composite, position, anchor, canvas, animation, filter);
+
+            if let Some((_, _, composites, _, _, _, _, _, _, _)) = layer_contents.get_mut(layer) {
+                composites.push(composite);
+            } else {
+                BTreeMap::insert(
+                    &mut layer_contents,
+                    layer.clone(),
+                    (
+                        Vec::new(),
+                        Vec::new(),
+                        vec![composite],
+                        Vec::new(),
+                        Vec::new(),
+                        default(),
+                        Vec::new(),
+                        Vec::new(),
+                        default(),
+                        Vec::new(),
+                    ),
+                );
+            }
+        }
+
+        for (text, &pos, &alignment, layer, &canvas, animation, filter) in
+            self.texts.iter_manual(world)
+        {
+            let text = (text, pos, alignment, canvas, animation, filter);
+            #[cfg(feature = "gpu_palette")]
+            {
+                layer_set.insert(layer.clone());
+            }
+
+            if let Some((_, _, _, texts, _, _, _, _, _, _)) = layer_contents.get_mut(layer) {
+                texts.push(text);
+            } else {
+                BTreeMap::insert(
+                    &mut layer_contents,
+                    layer.clone(),
+                    (
+                        Vec::new(),
+                        Vec::new(),
+                        Vec::new(),
+                        vec![text],
+                        Vec::new(),
+                        default(),
+                        Vec::new(),
+                        Vec::new(),
+                        default(),
+                        Vec::new(),
+                    ),
+                );
+            }
+        }
+
+        for (&rect, filter, layers, &pos, &anchor, &canvas, animation, invert) in
+            self.rects.iter_manual(world)
+        {
+            for (layer, clip) in match layers {
+                PxFilterLayers::Single { layer, clip } => vec![(layer.clone(), *clip)],
+                // TODO Need to do this after all layers have been extracted
+                PxFilterLayers::Range(range) => layer_contents
+                    .keys()
+                    .filter(|layer| range.contains(layer))
+                    .map(|layer| (layer.clone(), true))
+                    .collect(),
+                PxFilterLayers::Many(layers) => {
+                    layers.iter().map(|layer| (layer.clone(), true)).collect()
+                }
+            }
+            .into_iter()
+            {
+                let rect = (rect, filter, pos, anchor, canvas, animation, invert);
+                #[cfg(feature = "gpu_palette")]
+                {
+                    layer_set.insert(layer.clone());
+                }
+
+                if let Some((_, _, _, _, clip_rects, _, _, over_rects, _, _)) =
+                    layer_contents.get_mut(&layer)
+                {
+                    if clip { clip_rects } else { over_rects }.push(rect);
+                } else {
+                    let rects = vec![rect];
+
+                    BTreeMap::insert(
+                        &mut layer_contents,
+                        layer,
+                        if clip {
+                            (
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                rects,
+                                default(),
+                                Vec::new(),
+                                Vec::new(),
+                                default(),
+                                Vec::new(),
+                            )
+                        } else {
+                            (
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                default(),
+                                Vec::new(),
+                                rects,
+                                default(),
+                                Vec::new(),
+                            )
+                        },
+                    );
+                }
+            }
+        }
+
+        #[cfg(feature = "line")]
+        for (line, filter, layers, &canvas, animation, invert) in self.lines.iter_manual(world) {
+            let line = (line, filter, canvas, animation, invert);
+
+            for (layer, clip) in match layers {
+                PxFilterLayers::Single { layer, clip } => vec![(layer.clone(), *clip)],
+                PxFilterLayers::Range(range) => layer_contents
+                    .keys()
+                    .filter(|layer| range.contains(layer))
+                    .map(|layer| (layer.clone(), true))
+                    .collect(),
+                PxFilterLayers::Many(layers) => {
+                    layers.iter().map(|layer| (layer.clone(), true)).collect()
+                }
+            }
+            .into_iter()
+            {
+                #[cfg(feature = "gpu_palette")]
+                {
+                    layer_set.insert(layer.clone());
+                }
+                if let Some((_, _, _, _, _, clip_lines, _, _, over_lines, _)) =
+                    layer_contents.get_mut(&layer)
+                {
+                    if clip { clip_lines } else { over_lines }.push(line);
+                } else {
+                    let lines = vec![line];
+
+                    BTreeMap::insert(
+                        &mut layer_contents,
+                        layer,
+                        if clip {
+                            (
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                lines,
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                            )
+                        } else {
+                            (
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                lines,
+                                Vec::new(),
+                            )
+                        },
+                    );
+                }
+            }
+        }
+
+        for (filter, layers, animation) in self.filters.iter_manual(world) {
+            let filter = (filter, animation);
+
+            for (layer, clip) in match layers {
+                PxFilterLayers::Single { layer, clip } => vec![(layer.clone(), *clip)],
+                PxFilterLayers::Range(range) => layer_contents
+                    .keys()
+                    .filter(|layer| range.contains(layer))
+                    .map(|layer| (layer.clone(), true))
+                    .collect(),
+                PxFilterLayers::Many(layers) => {
+                    layers.iter().map(|layer| (layer.clone(), true)).collect()
+                }
+            }
+            .into_iter()
+            {
+                #[cfg(feature = "gpu_palette")]
+                {
+                    layer_set.insert(layer.clone());
+                }
+                if let Some((_, _, _, _, _, _, clip_filters, _, _, over_filters)) =
+                    layer_contents.get_mut(&layer)
+                {
+                    if clip { clip_filters } else { over_filters }.push(filter);
+                } else {
+                    let filters = vec![filter];
+
+                    BTreeMap::insert(
+                        &mut layer_contents,
+                        layer,
+                        if clip {
+                            (
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                default(),
+                                default(),
+                                filters,
+                                Vec::new(),
+                                default(),
+                                Vec::new(),
+                            )
+                        } else {
+                            (
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                Vec::new(),
+                                default(),
+                                default(),
+                                Vec::new(),
+                                Vec::new(),
+                                default(),
+                                filters,
+                            )
+                        },
+                    );
+                }
+            }
+        }
+
+        #[cfg(feature = "gpu_palette")]
+        let layer_order: Vec<L> = layer_set.into_iter().collect();
+        #[cfg(feature = "gpu_palette")]
+        world.resource::<PxLayerOrder<L>>().set(layer_order.clone());
+
+        #[cfg(feature = "gpu_palette")]
+        draw::draw_layers(
+            world,
+            render_buffer,
+            camera,
+            layer_contents,
+            &self.tiles,
+            &layer_order,
+        );
+        #[cfg(not(feature = "gpu_palette"))]
+        draw::draw_layers(world, render_buffer, camera, layer_contents, &self.tiles);
+
+        let Some(uniform_binding) = world.resource::<PxUniformBuffer>().binding() else {
+            return Ok(());
+        };
+
+        let inner = render_buffer.read_inner();
+        let texture = inner.texture.as_ref().unwrap();
+        let image = inner.image.as_ref().unwrap();
+        let image_descriptor = image.texture_descriptor.clone();
+
+        let Ok(pixel_size) = image_descriptor.format.pixel_size() else {
+            return Ok(());
+        };
+
+        world.resource::<RenderQueue>().write_texture(
+            texture.as_image_copy(),
+            image.data.as_ref().unwrap(),
+            TexelCopyBufferLayout {
+                offset: 0,
+                bytes_per_row: Some(image.width() * pixel_size as u32),
+                rows_per_image: None,
+            },
+            image_descriptor.size,
+        );
+
+        #[cfg(feature = "gpu_palette")]
+        if let Some(depth_image) = inner.depth_image.as_ref()
+            && let Some(depth_data) = depth_image.data.as_ref()
+            && let Some(depth_texture) = inner.depth_texture.as_ref()
+        {
+            let depth_descriptor = depth_image.texture_descriptor.clone();
+            if let Ok(depth_pixel_size) = depth_descriptor.format.pixel_size() {
+                world.resource::<RenderQueue>().write_texture(
+                    depth_texture.as_image_copy(),
+                    depth_data,
+                    TexelCopyBufferLayout {
+                        offset: 0,
+                        bytes_per_row: Some(depth_image.width() * depth_pixel_size as u32),
+                        rows_per_image: None,
+                    },
+                    depth_descriptor.size,
+                );
+            }
+        }
+
+        let texture_view = texture.create_view(&TextureViewDescriptor {
+            label: Some("px_texture_view"),
+            format: Some(image_descriptor.format),
+            dimension: Some(TextureViewDimension::D2),
+            ..default()
+        });
+
+        let px_pipeline = world.resource::<PxPipeline>();
+        let Some(pipeline) = world
+            .resource::<PipelineCache>()
+            .get_render_pipeline(px_pipeline.id)
+        else {
+            return Ok(());
+        };
+
+        let post_process = target.post_process_write();
+
+        let bind_group = render_context.render_device().create_bind_group(
+            "px_bind_group",
+            &px_pipeline.layout,
+            &BindGroupEntries::sequential((&texture_view, uniform_binding.clone())),
+        );
+
+        let mut render_pass = render_context.begin_tracked_render_pass(RenderPassDescriptor {
+            label: Some("px_pass"),
+            color_attachments: &[Some(RenderPassColorAttachment {
+                view: post_process.destination,
+                depth_slice: None,
+                resolve_target: None,
+                ops: default(),
+            })],
+            depth_stencil_attachment: None,
+            timestamp_writes: None,
+            occlusion_query_set: None,
+        });
+
+        render_pass.set_render_pipeline(pipeline);
+        render_pass.set_bind_group(0, &bind_group, &[]);
+        render_pass.draw(0..6, 0..1);
+
+        Ok(())
+    }
+}
diff --git a/src/screen/pipeline.rs b/src/screen/pipeline.rs
new file mode 100644
index 0000000..e1a49b3
--- /dev/null
+++ b/src/screen/pipeline.rs
@@ -0,0 +1,223 @@
+use std::sync::RwLock;
+
+use bevy_derive::{Deref, DerefMut};
+#[cfg(feature = "headed")]
+use bevy_render::{
+    render_resource::{
+        BindGroupLayout, BindGroupLayoutEntries, CachedRenderPipelineId, ColorTargetState,
+        ColorWrites, DynamicUniformBuffer, Extent3d, FragmentState, PipelineCache,
+        RenderPipelineDescriptor, ShaderStages, ShaderType, Texture, TextureDescriptor,
+        TextureDimension, TextureFormat, TextureSampleType, TextureUsages, VertexState,
+        binding_types::{texture_2d, uniform_buffer},
+    },
+    renderer::{RenderDevice, RenderQueue},
+};
+
+use crate::prelude::*;
+
+use super::{SCREEN_SHADER_HANDLE, Screen};
+
+#[cfg(feature = "headed")]
+#[derive(ShaderType)]
+pub(crate) struct PxUniform {
+    pub(crate) palette: [Vec3; 256],
+    pub(crate) fit_factor: Vec2,
+}
+
+#[cfg(feature = "headed")]
+#[derive(Resource, Deref, DerefMut, Default)]
+pub(crate) struct PxUniformBuffer(DynamicUniformBuffer<PxUniform>);
+
+#[cfg(feature = "headed")]
+pub(crate) fn prepare_uniform(
+    mut buffer: ResMut<PxUniformBuffer>,
+    screen: Res<Screen>,
+    device: Res<RenderDevice>,
+    queue: Res<RenderQueue>,
+) {
+    let Some(mut writer) = buffer.get_writer(1, &device, &queue) else {
+        return;
+    };
+
+    let aspect_ratio_ratio =
+        screen.computed_size.x as f32 / screen.computed_size.y as f32 / screen.window_aspect_ratio;
+    writer.write(&PxUniform {
+        palette: screen.palette,
+        fit_factor: if aspect_ratio_ratio > 1. {
+            Vec2::new(1., 1. / aspect_ratio_ratio)
+        } else {
+            Vec2::new(aspect_ratio_ratio, 1.)
+        },
+    });
+}
+
+#[cfg(feature = "headed")]
+#[derive(Resource)]
+pub(crate) struct PxPipeline {
+    pub(crate) layout: BindGroupLayout,
+    pub(crate) id: CachedRenderPipelineId,
+}
+
+#[cfg(feature = "headed")]
+impl FromWorld for PxPipeline {
+    fn from_world(world: &mut World) -> Self {
+        let render_device = world.resource::<RenderDevice>();
+
+        let layout = render_device.create_bind_group_layout(
+            "px_bind_group_layout",
+            &BindGroupLayoutEntries::sequential(
+                ShaderStages::FRAGMENT,
+                (
+                    texture_2d(TextureSampleType::Uint),
+                    uniform_buffer::<PxUniform>(false).visibility(ShaderStages::VERTEX_FRAGMENT),
+                ),
+            ),
+        );
+
+        Self {
+            id: world.resource_mut::<PipelineCache>().queue_render_pipeline(
+                RenderPipelineDescriptor {
+                    label: Some("px_pipeline".into()),
+                    layout: vec![layout.clone()],
+                    vertex: VertexState {
+                        shader: SCREEN_SHADER_HANDLE,
+                        shader_defs: Vec::new(),
+                        entry_point: Some("vertex".into()),
+                        buffers: Vec::new(),
+                    },
+                    fragment: Some(FragmentState {
+                        shader: SCREEN_SHADER_HANDLE,
+                        shader_defs: Vec::new(),
+                        entry_point: Some("fragment".into()),
+                        targets: vec![Some(ColorTargetState {
+                            format: TextureFormat::bevy_default(),
+                            blend: None,
+                            write_mask: ColorWrites::ALL,
+                        })],
+                    }),
+                    primitive: default(),
+                    depth_stencil: None,
+                    multisample: default(),
+                    push_constant_ranges: Vec::new(),
+                    zero_initialize_workgroup_memory: true,
+                },
+            ),
+            layout,
+        }
+    }
+}
+
+#[cfg(feature = "headed")]
+#[derive(Resource)]
+pub(crate) struct PxRenderBuffer {
+    inner: RwLock<PxRenderBufferInner>,
+}
+
+#[cfg(feature = "headed")]
+pub(crate) struct PxRenderBufferInner {
+    pub(crate) size: UVec2,
+    pub(crate) image: Option<Image>,
+    pub(crate) texture: Option<Texture>,
+    #[cfg(feature = "gpu_palette")]
+    pub(crate) depth_image: Option<Image>,
+    #[cfg(feature = "gpu_palette")]
+    pub(crate) depth_texture: Option<Texture>,
+}
+
+#[cfg(feature = "headed")]
+impl Default for PxRenderBuffer {
+    fn default() -> Self {
+        Self {
+            inner: RwLock::new(PxRenderBufferInner {
+                size: UVec2::ZERO,
+                image: None,
+                texture: None,
+                #[cfg(feature = "gpu_palette")]
+                depth_image: None,
+                #[cfg(feature = "gpu_palette")]
+                depth_texture: None,
+            }),
+        }
+    }
+}
+
+#[cfg(feature = "headed")]
+impl PxRenderBuffer {
+    pub(crate) fn ensure_size(&self, device: &RenderDevice, size: UVec2) {
+        let mut inner = self.inner.write().unwrap();
+        if size == inner.size && inner.image.is_some() && inner.texture.is_some() {
+            return;
+        }
+
+        inner.size = size;
+
+        let descriptor = TextureDescriptor {
+            label: Some("px_present_texture"),
+            size: Extent3d {
+                width: size.x,
+                height: size.y,
+                depth_or_array_layers: 1,
+            },
+            dimension: TextureDimension::D2,
+            format: TextureFormat::R8Uint,
+            sample_count: 1,
+            mip_level_count: 1,
+            usage: TextureUsages::TEXTURE_BINDING | TextureUsages::COPY_DST,
+            view_formats: &[],
+        };
+
+        inner.texture = Some(device.create_texture(&descriptor));
+        inner.image = Some(Image::new_fill(
+            descriptor.size,
+            descriptor.dimension,
+            &[0],
+            descriptor.format,
+            default(),
+        ));
+
+        #[cfg(feature = "gpu_palette")]
+        {
+            let depth_descriptor = TextureDescriptor {
+                label: Some("px_present_depth_texture"),
+                size: descriptor.size,
+                dimension: TextureDimension::D2,
+                format: TextureFormat::R16Uint,
+                sample_count: 1,
+                mip_level_count: 1,
+                usage: TextureUsages::TEXTURE_BINDING | TextureUsages::COPY_DST,
+                view_formats: &[],
+            };
+            inner.depth_texture = Some(device.create_texture(&depth_descriptor));
+            inner.depth_image = Some(Image::new_fill(
+                depth_descriptor.size,
+                depth_descriptor.dimension,
+                &[0, 0],
+                depth_descriptor.format,
+                default(),
+            ));
+        }
+    }
+
+    pub(crate) fn clear(&self) {
+        let mut inner = self.inner.write().unwrap();
+        if let Some(image) = inner.image.as_mut()
+            && let Some(data) = image.data.as_mut()
+        {
+            data.fill(0);
+        }
+        #[cfg(feature = "gpu_palette")]
+        if let Some(depth) = inner.depth_image.as_mut()
+            && let Some(data) = depth.data.as_mut()
+        {
+            data.fill(0);
+        }
+    }
+
+    pub(crate) fn read_inner(&self) -> std::sync::RwLockReadGuard<'_, PxRenderBufferInner> {
+        self.inner.read().unwrap()
+    }
+
+    pub(crate) fn write_inner(&self) -> std::sync::RwLockWriteGuard<'_, PxRenderBufferInner> {
+        self.inner.write().unwrap()
+    }
+}
diff --git a/src/sprite.rs b/src/sprite.rs
index 48c168e..341d731 100644
--- a/src/sprite.rs
+++ b/src/sprite.rs
@@ -1,9 +1,11 @@
 //! Sprites
 
-use std::error::Error;
+use std::{error::Error, path::PathBuf};
 
-use bevy_asset::{AssetLoader, LoadContext, io::Reader};
+use bevy_asset::{AssetEvent, AssetId, AssetLoader, LoadContext, io::Reader};
 use bevy_derive::{Deref, DerefMut};
+#[cfg(feature = "gpu_palette")]
+use bevy_ecs::system::lifetimeless::SRes;
 use bevy_image::{CompressedImageFormats, ImageLoader, ImageLoaderSettings};
 use bevy_math::{ivec2, uvec2};
 #[cfg(feature = "headed")]
@@ -13,31 +15,60 @@ use bevy_render::{
     sync_component::SyncComponentPlugin,
     sync_world::RenderEntity,
 };
+#[cfg(feature = "gpu_palette")]
+use bevy_render::{
+    render_resource::{
+        Extent3d, TexelCopyBufferLayout, Texture, TextureDescriptor, TextureDimension,
+        TextureFormat, TextureUsages,
+    },
+    renderer::{RenderDevice, RenderQueue},
+};
 use serde::{Deserialize, Serialize};
 
 use crate::{
-    animation::{AnimatedAssetComponent, Frames},
+    animation::AnimatedAssetComponent,
+    filter::PxFilterAsset,
+    frame::{Frames, PxFrameBinding, PxFrameCount},
     image::{PxImage, PxImageSliceMut},
-    palette::asset_palette,
+    palette::Palette,
     position::{DefaultLayer, PxLayer, Spatial},
     prelude::*,
+    set::PxSet,
 };
 
-pub(crate) fn plug<L: PxLayer>(app: &mut App) {
+pub(crate) fn plug<L: PxLayer>(app: &mut App, palette_path: PathBuf) {
     #[cfg(feature = "headed")]
     app.add_plugins((
         RenderAssetPlugin::<PxSpriteAsset>::default(),
         SyncComponentPlugin::<PxSprite>::default(),
     ));
 
+    #[cfg(all(feature = "headed", feature = "gpu_palette"))]
+    app.add_plugins((
+        RenderAssetPlugin::<PxSpriteGpu>::default(),
+        SyncComponentPlugin::<PxGpuSprite>::default(),
+        SyncComponentPlugin::<PxGpuComposite>::default(),
+    ));
+
     app.init_asset::<PxSpriteAsset>()
-        .init_asset_loader::<PxSpriteLoader>();
+        .register_asset_loader(PxSpriteLoader::new(palette_path));
+
+    app.add_systems(
+        PostUpdate,
+        (
+            update_composite_metrics_on_change,
+            update_composite_metrics_on_assets,
+            sync_composite_frame_count_on_animation_added,
+        )
+            .before(PxSet::FinishAnimations),
+    );
 
     #[cfg(feature = "headed")]
     app.sub_app_mut(RenderApp).add_systems(
         ExtractSchedule,
         (
             extract_sprites::<L>,
+            extract_composite_sprites::<L>,
             // extract_image_to_sprites::<L>
         ),
     );
@@ -58,8 +89,15 @@ impl Default for PxSpriteLoaderSettings {
     }
 }
 
-#[derive(Default)]
-struct PxSpriteLoader;
+struct PxSpriteLoader {
+    palette_path: PathBuf,
+}
+
+impl PxSpriteLoader {
+    fn new(palette_path: PathBuf) -> Self {
+        Self { palette_path }
+    }
+}
 
 impl AssetLoader for PxSpriteLoader {
     type Asset = PxSpriteAsset;
@@ -75,8 +113,14 @@ impl AssetLoader for PxSpriteLoader {
         let image = ImageLoader::new(CompressedImageFormats::NONE)
             .load(reader, &settings.image_loader_settings, load_context)
             .await?;
-        let palette = asset_palette().await;
-        let data = PxImage::palette_indices(palette, &image).map_err(|err| err.to_string())?;
+        let palette = load_context
+            .loader()
+            .immediate()
+            .load::<Palette>(self.palette_path.clone())
+            .await
+            .map_err(|err| err.to_string())?;
+        let data =
+            PxImage::palette_indices(palette.get(), &image).map_err(|err| err.to_string())?;
 
         Ok(PxSpriteAsset {
             frame_size: data.area() / settings.frame_count,
@@ -98,6 +142,61 @@ pub struct PxSpriteAsset {
     pub(crate) frame_size: usize,
 }
 
+#[cfg(feature = "gpu_palette")]
+#[derive(Clone)]
+pub(crate) struct PxSpriteGpu {
+    pub(crate) size: UVec2,
+    pub(crate) frame_size: usize,
+    pub(crate) texture: Texture,
+}
+
+#[cfg(feature = "gpu_palette")]
+impl RenderAsset for PxSpriteGpu {
+    type SourceAsset = PxSpriteAsset;
+    type Param = (SRes<RenderDevice>, SRes<RenderQueue>);
+
+    fn prepare_asset(
+        source_asset: Self::SourceAsset,
+        _: AssetId<Self::SourceAsset>,
+        (device, queue): &mut bevy_ecs::system::SystemParamItem<Self::Param>,
+        _: Option<&Self>,
+    ) -> Result<Self, PrepareAssetError<Self::SourceAsset>> {
+        let size = source_asset.data.size();
+        let descriptor = TextureDescriptor {
+            label: Some("px_sprite_texture"),
+            size: Extent3d {
+                width: size.x,
+                height: size.y,
+                depth_or_array_layers: 1,
+            },
+            dimension: TextureDimension::D2,
+            format: TextureFormat::R8Uint,
+            sample_count: 1,
+            mip_level_count: 1,
+            usage: TextureUsages::TEXTURE_BINDING | TextureUsages::COPY_DST,
+            view_formats: &[],
+        };
+
+        let texture = device.create_texture(&descriptor);
+        queue.write_texture(
+            texture.as_image_copy(),
+            source_asset.data.data(),
+            TexelCopyBufferLayout {
+                offset: 0,
+                bytes_per_row: Some(size.x),
+                rows_per_image: None,
+            },
+            descriptor.size,
+        );
+
+        Ok(Self {
+            size,
+            frame_size: source_asset.frame_size,
+            texture,
+        })
+    }
+}
+
 #[cfg(feature = "headed")]
 impl RenderAsset for PxSpriteAsset {
     type SourceAsset = Self;
@@ -167,6 +266,149 @@ impl From<Handle<PxSpriteAsset>> for PxSprite {
     }
 }
 
+/// A sprite composed of multiple sprite parts.
+#[derive(Component, Default, Clone, Debug)]
+#[require(PxPosition, PxAnchor, DefaultLayer, PxCanvas)]
+#[cfg_attr(feature = "headed", require(Visibility))]
+pub struct PxCompositeSprite {
+    /// Parts that make up the composite sprite.
+    pub parts: Vec<PxCompositePart>,
+    /// Cached composite size (computed from parts).
+    pub size: UVec2,
+    /// Cached origin shift when parts have negative offsets.
+    pub origin: IVec2,
+    /// Cached frame count for the master animation.
+    pub frame_count: usize,
+}
+
+#[derive(Clone, Copy, Debug)]
+pub(crate) struct PxCompositeMetrics {
+    pub size: UVec2,
+    pub origin: IVec2,
+    pub frame_count: usize,
+}
+
+#[derive(Clone, Copy, Debug)]
+pub(crate) struct PxCompositePartMetrics {
+    pub size: UVec2,
+    pub frame_count: usize,
+}
+
+impl PxCompositeSprite {
+    /// Create a composite sprite from parts.
+    pub fn new(parts: Vec<PxCompositePart>) -> Self {
+        Self {
+            parts,
+            size: UVec2::ZERO,
+            origin: IVec2::ZERO,
+            frame_count: 0,
+        }
+    }
+
+    /// Recompute cached size/origin/frame count from current parts.
+    pub(crate) fn metrics_with<F>(&self, mut get: F) -> Option<PxCompositeMetrics>
+    where
+        F: FnMut(&Handle<PxSpriteAsset>) -> Option<PxCompositePartMetrics>,
+    {
+        let mut any = false;
+        let mut min = IVec2::ZERO;
+        let mut max = IVec2::ZERO;
+        let mut frame_count = 0usize;
+
+        for part in &self.parts {
+            let Some(metrics) = get(&part.sprite) else {
+                continue;
+            };
+
+            let size = metrics.size.as_ivec2();
+            let part_min = part.offset;
+            let part_max = part.offset + size;
+
+            if !any {
+                min = part_min;
+                max = part_max;
+                any = true;
+            } else {
+                min = min.min(part_min);
+                max = max.max(part_max);
+            }
+
+            frame_count = frame_count.max(metrics.frame_count);
+        }
+
+        if !any {
+            return None;
+        }
+
+        let size = max - min;
+        Some(PxCompositeMetrics {
+            origin: min,
+            size: UVec2::new(size.x.max(0) as u32, size.y.max(0) as u32),
+            frame_count,
+        })
+    }
+
+    /// Recompute cached size/origin/frame count from current parts.
+    pub fn recompute_metrics(&mut self, sprites: &Assets<PxSpriteAsset>) {
+        let metrics = self.metrics_with(|handle| {
+            let sprite = sprites.get(handle)?;
+            Some(PxCompositePartMetrics {
+                size: sprite.frame_size(),
+                frame_count: sprite.frame_count(),
+            })
+        });
+        match metrics {
+            Some(metrics) => {
+                self.size = metrics.size;
+                self.origin = metrics.origin;
+                self.frame_count = metrics.frame_count;
+            }
+            None => {
+                self.size = UVec2::ZERO;
+                self.origin = IVec2::ZERO;
+                self.frame_count = 0;
+            }
+        }
+    }
+}
+
+/// A single part of a composite sprite.
+#[derive(Clone, Debug)]
+pub struct PxCompositePart {
+    /// Sprite asset used for this part.
+    pub sprite: Handle<PxSpriteAsset>,
+    /// Offset from the composite's bottom-left (before anchor).
+    pub offset: IVec2,
+    /// Frame binding to the composite's master frame.
+    pub frame: PxFrameBinding,
+    /// Optional filter applied before the composite's filter.
+    pub filter: Option<Handle<PxFilterAsset>>,
+}
+
+impl PxCompositePart {
+    /// Create a composite part with default binding and zero offset.
+    pub fn new(sprite: Handle<PxSpriteAsset>) -> Self {
+        Self {
+            sprite,
+            offset: IVec2::ZERO,
+            frame: PxFrameBinding::default(),
+            filter: None,
+        }
+    }
+}
+
+/// Marker to render a sprite via the experimental GPU palette path.
+#[cfg(feature = "gpu_palette")]
+#[derive(Component, Default, Clone, Copy, Debug)]
+#[require(PxSprite)]
+pub struct PxGpuSprite;
+
+/// Marker to render a composite sprite via the experimental GPU palette path.
+#[cfg(feature = "gpu_palette")]
+#[derive(Component, Default, Clone, Copy, Debug)]
+#[require(PxCompositeSprite)]
+pub struct PxGpuComposite;
+
 impl AnimatedAssetComponent for PxSprite {
     type Asset = PxSpriteAsset;
 
@@ -179,6 +421,187 @@ impl AnimatedAssetComponent for PxSprite {
     }
 }
 
+impl Spatial for PxCompositeSprite {
+    fn frame_size(&self) -> UVec2 {
+        self.size
+    }
+}
+
+fn sync_composite_metrics(
+    composite: &mut PxCompositeSprite,
+    sprites: &Assets<PxSpriteAsset>,
+    mut count: Option<Mut<PxFrameCount>>,
+) {
+    composite.recompute_metrics(sprites);
+    if let Some(count) = count.as_mut() {
+        count.0 = composite.frame_count;
+    }
+}
+
+fn update_composite_metrics_on_change(
+    sprites: Res<Assets<PxSpriteAsset>>,
+    mut composites: Query<
+        (&mut PxCompositeSprite, Option<&mut PxFrameCount>),
+        Changed<PxCompositeSprite>,
+    >,
+) {
+    for (mut composite, count) in &mut composites {
+        sync_composite_metrics(&mut composite, &sprites, count);
+    }
+}
+
+fn update_composite_metrics_on_assets(
+    sprites: Res<Assets<PxSpriteAsset>>,
+    mut events: MessageReader<AssetEvent<PxSpriteAsset>>,
+    mut composites: Query<(&mut PxCompositeSprite, Option<&mut PxFrameCount>)>,
+) {
+    if events.read().next().is_none() {
+        return;
+    }
+
+    for (mut composite, count) in &mut composites {
+        sync_composite_metrics(&mut composite, &sprites, count);
+    }
+}
+
+fn sync_composite_frame_count_on_animation_added(
+    sprites: Res<Assets<PxSpriteAsset>>,
+    mut composites: Query<(&mut PxCompositeSprite, &mut PxFrameCount), Added<PxAnimation>>,
+) {
+    for (mut composite, count) in &mut composites {
+        sync_composite_metrics(&mut composite, &sprites, Some(count));
+    }
+}
+
+#[cfg(test)]
+mod tests {
+    use super::*;
+    use crate::{
+        camera::PxCamera,
+        frame::{draw_spatial, resolve_frame_binding},
+        image::PxImage,
+    };
+    use bevy_asset::Assets;
+    use insta::assert_snapshot;
+
+    fn pixels(image: &PxImage) -> Vec<u8> {
+        let size = image.size();
+        let mut out = Vec::with_capacity((size.x * size.y) as usize);
+        for y in 0..size.y as i32 {
+            for x in 0..size.x as i32 {
+                out.push(image.pixel(IVec2::new(x, y)));
+            }
+        }
+        out
+    }
+
+    fn image_grid(image: &PxImage) -> String {
+        let size = image.size();
+        let mut out = String::new();
+        for y in 0..size.y as i32 {
+            for x in 0..size.x as i32 {
+                let value = image.pixel(IVec2::new(x, y));
+                if x > 0 {
+                    out.push(' ');
+                }
+                out.push_str(&format!("{value:02}"));
+            }
+            if y + 1 < size.y as i32 {
+                out.push('\n');
+            }
+        }
+        out
+    }
+
+    #[test]
+    fn sprite_draws_nonzero_pixels() {
+        let sprite = PxSpriteAsset {
+            data: PxImage::new(vec![0, 2, 3, 0], 2),
+            frame_size: 4,
+        };
+        let mut image = PxImage::new(vec![1; 4], 2);
+        let mut slice = image.slice_all_mut();
+
+        draw_spatial(
+            &sprite,
+            (),
+            &mut slice,
+            PxPosition(IVec2::ZERO),
+            PxAnchor::BottomLeft,
+            PxCanvas::Camera,
+            None,
+            [],
+            PxCamera::default(),
+        );
+
+        let expected = vec![1, 2, 3, 1];
+        assert_eq!(pixels(&image), expected);
+    }
+
+    #[test]
+    fn composite_sprite_snapshot() {
+        let mut sprites = Assets::default();
+        let sprite_a = sprites.add(PxSpriteAsset {
+            data: PxImage::new(vec![1, 2, 3, 4], 2),
+            frame_size: 4,
+        });
+        let sprite_b = sprites.add(PxSpriteAsset {
+            data: PxImage::new(vec![5, 6, 7, 8], 2),
+            frame_size: 4,
+        });
+
+        let mut composite = PxCompositeSprite::new(vec![
+            PxCompositePart {
+                sprite: sprite_a,
+                offset: IVec2::ZERO,
+                frame: PxFrameBinding::default(),
+                filter: None,
+            },
+            PxCompositePart {
+                sprite: sprite_b,
+                offset: IVec2::new(2, 0),
+                frame: PxFrameBinding::default(),
+                filter: None,
+            },
+        ]);
+        composite.recompute_metrics(&sprites);
+
+        let mut image = PxImage::new(vec![0; 8], 4);
+        let mut slice = image.slice_all_mut();
+        let base_pos = IVec2::ZERO - PxAnchor::BottomLeft.pos(composite.size).as_ivec2();
+
+        for part in &composite.parts {
+            let sprite = sprites.get(&part.sprite).unwrap();
+            let part_frame = resolve_frame_binding(
+                None,
+                composite.frame_count,
+                sprite.frame_count(),
+                &part.frame,
+            );
+            let part_pos = base_pos + (part.offset - composite.origin);
+            draw_spatial(
+                sprite,
+                (),
+                &mut slice,
+                part_pos.into(),
+                PxAnchor::BottomLeft,
+                PxCanvas::Camera,
+                part_frame,
+                [],
+                PxCamera::default(),
+            );
+        }
+
+        assert_snapshot!(
+            image_grid(&image),
+            @r###"
+01 02 05 06
+03 04 07 08
+"###
+        );
+    }
+}
+
 // /// Size of threshold map to use for dithering. The image is tiled with dithering according to this
 // /// map, so smaller sizes will have more visible repetition and worse color approximation, but
 // /// larger sizes are much, much slower with pattern dithering.
@@ -410,6 +833,16 @@ pub(crate) type SpriteComponents<L> = (
     Option<&'static PxFilter>,
 );
 
+pub(crate) type CompositeSpriteComponents<L> = (
+    &'static PxCompositeSprite,
+    &'static PxPosition,
+    &'static PxAnchor,
+    &'static L,
+    &'static PxCanvas,
+    Option<&'static PxFrame>,
+    Option<&'static PxFilter>,
+);
+
 #[cfg(feature = "headed")]
 fn extract_sprites<L: PxLayer>(
     // TODO Maybe calculate `ViewVisibility`
@@ -441,6 +874,43 @@ fn extract_sprites<L: PxLayer>(
     }
 }
 
+#[cfg(feature = "headed")]
+fn extract_composite_sprites<L: PxLayer>(
+    // TODO Maybe calculate `ViewVisibility`
+    sprites: Extract<
+        Query<(
+            CompositeSpriteComponents<L>,
+            &InheritedVisibility,
+            RenderEntity,
+        )>,
+    >,
+    mut cmd: Commands,
+) {
+    for ((sprite, &position, &anchor, layer, &canvas, frame, filter), visibility, id) in &sprites {
+        let mut entity = cmd.entity(id);
+
+        if !visibility.get() {
+            // TODO Need to a better way to prevent entities from rendering
+            entity.remove::<L>();
+            continue;
+        }
+
+        entity.insert((sprite.clone(), position, anchor, layer.clone(), canvas));
+
+        if let Some(frame) = frame {
+            entity.insert(*frame);
+        } else {
+            entity.remove::<PxFrame>();
+        }
+
+        if let Some(filter) = filter {
+            entity.insert(filter.clone());
+        } else {
+            entity.remove::<PxFilter>();
+        }
+    }
+}
+
 // pub(crate) type ImageToSpriteComponents<L> = (
 //     &'static ImageToSprite,
 //     &'static PxPosition,
diff --git a/src/text.rs b/src/text.rs
index 2419eee..cd72d9c 100644
--- a/src/text.rs
+++ b/src/text.rs
@@ -1,4 +1,4 @@
-use std::error::Error;
+use std::{error::Error, path::PathBuf};
 
 use bevy_asset::{AssetLoader, LoadContext, io::Reader};
 use bevy_image::{CompressedImageFormats, ImageLoader, ImageLoaderSettings};
@@ -13,11 +13,11 @@ use bevy_render::{
 use serde::{Deserialize, Serialize};
 
 use crate::{
-    animation::AnimatedAssetComponent, image::PxImage, palette::asset_palette,
-    position::DefaultLayer, position::PxLayer, prelude::*,
+    animation::AnimatedAssetComponent, image::PxImage, palette::Palette, position::DefaultLayer,
+    position::PxLayer, prelude::*,
 };
 
-pub(crate) fn plug<L: PxLayer>(app: &mut App) {
+pub(crate) fn plug<L: PxLayer>(app: &mut App, palette_path: PathBuf) {
     #[cfg(feature = "headed")]
     app.add_plugins((
         RenderAssetPlugin::<PxTypeface>::default(),
@@ -25,7 +25,7 @@ pub(crate) fn plug<L: PxLayer>(app: &mut App) {
     ));
 
     app.init_asset::<PxTypeface>()
-        .init_asset_loader::<PxTypefaceLoader>();
+        .register_asset_loader(PxTypefaceLoader::new(palette_path));
 
     #[cfg(feature = "headed")]
     app.sub_app_mut(RenderApp)
@@ -53,8 +53,15 @@ impl Default for PxTypefaceLoaderSettings {
     }
 }
 
-#[derive(Default)]
-struct PxTypefaceLoader;
+struct PxTypefaceLoader {
+    palette_path: PathBuf,
+}
+
+impl PxTypefaceLoader {
+    fn new(palette_path: PathBuf) -> Self {
+        Self { palette_path }
+    }
+}
 
 impl AssetLoader for PxTypefaceLoader {
     type Asset = PxTypeface;
@@ -70,7 +77,13 @@ impl AssetLoader for PxTypefaceLoader {
         let image = ImageLoader::new(CompressedImageFormats::NONE)
             .load(reader, &settings.image_loader_settings, load_context)
             .await?;
-        let palette = asset_palette().await;
+        let palette = load_context
+            .loader()
+            .immediate()
+            .load::<Palette>(self.palette_path.clone())
+            .await
+            .map_err(|err| err.to_string())?;
+        let palette = palette.get();
         let indices = PxImage::palette_indices(palette, &image).map_err(|err| err.to_string())?;
         let height = indices.height();
         let character_count = settings.characters.chars().count();
@@ -219,6 +232,104 @@ impl AnimatedAssetComponent for PxText {
     }
 }
 
+#[cfg(test)]
+mod tests {
+    use super::*;
+    use crate::{camera::PxCamera, frame::draw_spatial, image::PxImage, sprite::PxSpriteAsset};
+
+    fn pixels(image: &PxImage) -> Vec<u8> {
+        let size = image.size();
+        let mut out = Vec::with_capacity((size.x * size.y) as usize);
+        for y in 0..size.y as i32 {
+            for x in 0..size.x as i32 {
+                out.push(image.pixel(IVec2::new(x, y)));
+            }
+        }
+        out
+    }
+
+    fn draw_text(
+        image: &mut PxImage,
+        text: &str,
+        typeface: &PxTypeface,
+        pos: PxPosition,
+        alignment: PxAnchor,
+    ) {
+        let mut slice = image.slice_all_mut();
+        let line_break_count = 0_u32;
+        let mut size = uvec2(
+            0,
+            (line_break_count + 1) * typeface.height + line_break_count,
+        );
+        let mut x = 0;
+        let y = 0;
+        let mut chars = Vec::new();
+
+        for char in text.chars() {
+            if let Some(char) = typeface.characters.get(&char) {
+                if x != 0 {
+                    x += 1;
+                }
+
+                chars.push((x, y, char));
+                x += char.data.size().x;
+
+                if x > size.x {
+                    size.x = x;
+                }
+            } else if let Some(separator) = typeface.separators.get(&char) {
+                x += separator.width;
+            }
+        }
+
+        let top_left = *pos - alignment.pos(size).as_ivec2() + ivec2(0, size.y as i32 - 1);
+
+        for (x, y, char) in chars {
+            draw_spatial(
+                char,
+                (),
+                &mut slice,
+                PxPosition(top_left + ivec2(x as i32, -(y as i32))),
+                PxAnchor::TopLeft,
+                PxCanvas::Camera,
+                None,
+                [],
+                PxCamera::default(),
+            );
+        }
+    }
+
+    #[test]
+    fn text_draws_characters_with_spacing() {
+        let mut characters = HashMap::new();
+        characters.insert(
+            'A',
+            PxSpriteAsset {
+                data: PxImage::new(vec![2], 1),
+                frame_size: 1,
+            },
+        );
+        let typeface = PxTypeface {
+            height: 1,
+            characters,
+            separators: HashMap::new(),
+            max_frame_count: 1,
+        };
+
+        let mut image = PxImage::new(vec![1; 12], 4);
+        draw_text(
+            &mut image,
+            "AA",
+            &typeface,
+            PxPosition(IVec2::new(0, 1)),
+            PxAnchor::BottomLeft,
+        );
+
+        let expected = vec![1, 1, 1, 1, 1, 1, 1, 1, 2, 1, 2, 1];
+        assert_eq!(pixels(&image), expected);
+    }
+}
+
 pub(crate) type TextComponents<L> = (
     &'static PxText,
     &'static PxPosition,
diff --git a/src/ui.rs b/src/ui.rs
index e25c47d..bbc4588 100644
--- a/src/ui.rs
+++ b/src/ui.rs
@@ -7,30 +7,21 @@
 //!
 //! For more information, browse this module and see the `ui` example.
 
-// TODO UI example
-// TODO Feature parity between widgets
-// TODO Split into modules
+mod input;
+mod layout;
+mod widgets;
 
-use std::time::Duration;
-
-use bevy_derive::{Deref, DerefMut};
-use bevy_ecs::system::SystemId;
 #[cfg(feature = "headed")]
-use bevy_input::{
-    ButtonState, InputSystems,
-    keyboard::{Key, KeyboardInput, NativeKey},
-    mouse::MouseWheel,
-};
+use bevy_input::InputSystems;
 #[cfg(feature = "headed")]
 use bevy_input_focus::InputFocus;
-use bevy_math::{ivec2, uvec2};
 
-use crate::{
-    blink::Blink,
-    position::{DefaultLayer, Spatial},
-    prelude::*,
-    screen::Screen,
-    set::PxSet,
+use crate::{prelude::*, set::PxSet};
+
+pub use input::{PxCaret, PxKeyField, PxKeyFieldUpdate, PxTextField, PxTextFieldUpdate};
+pub use widgets::{
+    PxGrid, PxGridRow, PxGridRows, PxMargin, PxMinSize, PxRow, PxRowSlot, PxScroll, PxStack,
+    PxUiRoot,
 };
 
 pub(crate) fn plug<L: PxLayer>(app: &mut App) {
@@ -38,1204 +29,26 @@ pub(crate) fn plug<L: PxLayer>(app: &mut App) {
     app.add_systems(
         PreUpdate,
         (
-            (update_key_fields, update_text_fields).run_if(resource_exists::<InputFocus>),
-            scroll,
+            (input::update_key_fields, input::update_text_fields)
+                .run_if(resource_exists::<InputFocus>),
+            input::scroll,
         )
             .after(InputSystems),
     )
     .add_systems(
         PostUpdate,
         (
-            update_key_field_focus,
-            update_text_field_focus.before(caret_blink),
+            input::update_key_field_focus,
+            input::update_text_field_focus.before(input::caret_blink),
         )
             .run_if(resource_exists::<InputFocus>),
     );
     app.add_systems(
         PostUpdate,
-        (caret_blink, layout::<L>.before(PxSet::Picking)).chain(),
+        (
+            input::caret_blink,
+            layout::layout::<L>.before(PxSet::Picking),
+        )
+            .chain(),
     );
 }
-
-// TODO Work on this naming
-
-#[derive(Component)]
-#[require(PxCanvas, DefaultLayer)]
-pub struct PxUiRoot;
-
-#[derive(Component, Deref, DerefMut, Default, Reflect)]
-#[cfg_attr(feature = "headed", require(Visibility))]
-pub struct PxMinSize(pub UVec2);
-
-#[derive(Component, Deref, DerefMut, Reflect)]
-#[cfg_attr(feature = "headed", require(Visibility))]
-pub struct PxMargin(pub u32);
-
-impl Default for PxMargin {
-    fn default() -> Self {
-        Self(1)
-    }
-}
-
-#[derive(Component, Default, Clone)]
-pub struct PxRowSlot {
-    pub stretch: bool,
-}
-
-#[derive(Component, Default, Clone, Reflect)]
-#[cfg_attr(feature = "headed", require(Visibility))]
-pub struct PxRow {
-    pub vertical: bool,
-    pub space_between: u32,
-}
-
-#[derive(Default, Clone, Reflect)]
-pub struct PxGridRow {
-    pub stretch: bool,
-}
-
-#[derive(Default, Clone, Reflect)]
-pub struct PxGridRows {
-    pub rows: Vec<PxGridRow>,
-    pub space_between: u32,
-}
-
-#[derive(Component, Clone)]
-#[cfg_attr(feature = "headed", require(Visibility))]
-pub struct PxGrid {
-    pub width: u32,
-    pub rows: PxGridRows,
-    pub columns: PxGridRows,
-}
-
-impl Default for PxGrid {
-    fn default() -> Self {
-        Self {
-            width: 2,
-            rows: default(),
-            columns: default(),
-        }
-    }
-}
-
-#[derive(Component, Clone, Reflect)]
-#[cfg_attr(feature = "headed", require(Visibility))]
-pub struct PxStack;
-
-#[derive(Component, Default, Clone, Copy, Reflect)]
-#[require(PxInvertMask, PxRect)]
-pub struct PxScroll {
-    pub horizontal: bool,
-    pub scroll: u32,
-    pub max_scroll: u32,
-}
-
-// TODO Should be modular
-#[cfg(feature = "headed")]
-fn scroll(mut scrolls: Query<&mut PxScroll>, mut wheels: MessageReader<MouseWheel>) {
-    for wheel in wheels.read() {
-        for mut scroll in &mut scrolls {
-            scroll.scroll = scroll
-                .scroll
-                .saturating_add_signed(-wheel.y as i32)
-                .min(scroll.max_scroll);
-        }
-    }
-}
-
-#[derive(Component, Reflect)]
-#[require(PxText)]
-#[reflect(from_reflect = false)]
-pub struct PxKeyField {
-    pub caret: char,
-    /// System that creates the text label
-    ///
-    /// Ideally, this would accept a Bevy `Key`, but there doesn't seem to be a way to convert a
-    /// winit `PhysicalKey` to a winit `Key`, so it wouldn't be possible to run this when building
-    /// the UI (ie in `PxUiBuilder::dyn_insert_into`) or update all the text if the keyboard layout
-    /// changes.
-    #[reflect(ignore)]
-    pub key_to_str: SystemId<In<KeyCode>, String>,
-    pub cached_text: String,
-}
-
-#[cfg(feature = "headed")]
-fn update_key_field_focus(
-    mut prev_focus: Local<Option<Entity>>,
-    mut fields: Query<(&PxKeyField, &mut PxText, &mut Visibility, Entity)>,
-    focus: Res<InputFocus>,
-    mut cmd: Commands,
-) {
-    let focus = focus.get();
-
-    if *prev_focus == focus {
-        return;
-    }
-
-    if let Some(prev_focus) = *prev_focus
-        && let Ok((field, mut text, mut visibility, id)) = fields.get_mut(prev_focus)
-    {
-        text.value = field.cached_text.clone();
-        *visibility = Visibility::Inherited;
-        cmd.entity(id).remove::<Blink>();
-    }
-
-    if let Some(focus) = focus
-        && let Ok((field, mut text, _, id)) = fields.get_mut(focus)
-    {
-        text.value = field.caret.to_string();
-        cmd.entity(id)
-            .try_insert(Blink::new(Duration::from_millis(500)));
-    }
-
-    *prev_focus = focus;
-}
-
-#[derive(EntityEvent)]
-pub struct PxKeyFieldUpdate {
-    pub entity: Entity,
-    pub key: KeyCode,
-}
-
-// TODO Should be modular
-#[cfg(feature = "headed")]
-fn update_key_fields(
-    mut fields: Query<Entity, With<PxKeyField>>,
-    mut focus: ResMut<InputFocus>,
-    mut keys: MessageReader<KeyboardInput>,
-    mut cmd: Commands,
-) {
-    let mut keys = keys.read();
-    let key = keys.find(|key| matches!(key.state, ButtonState::Pressed));
-    keys.last();
-    let Some(key) = key else {
-        return;
-    };
-
-    let Some(focus_id) = focus.get() else {
-        return;
-    };
-
-    let Ok(field_id) = fields.get_mut(focus_id) else {
-        return;
-    };
-
-    let key = key.key_code;
-
-    cmd.queue(move |world: &mut World| {
-        let Some(field) = world.get::<PxKeyField>(field_id) else {
-            return;
-        };
-
-        let key = match world.run_system_with(field.key_to_str, key) {
-            Ok(key) => key,
-            Err(err) => {
-                error!("couldn't get text for pressed key for key field: {err}");
-                return;
-            }
-        };
-
-        if let Some(mut field) = world.get_mut::<PxKeyField>(field_id) {
-            field.cached_text = key.clone();
-        }
-
-        if let Some(mut text) = world.get_mut::<PxText>(field_id) {
-            text.value = key;
-        };
-    });
-
-    cmd.trigger(PxKeyFieldUpdate {
-        entity: field_id,
-        key,
-    });
-
-    focus.clear();
-}
-
-#[derive(Reflect)]
-pub struct PxCaret {
-    pub state: bool,
-    pub timer: Timer,
-}
-
-impl Default for PxCaret {
-    fn default() -> Self {
-        Self {
-            state: true,
-            timer: Timer::new(Duration::from_millis(500), TimerMode::Repeating),
-        }
-    }
-}
-
-#[derive(Component, Reflect)]
-#[require(PxText)]
-pub struct PxTextField {
-    pub cached_text: String,
-    pub caret_char: char,
-    pub caret: Option<PxCaret>,
-}
-
-#[cfg(feature = "headed")]
-fn update_text_field_focus(
-    mut prev_focus: Local<Option<Entity>>,
-    mut fields: Query<(&mut PxTextField, &mut PxText)>,
-    focus: Res<InputFocus>,
-) {
-    let focus = focus.get();
-
-    if *prev_focus == focus {
-        return;
-    }
-
-    if let Some(prev_focus) = *prev_focus
-        && let Ok((mut field, mut text)) = fields.get_mut(prev_focus)
-    {
-        text.value = field.cached_text.clone();
-        field.caret = None;
-    }
-
-    if let Some(focus) = focus
-        && let Ok((mut field, mut text)) = fields.get_mut(focus)
-    {
-        field.cached_text = text.value.clone();
-        text.value += &field.caret_char.to_string();
-        field.caret = Some(default());
-    }
-
-    *prev_focus = focus;
-}
-
-fn caret_blink(mut fields: Query<(&mut PxTextField, &mut PxText)>, time: Res<Time>) {
-    for (mut field, mut text) in &mut fields {
-        let Some(ref mut caret) = field.caret else {
-            continue;
-        };
-
-        caret.timer.tick(time.delta());
-
-        if caret.timer.just_finished() {
-            caret.state ^= true;
-            let state = caret.state;
-
-            text.value = field.cached_text.clone();
-
-            if state {
-                text.value += &field.caret_char.to_string();
-            }
-        }
-    }
-}
-
-#[derive(EntityEvent)]
-pub struct PxTextFieldUpdate {
-    pub entity: Entity,
-    pub text: String,
-}
-
-// TODO Should be modular
-#[cfg(feature = "headed")]
-fn update_text_fields(
-    mut fields: Query<(&mut PxTextField, &mut PxText)>,
-    focus: Res<InputFocus>,
-    mut keys: MessageReader<KeyboardInput>,
-    mut cmd: Commands,
-) {
-    let keys = keys
-        .read()
-        .filter(|key| matches!(key.state, ButtonState::Pressed))
-        .collect::<Vec<_>>();
-
-    if keys.is_empty() {
-        return;
-    }
-
-    let Some(focus_id) = focus.get() else {
-        return;
-    };
-
-    let Ok((mut field, mut text)) = fields.get_mut(focus_id) else {
-        return;
-    };
-
-    for key in keys {
-        match key.logical_key {
-            Key::Character(ref characters) | Key::Unidentified(NativeKey::Web(ref characters)) => {
-                for character in characters.chars() {
-                    field.cached_text += &character.to_string();
-                }
-            }
-            Key::Space => field.cached_text += " ",
-            Key::Backspace => {
-                field.cached_text.pop();
-            }
-            _ => (),
-        }
-    }
-
-    text.value = field.cached_text.clone() + &field.caret_char.to_string();
-    field.caret = Some(default());
-
-    cmd.trigger(PxTextFieldUpdate {
-        entity: focus_id,
-        text: field.cached_text.clone(),
-    });
-}
-
-// If layouting ends up being too slow, make a tree of min sizes up front and lookup in that
-fn calc_min_size<L: PxLayer>(
-    ui: Entity,
-    uis: Query<(
-        AnyOf<(
-            (&PxMinSize, Option<&Children>),
-            (&PxMargin, Option<&Children>),
-            (&PxRow, Option<&Children>),
-            (&PxGrid, Option<&Children>),
-            (&PxStack, Option<&Children>),
-            (Option<(&PxScroll, &Children)>, &PxRect, &PxFilterLayers<L>),
-            &PxSprite,
-            &PxText,
-        )>,
-        Option<&L>,
-        Option<(&PxPosition, &PxCanvas)>,
-    )>,
-    typefaces: &Assets<PxTypeface>,
-    sprites: &Assets<PxSpriteAsset>,
-) -> UVec2 {
-    let Ok(((min_size, margin, row, grid, stack, rect, sprite, text), _, _)) = uis.get(ui) else {
-        // This includes `PxSpace`. Surprise, the `PxSpace` component doesn't do anything at all.
-        // It's just easier to spawn in UI.
-        return UVec2::ZERO;
-    };
-
-    if let Some((min_size, children)) = min_size {
-        return match children.map(|children| &**children) {
-            None | Some([]) => **min_size,
-            Some(&[content]) => {
-                calc_min_size(content, uis.as_readonly(), typefaces, sprites).max(**min_size)
-            }
-            Some([_, _, ..]) => {
-                warn!("`PxMinSize` has multiple children");
-                **min_size
-            }
-        };
-    }
-
-    if let Some((margin, children)) = margin {
-        let margin = 2 * UVec2::splat(**margin);
-
-        return match children.map(|children| &**children) {
-            None | Some([]) => margin,
-            Some(&[content]) => {
-                calc_min_size(content, uis.as_readonly(), typefaces, sprites) + margin
-            }
-            Some([_, _, ..]) => {
-                warn!("`PxMargin` has multiple children");
-                margin
-            }
-        };
-    }
-
-    fn dim(vec: UVec2, y: bool) -> u32 {
-        if y { vec.y } else { vec.x }
-    }
-
-    fn dim_mut(vec: &mut UVec2, y: bool) -> &mut u32 {
-        if y { &mut vec.y } else { &mut vec.x }
-    }
-
-    if let Some((row, children)) = row {
-        let vert = row.vertical;
-        let mut size = UVec2::ZERO;
-
-        let children = if let Some(children) = children {
-            &**children
-        } else {
-            &[]
-        };
-
-        *dim_mut(&mut size, vert) += children.len().saturating_sub(1) as u32 * row.space_between;
-
-        for &entry in children {
-            let min_size = calc_min_size(entry, uis.as_readonly(), typefaces, sprites);
-
-            *dim_mut(&mut size, vert) += dim(min_size, vert);
-
-            let cross_size = dim(min_size, !vert);
-            if cross_size > dim(size, !vert) {
-                *dim_mut(&mut size, !vert) = cross_size;
-            }
-        }
-
-        return size;
-    }
-
-    if let Some((grid, children)) = grid {
-        let mut column_widths = vec![0; grid.width as usize];
-        let children = if let Some(children) = children {
-            &**children
-        } else {
-            &[]
-        };
-        let mut height = (children.len() as u32)
-            .div_ceil(grid.width)
-            .saturating_sub(1)
-            * grid.rows.space_between;
-
-        for row in children.chunks(grid.width as usize) {
-            let mut row_height = 0;
-
-            for (column, &entry) in row.iter().enumerate() {
-                let size = calc_min_size(entry, uis.as_readonly(), typefaces, sprites);
-
-                if size.x > column_widths[column] {
-                    column_widths[column] = size.x;
-                }
-
-                if size.y > row_height {
-                    row_height = size.y;
-                }
-            }
-
-            height += row_height;
-        }
-
-        return uvec2(
-            column_widths.into_iter().sum::<u32>()
-                + grid.width.saturating_sub(1) * grid.columns.space_between,
-            height,
-        );
-    }
-
-    if let Some((_, children)) = stack {
-        let mut size = UVec2::ZERO;
-
-        for &entry in children.iter().flat_map(|children| &***children) {
-            size = size.max(calc_min_size(entry, uis.as_readonly(), typefaces, sprites));
-        }
-
-        return size;
-    }
-
-    if let Some((scroll, _, _)) = rect {
-        let Some((scroll, children)) = scroll else {
-            return UVec2::ZERO;
-        };
-
-        let mut children = children.iter();
-
-        let (mut size, bar_size) = if let Some(content) = children.next() {
-            (
-                calc_min_size(content, uis.as_readonly(), typefaces, sprites),
-                if let Some(bar) = children.next() {
-                    calc_min_size(bar, uis.as_readonly(), typefaces, sprites).max(
-                        if let Some(bar_bg) = children.next() {
-                            calc_min_size(bar_bg, uis.as_readonly(), typefaces, sprites)
-                        } else {
-                            UVec2::ZERO
-                        },
-                    )
-                } else {
-                    UVec2::ZERO
-                },
-            )
-        } else {
-            default()
-        };
-
-        if children.next().is_some() {
-            warn!("`PxScroll` has more than 3 children");
-        }
-
-        let horz = scroll.horizontal;
-
-        *dim_mut(&mut size, horz) += dim(bar_size, horz);
-        let bar_main = dim(bar_size, !horz);
-        if bar_main > dim(size, !horz) {
-            *dim_mut(&mut size, !horz) = bar_main;
-        }
-
-        return size;
-    }
-
-    if let Some(sprite) = sprite {
-        return if let Some(sprite) = sprites.get(&**sprite) {
-            sprite.frame_size()
-        } else {
-            UVec2::ZERO
-        };
-    }
-
-    if let Some(text) = text {
-        let Some(typeface) = typefaces.get(&text.typeface) else {
-            return UVec2::ZERO;
-        };
-
-        return uvec2(
-            text.value
-                .chars()
-                .map(|char| {
-                    if let Some(char) = typeface.characters.get(&char) {
-                        char.frame_size().x + 1
-                    } else if let Some(separator) = typeface.separators.get(&char) {
-                        separator.width
-                    } else {
-                        error!(r#"character "{char}" in text isn't in typeface"#);
-                        0
-                    }
-                })
-                .sum::<u32>()
-                .saturating_sub(1),
-            typeface.height,
-        );
-    }
-
-    unreachable!()
-}
-
-fn layout_inner<L: PxLayer>(
-    target_rect: IRect,
-    target_layer: &L,
-    target_canvas: PxCanvas,
-    ui: Entity,
-    mut uis: Query<(
-        AnyOf<(
-            (&PxMinSize, Option<&Children>),
-            (&PxMargin, Option<&Children>),
-            (&PxRow, Option<&Children>),
-            (&PxGrid, Option<&Children>),
-            (&PxStack, Option<&Children>),
-            (
-                Option<(&mut PxScroll, &Children)>,
-                &mut PxRect,
-                &mut PxFilterLayers<L>,
-            ),
-            &PxSprite,
-            &mut PxText,
-        )>,
-        Option<&mut L>,
-        Option<(&mut PxPosition, &mut PxCanvas)>,
-    )>,
-    row_slots: Query<&PxRowSlot>,
-    typefaces: &Assets<PxTypeface>,
-    sprites: &Assets<PxSpriteAsset>,
-) -> Result<Option<L>> {
-    let Ok(((min_size, margin, row, grid, stack, rect, sprite, text), _, _)) = uis.get(ui) else {
-        return Ok(None);
-    };
-
-    if let Some((_, children)) = min_size {
-        return match children.map(|children| &**children) {
-            None | Some([]) => Ok(None),
-            Some(&[content]) => layout_inner(
-                target_rect,
-                target_layer,
-                target_canvas,
-                content,
-                uis,
-                row_slots,
-                typefaces,
-                sprites,
-            ),
-            Some([_, _, ..]) => {
-                warn!("`PxMinSize` has multiple children");
-                Ok(None)
-            }
-        };
-    }
-
-    if let Some((margin, children)) = margin {
-        return match children.map(|children| &**children) {
-            None | Some([]) => Ok(None),
-            Some(&[content]) => layout_inner(
-                IRect {
-                    min: target_rect.min + **margin as i32,
-                    max: target_rect.max - **margin as i32,
-                },
-                target_layer,
-                target_canvas,
-                content,
-                uis,
-                row_slots,
-                typefaces,
-                sprites,
-            ),
-            Some([_, _, ..]) => {
-                warn!("`PxMargin` has multiple children");
-                Ok(None)
-            }
-        };
-    }
-
-    fn dim(vec: IVec2, y: bool) -> i32 {
-        if y { vec.y } else { vec.x }
-    }
-
-    // Adds to x, subtracts from y
-    fn add(augend: i32, addend: i32, y: bool) -> i32 {
-        if y { augend - addend } else { augend + addend }
-    }
-
-    fn rect_size(rect: IRect, y: bool) -> i32 {
-        if y { rect.height() } else { rect.width() }
-    }
-
-    if let Some((row, children)) = row {
-        let row = row.clone();
-        let children = children
-            .iter()
-            .flat_map(|children| &**children)
-            .copied()
-            .collect::<Vec<_>>();
-
-        fn dim_mut(vec: &mut IVec2, y: bool) -> &mut i32 {
-            if y { &mut vec.y } else { &mut vec.x }
-        }
-
-        let vert = row.vertical;
-        let mut pos = ivec2(target_rect.min.x, target_rect.max.y);
-        let mut remaining_stretchers = children
-            .iter()
-            .map(|&entry| row_slots.get(entry).cloned().unwrap_or_default())
-            .filter(|slot| slot.stretch)
-            .count() as i32;
-        let mut stretch_budget = rect_size(target_rect, vert)
-            - dim(
-                calc_min_size(ui, uis.as_readonly(), typefaces, sprites).as_ivec2(),
-                vert,
-            );
-        let fill_size = rect_size(target_rect, !vert);
-
-        let mut layer = None::<L>;
-
-        for &child in &children {
-            let slot = row_slots.get(child).cloned().unwrap_or_default();
-            let mut size = calc_min_size(child, uis.as_readonly(), typefaces, sprites).as_ivec2();
-            if slot.stretch {
-                // For simplicity, we just split the extra size among the stretched entries evenly
-                // instead of prioritizing the smallest. I might change this in the future.
-                let extra_size = stretch_budget / remaining_stretchers;
-                *dim_mut(&mut size, vert) += extra_size;
-                stretch_budget -= extra_size;
-                remaining_stretchers -= 1;
-            }
-
-            // if entry.fill {
-            *dim_mut(&mut size, !vert) = fill_size;
-            // }
-
-            let entry_layer = if let Some(ref layer) = layer {
-                layer.clone().next().unwrap_or(layer.clone())
-            } else {
-                target_layer.clone()
-            };
-
-            // Improvements to the layouting could make it so that most things can share layers
-            if let Some(last_layer) = layout_inner(
-                IRect {
-                    min: ivec2(pos.x, pos.y - size.y),
-                    max: ivec2(pos.x + size.x, pos.y),
-                },
-                &entry_layer,
-                target_canvas,
-                child,
-                uis.reborrow(),
-                row_slots.as_readonly(),
-                typefaces,
-                sprites,
-            )? {
-                layer = Some(last_layer);
-            }
-
-            *dim_mut(&mut pos, vert) = add(
-                dim(pos, vert),
-                dim(size, vert) + row.space_between as i32,
-                vert,
-            );
-        }
-
-        return Ok(layer);
-    }
-
-    if let Some((grid, children)) = grid {
-        let grid = grid.clone();
-        let children = children
-            .iter()
-            .flat_map(|children| &**children)
-            .copied()
-            .collect::<Vec<_>>();
-
-        let mut column_widths = vec![0; grid.width as usize];
-        let mut row_heights = vec![0; children.len().div_ceil(grid.width as usize)];
-
-        for (row_index, row) in children.chunks(grid.width as usize).enumerate() {
-            for (column, &entry) in row.iter().enumerate() {
-                let size = calc_min_size(entry, uis.as_readonly(), typefaces, sprites).as_ivec2();
-
-                if size.x > column_widths[column] {
-                    column_widths[column] = size.x;
-                }
-
-                if size.y > row_heights[row_index] {
-                    row_heights[row_index] = size.y;
-                }
-            }
-        }
-
-        let min_size = calc_min_size(ui, uis.as_readonly(), typefaces, sprites).as_ivec2();
-
-        let mut remaining_stretching_rows =
-            grid.rows.rows.iter().filter(|row| row.stretch).count() as i32;
-        let mut row_stretch_budget = target_rect.height() - min_size.y;
-
-        for (index, row) in grid.rows.rows.iter().enumerate() {
-            if index >= row_heights.len() {
-                continue;
-            }
-
-            if row.stretch {
-                let extra_size = row_stretch_budget / remaining_stretching_rows;
-                row_heights[index] += extra_size;
-                row_stretch_budget -= extra_size;
-                remaining_stretching_rows -= 1;
-            }
-        }
-
-        let mut remaining_stretching_columns = grid
-            .columns
-            .rows
-            .iter()
-            .filter(|column| column.stretch)
-            .count() as i32;
-        let mut column_stretch_budget = target_rect.width() - min_size.x;
-
-        for (index, column) in grid.columns.rows.iter().enumerate() {
-            if index >= column_widths.len() {
-                continue;
-            }
-
-            if column.stretch {
-                let extra_size = column_stretch_budget / remaining_stretching_columns;
-                column_widths[index] += extra_size;
-                column_stretch_budget -= extra_size;
-                remaining_stretching_columns -= 1;
-            }
-        }
-
-        let mut y_pos = target_rect.max.y;
-
-        let mut layer = None::<L>;
-
-        for (row_index, row) in children.chunks(grid.width as usize).enumerate() {
-            let mut x_pos = target_rect.min.x;
-            let height = row_heights[row_index];
-
-            for (column, &entry) in row.iter().enumerate() {
-                let width = column_widths[column];
-
-                let entry_layer = if let Some(ref layer) = layer {
-                    layer.clone().next().unwrap_or(layer.clone())
-                } else {
-                    target_layer.clone()
-                };
-
-                if let Some(last_layer) = layout_inner(
-                    IRect {
-                        min: ivec2(x_pos, y_pos - height),
-                        max: ivec2(x_pos + width, y_pos),
-                    },
-                    &entry_layer,
-                    target_canvas,
-                    entry,
-                    uis.reborrow(),
-                    row_slots.as_readonly(),
-                    typefaces,
-                    sprites,
-                )? {
-                    layer = Some(last_layer);
-                };
-
-                x_pos += width + grid.columns.space_between as i32;
-            }
-
-            y_pos -= height + grid.columns.space_between as i32;
-        }
-
-        return Ok(layer);
-    }
-
-    if let Some((_, children)) = stack {
-        let children = children
-            .iter()
-            .flat_map(|children| &**children)
-            .copied()
-            .collect::<Vec<_>>();
-
-        let mut layer = None::<L>;
-
-        for &entry in &children {
-            let entry_layer = if let Some(ref layer) = layer {
-                layer.clone().next().unwrap_or(layer.clone())
-            } else {
-                target_layer.clone()
-            };
-
-            if let Some(last_layer) = layout_inner(
-                target_rect,
-                &entry_layer,
-                target_canvas,
-                entry,
-                uis.reborrow(),
-                row_slots.as_readonly(),
-                typefaces,
-                sprites,
-            )? {
-                layer = Some(last_layer);
-            };
-        }
-
-        return Ok(layer);
-    }
-
-    if rect.is_some() {
-        let ((_, _, _, _, _, rect, _, _), _, mut pos) = uis.get_mut(ui).unwrap();
-
-        if let Some((_, ref mut canvas)) = pos {
-            **canvas = target_canvas;
-        }
-
-        let (scroll, mut rect, mut layers) = rect.unwrap();
-
-        if let Some((scroll, children)) = scroll {
-            fn rect_start(rect: IRect, y: bool) -> i32 {
-                if y { rect.max.y } else { rect.min.x }
-            }
-
-            fn rect_start_mut(rect: &mut IRect, y: bool) -> &mut i32 {
-                if y { &mut rect.max.y } else { &mut rect.min.x }
-            }
-
-            fn rect_end(rect: IRect, y: bool) -> i32 {
-                if y { rect.min.y } else { rect.max.x }
-            }
-
-            fn rect_end_mut(rect: &mut IRect, y: bool) -> &mut i32 {
-                if y { &mut rect.min.y } else { &mut rect.max.x }
-            }
-
-            let scroll = *scroll;
-            let content = children[0];
-            let bar = children.get(1).copied();
-            let bg = children.get(2).copied();
-            if children.get(3).is_some() {
-                warn!("`PxScroll` has more than 3 children");
-                return Ok(None);
-            }
-            let horz = scroll.horizontal;
-
-            let content_min_size =
-                calc_min_size(content, uis.as_readonly(), typefaces, sprites).as_ivec2();
-
-            let bar_min_size = if let Some(bar) = bar {
-                calc_min_size(bar, uis.as_readonly(), typefaces, sprites).max(
-                    if let Some(bg) = bg {
-                        calc_min_size(bg, uis.as_readonly(), typefaces, sprites)
-                    } else {
-                        UVec2::ZERO
-                    },
-                )
-            } else {
-                UVec2::ZERO
-            }
-            .as_ivec2();
-
-            let mut view_rect = target_rect;
-            *rect_end_mut(&mut view_rect, horz) =
-                add(rect_end(view_rect, horz), -dim(bar_min_size, horz), horz);
-
-            let ((_, _, _, _, _, rect, _, _), _, pos) = uis.get_mut(ui).unwrap();
-            let (_, mut rect, _) = rect.unwrap();
-            **rect = view_rect.size().as_uvec2();
-            if let Some((mut pos, _)) = pos {
-                **pos = view_rect.center();
-            }
-
-            let mut content_rect = view_rect;
-            *rect_start_mut(&mut content_rect, !horz) = add(
-                rect_start(content_rect, !horz),
-                -(scroll.scroll as i32),
-                !horz,
-            );
-            *rect_end_mut(&mut content_rect, !horz) = add(
-                rect_start(content_rect, !horz),
-                dim(content_min_size, !horz),
-                !horz,
-            );
-
-            let mut layer = None;
-
-            // TODO Need to make containers with multiple entries put entries beyond the first on
-            // different layers
-            let last_content_layer = layout_inner(
-                content_rect,
-                target_layer,
-                target_canvas,
-                content,
-                uis.reborrow(),
-                row_slots.as_readonly(),
-                typefaces,
-                sprites,
-            )?;
-
-            let ((_, _, _, _, _, rect, _, _), _, _) = uis.get_mut(ui).unwrap();
-            let (_, _, mut layers) = rect.unwrap();
-
-            let bg_layer;
-            (*layers, bg_layer) = if let Some(last_content_layer) = last_content_layer {
-                layer = Some(last_content_layer.clone());
-
-                (
-                    PxFilterLayers::Range(target_layer.clone()..=last_content_layer.clone()),
-                    last_content_layer
-                        .clone()
-                        .next()
-                        .unwrap_or(last_content_layer),
-                )
-            } else {
-                (PxFilterLayers::Many(Vec::new()), target_layer.clone())
-            };
-
-            let mut bar_rect = target_rect;
-            *rect_start_mut(&mut bar_rect, horz) = rect_end(view_rect, horz);
-
-            let last_bg_layer = bg
-                .map(|bg| {
-                    layout_inner(
-                        bar_rect,
-                        &bg_layer,
-                        target_canvas,
-                        bg,
-                        uis.reborrow(),
-                        row_slots.as_readonly(),
-                        typefaces,
-                        sprites,
-                    )
-                })
-                .transpose()?
-                .flatten();
-            let bar_layer = if let Some(last_bg_layer) = last_bg_layer {
-                layer = Some(last_bg_layer.clone());
-                last_bg_layer.clone().next().unwrap_or(last_bg_layer)
-            } else {
-                bg_layer.clone()
-            };
-
-            let content_size = rect_size(content_rect, !horz);
-            let view_size = rect_size(view_rect, !horz);
-            let ratio = if content_size == 0 {
-                0.
-            } else {
-                view_size as f32 / content_size as f32
-            };
-            *rect_start_mut(&mut bar_rect, !horz) = add(
-                rect_start(view_rect, !horz),
-                (scroll.scroll as f32 * ratio) as i32,
-                !horz,
-            );
-            *rect_end_mut(&mut bar_rect, !horz) = add(
-                rect_start(view_rect, !horz),
-                ((view_size + scroll.scroll as i32) as f32 * ratio) as i32,
-                !horz,
-            );
-
-            let ((_, _, _, _, _, rect, _, _), _, _) = uis.get_mut(ui).unwrap();
-            let (scroll, _, _) = rect.unwrap();
-            let (mut scroll, _) = scroll.unwrap();
-
-            scroll.max_scroll = (view_size as f32 * (1. / ratio - 1.)).ceil() as u32;
-
-            if let Some(last_bar_layer) = bar
-                .map(|bar| {
-                    layout_inner(
-                        bar_rect,
-                        &bar_layer,
-                        target_canvas,
-                        bar,
-                        uis.reborrow(),
-                        row_slots.as_readonly(),
-                        typefaces,
-                        sprites,
-                    )
-                })
-                .transpose()?
-                .flatten()
-            {
-                layer = Some(last_bar_layer);
-            }
-
-            return Ok(layer);
-        } else {
-            if let Some((mut pos, _)) = pos {
-                **pos = target_rect.center();
-            }
-
-            let rect_layer = target_layer.clone();
-            match *layers {
-                PxFilterLayers::Single { ref mut layer, .. } => *layer = rect_layer,
-                PxFilterLayers::Range(ref mut layers) => {
-                    *layers = layers.start().clone()..=rect_layer
-                }
-                ref mut layers @ PxFilterLayers::Many(_) => {
-                    *layers = PxFilterLayers::single_over(rect_layer)
-                }
-            }
-
-            **rect = target_rect.size().as_uvec2();
-
-            return Ok(Some(target_layer.clone()));
-        }
-    }
-
-    if sprite.is_some() {
-        let (_, layer, pos) = uis.get_mut(ui).unwrap();
-
-        if let Some((mut pos, mut canvas)) = pos {
-            **pos = target_rect.center();
-            *canvas = target_canvas;
-        }
-
-        if let Some(mut layer) = layer {
-            *layer = target_layer.clone();
-        }
-
-        return Ok(Some(target_layer.clone()));
-    }
-
-    if text.is_some() {
-        let ((_, _, _, _, _, _, _, text), layer, pos) = uis.get_mut(ui).unwrap();
-
-        if let Some(mut layer) = layer {
-            *layer = target_layer.clone();
-        }
-
-        let Some((mut pos, mut canvas)) = pos else {
-            return Ok(Some(target_layer.clone()));
-        };
-
-        *canvas = target_canvas;
-
-        let mut text = text.unwrap();
-        let PxText {
-            ref mut value,
-            ref typeface,
-            ref mut line_breaks,
-        } = *text;
-
-        let Some(typeface) = typefaces.get(typeface) else {
-            return Ok(Some(target_layer.clone()));
-        };
-
-        line_breaks.clear();
-
-        let max_width = target_rect.width();
-        let mut x = 0;
-        let mut max_x = 0;
-        let mut last_separator = None;
-
-        for (index, char) in value.chars().enumerate() {
-            let index = index as u32;
-
-            if let Some(char) = typeface.characters.get(&char) {
-                let split = x > max_width;
-                if split {
-                    x = 0;
-                    line_breaks.push(last_separator.unwrap_or(index.saturating_sub(1)));
-                    last_separator = None;
-                }
-
-                let width = char.frame_size().x as i32;
-
-                if x != 0 {
-                    x += 1
-                }
-                x += width;
-
-                if x > max_width && !split {
-                    x = width;
-                    line_breaks.push(last_separator.unwrap_or(index.saturating_sub(1)));
-                    last_separator = None;
-                }
-
-                if x > max_x {
-                    max_x = x;
-                }
-            } else if let Some(separator) = typeface.separators.get(&char) {
-                x += separator.width as i32;
-                last_separator = Some(index);
-            } else {
-                error!(r#"character "{char}" in text isn't in typeface"#);
-            }
-        }
-
-        let line_break_count = line_breaks.len() as i32;
-        **pos = ivec2(target_rect.min.x, target_rect.max.y)
-            + ivec2(
-                max_x,
-                -((line_break_count + 1) * typeface.height as i32 + line_break_count),
-            ) / 2;
-
-        return Ok(Some(target_layer.clone()));
-    }
-
-    unreachable!();
-}
-
-fn layout<L: PxLayer>(
-    mut uis: ParamSet<(
-        Query<(&L, &PxCanvas, Entity), With<PxUiRoot>>,
-        Query<(
-            AnyOf<(
-                (&PxMinSize, Option<&Children>),
-                (&PxMargin, Option<&Children>),
-                (&PxRow, Option<&Children>),
-                (&PxGrid, Option<&Children>),
-                (&PxStack, Option<&Children>),
-                (
-                    Option<(&mut PxScroll, &Children)>,
-                    &mut PxRect,
-                    &mut PxFilterLayers<L>,
-                ),
-                &PxSprite,
-                &mut PxText,
-            )>,
-            Option<&mut L>,
-            Option<(&mut PxPosition, &mut PxCanvas)>,
-        )>,
-    )>,
-    row_slots: Query<&PxRowSlot>,
-    typefaces: Res<Assets<PxTypeface>>,
-    sprites: Res<Assets<PxSpriteAsset>>,
-    screen: Res<Screen>,
-) -> Result {
-    for (layer, canvas, root) in uis
-        .p0()
-        .iter()
-        .map(|(layer, &canvas, entity)| (layer.clone(), canvas, entity))
-        .collect::<Vec<_>>()
-    {
-        layout_inner(
-            IRect {
-                min: IVec2::ZERO,
-                max: screen.computed_size.as_ivec2(),
-            },
-            &layer,
-            canvas,
-            root,
-            uis.p1(),
-            row_slots.as_readonly(),
-            &typefaces,
-            &sprites,
-        )?;
-    }
-
-    OK
-}
diff --git a/src/ui/input.rs b/src/ui/input.rs
new file mode 100644
index 0000000..e913b74
--- /dev/null
+++ b/src/ui/input.rs
@@ -0,0 +1,282 @@
+use std::time::Duration;
+
+use bevy_ecs::system::SystemId;
+#[cfg(feature = "headed")]
+use bevy_input::{
+    ButtonState,
+    keyboard::{Key, KeyboardInput, NativeKey},
+    mouse::MouseWheel,
+};
+#[cfg(feature = "headed")]
+use bevy_input_focus::InputFocus;
+
+use crate::{blink::Blink, prelude::*};
+
+use super::widgets::PxScroll;
+
+// TODO Should be modular
+#[cfg(feature = "headed")]
+pub(crate) fn scroll(mut scrolls: Query<&mut PxScroll>, mut wheels: MessageReader<MouseWheel>) {
+    for wheel in wheels.read() {
+        for mut scroll in &mut scrolls {
+            scroll.scroll = scroll
+                .scroll
+                .saturating_add_signed(-wheel.y as i32)
+                .min(scroll.max_scroll);
+        }
+    }
+}
+
+/// Field that captures a single key and renders its label.
+#[derive(Component, Reflect)]
+#[require(PxText)]
+#[reflect(from_reflect = false)]
+pub struct PxKeyField {
+    /// Placeholder/caret character when focused.
+    pub caret: char,
+    /// System that creates the text label
+    ///
+    /// Ideally, this would accept a Bevy `Key`, but there doesn't seem to be a way to convert a
+    /// winit `PhysicalKey` to a winit `Key`, so it wouldn't be possible to run this when building
+    /// the UI (ie in `PxUiBuilder::dyn_insert_into`) or update all the text if the keyboard layout
+    /// changes.
+    #[reflect(ignore)]
+    pub key_to_str: SystemId<In<KeyCode>, String>,
+    /// Last displayed value when unfocused.
+    pub cached_text: String,
+}
+
+#[cfg(feature = "headed")]
+pub(crate) fn update_key_field_focus(
+    mut prev_focus: Local<Option<Entity>>,
+    mut fields: Query<(&PxKeyField, &mut PxText, &mut Visibility, Entity)>,
+    focus: Res<InputFocus>,
+    mut cmd: Commands,
+) {
+    let focus = focus.get();
+
+    if *prev_focus == focus {
+        return;
+    }
+
+    if let Some(prev_focus) = *prev_focus
+        && let Ok((field, mut text, mut visibility, id)) = fields.get_mut(prev_focus)
+    {
+        text.value = field.cached_text.clone();
+        *visibility = Visibility::Inherited;
+        cmd.entity(id).remove::<Blink>();
+    }
+
+    if let Some(focus) = focus
+        && let Ok((field, mut text, _, id)) = fields.get_mut(focus)
+    {
+        text.value = field.caret.to_string();
+        cmd.entity(id)
+            .try_insert(Blink::new(Duration::from_millis(500)));
+    }
+
+    *prev_focus = focus;
+}
+
+/// Emitted when a [`PxKeyField`] captures a key press.
+#[derive(EntityEvent)]
+pub struct PxKeyFieldUpdate {
+    /// Target field entity.
+    pub entity: Entity,
+    /// Captured key.
+    pub key: KeyCode,
+}
+
+// TODO Should be modular
+#[cfg(feature = "headed")]
+pub(crate) fn update_key_fields(
+    mut fields: Query<Entity, With<PxKeyField>>,
+    mut focus: ResMut<InputFocus>,
+    mut keys: MessageReader<KeyboardInput>,
+    mut cmd: Commands,
+) {
+    let mut keys = keys.read();
+    let key = keys.find(|key| matches!(key.state, ButtonState::Pressed));
+    keys.last();
+    let Some(key) = key else {
+        return;
+    };
+
+    let Some(focus_id) = focus.get() else {
+        return;
+    };
+
+    let Ok(field_id) = fields.get_mut(focus_id) else {
+        return;
+    };
+
+    let key = key.key_code;
+
+    cmd.queue(move |world: &mut World| {
+        let Some(field) = world.get::<PxKeyField>(field_id) else {
+            return;
+        };
+
+        let key = match world.run_system_with(field.key_to_str, key) {
+            Ok(key) => key,
+            Err(err) => {
+                error!("couldn't get text for pressed key for key field: {err}");
+                return;
+            }
+        };
+
+        if let Some(mut field) = world.get_mut::<PxKeyField>(field_id) {
+            field.cached_text = key.clone();
+        }
+
+        if let Some(mut text) = world.get_mut::<PxText>(field_id) {
+            text.value = key;
+        };
+    });
+
+    cmd.trigger(PxKeyFieldUpdate {
+        entity: field_id,
+        key,
+    });
+
+    focus.clear();
+}
+
+/// Caret blink state for text fields.
+#[derive(Reflect)]
+pub struct PxCaret {
+    /// Whether the caret is currently visible.
+    pub state: bool,
+    /// Blink timer.
+    pub timer: Timer,
+}
+
+impl Default for PxCaret {
+    fn default() -> Self {
+        Self {
+            state: true,
+            timer: Timer::new(Duration::from_millis(500), TimerMode::Repeating),
+        }
+    }
+}
+
+/// Editable text field with an optional blinking caret.
+#[derive(Component, Reflect)]
+#[require(PxText)]
+pub struct PxTextField {
+    /// Cached text without the caret character.
+    pub cached_text: String,
+    /// Character used as the caret.
+    pub caret_char: char,
+    /// Active caret state if focused.
+    pub caret: Option<PxCaret>,
+}
+
+#[cfg(feature = "headed")]
+pub(crate) fn update_text_field_focus(
+    mut prev_focus: Local<Option<Entity>>,
+    mut fields: Query<(&mut PxTextField, &mut PxText)>,
+    focus: Res<InputFocus>,
+) {
+    let focus = focus.get();
+
+    if *prev_focus == focus {
+        return;
+    }
+
+    if let Some(prev_focus) = *prev_focus
+        && let Ok((mut field, mut text)) = fields.get_mut(prev_focus)
+    {
+        text.value = field.cached_text.clone();
+        field.caret = None;
+    }
+
+    if let Some(focus) = focus
+        && let Ok((mut field, mut text)) = fields.get_mut(focus)
+    {
+        field.cached_text = text.value.clone();
+        text.value += &field.caret_char.to_string();
+        field.caret = Some(default());
+    }
+
+    *prev_focus = focus;
+}
+
+pub(crate) fn caret_blink(mut fields: Query<(&mut PxTextField, &mut PxText)>, time: Res<Time>) {
+    for (mut field, mut text) in &mut fields {
+        let Some(ref mut caret) = field.caret else {
+            continue;
+        };
+
+        caret.timer.tick(time.delta());
+
+        if caret.timer.just_finished() {
+            caret.state ^= true;
+            let state = caret.state;
+
+            text.value = field.cached_text.clone();
+
+            if state {
+                text.value += &field.caret_char.to_string();
+            }
+        }
+    }
+}
+
+/// Emitted when a [`PxTextField`] changes its text.
+#[derive(EntityEvent)]
+pub struct PxTextFieldUpdate {
+    /// Target field entity.
+    pub entity: Entity,
+    /// Updated text content.
+    pub text: String,
+}
+
+// TODO Should be modular
+#[cfg(feature = "headed")]
+pub(crate) fn update_text_fields(
+    mut fields: Query<(&mut PxTextField, &mut PxText)>,
+    focus: Res<InputFocus>,
+    mut keys: MessageReader<KeyboardInput>,
+    mut cmd: Commands,
+) {
+    let keys = keys
+        .read()
+        .filter(|key| matches!(key.state, ButtonState::Pressed))
+        .collect::<Vec<_>>();
+
+    if keys.is_empty() {
+        return;
+    }
+
+    let Some(focus_id) = focus.get() else {
+        return;
+    };
+
+    let Ok((mut field, mut text)) = fields.get_mut(focus_id) else {
+        return;
+    };
+
+    for key in keys {
+        match key.logical_key {
+            Key::Character(ref characters) | Key::Unidentified(NativeKey::Web(ref characters)) => {
+                for character in characters.chars() {
+                    field.cached_text += &character.to_string();
+                }
+            }
+            Key::Space => field.cached_text += " ",
+            Key::Backspace => {
+                field.cached_text.pop();
+            }
+            _ => (),
+        }
+    }
+
+    text.value = field.cached_text.clone() + &field.caret_char.to_string();
+    field.caret = Some(default());
+
+    cmd.trigger(PxTextFieldUpdate {
+        entity: focus_id,
+        text: field.cached_text.clone(),
+    });
+}
diff --git a/src/ui/layout.rs b/src/ui/layout.rs
new file mode 100644
index 0000000..5969e01
--- /dev/null
+++ b/src/ui/layout.rs
@@ -0,0 +1,862 @@
+use crate::{position::Spatial, prelude::*, screen::Screen};
+
+use super::widgets::{PxGrid, PxMargin, PxMinSize, PxRow, PxRowSlot, PxScroll, PxStack};
+
+// If layouting ends up being too slow, make a tree of min sizes up front and lookup in that
+fn calc_min_size<L: PxLayer>(
+    ui: Entity,
+    uis: Query<(
+        AnyOf<(
+            (&PxMinSize, Option<&Children>),
+            (&PxMargin, Option<&Children>),
+            (&PxRow, Option<&Children>),
+            (&PxGrid, Option<&Children>),
+            (&PxStack, Option<&Children>),
+            (Option<(&PxScroll, &Children)>, &PxRect, &PxFilterLayers<L>),
+            &PxSprite,
+            &PxText,
+        )>,
+        Option<&L>,
+        Option<(&PxPosition, &PxCanvas)>,
+    )>,
+    typefaces: &Assets<PxTypeface>,
+    sprites: &Assets<PxSpriteAsset>,
+) -> UVec2 {
+    let Ok(((min_size, margin, row, grid, stack, rect, sprite, text), _, _)) = uis.get(ui) else {
+        // This includes `PxSpace`. Surprise, the `PxSpace` component doesn't do anything at all.
+        // It's just easier to spawn in UI.
+        return UVec2::ZERO;
+    };
+
+    if let Some((min_size, children)) = min_size {
+        return match children.map(|children| &**children) {
+            None | Some([]) => **min_size,
+            Some(&[content]) => {
+                calc_min_size(content, uis.as_readonly(), typefaces, sprites).max(**min_size)
+            }
+            Some([_, _, ..]) => {
+                warn!("`PxMinSize` has multiple children");
+                **min_size
+            }
+        };
+    }
+
+    if let Some((margin, children)) = margin {
+        let margin = 2 * UVec2::splat(**margin);
+
+        return match children.map(|children| &**children) {
+            None | Some([]) => margin,
+            Some(&[content]) => {
+                calc_min_size(content, uis.as_readonly(), typefaces, sprites) + margin
+            }
+            Some([_, _, ..]) => {
+                warn!("`PxMargin` has multiple children");
+                margin
+            }
+        };
+    }
+
+    fn dim(vec: UVec2, y: bool) -> u32 {
+        if y { vec.y } else { vec.x }
+    }
+
+    fn dim_mut(vec: &mut UVec2, y: bool) -> &mut u32 {
+        if y { &mut vec.y } else { &mut vec.x }
+    }
+
+    if let Some((row, children)) = row {
+        let vert = row.vertical;
+        let mut size = UVec2::ZERO;
+
+        let children = if let Some(children) = children {
+            &**children
+        } else {
+            &[]
+        };
+
+        *dim_mut(&mut size, vert) += children.len().saturating_sub(1) as u32 * row.space_between;
+
+        for &entry in children {
+            let min_size = calc_min_size(entry, uis.as_readonly(), typefaces, sprites);
+
+            *dim_mut(&mut size, vert) += dim(min_size, vert);
+
+            let cross_size = dim(min_size, !vert);
+            if cross_size > dim(size, !vert) {
+                *dim_mut(&mut size, !vert) = cross_size;
+            }
+        }
+
+        return size;
+    }
+
+    if let Some((grid, children)) = grid {
+        let mut column_widths = vec![0; grid.width as usize];
+        let children = if let Some(children) = children {
+            &**children
+        } else {
+            &[]
+        };
+        let mut height = (children.len() as u32)
+            .div_ceil(grid.width)
+            .saturating_sub(1)
+            * grid.rows.space_between;
+
+        for row in children.chunks(grid.width as usize) {
+            let mut row_height = 0;
+
+            for (column, &entry) in row.iter().enumerate() {
+                let size = calc_min_size(entry, uis.as_readonly(), typefaces, sprites);
+
+                if size.x > column_widths[column] {
+                    column_widths[column] = size.x;
+                }
+
+                if size.y > row_height {
+                    row_height = size.y;
+                }
+            }
+
+            height += row_height;
+        }
+
+        return uvec2(
+            column_widths.into_iter().sum::<u32>()
+                + grid.width.saturating_sub(1) * grid.columns.space_between,
+            height,
+        );
+    }
+
+    if let Some((_, children)) = stack {
+        let mut size = UVec2::ZERO;
+
+        for &entry in children.iter().flat_map(|children| &***children) {
+            size = size.max(calc_min_size(entry, uis.as_readonly(), typefaces, sprites));
+        }
+
+        return size;
+    }
+
+    if let Some((scroll, _, _)) = rect {
+        let Some((scroll, children)) = scroll else {
+            return UVec2::ZERO;
+        };
+
+        let mut children = children.iter();
+
+        let (mut size, bar_size) = if let Some(content) = children.next() {
+            (
+                calc_min_size(content, uis.as_readonly(), typefaces, sprites),
+                if let Some(bar) = children.next() {
+                    calc_min_size(bar, uis.as_readonly(), typefaces, sprites).max(
+                        if let Some(bar_bg) = children.next() {
+                            calc_min_size(bar_bg, uis.as_readonly(), typefaces, sprites)
+                        } else {
+                            UVec2::ZERO
+                        },
+                    )
+                } else {
+                    UVec2::ZERO
+                },
+            )
+        } else {
+            default()
+        };
+
+        if children.next().is_some() {
+            warn!("`PxScroll` has more than 3 children");
+        }
+
+        let horz = scroll.horizontal;
+
+        *dim_mut(&mut size, horz) += dim(bar_size, horz);
+        let bar_main = dim(bar_size, !horz);
+        if bar_main > dim(size, !horz) {
+            *dim_mut(&mut size, !horz) = bar_main;
+        }
+
+        return size;
+    }
+
+    if let Some(sprite) = sprite {
+        return if let Some(sprite) = sprites.get(&**sprite) {
+            sprite.frame_size()
+        } else {
+            UVec2::ZERO
+        };
+    }
+
+    if let Some(text) = text {
+        let Some(typeface) = typefaces.get(&text.typeface) else {
+            return UVec2::ZERO;
+        };
+
+        return uvec2(
+            text.value
+                .chars()
+                .map(|char| {
+                    if let Some(char) = typeface.characters.get(&char) {
+                        char.frame_size().x + 1
+                    } else if let Some(separator) = typeface.separators.get(&char) {
+                        separator.width
+                    } else {
+                        error!(r#"character "{char}" in text isn't in typeface"#);
+                        0
+                    }
+                })
+                .sum::<u32>()
+                .saturating_sub(1),
+            typeface.height,
+        );
+    }
+
+    unreachable!()
+}
+
+fn layout_inner<L: PxLayer>(
+    target_rect: IRect,
+    target_layer: &L,
+    target_canvas: PxCanvas,
+    ui: Entity,
+    mut uis: Query<(
+        AnyOf<(
+            (&PxMinSize, Option<&Children>),
+            (&PxMargin, Option<&Children>),
+            (&PxRow, Option<&Children>),
+            (&PxGrid, Option<&Children>),
+            (&PxStack, Option<&Children>),
+            (
+                Option<(&mut PxScroll, &Children)>,
+                &mut PxRect,
+                &mut PxFilterLayers<L>,
+            ),
+            &PxSprite,
+            &mut PxText,
+        )>,
+        Option<&mut L>,
+        Option<(&mut PxPosition, &mut PxCanvas)>,
+    )>,
+    row_slots: Query<&PxRowSlot>,
+    typefaces: &Assets<PxTypeface>,
+    sprites: &Assets<PxSpriteAsset>,
+) -> Result<Option<L>> {
+    let Ok(((min_size, margin, row, grid, stack, rect, sprite, text), _, _)) = uis.get(ui) else {
+        return Ok(None);
+    };
+
+    if let Some((_, children)) = min_size {
+        return match children.map(|children| &**children) {
+            None | Some([]) => Ok(None),
+            Some(&[content]) => layout_inner(
+                target_rect,
+                target_layer,
+                target_canvas,
+                content,
+                uis,
+                row_slots,
+                typefaces,
+                sprites,
+            ),
+            Some([_, _, ..]) => {
+                warn!("`PxMinSize` has multiple children");
+                Ok(None)
+            }
+        };
+    }
+
+    if let Some((margin, children)) = margin {
+        return match children.map(|children| &**children) {
+            None | Some([]) => Ok(None),
+            Some(&[content]) => layout_inner(
+                IRect {
+                    min: target_rect.min + **margin as i32,
+                    max: target_rect.max - **margin as i32,
+                },
+                target_layer,
+                target_canvas,
+                content,
+                uis,
+                row_slots,
+                typefaces,
+                sprites,
+            ),
+            Some([_, _, ..]) => {
+                warn!("`PxMargin` has multiple children");
+                Ok(None)
+            }
+        };
+    }
+
+    fn dim(vec: IVec2, y: bool) -> i32 {
+        if y { vec.y } else { vec.x }
+    }
+
+    // Adds to x, subtracts from y
+    fn add(augend: i32, addend: i32, y: bool) -> i32 {
+        if y { augend - addend } else { augend + addend }
+    }
+
+    fn rect_size(rect: IRect, y: bool) -> i32 {
+        if y { rect.height() } else { rect.width() }
+    }
+
+    if let Some((row, children)) = row {
+        let row = row.clone();
+        let children = children
+            .iter()
+            .flat_map(|children| &**children)
+            .copied()
+            .collect::<Vec<_>>();
+
+        fn dim_mut(vec: &mut IVec2, y: bool) -> &mut i32 {
+            if y { &mut vec.y } else { &mut vec.x }
+        }
+
+        let vert = row.vertical;
+        let mut pos = ivec2(target_rect.min.x, target_rect.max.y);
+        let mut remaining_stretchers = children
+            .iter()
+            .map(|&entry| row_slots.get(entry).cloned().unwrap_or_default())
+            .filter(|slot| slot.stretch)
+            .count() as i32;
+        let mut stretch_budget = rect_size(target_rect, vert)
+            - dim(
+                calc_min_size(ui, uis.as_readonly(), typefaces, sprites).as_ivec2(),
+                vert,
+            );
+        let fill_size = rect_size(target_rect, !vert);
+
+        let mut layer = None::<L>;
+
+        for &child in &children {
+            let slot = row_slots.get(child).cloned().unwrap_or_default();
+            let mut size = calc_min_size(child, uis.as_readonly(), typefaces, sprites).as_ivec2();
+            if slot.stretch {
+                // For simplicity, we just split the extra size among the stretched entries evenly
+                // instead of prioritizing the smallest. I might change this in the future.
+                let extra_size = stretch_budget / remaining_stretchers;
+                *dim_mut(&mut size, vert) += extra_size;
+                stretch_budget -= extra_size;
+                remaining_stretchers -= 1;
+            }
+
+            // if entry.fill {
+            *dim_mut(&mut size, !vert) = fill_size;
+            // }
+
+            let entry_layer = if let Some(ref layer) = layer {
+                layer.clone().next().unwrap_or(layer.clone())
+            } else {
+                target_layer.clone()
+            };
+
+            // Improvements to the layouting could make it so that most things can share layers
+            if let Some(last_layer) = layout_inner(
+                IRect {
+                    min: ivec2(pos.x, pos.y - size.y),
+                    max: ivec2(pos.x + size.x, pos.y),
+                },
+                &entry_layer,
+                target_canvas,
+                child,
+                uis.reborrow(),
+                row_slots.as_readonly(),
+                typefaces,
+                sprites,
+            )? {
+                layer = Some(last_layer);
+            }
+
+            *dim_mut(&mut pos, vert) = add(
+                dim(pos, vert),
+                dim(size, vert) + row.space_between as i32,
+                vert,
+            );
+        }
+
+        return Ok(layer);
+    }
+
+    if let Some((grid, children)) = grid {
+        let grid = grid.clone();
+        let children = children
+            .iter()
+            .flat_map(|children| &**children)
+            .copied()
+            .collect::<Vec<_>>();
+
+        let mut column_widths = vec![0; grid.width as usize];
+        let mut row_heights = vec![0; children.len().div_ceil(grid.width as usize)];
+
+        for (row_index, row) in children.chunks(grid.width as usize).enumerate() {
+            for (column, &entry) in row.iter().enumerate() {
+                let size = calc_min_size(entry, uis.as_readonly(), typefaces, sprites).as_ivec2();
+
+                if size.x > column_widths[column] {
+                    column_widths[column] = size.x;
+                }
+
+                if size.y > row_heights[row_index] {
+                    row_heights[row_index] = size.y;
+                }
+            }
+        }
+
+        let min_size = calc_min_size(ui, uis.as_readonly(), typefaces, sprites).as_ivec2();
+
+        let mut remaining_stretching_rows =
+            grid.rows.rows.iter().filter(|row| row.stretch).count() as i32;
+        let mut row_stretch_budget = target_rect.height() - min_size.y;
+
+        for (index, row) in grid.rows.rows.iter().enumerate() {
+            if index >= row_heights.len() {
+                continue;
+            }
+
+            if row.stretch {
+                let extra_size = row_stretch_budget / remaining_stretching_rows;
+                row_heights[index] += extra_size;
+                row_stretch_budget -= extra_size;
+                remaining_stretching_rows -= 1;
+            }
+        }
+
+        let mut remaining_stretching_columns = grid
+            .columns
+            .rows
+            .iter()
+            .filter(|column| column.stretch)
+            .count() as i32;
+        let mut column_stretch_budget = target_rect.width() - min_size.x;
+
+        for (index, column) in grid.columns.rows.iter().enumerate() {
+            if index >= column_widths.len() {
+                continue;
+            }
+
+            if column.stretch {
+                let extra_size = column_stretch_budget / remaining_stretching_columns;
+                column_widths[index] += extra_size;
+                column_stretch_budget -= extra_size;
+                remaining_stretching_columns -= 1;
+            }
+        }
+
+        let mut y_pos = target_rect.max.y;
+
+        let mut layer = None::<L>;
+
+        for (row_index, row) in children.chunks(grid.width as usize).enumerate() {
+            let mut x_pos = target_rect.min.x;
+            let height = row_heights[row_index];
+
+            for (column, &entry) in row.iter().enumerate() {
+                let width = column_widths[column];
+
+                let entry_layer = if let Some(ref layer) = layer {
+                    layer.clone().next().unwrap_or(layer.clone())
+                } else {
+                    target_layer.clone()
+                };
+
+                if let Some(last_layer) = layout_inner(
+                    IRect {
+                        min: ivec2(x_pos, y_pos - height),
+                        max: ivec2(x_pos + width, y_pos),
+                    },
+                    &entry_layer,
+                    target_canvas,
+                    entry,
+                    uis.reborrow(),
+                    row_slots.as_readonly(),
+                    typefaces,
+                    sprites,
+                )? {
+                    layer = Some(last_layer);
+                };
+
+                x_pos += width + grid.columns.space_between as i32;
+            }
+
+            y_pos -= height + grid.columns.space_between as i32;
+        }
+
+        return Ok(layer);
+    }
+
+    if let Some((_, children)) = stack {
+        let children = children
+            .iter()
+            .flat_map(|children| &**children)
+            .copied()
+            .collect::<Vec<_>>();
+
+        let mut layer = None::<L>;
+
+        for &entry in &children {
+            let entry_layer = if let Some(ref layer) = layer {
+                layer.clone().next().unwrap_or(layer.clone())
+            } else {
+                target_layer.clone()
+            };
+
+            if let Some(last_layer) = layout_inner(
+                target_rect,
+                &entry_layer,
+                target_canvas,
+                entry,
+                uis.reborrow(),
+                row_slots.as_readonly(),
+                typefaces,
+                sprites,
+            )? {
+                layer = Some(last_layer);
+            };
+        }
+
+        return Ok(layer);
+    }
+
+    if rect.is_some() {
+        let ((_, _, _, _, _, rect, _, _), _, mut pos) = uis.get_mut(ui).unwrap();
+
+        if let Some((_, ref mut canvas)) = pos {
+            **canvas = target_canvas;
+        }
+
+        let (scroll, mut rect, mut layers) = rect.unwrap();
+
+        if let Some((scroll, children)) = scroll {
+            fn rect_start(rect: IRect, y: bool) -> i32 {
+                if y { rect.max.y } else { rect.min.x }
+            }
+
+            fn rect_start_mut(rect: &mut IRect, y: bool) -> &mut i32 {
+                if y { &mut rect.max.y } else { &mut rect.min.x }
+            }
+
+            fn rect_end(rect: IRect, y: bool) -> i32 {
+                if y { rect.min.y } else { rect.max.x }
+            }
+
+            fn rect_end_mut(rect: &mut IRect, y: bool) -> &mut i32 {
+                if y { &mut rect.min.y } else { &mut rect.max.x }
+            }
+
+            let scroll = *scroll;
+            let content = children[0];
+            let bar = children.get(1).copied();
+            let bg = children.get(2).copied();
+            if children.get(3).is_some() {
+                warn!("`PxScroll` has more than 3 children");
+                return Ok(None);
+            }
+            let horz = scroll.horizontal;
+
+            let content_min_size =
+                calc_min_size(content, uis.as_readonly(), typefaces, sprites).as_ivec2();
+
+            let bar_min_size = if let Some(bar) = bar {
+                calc_min_size(bar, uis.as_readonly(), typefaces, sprites).max(
+                    if let Some(bg) = bg {
+                        calc_min_size(bg, uis.as_readonly(), typefaces, sprites)
+                    } else {
+                        UVec2::ZERO
+                    },
+                )
+            } else {
+                UVec2::ZERO
+            }
+            .as_ivec2();
+
+            let mut view_rect = target_rect;
+            *rect_end_mut(&mut view_rect, horz) =
+                add(rect_end(view_rect, horz), -dim(bar_min_size, horz), horz);
+
+            let ((_, _, _, _, _, rect, _, _), _, pos) = uis.get_mut(ui).unwrap();
+            let (_, mut rect, _) = rect.unwrap();
+            **rect = view_rect.size().as_uvec2();
+            if let Some((mut pos, _)) = pos {
+                **pos = view_rect.center();
+            }
+
+            let mut content_rect = view_rect;
+            *rect_start_mut(&mut content_rect, !horz) = add(
+                rect_start(content_rect, !horz),
+                -(scroll.scroll as i32),
+                !horz,
+            );
+            *rect_end_mut(&mut content_rect, !horz) = add(
+                rect_start(content_rect, !horz),
+                dim(content_min_size, !horz),
+                !horz,
+            );
+
+            let mut layer = None;
+
+            // TODO Need to make containers with multiple entries put entries beyond the first on
+            // different layers
+            let last_content_layer = layout_inner(
+                content_rect,
+                target_layer,
+                target_canvas,
+                content,
+                uis.reborrow(),
+                row_slots.as_readonly(),
+                typefaces,
+                sprites,
+            )?;
+
+            let ((_, _, _, _, _, rect, _, _), _, _) = uis.get_mut(ui).unwrap();
+            let (_, _, mut layers) = rect.unwrap();
+
+            let bg_layer;
+            (*layers, bg_layer) = if let Some(last_content_layer) = last_content_layer {
+                layer = Some(last_content_layer.clone());
+
+                (
+                    PxFilterLayers::Range(target_layer.clone()..=last_content_layer.clone()),
+                    last_content_layer
+                        .clone()
+                        .next()
+                        .unwrap_or(last_content_layer),
+                )
+            } else {
+                (PxFilterLayers::Many(Vec::new()), target_layer.clone())
+            };
+
+            let mut bar_rect = target_rect;
+            *rect_start_mut(&mut bar_rect, horz) = rect_end(view_rect, horz);
+
+            let last_bg_layer = bg
+                .map(|bg| {
+                    layout_inner(
+                        bar_rect,
+                        &bg_layer,
+                        target_canvas,
+                        bg,
+                        uis.reborrow(),
+                        row_slots.as_readonly(),
+                        typefaces,
+                        sprites,
+                    )
+                })
+                .transpose()?
+                .flatten();
+            let bar_layer = if let Some(last_bg_layer) = last_bg_layer {
+                layer = Some(last_bg_layer.clone());
+                last_bg_layer.clone().next().unwrap_or(last_bg_layer)
+            } else {
+                bg_layer.clone()
+            };
+
+            let content_size = rect_size(content_rect, !horz);
+            let view_size = rect_size(view_rect, !horz);
+            let ratio = if content_size == 0 {
+                0.
+            } else {
+                view_size as f32 / content_size as f32
+            };
+            *rect_start_mut(&mut bar_rect, !horz) = add(
+                rect_start(view_rect, !horz),
+                (scroll.scroll as f32 * ratio) as i32,
+                !horz,
+            );
+            *rect_end_mut(&mut bar_rect, !horz) = add(
+                rect_start(view_rect, !horz),
+                ((view_size + scroll.scroll as i32) as f32 * ratio) as i32,
+                !horz,
+            );
+
+            let ((_, _, _, _, _, rect, _, _), _, _) = uis.get_mut(ui).unwrap();
+            let (scroll, _, _) = rect.unwrap();
+            let (mut scroll, _) = scroll.unwrap();
+
+            scroll.max_scroll = (view_size as f32 * (1. / ratio - 1.)).ceil() as u32;
+
+            if let Some(last_bar_layer) = bar
+                .map(|bar| {
+                    layout_inner(
+                        bar_rect,
+                        &bar_layer,
+                        target_canvas,
+                        bar,
+                        uis.reborrow(),
+                        row_slots.as_readonly(),
+                        typefaces,
+                        sprites,
+                    )
+                })
+                .transpose()?
+                .flatten()
+            {
+                layer = Some(last_bar_layer);
+            }
+
+            return Ok(layer);
+        } else {
+            if let Some((mut pos, _)) = pos {
+                **pos = target_rect.center();
+            }
+
+            let rect_layer = target_layer.clone();
+            match *layers {
+                PxFilterLayers::Single { ref mut layer, .. } => *layer = rect_layer,
+                PxFilterLayers::Range(ref mut layers) => {
+                    *layers = layers.start().clone()..=rect_layer
+                }
+                ref mut layers @ PxFilterLayers::Many(_) => {
+                    *layers = PxFilterLayers::single_over(rect_layer)
+                }
+            }
+
+            **rect = target_rect.size().as_uvec2();
+
+            return Ok(Some(target_layer.clone()));
+        }
+    }
+
+    if sprite.is_some() {
+        let (_, layer, pos) = uis.get_mut(ui).unwrap();
+
+        if let Some((mut pos, mut canvas)) = pos {
+            **pos = target_rect.center();
+            *canvas = target_canvas;
+        }
+
+        if let Some(mut layer) = layer {
+            *layer = target_layer.clone();
+        }
+
+        return Ok(Some(target_layer.clone()));
+    }
+
+    if text.is_some() {
+        let ((_, _, _, _, _, _, _, text), layer, pos) = uis.get_mut(ui).unwrap();
+
+        if let Some(mut layer) = layer {
+            *layer = target_layer.clone();
+        }
+
+        let Some((mut pos, mut canvas)) = pos else {
+            return Ok(Some(target_layer.clone()));
+        };
+
+        *canvas = target_canvas;
+
+        let mut text = text.unwrap();
+        let PxText {
+            ref mut value,
+            ref typeface,
+            ref mut line_breaks,
+        } = *text;
+
+        let Some(typeface) = typefaces.get(typeface) else {
+            return Ok(Some(target_layer.clone()));
+        };
+
+        line_breaks.clear();
+
+        let max_width = target_rect.width();
+        let mut x = 0;
+        let mut max_x = 0;
+        let mut last_separator = None;
+
+        for (index, char) in value.chars().enumerate() {
+            let index = index as u32;
+
+            if let Some(char) = typeface.characters.get(&char) {
+                let split = x > max_width;
+                if split {
+                    x = 0;
+                    line_breaks.push(last_separator.unwrap_or(index.saturating_sub(1)));
+                    last_separator = None;
+                }
+
+                let width = char.frame_size().x as i32;
+
+                if x != 0 {
+                    x += 1
+                }
+                x += width;
+
+                if x > max_width && !split {
+                    x = width;
+                    line_breaks.push(last_separator.unwrap_or(index.saturating_sub(1)));
+                    last_separator = None;
+                }
+
+                if x > max_x {
+                    max_x = x;
+                }
+            } else if let Some(separator) = typeface.separators.get(&char) {
+                x += separator.width as i32;
+                last_separator = Some(index);
+            } else {
+                error!(r#"character "{char}" in text isn't in typeface"#);
+            }
+        }
+
+        let line_break_count = line_breaks.len() as i32;
+        **pos = ivec2(target_rect.min.x, target_rect.max.y)
+            + ivec2(
+                max_x,
+                -((line_break_count + 1) * typeface.height as i32 + line_break_count),
+            ) / 2;
+
+        return Ok(Some(target_layer.clone()));
+    }
+
+    unreachable!();
+}
+
+pub(crate) fn layout<L: PxLayer>(
+    mut uis: ParamSet<(
+        Query<(&L, &PxCanvas, Entity), With<PxUiRoot>>,
+        Query<(
+            AnyOf<(
+                (&PxMinSize, Option<&Children>),
+                (&PxMargin, Option<&Children>),
+                (&PxRow, Option<&Children>),
+                (&PxGrid, Option<&Children>),
+                (&PxStack, Option<&Children>),
+                (
+                    Option<(&mut PxScroll, &Children)>,
+                    &mut PxRect,
+                    &mut PxFilterLayers<L>,
+                ),
+                &PxSprite,
+                &mut PxText,
+            )>,
+            Option<&mut L>,
+            Option<(&mut PxPosition, &mut PxCanvas)>,
+        )>,
+    )>,
+    row_slots: Query<&PxRowSlot>,
+    typefaces: Res<Assets<PxTypeface>>,
+    sprites: Res<Assets<PxSpriteAsset>>,
+    screen: Res<Screen>,
+) -> Result {
+    for (layer, canvas, root) in uis
+        .p0()
+        .iter()
+        .map(|(layer, &canvas, entity)| (layer.clone(), canvas, entity))
+        .collect::<Vec<_>>()
+    {
+        layout_inner(
+            IRect {
+                min: IVec2::ZERO,
+                max: screen.computed_size.as_ivec2(),
+            },
+            &layer,
+            canvas,
+            root,
+            uis.p1(),
+            row_slots.as_readonly(),
+            &typefaces,
+            &sprites,
+        )?;
+    }
+
+    OK
+}
diff --git a/src/ui/widgets.rs b/src/ui/widgets.rs
new file mode 100644
index 0000000..7989e3b
--- /dev/null
+++ b/src/ui/widgets.rs
@@ -0,0 +1,96 @@
+use bevy_derive::{Deref, DerefMut};
+
+use crate::{position::DefaultLayer, prelude::*};
+
+/// Marks the root entity of a UI tree.
+#[derive(Component)]
+#[require(PxCanvas, DefaultLayer)]
+pub struct PxUiRoot;
+
+/// Sets a minimum size for a UI node.
+#[derive(Component, Deref, DerefMut, Default, Reflect)]
+#[cfg_attr(feature = "headed", require(Visibility))]
+pub struct PxMinSize(pub UVec2);
+
+/// Adds pixel margin around a UI node.
+#[derive(Component, Deref, DerefMut, Reflect)]
+#[cfg_attr(feature = "headed", require(Visibility))]
+pub struct PxMargin(pub u32);
+
+impl Default for PxMargin {
+    fn default() -> Self {
+        Self(1)
+    }
+}
+
+/// Per-child layout options for [`PxRow`].
+#[derive(Component, Default, Clone)]
+pub struct PxRowSlot {
+    /// If true, the slot expands to fill available space.
+    pub stretch: bool,
+}
+
+/// Row/column layout container for UI children.
+#[derive(Component, Default, Clone, Reflect)]
+#[cfg_attr(feature = "headed", require(Visibility))]
+pub struct PxRow {
+    /// If true, lay out children vertically; otherwise horizontally.
+    pub vertical: bool,
+    /// Space between children in pixels.
+    pub space_between: u32,
+}
+
+/// Row sizing config used by [`PxGrid`].
+#[derive(Default, Clone, Reflect)]
+pub struct PxGridRow {
+    /// If true, the row expands to fill available space.
+    pub stretch: bool,
+}
+
+/// Row/column definitions for [`PxGrid`].
+#[derive(Default, Clone, Reflect)]
+pub struct PxGridRows {
+    /// Row definitions.
+    pub rows: Vec<PxGridRow>,
+    /// Space between rows/columns in pixels.
+    pub space_between: u32,
+}
+
+/// Grid layout container for UI children.
+#[derive(Component, Clone)]
+#[cfg_attr(feature = "headed", require(Visibility))]
+pub struct PxGrid {
+    /// Number of columns in the grid.
+    pub width: u32,
+    /// Row sizing rules.
+    pub rows: PxGridRows,
+    /// Column sizing rules.
+    pub columns: PxGridRows,
+}
+
+impl Default for PxGrid {
+    fn default() -> Self {
+        Self {
+            width: 2,
+            rows: default(),
+            columns: default(),
+        }
+    }
+}
+
+/// Stack layout container; children overlap in insertion order.
+#[derive(Component, Clone, Reflect)]
+#[cfg_attr(feature = "headed", require(Visibility))]
+pub struct PxStack;
+
+/// Scroll container that masks and offsets child content.
+#[derive(Component, Default, Clone, Copy, Reflect)]
+#[require(PxInvertMask, PxRect)]
+pub struct PxScroll {
+    /// If true, scroll horizontally; otherwise vertically.
+    pub horizontal: bool,
+    /// Current scroll offset in pixels.
+    pub scroll: u32,
+    /// Maximum scroll offset in pixels.
+    pub max_scroll: u32,
+}