diff --git a/docs/assets/core/ControlModule.png b/docs/assets/core/ControlModule.png
new file mode 100644
index 00000000..4360d4fa
Binary files /dev/null and b/docs/assets/core/ControlModule.png differ
diff --git a/docs/history/plans/Plan-20260731 - ControlModule and presets.md b/docs/history/plans/Plan-20260731 - ControlModule and presets.md
new file mode 100644
index 00000000..7451fce4
--- /dev/null
+++ b/docs/history/plans/Plan-20260731 - ControlModule and presets.md	
@@ -0,0 +1,135 @@
+# Plan: ControlModule and presets
+
+## Context
+
+There is no way to save a device's configuration and bring it back. Every change edits the live tree,
+and the only persistence is the automatic one that restores exactly what was there at reboot. A user
+who finds a look they like cannot keep it, and cannot switch between looks.
+
+MoonLight solved this inside `ModuleLightsControl`, and the mechanism is the one to copy: **a preset
+is a JSON file, saving is copying a file, selecting is reading one back**. MoonLight's presets cover
+only effects and modifiers. We make it generic, and put it in **core** rather than the light domain,
+so a preset can carry any part of the tree.
+
+`ControlModule` is also where external control belongs later (MIDI surfaces, IR, a hardware panel):
+one place that says "put the device in this state", whatever asked for it. Presets are its first
+capability, not its only one.
+
+**Naming.** `LightPresetsModule` already exists and is a different thing: named channel-role wirings
+per fixture. It keeps its name here; the collision is noted in the module comment on both sides so a
+reader is not misled. If the two prove confusable in use, renaming that one to a fixture profile is a
+separate, PO-called change.
+
+## Decisions taken
+
+- **A preset captures a SELECTABLE set of top-level subtrees**, recorded in the file. A `Layers`-only
+  preset is hardware-portable; adding `Drivers` makes it a device snapshot that carries pin maps.
+  The file says which, so applying one is never a surprise.
+- **Named files**: `/.config/presets/<name>.json`. Delete is a file delete; a preset uploaded through
+  the File Manager just appears. This is the PO's stated principle, taken literally.
+- **Playlists are NOT in this branch.** The cycling hook is designed in and left unbuilt; multiple
+  named playlists get their own plan, informed by real presets to cycle.
+
+## Design
+
+### The file
+
+```json
+{
+  "captures": ["Layers", "Layouts"],
+  "Layers":  { "enabled": true, "0.type": "Layer", "0.0.type": "NoiseEffect", "0.0.speed": 128 },
+  "Layouts": { "enabled": true, "0.type": "GridLayout", "0.width": 128 }
+}
+```
+
+Each captured subtree is **exactly the bytes `FilesystemModule` already writes** for that module
+(`writeNode`, `FilesystemModule.cpp:348`): a flat map of dotted positional keys, with `<idx>.type`
+per child. Reusing that format means save and restore reuse the engine that already reconciles a tree
+against JSON, rather than a second serializer that could drift from it.
+
+### What has to be added to core
+
+`FilesystemModule` can already do both halves, but neither is reachable at runtime:
+
+- **`saveSubtreeTo(MoonModule*, JsonSink&)`** — factor the body of `saveSubtree`
+  (`FilesystemModule.cpp:319`) so it can write into a caller's sink instead of straight to
+  `/.config/<TypeName>.json`. The existing method becomes a thin caller of it.
+- **`applySubtree(MoonModule*, const char* json, const char* prefix)`** — a public wrapper over the
+  private `applyNode` (`FilesystemModule.cpp:191`), which already creates, replaces and destroys
+  children by type and tolerates unknown types. **It must also drive the lifecycle `applyNode`
+  leaves undone**: `applyNode` calls only `defineControls()` on a created child, because at boot the
+  Scheduler's phases 3 and 4 follow. At runtime the caller must do what `applyAddModule` does
+  (`HttpServerModule.cpp:1591`): `setup()` then `applyState()`, then one `prepareTree()`.
+
+Both go on `FilesystemModule` because that is where the format and the reconciliation live. No new
+serializer, no second copy of the tree-walking rules.
+
+### ControlModule
+
+A top-level module, peer of Layouts/Layers/Drivers, registered in `main.cpp` alongside them. Not
+under `Services`: it reaches *across* the top-level modules, so it cannot be a child of one.
+
+Controls:
+
+| control | what it does |
+|---|---|
+| `presets` | An editable `List` (`ListSource`, `Control.h:190`) — one row per file, with the captured subtrees shown per row. |
+| `name` | Text: the name to save under. |
+| `capture` | Which subtrees a save includes. One `addBool` per top-level module, so the set is explicit. |
+| `save` | Button: write `/.config/presets/<name>.json`. |
+| `status` | ReadOnly: what happened, and which preset is currently applied. |
+
+Applying a row uses the list's existing per-row edit path (`setListRowField`), which reaches the
+source with an arbitrary field name, so a row gets an "apply" affordance with no new UI primitive.
+A row also carries delete and rename through the CRUD the list already provides.
+
+**Save** flushes pending writes first (`FilesystemModule::flushPending()`, `.cpp:100`) so the file
+captures the live state rather than a stale debounce, then walks the selected top-level modules and
+writes one object per capture.
+
+**Apply** reads the file, and for each key in `captures` that resolves to a live top-level module,
+calls `applySubtree`. A capture naming a module this build does not have is skipped with a status
+line: the same degrade-never-crash rule `applyNode` already follows for unknown child types.
+
+### The hot path
+
+Applying a preset rebuilds modules, and every structural mutator already quiesces the render worker
+(`MoonModule::quiesceForMutation`, `MoonModule.h:510`). But mutations run inline on the render tick,
+so a large restore stalls rendering for its duration. **Batch it**: mutate every captured subtree,
+then one `prepareTree()` and one `requestFullResync()` at the end, rather than per subtree as the
+existing add path does. `tick()` is untouched, since presets are a cold-path feature.
+
+## Files
+
+- `src/core/ControlModule.h` — new. The module, its controls, the preset `ListSource`.
+- `src/core/FilesystemModule.h` / `.cpp` — `saveSubtreeTo` + `applySubtree`; `saveSubtree` refactored
+  to call the former.
+- `src/main.cpp` — register the type, create it, `scheduler.addModule` it.
+- `src/ui/app.js` — the row-apply affordance, **in both render paths** (`renderCards` and
+  `updateModuleControls`; a rule added to one only is invisible on a WebSocket update).
+- `docs/moonmodules/core/control.md` + the catalog card.
+- `test/unit/core/unit_ControlModule.cpp` — new.
+
+## Verification
+
+1. **Unit**: a preset round-trips (save a tree, mutate it, apply, the tree matches); a capture naming
+   an absent module is skipped without throwing; a corrupt file degrades to a status rather than a
+   crash; an unknown child type inside a capture is skipped and the rest still applies.
+2. **Scenario**: save a preset, change effects and layout live, apply the preset, assert the pipeline
+   still renders non-zero, which is the wired-pipeline gate the other scenarios use.
+3. **`check_footprint --module ControlModule`**: zero static RAM when not used.
+4. **`clang-hotpath`**: no new blocking call on the render path.
+5. **Bench, and the gate that matters**: on a real board, save a look, change it, bring it back, and
+   confirm the panels show what they showed before. **PO judgement.**
+6. Hardware portability, deliberately: a `Layers`-only preset saved on one board applies on a board
+   with different pins and drives its own hardware.
+
+## Deliberately not in this plan
+
+- **Playlists**, per the decision above. The apply path is the hook they will need.
+- **Apply-on-boot.** MoonLight explicitly does not (its preset branch is guarded against firing at
+  boot); WLED does. Worth deciding once presets exist and the behaviour can be felt.
+- **Renaming `LightPresetsModule`.** Noted as a collision, not acted on: it is a PO call and a
+  separate change.
+- **External control (MIDI, hardware surfaces).** This is what `ControlModule` exists to host, but
+  the first capability is presets; adding a control surface has its own plan.
diff --git a/docs/metrics/repo-health.json b/docs/metrics/repo-health.json
index 2dd812ce..197dd221 100644
--- a/docs/metrics/repo-health.json
+++ b/docs/metrics/repo-health.json
@@ -1,18 +1,18 @@
 {
-  "commit": "cca3fe8e",
+  "commit": "e98379f3",
   "flash": {
     "esp32": 1678960,
-    "esp32p4-eth": 1503232,
+    "esp32p4-eth": 1503280,
     "esp32p4-eth-wifi": 1793760,
-    "esp32s3-n16r8": 1667216,
+    "esp32s3-n16r8": 1696000,
     "esp32s3-n8r8": 1666992,
-    "esp32s31": 1924992,
-    "desktop": 945752
+    "esp32s31": 1932624,
+    "desktop": 999784
   },
   "perf": {
     "desktop": {
-      "tick_us": 127,
-      "fps": 7874
+      "tick_us": 337,
+      "fps": 2967
     },
     "esp32": {
       "tick_us": 4164,
@@ -20,54 +20,54 @@
     }
   },
   "loc": {
-    "core": 14889,
-    "light": 20214,
-    "platform": 12526,
-    "ui": 5811,
-    "test": 35504,
-    "moondeck": 19968
+    "core": 15902,
+    "light": 20247,
+    "platform": 12543,
+    "ui": 6467,
+    "test": 36557,
+    "moondeck": 20025
   },
   "comments": {
     "core": {
-      "lines": 5583,
-      "ratio": 0.409
+      "lines": 5941,
+      "ratio": 0.407
     },
     "light": {
-      "lines": 7815,
-      "ratio": 0.427
+      "lines": 7846,
+      "ratio": 0.428
     },
     "platform": {
-      "lines": 4198,
-      "ratio": 0.371
+      "lines": 4201,
+      "ratio": 0.37
     },
     "ui": {
-      "lines": 1518,
-      "ratio": 0.278
+      "lines": 1670,
+      "ratio": 0.274
     },
     "test": {
-      "lines": 6073,
+      "lines": 6232,
       "ratio": 0.198
     },
     "moondeck": {
-      "lines": 3187,
+      "lines": 3193,
       "ratio": 0.183
     }
   },
   "tests": {
-    "cases": 1008,
+    "cases": 1042,
     "scenarios": 22
   },
   "docs": {
-    "md_files": 170,
-    "md_lines": 22818,
-    "plans_files": 90,
+    "md_files": 172,
+    "md_lines": 23032,
+    "plans_files": 91,
     "backlog_lines": 3114,
     "lessons_lines": 418,
     "claude_md_lines": 135
   },
   "complexity": {
-    "functions": 2188,
-    "over_threshold": 140,
+    "functions": 2238,
+    "over_threshold": 142,
     "worst_ccn": 93
   }
 }
diff --git a/docs/metrics/repo-health.md b/docs/metrics/repo-health.md
index 396c38d0..8007f0b9 100644
--- a/docs/metrics/repo-health.md
+++ b/docs/metrics/repo-health.md
@@ -1,6 +1,6 @@
 # Repo health
 
-Measured at `cca3fe8e`. Generated by [`moondeck/check/repo_health.py`](../../moondeck/check/repo_health.py) on every KPI-gate run. **Do not edit by hand.**
+Measured at `e98379f3`. Generated by [`moondeck/check/repo_health.py`](../../moondeck/check/repo_health.py) on every KPI-gate run. **Do not edit by hand.**
 
 Current state only; the trend is this file's git history (`git log -p docs/metrics/repo-health.md`). Nothing here fails a build: the numbers make growth visible, the judgment stays human.
 
@@ -8,54 +8,54 @@ Current state only; the trend is this file's git history (`git log -p docs/metri
 
 | Target | Flash |
 |---|---:|
-| desktop | 924 KB (+0 KB) ⚠ |
+| desktop | 976 KB (+17 KB) ⚠ |
 | esp32 | 1,640 KB |
 | esp32p4-eth | 1,468 KB |
 | esp32p4-eth-wifi | 1,752 KB |
-| esp32s3-n16r8 | 1,628 KB |
+| esp32s3-n16r8 | 1,656 KB (+6 KB) ⚠ |
 | esp32s3-n8r8 | 1,628 KB |
-| esp32s31 | 1,880 KB |
+| esp32s31 | 1,887 KB |
 
 ## Render performance
 
 | Target | Tick | FPS |
 |---|---:|---:|
-| desktop | 127 µs | 7,874 |
+| desktop | 337 µs (+205 µs) ⚠ | 2,967 (−4,608) ⚠ |
 | esp32 | 4,164 µs | 240 |
 
 ## Code
 
 | Area | Lines | Comments | Comment share |
 |---|---:|---:|---:|
-| core | 14,889 | 5,583 | 40.9 % |
-| light | 20,214 (+16) ⚠ | 7,815 | 42.7 % |
-| platform | 12,526 (+25) ⚠ | 4,198 | 37.1 % (+0.1 %) ⚠ |
-| ui | 5,811 | 1,518 | 27.8 % |
-| test | 35,504 (+75) ⚠ | 6,073 | 19.8 % |
-| moondeck | 19,968 | 3,187 | 18.3 % |
+| core | 15,902 (+249) ⚠ | 5,941 | 40.7 % |
+| light | 20,247 (+3) ⚠ | 7,846 | 42.8 % |
+| platform | 12,543 (+17) ⚠ | 4,201 | 37.0 % (−0.1 %) ✓ |
+| ui | 6,467 (+10) ⚠ | 1,670 | 27.4 % (+0.1 %) ⚠ |
+| test | 36,557 (+212) ⚠ | 6,232 | 19.8 % |
+| moondeck | 20,025 (+19) ⚠ | 3,193 | 18.3 % |
 
 ## Tests
 
 | Kind | Count |
 |---|---:|
-| unit cases | 1,008 (+1) ✓ |
+| unit cases | 1,042 (+6) ✓ |
 | scenarios | 22 |
 
 ## Complexity
 
 | Metric | Value |
 |---|---:|
-| functions | 2,188 (+1) ✓ |
-| over threshold | 140 (+1) ⚠ |
+| functions | 2,238 (+11) ✓ |
+| over threshold | 142 |
 | worst CCN | 93 |
 
 ## Documentation
 
 | Metric | Value |
 |---|---:|
-| markdown files | 170 |
-| markdown lines | 22,818 (+9) ⚠ |
-| plan files | 90 |
+| markdown files | 172 |
+| markdown lines | 23,032 (+17) ⚠ |
+| plan files | 91 |
 | backlog lines | 3,114 |
 | lessons lines | 418 |
 | CLAUDE.md lines | 135 |
diff --git a/docs/moonmodules/core/control.md b/docs/moonmodules/core/control.md
new file mode 100644
index 00000000..c0c3dc84
--- /dev/null
+++ b/docs/moonmodules/core/control.md
@@ -0,0 +1,79 @@
+# Core control
+
+The device's control surface — the place that says "put the device into this state", whatever asked for it. A preset applied from the grid, and later a fader moved on a MIDI desk, arrive at the same code. Its first capability is presets; the surface layout exists so external controllers map onto something that already looks like them.
+
+`ControlModule` is a top-level module, a peer of Layouts / Layers / Drivers rather than a child of Services: it reaches *across* the top-level modules, so it cannot sit inside one.
+
+## Control modules
+
+<a id="control"></a>
+
+### Control
+
+A grid of preset pads, a row of rotary encoders above them, and a bank of faders below — the layout of a Mackie-style control desk ([X-Touch](https://www.behringer.com/product.html?modelCode=0808-AAF), [QCon Pro G2](https://www.iconproaudio.com/product/qcon-pro-g2/)), so a physical surface maps onto it without a translation layer.
+
+<img src="../../assets/core/ControlModule.png" width="300" alt="Control module surface: encoders, preset pads, faders">
+
+- `presets` — the pad grid (8×8). One pad per preset file; click to apply, right-click (or long-press) to name it, pick which single subtree it captures, save or delete. Drag a pad to rearrange the surface.
+- `enc1` … `enc8` — rotary encoders. Drag or scroll to turn; right-click shows what each drives.
+- `fader1` … `fader8` — faders. `fader1` drives `Drivers.brightness`; the rest are unassigned until bound.
+
+Detail: [technical](moxygen/ControlModule.md)
+
+[Tests](../../tests/unit-tests.md#controlmodule)
+
+## Presets
+
+A preset is a file: `/.config/presets/<name>.json`. Saving writes one, applying reads one, deleting removes one. A preset uploaded through the File Manager appears on the grid; nothing else holds preset state, so there is no second copy to keep in step, and the list is rebuilt from the folder at startup rather than persisted alongside it.
+
+The name becomes the file name, so it is restricted to printable ASCII without `/`, `\` or `.` — a validator on the control, which every write path runs. `slot` records which pad the preset occupies, so a surface arranged to match a physical desk survives a reboot.
+
+### What a preset carries
+
+A preset captures **exactly one** top-level subtree, recorded in the file:
+
+```json
+{
+  "slot": 12,
+  "captures": "Layers",
+  "Layers.enabled": true, "Layers.0.type": "Layer", "Layers.0.0.type": "NoiseEffect"
+}
+```
+
+Each captured subtree is exactly the bytes the persistence engine already writes for that module, namespaced under a `<TypeName>.` key prefix. Save and restore therefore reuse the engine that reconciles a tree against JSON ([`saveSubtreeTo` / `applySubtree`](moxygen/FilesystemModule.md)) rather than a second serializer that could drift from it.
+
+One subtree per preset is the whole model: a preset is *a look*, or *a geometry*, or *a hardware setup*, or *a service configuration. Never a combination. A `Layers` preset is a look, and applies to a board with completely different hardware; a `Drivers` preset carries pin maps and is device-specific. Choosing the role is a single radio button when saving, and the pad's color says which role it holds.
+
+A preset naming a subtree this build does not have is refused with a reason rather than partially applied, and a file written by an older build that names several subtrees is listed but not applied, so it can be seen and deleted rather than silently vanishing. A malformed file leaves the live tree untouched.
+
+### One active preset per role
+
+Each subtree is a **role**: layout, layer, driver, service. A preset holds its own role and leaves the other three alone, so a layout preset and a look can be active at the same time, and applying a new look replaces only the look.
+
+A pad is tinted by its role: layout blue, layer violet, driver green, service amber.
+
+### Applying is a rebuild
+
+Applying a preset creates, replaces and destroys modules to match what the file describes — it is a restore, not a value overlay: a preset carrying more than the device has adds it, and one describing less removes what it omits.
+
+Structural mutation quiesces the render worker, and mutations run inline on the render tick, so a large restore stalls rendering for its duration. Every captured subtree is applied first and `prepareTree()` runs once at the end, rather than once per capture. Presets are a cold-path feature; the tick path is untouched.
+
+## Home Assistant
+
+Looks reach Home Assistant two ways, and only `Layers` presets travel either of them.
+
+**The WLED integration** (`/presets.json`) is the native path: HA renders looks in its own preset dropdown, shows which one is applied, and applies one when it is chosen. This is what HA calls a preset.
+
+**MQTT discovery** publishes the same looks as the light entity's **effect list**. HA has no preset concept over MQTT, so they arrive as effects — the same result from the user's side, reached through a different mechanism.
+
+HA caches the preset list and re-fetches only when the device's presets-modified time (`info.fs.pmt`) changes, so that value moves whenever a preset is saved, renamed or deleted. A constant there leaves HA showing the list it read at setup forever.
+
+Only looks are exposed, on both paths. A `Drivers` or `Layouts` preset rewires pins or geometry, which must not be reachable from something that believes it is choosing a color scheme — the restriction is enforced at the apply entry point, not merely by omitting them from the list.
+
+Home Assistant's WLED integration connects on **port 80 only**: its host field rejects a port, so a desktop build (which defaults to 8080) needs `--port 80`, and that needs root:
+
+```sh
+sudo uv run moondeck/run/run_desktop.py --port 80
+```
+
+The discovery buffers are sized to the looks this device actually has, and grow or shrink as presets are added and removed. There is no cap on the number: a fixed one would either reserve memory a small setup never uses, or silently publish nothing once the list outgrew it.
diff --git a/mkdocs.yml b/mkdocs.yml
index fcc1fd4f..1425330f 100644
--- a/mkdocs.yml
+++ b/mkdocs.yml
@@ -135,6 +135,7 @@ nav:
       - Supporting: moonmodules/light/supporting.md
   - Core:
       - System: moonmodules/core/system.md
+      - Control: moonmodules/core/control.md
       - Services: moonmodules/core/services.md
       - Supporting: moonmodules/core/supporting.md
       - Web UI: moonmodules/core/ui.md
diff --git a/moondeck/run/run_desktop.py b/moondeck/run/run_desktop.py
index 080d2743..2310a4ab 100644
--- a/moondeck/run/run_desktop.py
+++ b/moondeck/run/run_desktop.py
@@ -13,6 +13,7 @@
 leaves the device running independently).
 """
 
+import argparse
 import os
 import platform
 import subprocess
@@ -41,10 +42,14 @@ def _resolve_executable() -> Path:
         bdir / "projectMM.exe",
         bdir / "Release" / "projectMM.exe",
         bdir / "projectMM",
+        # A plain `cmake --build build` writes here rather than into the per-host dir, so this path
+        # is often the NEWER binary. Both are considered and the freshest wins below: picking the
+        # first that merely exists served a stale build whose changes appeared to be no-ops.
+        ROOT / "build" / "projectMM",
     ]
-    for c in candidates:
-        if c.exists():
-            return c
+    existing = [c for c in candidates if c.exists()]
+    if existing:
+        return max(existing, key=lambda c: c.stat().st_mtime)
     # Return the most-likely candidate so the error message points somewhere
     # informative if the binary genuinely isn't there.
     return bdir / ("projectMM.exe" if sys.platform == "win32" else "projectMM")
@@ -79,6 +84,17 @@ def _kill_running():
 
 
 def main():
+    ap = argparse.ArgumentParser(description="Run the desktop build in the background.")
+    # Ports below 1024 need root, so the default stays 8080. Port 80 exists for Home Assistant's
+    # WLED integration, which hardcodes port 80 and offers no way to specify another
+    # (`sudo uv run moondeck/run/run_desktop.py --port 80`).
+    ap.add_argument("--port", type=int, default=None,
+                    help="HTTP port (default 8080; 80 needs root, for the Home Assistant WLED integration)")
+    args = ap.parse_args()
+    if args.port is not None and not (1 <= args.port <= 65535):
+        print(f"--port must be 1..65535, got {args.port}")
+        sys.exit(1)
+
     if not EXECUTABLE.exists():
         print(f"Executable not found: {EXECUTABLE}")
         print("Run build_desktop.py first.")
@@ -116,7 +132,10 @@ def main():
     else:
         popen_kwargs["start_new_session"] = True  # own session, immune to our SIGTERM
 
-    proc = subprocess.Popen([str(EXECUTABLE)], **popen_kwargs)
+    cmd = [str(EXECUTABLE)]
+    if args.port is not None:
+        cmd += ["--port", str(args.port)]
+    proc = subprocess.Popen(cmd, **popen_kwargs)
     print(f"PID {proc.pid} — log: {log_path}")
     print("Press the Run button again to restart; the app keeps running otherwise.")
 
diff --git a/src/core/Control.cpp b/src/core/Control.cpp
index 07fab165..b7e6232b 100644
--- a/src/core/Control.cpp
+++ b/src/core/Control.cpp
@@ -42,6 +42,16 @@ const char* controlTypeName(ControlType t) {
     return "unknown";
 }
 
+bool isPersistable(const ControlDescriptor& c) {
+    // A List defers to its source: rows re-derived at setup are not worth writing (see
+    // ListSource::persistsList). Every other type answers from the type alone.
+    if (c.type == ControlType::List) {
+        auto* src = static_cast<ListSource*>(c.ptr);
+        if (src && !src->persistsList()) return false;
+    }
+    return isPersistable(c.type);
+}
+
 bool isPersistable(ControlType t) {
     // Display-only / device-derived types: no point saving — the next
     // tick1s overwrites them.
diff --git a/src/core/Control.h b/src/core/Control.h
index 5e2eacdc..d5614f65 100644
--- a/src/core/Control.h
+++ b/src/core/Control.h
@@ -187,6 +187,13 @@ struct ListSource {
     // the control system stays generic. Returns true if it took.
     virtual bool restoreList(const char* /*json*/, const char* /*key*/) { return false; }
 
+    // Is this list's VALUE worth writing to flash? False for a list whose rows are re-derived at
+    // setup from a source that is itself already persistent — a folder of files, the live module
+    // tree, the pin map. Persisting such a list writes a large array on every save that the loader
+    // then discards (restoreList returns false), which is flash wear for nothing.
+    // Default true, so a list that genuinely owns its rows keeps persisting unchanged.
+    virtual bool persistsList() const { return true; }
+
     // --- Editable list (the CRUD extension) -----------------------------------------
     // A ListSource that supports adding / removing / reordering / editing rows. This is
     // the editable-data-grid primitive (the write half of the same data-source/adapter
@@ -202,6 +209,31 @@ struct ListSource {
     // maps the result onto an HTTP status.
     virtual bool isEditableList() const { return false; }
 
+    // Render the rows as a GRID OF PADS rather than a stacked list: one uniform button per row,
+    // labelled with the row's `name`, clicking it fires the row's `activate` field.
+    //
+    // For rows that are TRIGGERED far more often than they are edited, a list is the wrong shape: it
+    // costs a click to expand before the action is even visible, and it hides which row is currently
+    // active. A pad grid is what a MIDI deck uses for the same job, and it is the same affordance
+    // whether the rows are a handful of named presets or a dense field of numbered channels.
+    //
+    // Deliberately domain-neutral, and a PRESENTATION hint only — the rows, their ids and the
+    // edit/delete/reorder ops are unchanged, so a pad list is still a list and still editable. A
+    // source that opts in should:
+    //   - emit `"name"` per row (the pad label; short — a number or a word, not a sentence),
+    //   - mark the current row `"active":true` so the UI can highlight it,
+    //   - accept an `activate` field in setListRowField (the click).
+    // Everything else about the row stays as it was.
+    virtual bool listAsPads() const { return false; }
+
+    // The pad grid's shape. Non-zero means a FIXED surface: the UI renders cols x rows cells and
+    // places each row at its own `slot`, so an empty cell is a real position rather than an absence.
+    // That is what separates a control surface from a list drawn in columns — pad 14 is pad 14
+    // whether or not anything is in it, and deleting pad 3 does not slide pad 4 into its place.
+    // Zero (the default) keeps the flowing layout: pads in row order, wrapping to the card width.
+    virtual uint8_t listGridCols() const { return 0; }
+    virtual uint8_t listGridRows() const { return 0; }
+
     // Append a new row with default values; write the new row's stable id into `outId`.
     // Returns false if the list is full or otherwise refuses (e.g. a read-only source).
     virtual bool addListRow(uint32_t& /*outId*/) { return false; }
@@ -260,6 +292,11 @@ struct ControlDescriptor {
                             // renders number-only for the same reason — a GPIO is an identity, not a
                             // magnitude; this extends that to non-Pin numerics without the Pin type's
                             // pin-ownership-map claim.)
+    // Appended AFTER the other flags and before `validate`: the two addText-family initializers
+    // below are positional, so this field's place in the order is load-bearing.
+    bool fader = false;     // Render as a vertical fader (see ControlList::setFader). Presentation only.
+    bool encoder = false;   // Render as a rotary encoder (see ControlList::setEncoder).
+    const char* faderTarget = nullptr;   // What the fader/encoder drives ("Drivers.brightness"), or null.
     // Optional per-control input validator (Text/Password only; nullptr = accept anything
     // that fits the buffer). applyControlValue calls it on the incoming string BEFORE the
     // write and returns ApplyResult::Malformed on reject, so the check covers EVERY write
@@ -361,7 +398,8 @@ class ControlList {
     void addText(const char* name, char* var, uint16_t bufSize = 16,
                  bool (*validate)(const char*) = nullptr) {
         grow();
-        controls_[count_++] = {var, name, 0, ControlType::Text, 0, bufSize, false, false, false, false, validate};
+        controls_[count_++] = {.ptr = var, .name = name, .type = ControlType::Text,
+                               .max = bufSize, .validate = validate};
     }
 
     // Like addText but the UI renders a resizable multi-line <textarea> (e.g. a
@@ -369,7 +407,8 @@ class ControlList {
     void addTextArea(const char* name, char* var, uint16_t bufSize = 16,
                      bool (*validate)(const char*) = nullptr) {
         grow();
-        controls_[count_++] = {var, name, 0, ControlType::TextArea, 0, bufSize, false, false, false, false, validate};
+        controls_[count_++] = {.ptr = var, .name = name, .type = ControlType::TextArea,
+                               .max = bufSize, .validate = validate};
     }
 
     // Like addText but the value is a secret: the API serializes it
@@ -472,6 +511,24 @@ class ControlList {
         if (i < count_) controls_[i].numberField = numberField;
     }
 
+    /// Render this numeric control as a VERTICAL fader rather than a horizontal slider. Presentation
+    /// only: the control, its range and its value are unchanged, and consecutive faders render as
+    /// one bank. For a value a user rides rather than sets once — a level — a fader is the physical
+    /// affordance, and it is what a hardware surface will map onto.
+    /// `target` names what the fader drives ("Drivers.brightness"), or null when nothing yet. A
+    /// borrowed pointer, like every other name here.
+    void setFader(uint8_t i, bool fader = true, const char* target = nullptr) {
+        if (i < count_) { controls_[i].fader = fader; controls_[i].faderTarget = target; }
+    }
+
+    /// Render this numeric control as a ROTARY ENCODER: a knob, dragged vertically to turn. The
+    /// third surface affordance beside pads and faders, and the one both the X-Touch and the QCon
+    /// put above their strips. Presentation only, same as setFader — value, range and persistence
+    /// are untouched. `target` names what it drives, or null when nothing yet.
+    void setEncoder(uint8_t i, bool encoder = true, const char* target = nullptr) {
+        if (i < count_) { controls_[i].encoder = encoder; controls_[i].faderTarget = target; }
+    }
+
 private:
     ControlDescriptor* controls_ = nullptr;
     uint8_t count_ = 0;
@@ -507,6 +564,9 @@ const char* controlTypeName(ControlType t);
 // for ReadOnly / ReadOnlyInt / Progress (device-derived display values that
 // would just get overwritten on the next tick1s).
 bool isPersistable(ControlType t);
+/// Whether THIS control's value is written to flash. Prefer this over the type-only form: it also
+/// honours a ListSource that derives its rows (see ListSource::persistsList).
+bool isPersistable(const ControlDescriptor& c);
 
 // Whether `/api/types`'s default-values block should emit a default for this
 // type. False for Password (defaults defeat the secret), false for the
diff --git a/src/core/ControlModule.h b/src/core/ControlModule.h
new file mode 100644
index 00000000..ee3627c5
--- /dev/null
+++ b/src/core/ControlModule.h
@@ -0,0 +1,690 @@
+#pragma once
+
+#include "core/MoonModule.h"
+#include "core/FilesystemModule.h"
+#include "core/JsonSink.h"
+#include "core/Scheduler.h"
+#include "core/JsonUtil.h"
+#include "platform/platform.h"
+
+#include <cstdarg>   // setStatusf
+#include <cstdio>
+#include <algorithm>
+#include <cstring>
+
+namespace mm {
+
+/// Puts the device into a named state, and is where anything that wants to do that will live.
+///
+/// Its first capability is **presets**: a preset is a JSON file, saving one writes a file, selecting
+/// one reads it back. That is the whole model, taken from MoonLight's `ModuleLightsControl` and made
+/// generic — MoonLight's presets carry effects and modifiers only, ours carry whichever top-level
+/// subtrees the user chose to capture.
+///
+/// Top-level by necessity rather than convention: a preset reaches ACROSS Layouts, Layers, Drivers
+/// and Services, so this module cannot be a child of any of them.
+///
+/// **Not to be confused with `LightPresetsModule`**, which despite the name is a different thing: a
+/// library of named channel-role wirings (which channel of a light carries red, which carries pan)
+/// that drivers reference per fixture. That is a *fixture profile*; this is a device state.
+///
+/// The deep dives are under *More info*, below the attribute/method lists:
+/// @xref{what-a-preset-captures|what a preset captures, and portability},
+/// @xref{why-files|why files rather than slots}.
+///
+/// @moreinfo
+///
+/// ## What a preset captures
+///
+/// The `capture` controls choose which top-level subtrees a save includes, and the file records the
+/// choice, so applying one is never a surprise about what it will touch.
+///
+/// That choice is what decides **portability**. A preset capturing `Layers` alone is a look: effects,
+/// modifiers, their settings, and nothing about the hardware — it applies on any board and drives
+/// whatever that board has. Adding `Drivers` makes it a device snapshot that carries pin maps and
+/// lane counts, which is what you want for cloning a board and NOT what you want for sharing a look.
+///
+/// MoonLight avoided the question by only ever capturing effects. Making it selectable is the cost
+/// of being generic, and the file header is what keeps it honest.
+///
+/// ## Why files
+///
+/// `/.config/presets/<name>.json`, one file per preset, free-form names. Deleting a preset is
+/// deleting a file; a preset copied onto the device through the File Manager simply appears in the
+/// list; backing up presets is copying a folder. Numbered slots would have bought a fixed grid in
+/// the UI at the cost of every one of those.
+///
+/// The bytes inside are exactly what `FilesystemModule` writes for that subtree, so save and restore
+/// reuse the engine that already reconciles a live tree against JSON rather than a second serializer
+/// that could drift from it.
+class ControlModule : public MoonModule, public ListSource {
+public:
+    static constexpr const char* kPresetDir = "/.config/presets";
+    /// The surface is a fixed grid, so a pad has a POSITION rather than a place in a list: slot 14
+    /// is slot 14 whether or not anything is in it, and deleting slot 3 does not shuffle slot 4 into
+    /// its place. That is the whole difference between a control surface and a list of files, and it
+    /// is why the grid renders all kGridCols * kGridRows cells including the empty ones.
+    static constexpr uint8_t kGridCols = 8;
+    static constexpr uint8_t kGridRows = 8;
+    static constexpr uint8_t kMaxPresets = kGridCols * kGridRows;
+    static constexpr uint8_t kMaxNameLen = 32;
+    /// The top-level subtrees a preset can carry. Names are `typeName()`s, which is what the file
+    /// records and what `Scheduler` resolves them back to.
+    static constexpr const char* kCapturable[] = {"Layouts", "Layers", "Drivers", "Services"};
+    /// The role each capturable subtree holds, so a pad can show what a preset covers with the same
+    /// emoji the module cards use (ROLE_EMOJI in the UI): one vocabulary rather than a second set
+    /// invented here. Index-aligned with kCapturable.
+    static constexpr const char* kCaptureRole[] = {"layout", "layer", "driver", "service"};
+    static constexpr uint8_t kCaptureCount = 4;
+    /// Index of "Layers" within kCapturable — the role a pure look occupies.
+    static constexpr uint8_t kLayersRole = 1;
+    static_assert(kCapturable[kLayersRole][0] == 'L' && kCapturable[kLayersRole][1] == 'a' &&
+                  kCapturable[kLayersRole][5] == 's', "kLayersRole must index Layers");
+
+    /// How many faders the bank shows. Fixed for now; the surfaces we will map onto this have 8
+    /// (X-Touch) or 9 (nanoKONTROL), so the count becomes a control once a second surface needs it.
+    static constexpr uint8_t kFaderCount = 8;
+    /// A row of rotary encoders above the pads, mirroring where both the X-Touch and the QCon put
+    /// theirs. Unassigned for now: the binding UI is what gives them targets.
+    static constexpr uint8_t kEncoderCount = 8;
+
+    void defineControls() override {
+        // Encoders first: they sit ABOVE the pads on the surfaces this mirrors, and control order is
+        // render order.
+        for (uint8_t i = 0; i < kEncoderCount; i++) {
+            controls_.addUint8(kEncoderNames[i], encoders_[i]);
+            controls_.setEncoder(controls_.count() - 1, true, nullptr);
+        }
+        controls_.addList("presets", *this);
+        // The fader bank. Each fader is a plain uint8 control, so it persists, appears in /api/state,
+        // and is settable from anywhere the control system reaches — which is what a MIDI surface
+        // will bind to later. Rendered as a bank of vertical sliders by the UI.
+        for (uint8_t i = 0; i < kFaderCount; i++) {
+            controls_.addUint8(kFaderNames[i], faders_[i]);
+            controls_.setFader(controls_.count() - 1, true, faderTarget(i));
+        }
+        // The save form. All HIDDEN: these are what the pad popup drives, not controls a user reads
+        // off the card. Shown on the card they were ambiguous — `name` and the capture toggles look
+        // like they describe the selected preset, when they actually describe the NEXT save, and
+        // nothing on the card could say which pad they meant. Hidden keeps them settable from the
+        // popup, the API and persistence, without pretending to be a second way to do the job.
+        controls_.addText("name", name_, sizeof(name_), validPresetName);
+        controls_.setHidden(controls_.count() - 1, true);
+        // The pad a save is aimed at: transient UI intent, reset at setup (see setup()), never a
+        // restored value. The declared max is kMaxPresets-1, so a persisted or API-supplied kNoSlot
+        // would clamp to the last pad; savePreset re-checks the range for the same reason.
+        controls_.addUint8("slot", saveSlot_, 0, kMaxPresets - 1);
+        controls_.setHidden(controls_.count() - 1, true);
+        // One flag per capturable subtree rather than a single multi-select: the set is small and
+        // fixed, and a checkbox each is what makes "what will this preset contain" readable at a
+        // glance instead of hidden behind a dropdown.
+        // One choice, not four toggles: the UI renders it as a radio group in the pad popup.
+        controls_.addSelect("captures", captureRole_, kCapturable, kCaptureCount);
+        controls_.setHidden(controls_.count() - 1, true);
+        controls_.addButton("save");
+        controls_.setHidden(controls_.count() - 1, true);
+        MoonModule::defineControls();
+    }
+
+    void setup() override {
+        platform::fsMkdir(kPresetDir);
+        // A restored `slot` is meaningless: it is the popup's "save onto this pad" intent for one
+        // save, and the persistence load would clamp a stored kNoSlot to the last pad.
+        saveSlot_ = kNoSlot;
+        rescan();
+        MoonModule::setup();
+    }
+
+    /// `save` writes the current state; a fader drives whatever it targets; everything else is a
+    /// value edit the base handles.
+    void onControlChanged(const char* controlName) override {
+        if (std::strcmp(controlName, "save") == 0) { savePreset(); return; }
+        for (uint8_t i = 0; i < kFaderCount; i++) {
+            if (std::strcmp(controlName, kFaderNames[i]) != 0) continue;
+            driveFader(i);
+            return;
+        }
+    }
+
+    // ---- ListSource: one row per preset file ----
+
+    uint8_t listRowCount() const override { return presetCount_; }
+
+    void writeListRow(JsonSink& sink, uint8_t row) const override {
+        if (row >= presetCount_) return;
+        const Preset& p = presets_[row];
+        // The name is written through writeJsonString, not raw: a preset named with a quote would
+        // otherwise emit malformed JSON that fails to parse, and the list would come back empty.
+        sink.appendf("{\"id\":%lu,\"slot\":%u,\"name\":",
+                     static_cast<unsigned long>(p.id), static_cast<unsigned>(p.slot));
+        sink.writeJsonString(p.name);
+        sink.append(",\"captures\":");
+        sink.writeJsonString(p.captures);
+        // The roles this preset covers, as role NAMES: the UI maps them through the same ROLE_EMOJI
+        // table the module cards use, so a pad shows 🥞 for a look and 🥞☸️ for one that also
+        // carries the hardware — readable at a glance without opening the row.
+        sink.append(",\"roles\":[");
+        bool firstRole = true;
+        for (uint8_t i = 0; i < kCaptureCount; i++) {
+            if (!listHas(p.captures, kCapturable[i])) continue;
+            sink.appendf("%s\"%s\"", firstRole ? "" : ",", kCaptureRole[i]);
+            firstRole = false;
+        }
+        sink.append("]");
+        // Which pad is lit, and for WHICH roles. A pad is active when it still holds at least one
+        // role; `activeRoles` is the subset it holds right now, which is what the UI mixes into the
+        // lit color. A mixed preset partly superseded (its layer replaced, its layout still on) stays
+        // lit for the role it kept.
+        sink.append(",\"activeRoles\":[");
+        bool firstActive = true;
+        for (uint8_t i = 0; i < kCaptureCount; i++) {
+            if (!p.name[0] || std::strcmp(p.name, current_[i]) != 0) continue;
+            sink.appendf("%s\"%s\"", firstActive ? "" : ",", kCaptureRole[i]);
+            firstActive = false;
+        }
+        sink.append("]");
+        if (!firstActive) sink.append(",\"active\":true");
+        sink.append("}");
+    }
+
+    /// The expanded row: what the preset carries, its name, and the action that applies it.
+    ///
+    /// `apply` is a `button` field rather than a stored value — the click PATCHes it like an edit and
+    /// setListRowField reads the arrival as "put the device into this state". That reuses the list's
+    /// existing per-row edit path instead of inventing a second wire shape for actions.
+    void writeListRowDetail(JsonSink& sink, uint8_t row) const override {
+        if (row >= presetCount_) return;
+        const Preset& p = presets_[row];
+        sink.append("{\"fields\":[{\"name\":\"name\",\"type\":\"text\",\"value\":");
+        sink.writeJsonString(p.name);
+        sink.append("},{\"name\":\"captures\",\"type\":\"text\",\"readonly\":true,\"value\":");
+        sink.writeJsonString(p.captures[0] ? p.captures : "(unknown)");
+        sink.append("},{\"name\":\"apply\",\"type\":\"button\",\"label\":\"apply\"}]}");
+    }
+
+    // ---- Presets as an external surface (Home Assistant, and any future consumer) --------------
+    //
+    // A preset carrying ONLY Layers is a look: it changes what the lights show and nothing else. One
+    // that also carries Drivers or Layouts rewires pins or geometry, which must not be reachable from
+    // a voice assistant or an automation that thinks it is picking a colour scheme. These two calls
+    // are the whole seam a publisher needs, so no consumer has to learn the file format or the
+    // capture rules to decide what is safe to expose.
+
+    /// The one role this preset carries, or kCaptureCount if the file names none or several. A
+    /// multi-capture file is one written by an older build: it is listed but not applied, so the
+    /// user can see it and delete it rather than have it silently vanish.
+    uint8_t roleOf(uint8_t row) const {
+        if (row >= presetCount_) return kCaptureCount;
+        uint8_t found = kCaptureCount, n = 0;
+        for (uint8_t i = 0; i < kCaptureCount; i++)
+            if (listHas(presets_[row].captures, kCapturable[i])) { found = i; n++; }
+        return n == 1 ? found : kCaptureCount;
+    }
+
+    /// Is this preset a pure look? With one role per preset this is simply "its role is Layers".
+    bool isLookOnly(uint8_t row) const { return roleOf(row) == kLayersRole; }
+
+    /// The preset's name, or null for an out-of-range row.
+    const char* presetName(uint8_t row) const {
+        return row < presetCount_ ? presets_[row].name : nullptr;
+    }
+
+    uint8_t presetCount() const { return presetCount_; }
+
+    /// Seconds-since-boot of the last change to the preset SET (a save, delete, rename or rescan).
+    /// The WLED shim reports this as `info.fs.pmt`, which is how Home Assistant decides whether to
+    /// re-fetch /presets.json: a constant there means HA keeps its first copy forever and never sees
+    /// a preset added or removed.
+    uint32_t presetsModifiedS() const { return presetsModifiedS_; }
+
+    /// Apply a LOOK by name. Refuses anything that is not look-only, so an external caller cannot
+    /// reconfigure the hardware through this entry point even if it names a preset that would.
+    bool applyLookByName(const char* name) {
+        if (!name || !name[0]) return false;
+        for (uint8_t i = 0; i < presetCount_; i++) {
+            if (std::strcmp(presets_[i].name, name) != 0) continue;
+            if (!isLookOnly(i)) return false;
+            return applyPreset(presets_[i].name);
+        }
+        return false;
+    }
+
+    /// The look applied most recently, or "" when none is. Reports the LAYER role's holder, since a
+    /// look is by definition what occupies that role.
+    const char* currentLook() const { return current_[kLayersRole]; }
+
+    bool isEditableList() const override { return true; }
+
+    /// The preset FOLDER is the state; rescan() rebuilds these rows at setup. Persisting the list
+    /// would write every row into /.config/ControlModule.json on each save and then discard it on
+    /// load, since nothing restores it.
+    bool persistsList() const override { return false; }
+
+    /// Presets are triggered far more than they are edited, so the rows render as a grid of pads:
+    /// one click applies, and the active one is highlighted. The list's edit/delete/rename ops are
+    /// unchanged underneath.
+    bool listAsPads() const override { return true; }
+
+    /// The surface's shape. The UI renders exactly this many cells, filling from the rows' `slot`
+    /// field, so the empty positions are as real as the occupied ones.
+    uint8_t listGridCols() const override { return kGridCols; }
+    uint8_t listGridRows() const override { return kGridRows; }
+
+    /// Deleting a row deletes the file. Nothing else holds preset state, so there is no second copy
+    /// to keep in step.
+    bool deleteListRow(uint32_t id) override {
+        for (uint8_t i = 0; i < presetCount_; i++) {
+            if (presets_[i].id != id) continue;
+            char path[128];
+            pathFor(presets_[i].name, path, sizeof(path));
+            const bool ok = platform::fsRemove(path);
+            setStatusf(ok ? Severity::Status : Severity::Error,
+                       ok ? "deleted %s" : "could not delete %s", presets_[i].name);
+            rescan();
+            return ok;
+        }
+        return false;
+    }
+
+    /// A fader drives its target through Scheduler::setControl, the same domain-neutral primitive IR
+    /// and the network bridges use: this module composes against that rather than reaching into
+    /// another module's members. Only fader 1 has a target today (the global brightness every driver
+    /// scales by); the rest are unassigned and do nothing until a target picker exists.
+    /// What a fader drives, as "Module.control", or null when it drives nothing yet. The UI shows
+    /// this in the fader's popup, so the answer comes from the module rather than the UI assuming.
+    static const char* faderTarget(uint8_t index) {
+        return index == 0 ? "Drivers.brightness" : nullptr;
+    }
+
+    /// Drives whatever `faderTarget` declares, so the binding is stated ONCE: the popup and the
+    /// action cannot disagree, and a fader starts working the moment it gains a target.
+    void driveFader(uint8_t index) {
+        const char* target = faderTarget(index);
+        if (!target) return;                          // unassigned
+        const char* dot = std::strchr(target, '.');
+        if (!dot) return;
+        auto* sched = Scheduler::instance();
+        if (!sched) return;
+        char module[24];
+        const size_t n = std::min(static_cast<size_t>(dot - target), sizeof(module) - 1);
+        std::memcpy(module, target, n);
+        module[n] = '\0';
+        char body[32];
+        std::snprintf(body, sizeof(body), "{\"value\":%u}", static_cast<unsigned>(faders_[index]));
+        sched->setControl(module, dot + 1, body);
+    }
+
+    /// Reorder: the grid can be arranged to match a physical control surface, so pad 3 here is
+    /// fader 3 there. The order is the row order, persisted as a `slot` field in each file, so it
+    /// survives a reboot and a rescan (which otherwise returns files in whatever order the
+    /// filesystem lists them).
+    /// Drop a pad onto a grid cell. `to` is the SLOT, not a list index — the UI sends the cell the
+    /// pad was dropped on. Dropping onto an occupied slot swaps the two, which is what a user
+    /// rearranging a surface expects and avoids a silent overwrite.
+    bool moveListRow(uint32_t id, uint8_t to) override {
+        if (to >= kMaxPresets) return false;
+        Preset* moving = nullptr;
+        for (uint8_t i = 0; i < presetCount_; i++) if (presets_[i].id == id) { moving = &presets_[i]; break; }
+        if (!moving) return false;
+        if (moving->slot == to) return true;
+
+        Preset* occupant = nullptr;
+        for (uint8_t i = 0; i < presetCount_; i++)
+            if (presets_[i].slot == to && presets_[i].id != id) { occupant = &presets_[i]; break; }
+
+        const uint8_t from = moving->slot;
+        moving->slot = to;
+        if (occupant) occupant->slot = from;    // swap rather than overwrite
+        writeSlots();
+        sortBySlot();
+        return true;
+    }
+
+    /// The row's editable fields carry the two actions a preset row needs. `apply` is a pseudo-field
+    /// rather than a stored value: the UI sends it like an edit, and this reads it as "put the device
+    /// into this state". That reuses the existing per-row edit path instead of adding a row-button
+    /// primitive to the control system for one caller.
+    bool setListRowField(uint32_t id, const char* field, const char* valueJson) override {
+        for (uint8_t i = 0; i < presetCount_; i++) {
+            if (presets_[i].id != id) continue;
+            // `activate` is the pad click, `apply` the row button — the same action from the two
+            // presentations the list can take.
+            if (std::strcmp(field, "activate") == 0 || std::strcmp(field, "apply") == 0)
+                return applyPreset(presets_[i].name);
+            if (std::strcmp(field, "name") == 0) {
+                char newName[kMaxNameLen] = {};
+                mm::json::parseString(valueJson, "value", newName, sizeof(newName));
+                return renamePreset(presets_[i].name, newName);
+            }
+            return false;
+        }
+        return false;
+    }
+
+private:
+    struct Preset {
+        uint32_t id = 0;
+        char name[kMaxNameLen] = {};
+        char captures[64] = {};   // what the file says it carries, shown per row
+        uint8_t slot = 0;         // position on the grid (0..kMaxPresets-1), persisted in the file
+        bool hasSlot = false;     // false for a file with no stored slot: assignFreeSlots places it
+    };
+
+    /// Re-read the folder. Cheap and cold-path: called at setup, and after any save/delete/rename,
+    /// so an upload through the File Manager shows up the next time one of those happens.
+    void rescan() {
+        // Every change to the preset SET funnels through here (save, delete, rename, boot), so this
+        // is the one place the "presets changed" stamp needs to move.
+        presetsModifiedS_ = platform::millis() / 1000u;
+        presetCount_ = 0;
+        platform::fsList(kPresetDir, &onEntry, this);
+        for (uint8_t i = 0; i < presetCount_; i++) readCaptures(presets_[i]);
+        assignFreeSlots();
+        sortBySlot();
+    }
+
+    /// A preset with no stored slot (saved before slots existed, or copied in by hand) takes the
+    /// first free cell rather than colliding at 0, so a folder of hand-made files still lays out.
+    void assignFreeSlots() {
+        bool taken[kMaxPresets] = {};
+        for (uint8_t i = 0; i < presetCount_; i++)
+            if (presets_[i].hasSlot) taken[presets_[i].slot] = true;
+        for (uint8_t i = 0; i < presetCount_; i++) {
+            if (presets_[i].hasSlot) continue;
+            for (uint8_t s = 0; s < kMaxPresets; s++)
+                if (!taken[s]) { presets_[i].slot = s; taken[s] = true; break; }
+        }
+    }
+
+    void sortBySlot() {
+        for (uint8_t i = 1; i < presetCount_; i++) {
+            Preset key = presets_[i];
+            int j = i - 1;
+            while (j >= 0 && presets_[j].slot > key.slot) { presets_[j + 1] = presets_[j]; j--; }
+            presets_[j + 1] = key;
+        }
+    }
+
+    static void onEntry(const char* name, bool isDir, uint32_t /*size*/, void* user) {
+        auto* self = static_cast<ControlModule*>(user);
+        if (isDir || self->presetCount_ >= kMaxPresets) return;
+        const size_t len = std::strlen(name);
+        if (len < 6 || std::strcmp(name + len - 5, ".json") != 0) return;   // only our files
+        // Skip a name too long to hold, rather than truncating it: a truncated name reconstructs a
+        // DIFFERENT path in pathFor, so apply, rename and delete would all act on the wrong file (or
+        // silently fail). A preset uploaded through the File Manager can carry any name, so this is
+        // reachable without going through the validator.
+        const size_t stem = len - 5;
+        if (stem >= sizeof(Preset::name)) return;
+        Preset& p = self->presets_[self->presetCount_];
+        std::memcpy(p.name, name, stem);
+        p.name[stem] = '\0';
+        p.id = ++self->nextId_;
+        self->presetCount_++;
+    }
+
+    /// A preset name becomes a FILE name, so it must not be able to steer the path. ESP32's
+    /// fsTranslate is a bare prefix concatenation with no normalization (unlike the desktop
+    /// filesystem, which rejects escapes), so `..` in a name would reach outside the preset folder
+    /// on device — and delete and rename write through the same path. Rejecting the separator and
+    /// the dot outright is the check the HTTP file routes already apply; this extends it to the
+    /// second write path rather than leaving that one guarded only on desktop.
+    /// Bound as the `name` control's validator, so EVERY write path runs it: HTTP, the persistence
+    /// load, and a scripted set.
+    static bool validPresetName(const char* value) {
+        if (!value) return false;
+        const size_t n = std::strlen(value);
+        if (n == 0 || n >= kMaxNameLen) return false;
+        for (size_t i = 0; i < n; i++) {
+            const unsigned char b = static_cast<unsigned char>(value[i]);
+            if (b < 0x20 || b > 0x7E) return false;          // printable ASCII only
+            if (b == '/' || b == '\\' || b == '.') return false;   // no separator, no dot-segment
+        }
+        return true;
+    }
+
+    /// Read just the `captures` header so a row can say what it carries without loading the body.
+    void readCaptures(Preset& p) {
+        char path[128];
+        pathFor(p.name, path, sizeof(path));
+        char head[192] = {};
+        const int n = platform::fsReadAt(path, 0, head, sizeof(head) - 1);
+        if (n <= 0) return;
+        head[n] = '\0';
+        mm::json::parseString(head, "captures", p.captures, sizeof(p.captures));
+        p.hasSlot = mm::json::hasKey(head, "slot");
+        const int slot = mm::json::parseInt(head, "slot");
+        p.slot = (p.hasSlot && slot >= 0 && slot < kMaxPresets) ? static_cast<uint8_t>(slot) : 0;
+    }
+
+    /// Persist the pad order by stamping each file with its position. Cheap (one small rewrite per
+    /// file) and it keeps the order where the presets themselves live, so a folder copied to another
+    /// device brings its layout with it rather than resetting to whatever order that filesystem
+    /// happens to list.
+    void writeSlots() {
+        for (uint8_t i = 0; i < presetCount_; i++) {
+            char path[128];
+            pathFor(presets_[i].name, path, sizeof(path));
+            const long size = platform::fsSize(path);
+            if (size <= 0) continue;
+            char* body = static_cast<char*>(platform::alloc(static_cast<size_t>(size) + 1));
+            if (!body) continue;
+            const int n = platform::fsRead(path, body, static_cast<size_t>(size) + 1);
+            if (n > 0) {
+                body[n] = '\0';
+                JsonSink sink;
+                // Replace the leading '{' with '{"slot":N,' — the slot is a header field like
+                // `captures`, and a rewrite is simpler than an in-place patch of a variable-width int.
+                sink.appendf("{\"slot\":%u,", static_cast<unsigned>(presets_[i].slot));
+                const char* rest = std::strchr(body, '{');
+                if (rest) {
+                    const char* after = rest + 1;
+                    // Drop any previous slot key so repeated reorders do not accumulate them.
+                    if (std::strncmp(after, "\"slot\":", 7) == 0) {
+                        const char* comma = std::strchr(after, ',');
+                        if (comma) after = comma + 1;
+                    }
+                    sink.append(after);
+                    if (!sink.overflowed())
+                        platform::fsWriteAtomic(path, sink.data(), sink.size());
+                }
+            }
+            platform::free(body);
+        }
+    }
+
+    static void pathFor(const char* name, char* out, size_t n) {
+        std::snprintf(out, n, "%s/%s.json", kPresetDir, name);
+    }
+
+    /// Capture the selected subtrees into one file.
+    void savePreset() {
+        if (name_[0] == 0) { setStatusf(Severity::Warning, "name the preset first"); return; }
+        // Flush first: the persistence engine debounces writes by 2 s, and a preset that captured the
+        // debounced-but-unwritten state would be a snapshot of a moment that never existed on disk.
+        FilesystemModule::flushPending();
+
+        auto* fs = FilesystemModule::instance();
+        auto* sched = Scheduler::instance();
+        if (!fs || !sched) { setStatusf(Severity::Error, "not ready"); return; }
+
+        JsonSink sink;
+        // A save aimed at a pad carries its slot in the file, exactly as writeSlots writes it, so
+        // rescan() places it on the pad the user clicked. Stamping it here rather than fixing it up
+        // afterwards avoids a second whole-folder rewrite and avoids displacing whichever preset
+        // happened to hold the first free cell. A save that named no pad omits the key, and
+        // assignFreeSlots gives it the first free cell instead.
+        if (captureRole_ >= kCaptureCount) { setStatusf(Severity::Warning, "choose what to capture"); return; }
+        const char* type = kCapturable[captureRole_];
+        sink.append("{");
+        if (saveSlot_ < kMaxPresets)   // anything else (incl. kNoSlot) means "no pad was chosen"
+            sink.appendf("\"slot\":%u,", static_cast<unsigned>(saveSlot_));
+        sink.appendf("\"captures\":\"%s\"", type);
+
+        // Each captured subtree is written under a "<TypeName>." key prefix into ONE flat object —
+        // the same dotted form the persistence engine already writes, just namespaced. That is what
+        // lets applySubtree read it back with nothing more than the prefix it already accepts: no
+        // nested-object addressing, no second parser.
+        MoonModule* m = findTopLevel(sched, type);
+        if (!m) { setStatusf(Severity::Error, "%s is not on this device", type); return; }
+        char prefix[24];
+        std::snprintf(prefix, sizeof(prefix), "%s.", type);
+        sink.append(",");
+        if (!fs->saveSubtreeTo(m, sink, prefix)) { setStatusf(Severity::Error, "out of memory saving"); return; }
+        sink.append("}");
+        if (sink.overflowed()) { setStatusf(Severity::Error, "out of memory saving"); return; }
+
+        char path[128];
+        pathFor(name_, path, sizeof(path));
+        const bool ok = platform::fsWriteAtomic(path, sink.data(), sink.size());
+        setStatusf(ok ? Severity::Status : Severity::Error,
+                   ok ? "saved %s" : "could not save %s", name_);
+        rescan();   // the file carries its slot, so this places it on the clicked pad
+    }
+
+    /// Put the device into a preset's state.
+    bool applyPreset(const char* presetName) {
+        auto* fs = FilesystemModule::instance();
+        auto* sched = Scheduler::instance();
+        if (!fs || !sched) return false;
+
+        char path[128];
+        pathFor(presetName, path, sizeof(path));
+        const long size = platform::fsSize(path);
+        if (size <= 0) { setStatusf(Severity::Error, "%s is missing", presetName); return false; }
+        char* body = static_cast<char*>(platform::alloc(static_cast<size_t>(size) + 1));
+        if (!body) { setStatusf(Severity::Error, "out of memory applying"); return false; }
+        const int n = platform::fsRead(path, body, static_cast<size_t>(size) + 1);
+        if (n <= 0) { platform::free(body); setStatusf(Severity::Error, "could not read %s", presetName); return false; }
+        body[n] = '\0';
+
+        char captures[64] = {};
+        mm::json::parseString(body, "captures", captures, sizeof(captures));
+
+        // Apply every captured subtree, THEN prepare once. Each applySubtree already builds the
+        // subtree it touched; a prepareTree() per capture would walk the whole tree N times, and this
+        // runs inline on the render tick.
+        // Exactly one capture, or this file is not one we can apply.
+        uint8_t role = kCaptureCount, roleCount = 0;
+        for (uint8_t i = 0; i < kCaptureCount; i++)
+            if (listHas(captures, kCapturable[i])) { role = i; roleCount++; }
+        if (roleCount != 1) {
+            platform::free(body);
+            setStatusf(Severity::Warning, roleCount ? "%s carries several roles — re-save it"
+                                                    : "%s carries nothing this build knows", presetName);
+            return false;
+        }
+        const char* type = kCapturable[role];
+        MoonModule* m = findTopLevel(sched, type);
+        if (!m) {
+            platform::free(body);
+            setStatusf(Severity::Warning, "%s needs %s, which this device does not have", presetName, type);
+            return false;
+        }
+        char prefix[24];
+        std::snprintf(prefix, sizeof(prefix), "%s.", type);
+        const bool applied = fs->applySubtree(m, body, prefix);
+        platform::free(body);
+        if (!applied) { setStatusf(Severity::Error, "could not apply %s", presetName); return false; }
+
+        sched->prepareTree();
+        // The preset now holds its role; the other three keep whoever held them, so a layout preset
+        // and a layer preset stay lit together.
+        std::snprintf(current_[role], sizeof(current_[role]), "%s", presetName);
+        setStatusf(Severity::Status, "applied %s", presetName);
+        return true;
+    }
+
+    bool renamePreset(const char* from, const char* to) {
+        if (!validPresetName(to)) return false;   // the new name becomes a file name (see validPresetName)
+        if (std::strcmp(from, to) == 0) return true;   // renaming to itself is a no-op, not a failure
+        char src[128], dst[128];
+        pathFor(from, src, sizeof(src));
+        pathFor(to, dst, sizeof(dst));
+        // Refuse a rename onto an existing preset: the write would overwrite it and the remove would
+        // then delete the source, destroying a preset the user never named. Same refuse-on-collision
+        // stance moveListRow takes.
+        if (platform::fsSize(dst) > 0) {
+            setStatusf(Severity::Warning, "%s already exists", to);
+            return false;
+        }
+        const long size = platform::fsSize(src);
+        if (size <= 0) return false;
+        char* buf = static_cast<char*>(platform::alloc(static_cast<size_t>(size) + 1));
+        if (!buf) return false;
+        const int n = platform::fsRead(src, buf, static_cast<size_t>(size) + 1);
+        bool ok = false;
+        if (n > 0 && platform::fsWriteAtomic(dst, buf, static_cast<size_t>(n))) {
+            platform::fsRemove(src);
+            ok = true;
+        }
+        platform::free(buf);
+        rescan();
+        return ok;
+    }
+
+    /// Is `type` in the comma-separated `captures` header? Whole-token match, so "Layer" never
+    /// matches "Layers".
+    static bool listHas(const char* list, const char* type) {
+        const size_t tlen = std::strlen(type);
+        for (const char* p = list; *p;) {
+            const char* end = std::strchr(p, ',');
+            const size_t len = end ? static_cast<size_t>(end - p) : std::strlen(p);
+            if (len == tlen && std::strncmp(p, type, tlen) == 0) return true;
+            if (!end) break;
+            p = end + 1;
+        }
+        return false;
+    }
+
+    static MoonModule* findTopLevel(Scheduler* s, const char* typeName) {
+        for (uint8_t i = 0; i < s->moduleCount(); i++) {
+            MoonModule* m = s->module(i);
+            if (m && std::strcmp(m->typeName(), typeName) == 0) return m;
+        }
+        return nullptr;
+    }
+
+    /// Report through the base's status, the way every module does, so the UI shows it in the card's
+    /// status chip with the right severity emoji. setStatus takes a BORROWED pointer, so the text
+    /// lives in a member buffer rather than a temporary.
+    void setStatusf(Severity sev, const char* fmt, ...) {
+        va_list ap;
+        va_start(ap, fmt);
+        std::vsnprintf(statusBuf_, sizeof(statusBuf_), fmt, ap);
+        va_end(ap);
+        setStatus(statusBuf_, sev);
+    }
+
+    /// Fader names are their position, so a surface binds to "fader1" rather than to a label a user
+    /// might rename. Fixed strings because a control's name is a borrowed pointer.
+    static constexpr const char* kFaderNames[kFaderCount] =
+        {"fader1", "fader2", "fader3", "fader4", "fader5", "fader6", "fader7", "fader8"};
+    static constexpr const char* kEncoderNames[kEncoderCount] =
+        {"enc1", "enc2", "enc3", "enc4", "enc5", "enc6", "enc7", "enc8"};
+    uint8_t faders_[kFaderCount] = {};
+    uint8_t encoders_[kEncoderCount] = {};
+    /// Which pad the next save fills, set by the surface popup. kNoSlot means the save did not name
+    /// a pad (a scripted or API save), and assignFreeSlots then places it in the first free cell.
+    static constexpr uint8_t kNoSlot = 0xFF;
+    uint8_t saveSlot_ = kNoSlot;
+
+    Preset presets_[kMaxPresets];
+    uint8_t presetCount_ = 0;
+    uint32_t presetsModifiedS_ = 0;   ///< see presetsModifiedS(): drives HA's preset re-fetch
+    uint32_t nextId_ = 0;
+    char name_[kMaxNameLen] = {};
+    /// Which ONE subtree the next save captures, as an index into kCapturable. A preset carries
+    /// exactly one role: "this preset is a look" is a thing a user can hold in their head, where
+    /// "a look and a geometry, lit for one and superseded for the other" is not.
+    uint8_t captureRole_ = kLayersRole;   // a look, by default
+    /// Which preset currently holds each capturable role, index-aligned with kCapturable. A
+    /// preset that carries layout+layer claims both, so applying a layer-only preset afterwards
+    /// replaces the layer holder and leaves the layout one lit. That is what a mixed preset means
+    /// here: it owns more than one role, not a special kind of pad.
+    char current_[kCaptureCount][kMaxNameLen] = {};
+    /// Backing store for the status text: setStatus borrows the pointer, so it must outlive the call.
+    char statusBuf_[64] = {};
+};
+
+}  // namespace mm
diff --git a/src/core/FilesystemModule.cpp b/src/core/FilesystemModule.cpp
index c54ae562..c9f6a28b 100644
--- a/src/core/FilesystemModule.cpp
+++ b/src/core/FilesystemModule.cpp
@@ -152,7 +152,7 @@ void FilesystemModule::overlayControls(MoonModule* m, const char* json, const ch
     auto& cs = m->controls();
     for (uint8_t i = 0; i < cs.count(); i++) {
         auto& c = cs[i];
-        if (!isPersistable(c.type)) continue;
+        if (!isPersistable(c)) continue;
         std::snprintf(key, sizeof(key), "%s%s", prefix, c.name);
         applyValue(c, json, key);
     }
@@ -188,6 +188,40 @@ bool FilesystemModule::hasWiredChildOfType(const MoonModule* parent, const char*
     return false;
 }
 
+// Runtime entry point over applyNode. See the header for the contract; the reason it exists is the
+// lifecycle gap: at boot, Scheduler phases 3 and 4 call setup() and applyState() across the whole
+// tree after the load, so applyNode only has to call defineControls() on a child it creates. A
+// runtime caller gets no such phases, and a module that never saw setup() comes back with its
+// buffers unbuilt and its hardware unclaimed — a preset that "sometimes does not work".
+bool FilesystemModule::applySubtree(MoonModule* m, const char* json, const char* prefix) {
+    if (!m || !json) return false;
+    // Refuse a body that is not credibly one of ours BEFORE touching the tree. applyNode's trim step
+    // reads "no children in the JSON" as "delete every live child", so a truncated file (an
+    // interrupted upload, a half-written preset) would not leave the current look alone — it would
+    // WIPE it. Every subtree we write emits `<prefix>enabled`, so its absence is the cheap,
+    // format-specific test for "this is not a subtree", and it costs one key lookup on a cold path.
+    char enabledKey[MAX_KEY];
+    std::snprintf(enabledKey, sizeof(enabledKey), "%senabled", prefix);
+    if (!mm::json::hasKey(json, enabledKey)) {
+        std::printf("FilesystemModule: ignoring malformed subtree for %s\n", m->typeName());
+        return false;
+    }
+    applyNode(m, json, prefix);
+    // Same order as the runtime add path (HttpServerModule::applyAddModule): setup() may read what
+    // defineControls() bound, and applyState() then builds or releases per effectively-enabled.
+    // Both recurse over children on their own (MoonModule::setup / applyState), so one call at the
+    // root covers every node applyNode just created.
+    m->setup();
+    m->applyState();
+    // The tree just changed shape and values, so it has to be written back: without this an applied
+    // preset renders correctly and is then LOST on reboot, because the boot loader restores the
+    // config file that the apply never updated. Marked here rather than in each caller, so every
+    // applySubtree user persists by construction.
+    m->markDirty();
+    noteDirty();
+    return true;
+}
+
 void FilesystemModule::applyNode(MoonModule* m, const char* json, const char* prefix) {
     char key[MAX_KEY];
     // Overlay the saved values. A module whose CONTROL SET depends on one of its own control VALUES
@@ -316,6 +350,22 @@ void FilesystemModule::applyValue(const ControlDescriptor& c, const char* json,
 // ---- Save ----
 // Returns true only when the file was written. On failure (path/overflow/write
 // error) the caller must keep the subtree dirty so the change isn't lost.
+// Serialize a subtree into a caller's sink. The write half of saveSubtree, split out so a caller
+// storing the bytes elsewhere (a named preset file) produces the SAME format the loader reads,
+// rather than a second serializer that could drift from this one. See the header.
+bool FilesystemModule::saveSubtreeTo(MoonModule* m, JsonSink& sink, const char* prefix) {
+    if (!m) return false;
+    const bool bare = (prefix == nullptr || prefix[0] == 0);
+    if (bare) sink.append("{");   // a namespaced subtree is a fragment of the caller's object
+    // firstField=true in BOTH cases: this writes only its own fields, and the caller assembling a
+    // larger object owns the separator before each subtree. Emitting a leading comma here as well
+    // produced ",," in every preset carrying more than one capture — invalid JSON that our own
+    // first-match key reader happened to tolerate.
+    writeNode(m, sink, bare ? "" : prefix, /*firstField=*/true);
+    if (bare) sink.append("}");
+    return !sink.overflowed();           // only trips on an allocation failure, not a size cap
+}
+
 bool FilesystemModule::saveSubtree(MoonModule* m) {
     char path[MAX_PATH];
     if (!pathFor(m, path, sizeof(path))) return false;
@@ -324,10 +374,7 @@ bool FilesystemModule::saveSubtree(MoonModule* m) {
     // presets, a wide fixture wiring) persists in full instead of silently truncating. Written
     // atomically once complete.
     JsonSink sink;                       // heap/buffer mode: grows as needed, no cap
-    sink.append("{");
-    writeNode(m, sink, "", /*firstField=*/true);
-    sink.append("}");
-    if (sink.overflowed()) {             // only trips on an allocation failure now, not a size cap
+    if (!saveSubtreeTo(m, sink)) {
         std::printf("FilesystemModule: out of memory serializing %s\n", path);
         return false;
     }
@@ -350,7 +397,7 @@ void FilesystemModule::writeNode(MoonModule* m, JsonSink& sink, const char* pref
     auto& cs = m->controls();
     for (uint8_t i = 0; i < cs.count(); i++) {
         auto& c = cs[i];
-        if (!isPersistable(c.type)) continue;
+        if (!isPersistable(c)) continue;
         sink.appendf("%s\"%s%s\":", first ? "" : ",", prefix, c.name);
         writeControlValue(sink, c);      // the shared value serializer (same as /api/state)
         first = false;
diff --git a/src/core/FilesystemModule.h b/src/core/FilesystemModule.h
index a4c80f19..6d8e85ad 100644
--- a/src/core/FilesystemModule.h
+++ b/src/core/FilesystemModule.h
@@ -131,6 +131,38 @@ class FilesystemModule : public MoonModule {
     /// 2s debounce starts. Cheap timestamp record; the actual walk happens in tick1s().
     static void noteDirty();
 
+    /// Serialize a subtree into a caller's sink instead of to `/.config/<TypeName>.json`.
+    ///
+    /// Same bytes `saveSubtree` writes — the flat dotted-key form `applySubtree` reads back — so a
+    /// caller that stores a subtree elsewhere (ControlModule's presets, one file per named preset)
+    /// gets the persistence format for free rather than growing a second serializer that could
+    /// drift from this one. Emits the enclosing `{}`; returns false only on allocation failure.
+    /// `prefix` namespaces every key ("Layers.0.type"), so several subtrees can share one flat
+    /// object and `applySubtree` reads each back with the same prefix. Empty for a bare subtree.
+    bool saveSubtreeTo(MoonModule* m, JsonSink& sink, const char* prefix = "");
+
+    /// Apply a serialized subtree to a LIVE module tree, creating, replacing and destroying children
+    /// to match, then driving the lifecycle a runtime rebuild needs.
+    ///
+    /// The reconciliation itself is the boot loader's (`applyNode`): type-at-position decides
+    /// whether a child is kept and overlaid, replaced, or appended; an unknown type is skipped so
+    /// the rest of the tree still applies; code-wired children are never replaced. What this adds is
+    /// the part boot gets from the Scheduler's later phases and a runtime caller does not:
+    /// `applyNode` calls only `defineControls()` on a child it creates, so `setup()` and
+    /// `applyState()` must follow or the module comes back half-initialized. Mirrors the tail of
+    /// HttpServerModule's runtime add path.
+    ///
+    /// Does NOT call `prepareTree()` or persist: a caller applying several subtrees should batch one
+    /// `prepareTree()` after the last, since each is a full walk and this runs inline on the render
+    /// tick. Structural mutation is safe here because `addChild`/`replaceChildAt` quiesce the render
+    /// worker themselves (MoonModule::quiesceForMutation).
+    ///
+    /// `prefix` is "" for a whole subtree; the dotted form addresses a node within one.
+    /// Returns whether the subtree was applied. False means the body was not credibly one of
+    /// ours (malformed, or missing this prefix entirely) and the live tree was left alone — a
+    /// caller reporting success to a user needs to tell that apart from a real apply.
+    bool applySubtree(MoonModule* m, const char* json, const char* prefix = "");
+
 private:
     static inline FilesystemModule* instance_ = nullptr;
     Scheduler* scheduler_ = nullptr;
diff --git a/src/core/HttpServerModule.cpp b/src/core/HttpServerModule.cpp
index 26e931ca..d77c5532 100644
--- a/src/core/HttpServerModule.cpp
+++ b/src/core/HttpServerModule.cpp
@@ -12,6 +12,7 @@
 #include "core/JsonSink.h"
 #include "core/Sha1.h"
 #include "core/Base64.h"
+#include "core/ControlModule.h"   // look presets on /presets.json (HA WLED integration)
 #include "core/FilesystemModule.h"
 #include "core/FirmwareUpdateModule.h"
 #include "core/SystemModule.h"      // deviceName() for the WLED /json/info shim
@@ -275,8 +276,7 @@ void HttpServerModule::handleConnection(platform::TcpConnection& conn) {
         // (`{"0":{}}`): python-wled's __pre_deserialize__ maps it into `{0: Preset(0)}` then discards
         // 0 per its "Nobody cares about 0" rule — result is HA seeing zero presets. `{}` alone would
         // fail the `not presets` guard in wled.py; we need a non-empty dict.
-        else if (std::strcmp(path, "/presets.json") == 0)
-            sendResponse(conn, 200, "application/json", "{\"0\":{}}");
+        else if (std::strcmp(path, "/presets.json") == 0) serveWledPresets(conn);
         else sendResponse(conn, 404, "text/plain", "Not found");
     } else if (std::strcmp(method, "POST") == 0) {
         // POST /api/modules/<name>/move with body {"to":N}.
@@ -1087,9 +1087,19 @@ void HttpServerModule::writeControls(JsonSink& sink, MoonModule* mod) {
         // An editable List (the CRUD primitive) tells the UI to show add/delete/reorder + inline
         // row editors; a plain List stays read-only. The row objects carry a stable "id" the
         // /api/list/* ops address, and each editable row's detail carries its field descriptors.
+        if (c.fader || c.encoder) {
+            sink.append(c.fader ? ",\"fader\":true" : ",\"encoder\":true");
+            if (c.faderTarget) { sink.append(",\"target\":"); sink.writeJsonString(c.faderTarget); }
+        }
         if (c.type == ControlType::List) {
             const auto* ls = static_cast<const ListSource*>(c.ptr);
             if (ls && ls->isEditableList()) sink.append(",\"editable\":true");
+            if (ls && ls->listAsPads()) {
+                sink.append(",\"pads\":true");
+                const uint8_t gc = ls->listGridCols(), gr = ls->listGridRows();
+                if (gc && gr) sink.appendf(",\"gridCols\":%u,\"gridRows\":%u",
+                                           static_cast<unsigned>(gc), static_cast<unsigned>(gr));
+            }
         }
         sink.append(c.hidden ? ",\"hidden\":true}" : "}");
     }
@@ -1234,6 +1244,40 @@ void HttpServerModule::serveWledInfo(platform::TcpConnection& conn) {
 // See header. Extracts the deviceName / IP / MAC lookup the WLED shim needs at four
 // call sites (/json/info, /json/state /json/si, /json), so a future change to how identity
 // is discovered updates one place.
+// /presets.json — the device's LOOK presets in WLED's format, so Home Assistant's WLED integration
+// shows them in its preset dropdown (its native preset support, unlike the MQTT path where the same
+// presets ride as "effects").
+//
+// Format: an object keyed by preset SLOT, each holding at least a name `n`. Slot 0 is reserved
+// ("Nobody cares about 0" in python-wled, which discards it), so slots are emitted 1-based. The
+// object must be non-empty or python-wled's `not presets` guard treats the response as a failure —
+// hence the `{"0":{}}` floor when the device has no looks yet.
+//
+// Only look presets appear: a Drivers or Layouts preset rewires pins or geometry, which must not be
+// reachable from a Home Assistant automation that believes it is choosing a scene. Same restriction
+// the MQTT effect list applies, enforced from the same ControlModule predicate.
+void HttpServerModule::serveWledPresets(platform::TcpConnection& conn) {
+    auto* control = static_cast<ControlModule*>(findModuleByName("Control"));
+    if (!control) { sendResponse(conn, 200, "application/json", "{\"0\":{}}"); return; }
+
+    JsonSink sink;
+    sink.append("{");
+    bool any = false;
+    for (uint8_t i = 0; i < control->presetCount(); i++) {
+        if (!control->isLookOnly(i)) continue;
+        const char* name = control->presetName(i);
+        if (!name || !name[0]) continue;
+        // Slot+1: WLED slot 0 is reserved, and python-wled drops it.
+        sink.appendf("%s\"%u\":{\"n\":", any ? "," : "", static_cast<unsigned>(i + 1));
+        sink.writeJsonString(name);
+        sink.append("}");
+        any = true;
+    }
+    if (!any) sink.append("\"0\":{}");   // non-empty, or python-wled reads it as no response at all
+    sink.append("}");
+    sendResponse(conn, 200, "application/json", sink.data());
+}
+
 void HttpServerModule::resolveWledIdentity(const char*& name, uint8_t mac[6], uint8_t ip[4],
                                            const char* nameFallback) {
     name = nameFallback;
@@ -1307,7 +1351,21 @@ void HttpServerModule::writeWledStateBody(JsonSink& sink) {
     // dropdown and color picker stay two views of one value: selecting a palette repaints the picker
     // on HA's next poll, and picking a color snaps to the nearest palette (applyWledState).
     const uint8_t pal = driversPalette(scheduler_);
-    sink.appendf("{\"on\":%s,\"bri\":%u,\"transition\":7,\"ps\":-1,\"pl\":-1,"
+    // The applied look as a WLED preset slot (1-based, matching /presets.json), or -1 for none.
+    // Without this HA's preset dropdown reads "unknown" even while a preset is active, and never
+    // reflects a look chosen on the device itself.
+    int currentPs = -1;
+    if (auto* control = static_cast<ControlModule*>(findModuleByName("Control"))) {
+        const char* look = control->currentLook();
+        if (look && look[0]) {
+            for (uint8_t i = 0; i < control->presetCount(); i++) {
+                if (!control->isLookOnly(i)) continue;
+                const char* n = control->presetName(i);
+                if (n && std::strcmp(n, look) == 0) { currentPs = i + 1; break; }
+            }
+        }
+    }
+    sink.appendf("{\"on\":%s,\"bri\":%u,\"transition\":7,\"ps\":%d,\"pl\":-1,"
                  "\"nl\":{},\"udpn\":{},\"lor\":0,\"mainseg\":0,"
                  // seg[0].bri MUST be present alongside seg[0].on (same reason): HA WLED reads brightness
                  // from state.segments[<seg>].brightness (light.py's _attr_brightness), NOT top-level
@@ -1326,7 +1384,7 @@ void HttpServerModule::writeWledStateBody(JsonSink& sink) {
                  // (the sensors still work — only the segment-derived light breaks). fx=0 = "Solid", the
                  // single effect this shim exposes (fxcount=1), so the pair is consistent.
                  "\"seg\":[{\"id\":0,\"on\":%s,\"bri\":255,\"fx\":0,\"pal\":%u,\"col\":[[%u,%u,%u]]}]}",
-                 onStr, bri, onStr, pal, pc.r, pc.g, pc.b);
+                 onStr, bri, currentPs, onStr, pal, pc.r, pc.g, pc.b);
 }
 
 void HttpServerModule::serveWledState(platform::TcpConnection& conn) {
@@ -1424,10 +1482,23 @@ void HttpServerModule::serveWledDeviceJson(platform::TcpConnection& conn) {
                      bssid[0], bssid[1], bssid[2], bssid[3], bssid[4], bssid[5],
                      rssi, channel, signal);
     }
-    sink.appendf("\"fs\":{\"t\":256,\"u\":32,\"pmt\":1},"
+    // freeheap must be NON-ZERO for the WLED integration: desktop's platform::freeHeap() reports 0
+    // ("unlimited"), and HA's parser rejects the device outright, which is why every ESP32 added
+    // successfully while the desktop build failed with "Unknown error occurred". Report a nominal
+    // figure when the platform has no meaningful number rather than lying about a real one.
+    // pmt is the presets-modified time, and it is how Home Assistant decides whether to re-fetch
+    // /presets.json. A CONSTANT here means HA keeps the copy it took at setup forever, so a preset
+    // saved, renamed or deleted afterwards never appears — the endpoint was already dynamic, but
+    // nothing ever asked it again. ControlModule stamps this whenever the preset set changes; 1 is
+    // the fallback for a build with no ControlModule, preserving the previous stable-since-boot
+    // behaviour rather than forcing a re-fetch on every state update.
+    unsigned pmt = 1;
+    if (auto* control = static_cast<ControlModule*>(findModuleByName("Control")))
+        pmt = static_cast<unsigned>(control->presetsModifiedS()) + 1;   // +1: never report 0
+    sink.appendf("\"fs\":{\"t\":256,\"u\":32,\"pmt\":%u},"
                  // uptime + pmt drive python-wled's presets change-detect: when both are non-zero and
                  // stable, HA computes a stable "boot_time" and stops refetching /presets.json every
-                 // state update. pmt=1 (stable-since-boot) + uptime in seconds gives it the anchor.
+                 // state update.
                  "\"freeheap\":%u,\"uptime\":%u,\"udpport\":21324,\"live\":false,"
                  // ws=-1 tells python-wled (HA's WLED integration lib) that WebSocket updates are
                  // unsupported in this build. Its __post_deserialize__ maps -1 to None, and its
@@ -1440,7 +1511,10 @@ void HttpServerModule::serveWledDeviceJson(platform::TcpConnection& conn) {
                  // palcount = the real built-in count (matches the palettes[] array below); fxcount
                  // stays 1 (this shim exposes one effect surface). cpal/umpal = 0 (no custom palettes).
                  "\"fxcount\":1,\"palcount\":%u,\"cpalcount\":0,\"umpalcount\":0,\"str\":false}",
-                 static_cast<unsigned>(platform::freeHeap()),
+                 // Non-zero or the WLED integration rejects the device: desktop's freeHeap() reports
+                 // 0 ("unlimited"), which is why every ESP32 added fine while desktop failed.
+                 pmt,
+                 static_cast<unsigned>(platform::freeHeap() ? platform::freeHeap() : 32768u),
                  static_cast<unsigned>(platform::millis() / 1000u),
                  static_cast<unsigned>(mm::palettes::kCount));
     // effects + palettes — python-wled's __pre_deserialize__ turns each array into an indexed dict.
@@ -1479,6 +1553,17 @@ void HttpServerModule::serveWledStateInfo(platform::TcpConnection& conn) {
 // the real master-power control (so toggling off preserves the brightness level), `bri` sets the
 // level. Shared by the HTTP POST /json/state handler and the inbound-WebSocket path.
 void HttpServerModule::applyWledState(const char* body) {
+    // ps = a preset slot chosen from Home Assistant's preset dropdown. Slots are 1-based and match
+    // /presets.json. applyLookByName re-checks look-only, so a crafted request naming a preset that
+    // carries Drivers or Layouts is refused at the entry point rather than merely hidden from the list.
+    if (mm::json::hasKey(body, "ps")) {
+        const int slot = mm::json::parseInt(body, "ps");
+        auto* control = static_cast<ControlModule*>(findModuleByName("Control"));
+        if (control && slot > 0 && slot <= control->presetCount()) {
+            const char* name = control->presetName(static_cast<uint8_t>(slot - 1));
+            if (name) control->applyLookByName(name);
+        }
+    }
     if (mm::json::hasKey(body, "on")) {
         applySetControl("Drivers", "on",
                         mm::json::parseBool(body, "on") ? "{\"value\":true}" : "{\"value\":false}");
diff --git a/src/core/HttpServerModule.h b/src/core/HttpServerModule.h
index 00099144..3f326930 100644
--- a/src/core/HttpServerModule.h
+++ b/src/core/HttpServerModule.h
@@ -413,6 +413,7 @@ class HttpServerModule : public MoonModule, public BinaryBroadcaster {
     void serveWledState(platform::TcpConnection& conn);
     void serveWledStateInfo(platform::TcpConnection& conn);
     void serveWledDeviceJson(platform::TcpConnection& conn);   ///< /json — HA WLED integration surface
+    void serveWledPresets(platform::TcpConnection& conn);      ///< /presets.json — look presets for HA
     void handleWledState(platform::TcpConnection& conn, const char* body);
     void pollWledStateFromWebSockets();             ///< read app's slider/toggle sent over /ws
     void writeWledInfoBody(JsonSink& sink, const char* name, const uint8_t mac[6]);
diff --git a/src/core/MqttModule.cpp b/src/core/MqttModule.cpp
index b590992a..81f7adb8 100644
--- a/src/core/MqttModule.cpp
+++ b/src/core/MqttModule.cpp
@@ -2,6 +2,7 @@
 
 #include "core/Scheduler.h"     // setControl — the shared apply-core
 #include "core/JsonUtil.h"      // json::hasKey/parseBool/parseInt/parseString — the inbound ha/set parse
+#include "core/ControlModule.h"  // look-only presets -> the HA effect list
 #include "core/JsonSink.h"      // jsonEscape — escape the editable deviceName into the discovery JSON
                                 // (same flat helpers HttpServerModule::applyWledState uses; no arena)
 #include "core/build_info.h"    // kVersion / kFirmwareName — reported to HA's update entity
@@ -68,15 +69,61 @@ void MqttModule::buildStatusTopic(char* out, size_t cap) const {
 // and report them via setDynamicBytes so the UI's per-module memory line accounts for them. A device
 // that never enables HA discovery never calls this → zero bytes. Returns false on OOM (the caller then
 // skips the publish rather than deref a null — the module keeps running, discovery just doesn't announce).
+// Sized to what THIS device actually publishes: the fixed config plus the measured effect list. No
+// cap on the preset count -- a cap would either reserve RAM a three-preset device never uses, or
+// silently publish nothing once the list outgrew it (a truncated config is refused, not sent).
+// Saving or deleting a preset changes the required size, so the buffers are reallocated when it
+// moves rather than held at whatever the first announce needed.
 bool MqttModule::ensureDiscoveryBuffers() {
-    if (discoveryBuf_ && discoveryPayload_) return true;
-    if (!discoveryBuf_)     discoveryBuf_     = static_cast<uint8_t*>(platform::alloc(kDiscoveryBufLen));
-    if (!discoveryPayload_) discoveryPayload_ = static_cast<char*>(platform::alloc(kDiscoveryPayloadLen));
+    const size_t effects = haEffectListBytes();
+    const size_t wantPayload = kDiscoveryPayloadBase + effects;
+    const size_t wantBuf     = kDiscoveryBufBase + effects;
+    if (discoveryBuf_ && discoveryPayload_ &&
+        discoveryPayloadLen_ == wantPayload && discoveryBufLen_ == wantBuf) return true;
+    freeDiscoveryBuffers();
+    discoveryBuf_     = static_cast<uint8_t*>(platform::alloc(wantBuf));
+    discoveryPayload_ = static_cast<char*>(platform::alloc(wantPayload));
     if (!discoveryBuf_ || !discoveryPayload_) { freeDiscoveryBuffers(); return false; }
-    setDynamicBytes(kDiscoveryBufLen + kDiscoveryPayloadLen);
+    discoveryPayloadLen_ = wantPayload;
+    discoveryBufLen_     = wantBuf;
+    setDynamicBytes(wantBuf + wantPayload);
     return true;
 }
 
+// The effect_list is the light's menu of LOOKS. Only look-only presets appear: one that also carries
+// Drivers or Layouts would rewire pins or geometry, which must not be reachable from an automation
+// or a voice command that believes it is choosing a colour scheme (ControlModule::isLookOnly).
+size_t MqttModule::haEffectListBytes() const {
+    if (!controlModule_) return 0;
+    size_t n = 0, count = 0;
+    for (uint8_t i = 0; i < controlModule_->presetCount(); i++) {
+        if (!controlModule_->isLookOnly(i)) continue;
+        const char* nm = controlModule_->presetName(i);
+        if (!nm) continue;
+        n += std::strlen(nm) * 2 + 3;   // worst-case escaping, plus two quotes and a comma
+        count++;
+    }
+    return count ? n + 20 : 0;          // ,"effect":true,"fx_list":[]
+}
+
+size_t MqttModule::writeHaEffectList(char* out, size_t cap) const {
+    if (!controlModule_ || cap == 0) return 0;
+    size_t n = 0;
+    bool first = true;
+    for (uint8_t i = 0; i < controlModule_->presetCount(); i++) {
+        if (!controlModule_->isLookOnly(i)) continue;
+        const char* nm = controlModule_->presetName(i);
+        if (!nm) continue;
+        char esc[72];
+        jsonEscape(nm, esc, sizeof(esc));
+        const int w = std::snprintf(out + n, cap - n, "%s\"%s\"", first ? "" : ",", esc);
+        if (w <= 0 || static_cast<size_t>(w) >= cap - n) return 0;   // refuse a partial list
+        n += static_cast<size_t>(w);
+        first = false;
+    }
+    return first ? 0 : n;
+}
+
 void MqttModule::freeDiscoveryBuffers() {
     if (discoveryBuf_)     { platform::free(discoveryBuf_);     discoveryBuf_ = nullptr; }
     if (discoveryPayload_) { platform::free(discoveryPayload_); discoveryPayload_ = nullptr; }
@@ -136,15 +183,25 @@ void MqttModule::publishDiscovery(bool announce) {
     // JSON-schema MQTT light. Abbreviated keys (HA's documented short forms). brightness at the
     // default 0-255 scale (no scale key needed). dev{} groups the entity under a device card in HA.
     // `name:null` (see comment above) collapses the entity slug so `light.<device>` isn't doubled.
-    const int pn = std::snprintf(discoveryPayload_, kDiscoveryPayloadLen,
+    // The looks this device offers, as HA's effect list. Built into a scratch region of the payload
+    // buffer first so its true length is known before the config is assembled around it.
+    char* fxScratch = discoveryPayload_ + kDiscoveryPayloadBase / 2;
+    const size_t fxLen = writeHaEffectList(fxScratch, discoveryPayloadLen_ - kDiscoveryPayloadBase / 2);
+    char fxKey[24] = "";
+    if (fxLen) std::snprintf(fxKey, sizeof(fxKey), "\"effect\":true,");
+
+    const int pn = std::snprintf(discoveryPayload_, discoveryPayloadLen_,
         "{\"schema\":\"json\",\"name\":null,\"uniq_id\":\"%s\",\"cmd_t\":\"%s\","
-        "\"stat_t\":\"%s\",\"avty_t\":\"%s\",\"brightness\":true,"
+        "\"stat_t\":\"%s\",\"avty_t\":\"%s\",\"brightness\":true,%s%s%s%s"
         "\"dev\":{\"ids\":[\"%s\"],\"name\":\"%s\",\"mf\":\"MoonModules\",\"mdl\":\"projectMM\"}}",
-        id, cmd, stat, avty, id, dnEsc);
-    if (pn <= 0 || static_cast<size_t>(pn) >= kDiscoveryPayloadLen) return;   // truncated → don't send a broken config
+        id, cmd, stat, avty,
+        fxKey,
+        fxLen ? "\"fx_list\":[" : "", fxLen ? fxScratch : "", fxLen ? "]," : "",
+        id, dnEsc);
+    if (pn <= 0 || static_cast<size_t>(pn) >= discoveryPayloadLen_) return;   // truncated → don't send a broken config
 
     const size_t n = buildMqttPublish(topic, reinterpret_cast<const uint8_t*>(discoveryPayload_),
-                                      static_cast<size_t>(pn), discoveryBuf_, kDiscoveryBufLen,
+                                      static_cast<size_t>(pn), discoveryBuf_, discoveryBufLen_,
                                       /*retain=*/true);
     if (n == 0) { setStatusLine("error: discovery config too large"); return; }
     // Same "reset on a failed send" contract as the ping / subscribe / state paths: a partial write
@@ -229,15 +286,15 @@ void MqttModule::publishUpdateDiscovery(bool announce) {
     // it in HA's diagnostic section of the device card, matching how ESPHome and Tasmota surface
     // firmware info. `name:null` still applies — with device_class set, HA composes the label
     // itself (`<device_name> Firmware`), which is exactly what we want.
-    const int pn = std::snprintf(discoveryPayload_, kDiscoveryPayloadLen,
+    const int pn = std::snprintf(discoveryPayload_, discoveryPayloadLen_,
         "{\"name\":null,\"uniq_id\":\"%s_update\",\"stat_t\":\"%s\",\"cmd_t\":\"%s\","
         "\"avty_t\":\"%s\",\"entity_category\":\"diagnostic\",\"device_class\":\"firmware\","
         "\"dev\":{\"ids\":[\"%s\"],\"name\":\"%s\",\"mf\":\"MoonModules\",\"mdl\":\"projectMM\"}}",
         id, stat, cmd, avty, id, dnEsc);
-    if (pn <= 0 || static_cast<size_t>(pn) >= kDiscoveryPayloadLen) return;   // truncated → don't send
+    if (pn <= 0 || static_cast<size_t>(pn) >= discoveryPayloadLen_) return;   // truncated → don't send
 
     const size_t n = buildMqttPublish(topic, reinterpret_cast<const uint8_t*>(discoveryPayload_),
-                                      static_cast<size_t>(pn), discoveryBuf_, kDiscoveryBufLen,
+                                      static_cast<size_t>(pn), discoveryBuf_, discoveryBufLen_,
                                       /*retain=*/true);
     if (n == 0) { setStatusLine("error: update discovery too large"); return; }
     if (!sendPacket(discoveryBuf_, n)) resetConnection("error: update discovery publish failed");
@@ -645,8 +702,14 @@ void MqttModule::routePublish(const char* topic, const uint8_t* payload, size_t
             std::snprintf(json, sizeof(json), "{\"value\":%d}", bri);
             setControlValue("brightness", json);
         }
-        // The JSON schema carries every field in one message, so a new control is another key here
-        // (e.g. an "effect" key routing to setControlValue) rather than another topic.
+        // A look chosen from the effect dropdown. applyLookByName re-checks look-only, so a crafted
+        // message naming a hardware-carrying preset is refused at the entry point, not just hidden
+        // from the list.
+        if (controlModule_ && json::hasKey(body, "effect")) {
+            char fx[40] = {};
+            json::parseString(body, "effect", fx, sizeof(fx));
+            if (fx[0]) controlModule_->applyLookByName(fx);
+        }
         return;
     }
 
@@ -760,9 +823,15 @@ void MqttModule::publishState(bool force) {
     // JSON message with 0-255 brightness (no rescale, unlike brightness/get's 0-100). Only when
     // discovery is on, and inside this change-gated block so it emits once per change, not per tick.
     if (haDiscovery_) {
-        char haState[48];
-        std::snprintf(haState, sizeof(haState), "{\"state\":\"%s\",\"brightness\":%u}",
-                      on ? "ON" : "OFF", static_cast<unsigned>(bri));
+        // The applied look rides along, so HA's dropdown shows what is actually on -- including when
+        // the change came from the device's own pad grid rather than from HA.
+        char fxEsc[72] = "";
+        const char* look = controlModule_ ? controlModule_->currentLook() : nullptr;
+        if (look && look[0]) jsonEscape(look, fxEsc, sizeof(fxEsc));
+        char haState[136];
+        std::snprintf(haState, sizeof(haState), "{\"state\":\"%s\",\"brightness\":%u%s%s%s}",
+                      on ? "ON" : "OFF", static_cast<unsigned>(bri),
+                      fxEsc[0] ? ",\"effect\":\"" : "", fxEsc, fxEsc[0] ? "\"" : "");
         char haTopic[128];
         buildTopic(haTopic, sizeof(haTopic), "ha/state");
         const size_t n = buildMqttPublish(haTopic, reinterpret_cast<const uint8_t*>(haState),
diff --git a/src/core/MqttModule.h b/src/core/MqttModule.h
index e7df4620..0ed7cb33 100644
--- a/src/core/MqttModule.h
+++ b/src/core/MqttModule.h
@@ -3,6 +3,8 @@
 #include "core/MoonModule.h"
 #include "core/MqttPacket.h"
 #include "core/SystemModule.h"
+
+namespace mm { class ControlModule; }   // presets published as the HA effect list; .cpp includes it
 #include "platform/platform.h"
 
 #include <cstdint>
@@ -74,6 +76,10 @@ namespace mm {
 class MqttModule : public MoonModule {
 public:
     void setSystemModule(SystemModule* s) { systemModule_ = s; }
+    /// Optional: presets are published to Home Assistant as the light's effect list when set. Only
+    /// look-only presets are exposed (ControlModule::isLookOnly), so an automation cannot rewire
+    /// hardware through the effect dropdown.
+    void setControlModule(ControlModule* c) { controlModule_ = c; }
 
     void setup() override;
     void release() override;                          // free the lazily-allocated discovery buffers
@@ -95,6 +101,8 @@ class MqttModule : public MoonModule {
 
     /// The heap footprint dynamicBytes() reports while HA discovery is announcing — the sum of the two
     /// discovery scratch regions. Exposed so a test asserts against this instead of a magic literal.
+    /// The no-presets footprint. With looks published the buffers grow by the measured effect-list
+    /// size, so the live figure is dynamicBytes(); this constant is the floor.
     static constexpr size_t kDiscoveryDynamicBytes = 320 + 448;
 
 private:
@@ -140,6 +148,7 @@ class MqttModule : public MoonModule {
     void handleUpdateInstall(const char* payload, size_t payloadLen);
 
     SystemModule* systemModule_ = nullptr;
+    ControlModule* controlModule_ = nullptr;
 
     // The topic prefix is DERIVED from a STABLE hardware id: projectMM/<last6-of-MAC>. Not stored (no
     // buffer). The MAC is fixed for the chip's life, so a device rename never changes the topics —
@@ -188,10 +197,20 @@ class MqttModule : public MoonModule {
     // config frame off the shared 8 KB main-task stack (the P4 registerType-stack lesson). Two regions
     // because buildMqttPublish needs payload + output separate: the JSON builds into discoveryPayload_,
     // the framed packet into discoveryBuf_.
-    static constexpr size_t kDiscoveryPayloadLen = 320;
-    static constexpr size_t kDiscoveryBufLen     = 448;
-    static_assert(kDiscoveryDynamicBytes == kDiscoveryPayloadLen + kDiscoveryBufLen,
+    // The fixed part of the config; the effect_list adds to it and is measured, not capped (see
+    // haEffectListBytes / ensureDiscoveryBuffers). A cap would either waste RAM on a device with
+    // three presets or silently publish nothing on a device with many.
+    static constexpr size_t kDiscoveryPayloadBase = 320;
+    static constexpr size_t kDiscoveryBufBase     = 448;
+    static_assert(kDiscoveryDynamicBytes == kDiscoveryPayloadBase + kDiscoveryBufBase,
                   "public test constant must track the actual buffer sizes");
+    /// Bytes the effect_list needs for the CURRENT look-only presets, including the JSON key,
+    /// quotes and separators. 0 when there is nothing to publish.
+    size_t haEffectListBytes() const;
+    /// Serialize the effect_list key into `out`; returns the bytes written (0 if there are no looks).
+    size_t writeHaEffectList(char* out, size_t cap) const;
+    size_t discoveryPayloadLen_ = 0;   ///< size the buffers were allocated at, so a change can resize
+    size_t discoveryBufLen_     = 0;
     char*    discoveryPayload_ = nullptr;
     uint8_t* discoveryBuf_     = nullptr;
     bool ensureDiscoveryBuffers();   // lazily alloc both; false on OOM. Sets dynamicBytes.
diff --git a/src/light/drivers/Drivers.h b/src/light/drivers/Drivers.h
index 4dd54e29..33c111eb 100644
--- a/src/light/drivers/Drivers.h
+++ b/src/light/drivers/Drivers.h
@@ -200,14 +200,17 @@ class Drivers : public MoonModule {
         controls_.addUint8("brightness", brightness, 0, 255);
         controls_.addPalette("palette", palette, mm::paletteOptions, mm::palettes::kCount);
         controls_.addBool("multicore", multicore);   // render↔encode split on/off (see the member's doc)
+        controls_.setAdvanced(controls_.count() - 1);   // a tuning knob, not a user setting
         // Read-only KPI, the multicore sibling of the driver's frameTime: how long core 0 waited at the
         // frame boundary for core 1's encode. ~0 = render and encode overlap perfectly (the split pays
         // off fully). A large value = the effect is far cheaper than the encode, so core 0 idles — the
         // measured signal that a second (ping-pong) handoff buffer would recover that time. Refreshed
         // in tick1s(). Hidden while `multicore` is off: with no split there is no boundary to wait at,
         // so the number is meaningless — the same add-then-setHidden shape the loopback fields use.
+        // Expert-only too, since it only reads on the control it reports for.
         controls_.addReadOnly("renderWait", renderWaitStr_, sizeof(renderWaitStr_));
         controls_.setHidden(controls_.count() - 1, !multicore);
+        controls_.setAdvanced(controls_.count() - 1);
         MoonModule::defineControls();  // cascade to driver children (each owns its lightPreset/whiteMode)
     }
 
diff --git a/src/main.cpp b/src/main.cpp
index 87ba9a7f..4b789f9c 100644
--- a/src/main.cpp
+++ b/src/main.cpp
@@ -116,6 +116,7 @@
 #endif
 #include "core/HttpServerModule.h"
 #include "core/SystemModule.h"
+#include "core/ControlModule.h"
 #include "core/Services.h"
 #include "core/AudioService.h"
 #include "core/I2cScanModule.h"
@@ -249,6 +250,7 @@ static void registerModuleTypes() {
 #endif
     mm::ModuleFactory::registerType<mm::HttpServerModule>("HttpServerModule", "core/system.md");
     mm::ModuleFactory::registerType<mm::SystemModule>("SystemModule", "core/system.md#system");
+    mm::ModuleFactory::registerType<mm::ControlModule>("ControlModule", "core/control.md#control");
     mm::ModuleFactory::registerType<mm::Services>("Services", "core/services.md#services");
     mm::ModuleFactory::registerType<mm::AudioService>("AudioService", "core/services.md#audio");
     mm::ModuleFactory::registerType<mm::I2cScanModule>("I2cScanModule", "core/system.md#i2c-scan");
@@ -338,6 +340,11 @@ void mm_main(volatile bool& keepRunning, uint16_t httpPort) {
     // whose children the user adds/removes at runtime. Added as a root below.
     auto* servicesModule = static_cast<mm::Services*>(mm::ModuleFactory::create("Services"));
 
+    // ControlModule — puts the device into a named state. Top-level rather than a Services child
+    // because a preset reaches ACROSS Layouts/Layers/Drivers/Services, so it cannot live inside one
+    // of them. Boot-wired: presets are a device capability, not something a user adds.
+    auto* controlModule = static_cast<mm::ControlModule*>(mm::ModuleFactory::create("ControlModule"));
+
     // The deviceModel identity (e.g. "Olimex ESP32-Gateway Rev G") is now SystemModule's
     // `deviceModel` control — no separate module. SystemModule owns the device identity
     // (deviceName + deviceModel) directly; tooling injects deviceModel like any catalog
@@ -404,6 +411,7 @@ void mm_main(volatile bool& keepRunning, uint16_t httpPort) {
     if constexpr (mm::platform::hasNetwork) {
         mqttModule = static_cast<mm::MqttModule*>(mm::ModuleFactory::create("MqttModule"));
         mqttModule->setSystemModule(systemModule);
+        mqttModule->setControlModule(controlModule);   // look-only presets as the HA effect list
         mqttModule->markWiredByCode();
     }
 
@@ -515,6 +523,7 @@ void mm_main(volatile bool& keepRunning, uint16_t httpPort) {
     networkModule->addChild(devicesModule);
     scheduler.addModule(networkModule);
     scheduler.addModule(servicesModule);
+    scheduler.addModule(controlModule);
     scheduler.addModule(layouts);
     scheduler.addModule(layersContainer);
     scheduler.addModule(drivers);
diff --git a/src/platform/desktop/main_desktop.cpp b/src/platform/desktop/main_desktop.cpp
index 4368598b..21f3fea9 100644
--- a/src/platform/desktop/main_desktop.cpp
+++ b/src/platform/desktop/main_desktop.cpp
@@ -72,7 +72,24 @@ static void atExitHandler() {
     }
 }
 
-int main() {
+int main(int argc, char** argv) {
+    // --port N: the HTTP port. Defaults to 8080 because ports below 1024 need root on POSIX, but
+    // Home Assistant's WLED integration hardcodes port 80 with no way to specify another, so testing
+    // that path on desktop needs `sudo projectMM --port 80`.
+    uint16_t httpPort = 8080;
+    for (int i = 1; i < argc; i++) {
+        const bool isPort = std::strcmp(argv[i], "--port") == 0;
+        if (isPort && i + 1 < argc) {
+            const long v = std::strtol(argv[++i], nullptr, 10);
+            if (v > 0 && v <= 65535) httpPort = static_cast<uint16_t>(v);
+            else { std::printf("--port must be 1..65535\n"); return 1; }
+        } else if (isPort) {
+            std::printf("--port needs a value\n"); return 1;
+        } else if (std::strcmp(argv[i], "--help") == 0) {
+            std::printf("usage: projectMM [--port N]   (default 8080; 80 needs root)\n");
+            return 0;
+        }
+    }
     // Unbuffer so every line lands in projectMM.log before a crash.
     std::setvbuf(stdout, nullptr, _IONBF, 0);
     std::setvbuf(stderr, nullptr, _IONBF, 0);
@@ -116,9 +133,9 @@ int main() {
     char tbuf[32];
     isoTimestamp(tbuf, sizeof(tbuf));
     std::printf("projectMM started at %s\n", tbuf);
-    std::printf("Press Ctrl-C to stop.\n");
+    std::printf("Listening on port %u. Press Ctrl-C to stop.\n", static_cast<unsigned>(httpPort));
 
-    mm_main(running, 8080);
+    mm_main(running, httpPort);
 
     cleanExit = true;
     isoTimestamp(tbuf, sizeof(tbuf));
diff --git a/src/ui/app.js b/src/ui/app.js
index b8bb7a77..fd03fd9c 100644
--- a/src/ui/app.js
+++ b/src/ui/app.js
@@ -616,6 +616,9 @@ function buildNavFooter() {
 }
 
 function selectModule(name) {
+    // Surface demo sweep (REMOVABLE): leaving a surface re-arms it, so re-opening demos again while
+    // a re-render of the SAME surface (a pad click) does not.
+    if (name !== selectedModule) surfaceDemoShownFor = null;
     selectedModule = name;
     localStorage.setItem(LS_SELECTED, name);
     document.querySelectorAll(".nav-item").forEach((el) => {
@@ -659,8 +662,98 @@ function renderCards() {
         selectedModule = root.name;
     }
     if (root) renderModuleTree(root, main, 0);
+    // Surface demo sweep (REMOVABLE): delete this line and the block above it to remove the feature.
+    // `main` is the root of the rendered subtree, so it holds the encoder strips, the pad grid and
+    // the fader strips wherever they sit in the card nesting.
+    if (root && main.querySelector(".list-pads-fixed")) startSurfaceDemo(main, root.name);
 }
 
+// ============================================================================
+// Surface demo sweep — REMOVABLE BLOCK
+//
+// A hardware control desk sweeps its motorised faders and rings when it powers up, both to show it
+// is alive and to show what it has. This does the same for three seconds after the surface appears.
+//
+// It is deliberately isolated so it can be deleted whole: this block, plus the single
+// `startSurfaceDemo()` call at the end of renderCards(). It is a VIEW-ONLY animation — it never
+// calls sendControl, so it cannot write a swept value to the device, and the first WebSocket patch
+// after it finishes restores whatever the device actually holds.
+// ============================================================================
+const SURFACE_DEMO_MS = 1000;
+let surfaceDemoUntil = 0;
+/// The module the sweep last ran for. renderCards() fires on every state push and every mutation (a
+/// pad click refetches and re-renders), so "the surface was rendered" is NOT "the surface was
+/// opened" — without this the sweep replayed on every button press.
+let surfaceDemoShownFor = null;
+
+function startSurfaceDemo(root, moduleName) {
+    // The sweep is pure decoration, so it is the first thing to drop for someone who asked for less
+    // motion. Checked before the once-per-surface flag, so the flag is not burned by a skipped run.
+    if (window.matchMedia && window.matchMedia("(prefers-reduced-motion: reduce)").matches) return;
+    if (surfaceDemoShownFor === moduleName) return;   // already demoed this surface
+    // Every bank is queried from the SAME root. The encoder and fader strips sit on the top-level
+    // card while the pad grid is inside a nested one, so scoping to the card that contains the pads
+    // found the pads and nothing else.
+    const q = (sel) => [...root.querySelectorAll(sel)];
+    // Every bank is re-queried each frame, for the same reason the pads are: a state push mid-sweep
+    // re-renders the card and replaces these nodes. A list captured once would keep writing values to
+    // detached elements while the visible controls sat frozen — which is what stopped the knobs and
+    // faders a few hundred ms into a refresh, while the (live-queried) pads ran the full period.
+    const liveInputs = () => [
+        ...q(".control-encoder .encoder-input"),
+        ...q(".control-fader .fader-input"),
+    ];
+    const knobs  = q(".control-encoder .encoder-input");
+    const faders = q(".control-fader .fader-input");
+    // Pads are looked up LIVE each frame rather than captured: a state push mid-sweep re-renders the
+    // card and replaces these nodes, and a captured list would spend the rest of the run toggling
+    // classes on detached elements — which is why the chase stopped partway through.
+    const livePads = () => q(".list-pad:not(.list-pad-empty)");
+    if (!knobs.length && !faders.length && !livePads().length) return;
+    surfaceDemoShownFor = moduleName;
+
+    // No snapshot: the demo starts on the first render, BEFORE the caller assigns input.value, so a
+    // snapshot here captures the browser's default (50) and restoring it would overwrite every real
+    // value. The device state is the truth, so the sweep ends by replaying it.
+    const start = performance.now();
+    surfaceDemoUntil = start + SURFACE_DEMO_MS;
+
+    const step = (now) => {
+        const t = (now - start) / SURFACE_DEMO_MS;
+        if (t >= 1) {
+            // Put the real values back by re-applying device state, which also repaints the knobs
+            // and readouts through the normal patch path.
+            surfaceDemoUntil = 0;
+            updateValues();
+            livePads().forEach(p => p.classList.remove("list-pad-demo"));
+            return;
+        }
+        // A travelling wave rather than every control moving together: the phase offset per column is
+        // what makes it read as a sweep across the desk.
+        liveInputs().forEach((el, i) => {
+            const lo = Number(el.min) || 0, hi = Number(el.max) || 255;
+            const phase = t * 1.5 * Math.PI * 2 - i * 0.5;
+            el.value = Math.round(lo + (hi - lo) * (0.5 + 0.45 * Math.sin(phase)));
+            redrawRangeDecorations(el);
+        });
+        // The pads chase in sequence, one lit at a time, so the grid shows its extent. Paced by TIME
+        // rather than by pad count, so the chase runs at the same speed and for the full duration
+        // whatever number of presets exist.
+        const pads = livePads();
+        if (pads.length) {
+            const lit = Math.floor(t * SURFACE_DEMO_MS / 120) % pads.length;
+            pads.forEach((p, i) => p.classList.toggle("list-pad-demo", i === lit));
+        }
+        requestAnimationFrame(step);
+    };
+    requestAnimationFrame(step);
+}
+
+/// True while the sweep is running: updateValues() skips patching the swept inputs, so a WebSocket
+/// push mid-demo does not fight the animation for the same DOM node.
+function surfaceDemoRunning() { return surfaceDemoUntil > performance.now(); }
+// ======================= end REMOVABLE BLOCK ================================
+
 function renderModuleTree(mod, parentEl, depth) {
     const { card, childrenEl } = createCard(mod, depth);
     parentEl.appendChild(card);
@@ -1405,11 +1498,37 @@ function createControl(moduleName, moduleType, ctrl) {
         case "uint8": {
             const input = document.createElement("input");
             input.type = "range";
+            // A fader is the same range input stood on end (CSS `writing-mode: vertical-lr`), so the
+            // value, the range and the WS live-update path are untouched — only the orientation and
+            // the row's layout change. Consecutive faders sit side by side as one bank.
+            // An encoder is the same range input drawn as a KNOB: the input itself is hidden and an
+            // SVG dial sits on top, so the value, the range, the WS update path and keyboard access
+            // are the range input's — only the appearance changes. Dragging vertically turns it,
+            // which is the gesture a real encoder takes.
+            if (ctrl.encoder) {
+                input.classList.add("encoder-input");
+                row.classList.add("control-encoder");
+                row.appendChild(buildKnob(input, ctrl));
+                row.appendChild(buildSevenSeg(input));
+                attachTargetPopup(row, input, ctrl);
+            }
+            if (ctrl.fader) {
+                input.classList.add("fader-input");
+                row.classList.add("control-fader");
+                row.appendChild(buildSevenSeg(input));
+                // Right-click a fader to see (and later choose) what it drives — the same
+                // configure-on-the-control rule the pads follow.
+                attachTargetPopup(row, input, ctrl);
+            }
             input.min = ctrl.min ?? 0;
             input.max = ctrl.max ?? 255;
             input.value = ctrl.value ?? 0;
             input.dataset.mid = moduleName;
             input.dataset.key = ctrl.name;
+            // The knob and the readout were built above, before these three lines ran, so they drew
+            // against an empty input (the source of the 880 readouts). Refresh now that the value and
+            // the bounds exist.
+            redrawRangeDecorations(input);
             const numInput = document.createElement("input");
             numInput.type = "number";
             numInput.className = "control-value-input";
@@ -1917,8 +2036,8 @@ function createControl(moduleName, moduleType, ctrl) {
             // to before). The flag flows through to both render paths via the opts object.
             if (ctrl.editable) list.dataset.editable = "true";
             buildListEntries(list, rows, details, new Set(),   // initial: nothing expanded
-                {editable: ctrl.editable, moduleName: moduleName, ctrlName: ctrl.name,
-                 optionSets: ctrl.optionSets || {}});
+                {editable: ctrl.editable, pads: ctrl.pads, gridCols: ctrl.gridCols, gridRows: ctrl.gridRows,
+                 moduleName: moduleName, ctrlName: ctrl.name, optionSets: ctrl.optionSets || {}});
             row.appendChild(list);
             break;
         }
@@ -1951,7 +2070,492 @@ function listRowKey(item, labelText) {
     return (item && item.id != null) ? "#" + item.id : labelText;
 }
 
+// A grid of uniform pads, one per row: the presentation a `pads` list asks for. Rows are unchanged
+// — this is the same data the stacked list renders, laid out for triggering rather than reading.
+// Uniform size on purpose: sizing each pad to its label (as MoonLight does) makes a ragged grid that
+// is harder to scan and to hit; a fixed pad with a truncated label is what a MIDI deck looks like.
+// Long-press as the touch equivalent of a right-click: a touch device has no second button, so the
+// configure gesture has to come from somewhere. 500ms, cancelled by movement so it never fires
+// during a drag.
+function attachLongPress(el, fn) {
+    let timer = 0;
+    const cancel = () => { if (timer) { clearTimeout(timer); timer = 0; } };
+    el.addEventListener("touchstart", () => {
+        cancel();
+        timer = setTimeout(() => { timer = 0; fn(); }, 500);
+    }, {passive: true});
+    el.addEventListener("touchmove", cancel, {passive: true});
+    el.addEventListener("touchend", cancel);
+    el.addEventListener("touchcancel", cancel);
+}
+
+// A small popup anchored to a surface control. Floating rather than appended to the anchor: a panel
+// inside the grid would reflow the pads underneath it, and a surface must not move while you are
+// working on it. Dismisses on click-away, Escape, or opening another.
+function openSurfacePopup(anchorEl, title, build) {
+    document.querySelectorAll(".surface-popup").forEach(p => p.remove());
+    const pop = document.createElement("div");
+    pop.className = "surface-popup";
+
+    const head = document.createElement("div");
+    head.className = "surface-popup-title";
+    head.textContent = title;
+    pop.appendChild(head);
+
+    const body = document.createElement("div");
+    body.className = "surface-popup-body";
+    pop.appendChild(body);
+    // One teardown for every exit path (click-away, Escape, or a button calling close()): removing
+    // the popup without detaching the document listeners leaked a pair per open.
+    let away = null, esc = null;
+    const close = () => {
+        pop.remove();
+        if (away) document.removeEventListener("mousedown", away);
+        if (esc) document.removeEventListener("keydown", esc);
+    };
+    build(body, close);
+
+    document.body.appendChild(pop);
+    // Anchor below-right of the control, then pull back inside the viewport if that would overflow.
+    const r = anchorEl.getBoundingClientRect();
+    pop.style.left = `${Math.min(r.left, window.innerWidth - pop.offsetWidth - 8)}px`;
+    pop.style.top = `${Math.min(r.bottom + 4, window.innerHeight - pop.offsetHeight - 8)}px`;
+
+    // Defer so the click that opened it does not immediately close it.
+    setTimeout(() => {
+        away = (e) => { if (!pop.contains(e.target)) close(); };
+        esc = (e) => { if (e.key === "Escape") close(); };
+        document.addEventListener("mousedown", away);
+        document.addEventListener("keydown", esc);
+    }, 0);
+    return pop;
+}
+
+// The edit form behind a right-click on a pad: rename, choose what it captures, save over it, or
+// delete. These are the SAME operations the card's bottom controls performed, moved onto the thing
+// they act on — a form at the bottom of the card cannot say which pad it means.
+// What a preset captures: exactly ONE of the four top-level subtrees. A radio group rather than four
+// checkboxes, so "a look" and "a geometry" are the only things expressible — the combinations that
+// used to be possible were the hard part to explain and the hard part to display.
+function buildCaptureToggles(body, moduleName) {
+    const mod = findModule(moduleName);
+    const ctrl = mod && (mod.controls || []).find(c => c.name === "captures");
+    if (!ctrl) return;
+    const names = Array.isArray(ctrl.options) && ctrl.options.length
+        ? ctrl.options : ["Layouts", "Layers", "Drivers", "Services"];
+    const wrap = document.createElement("div");
+    wrap.className = "surface-popup-captures";
+    names.forEach((n, i) => {
+        const lab = document.createElement("label");
+        lab.className = "surface-popup-capture";
+        const rb = document.createElement("input");
+        rb.type = "radio";
+        rb.name = `capture-${moduleName}`;
+        rb.checked = Number(ctrl.value) === i;
+        rb.addEventListener("change", () => { if (rb.checked) sendControl(moduleName, "captures", i); });
+        lab.append(rb, document.createTextNode(n));
+        wrap.appendChild(lab);
+    });
+    const cap = document.createElement("div");
+    cap.className = "surface-popup-caption";
+    cap.textContent = "captures";
+    body.append(cap, wrap);
+}
+
+function openPadEditor(anchorEl, moduleName, ctrlName, item, slot) {
+    const filled = item != null;
+    openSurfacePopup(anchorEl, filled ? `pad: ${item.name}` : `pad ${slot + 1} (empty)`, (body, close) => {
+        if (filled) {
+            const nameRow = document.createElement("div");
+            nameRow.className = "surface-popup-row";
+            const nameLbl = document.createElement("span");
+            nameLbl.textContent = "name";
+            const nameIn = document.createElement("input");
+            nameIn.type = "text";
+            nameIn.className = "list-field-input";
+            nameIn.value = item.name || "";
+            nameIn.addEventListener("change", async () => {
+                await listSetField(moduleName, ctrlName, item.id, "name", nameIn.value);
+                refetchState();
+            });
+            nameRow.append(nameLbl, nameIn);
+            body.appendChild(nameRow);
+
+            // What this preset carries, read from the file rather than the form.
+            if (item.captures) {
+                const cap = document.createElement("div");
+                cap.className = "surface-popup-row";
+                cap.textContent = `captures ${item.captures}`;
+                body.appendChild(cap);
+            }
+            // Re-saving over the pad: the toggles decide what the NEW contents carry.
+            buildCaptureToggles(body, moduleName);
+            const over = document.createElement("button");
+            over.className = "surface-popup-primary";
+            over.textContent = "save current state over it";
+            over.addEventListener("click", async () => {
+                await sendControl(moduleName, "name", item.name);
+                await sendControl(moduleName, "slot", slot);
+                await sendControl(moduleName, "save", 1);
+                close();
+                refetchState();
+            });
+            body.appendChild(over);
+
+            const del = document.createElement("button");
+            del.className = "surface-popup-danger";
+            del.textContent = "delete preset";
+            del.addEventListener("click", async () => {
+                await listDeleteRow(moduleName, ctrlName, item.id);
+                close();
+                refetchState();
+            });
+            body.appendChild(del);
+        } else {
+            // An empty pad's action is to fill it: name it and save the current state here.
+            const nameRow = document.createElement("div");
+            nameRow.className = "surface-popup-row";
+            const nameLbl = document.createElement("span");
+            nameLbl.textContent = "name";
+            const nameIn = document.createElement("input");
+            nameIn.type = "text";
+            nameIn.className = "list-field-input";
+            nameIn.placeholder = "new preset";
+            nameRow.append(nameLbl, nameIn);
+            body.appendChild(nameRow);
+            buildCaptureToggles(body, moduleName);
+
+            const saveBtn = document.createElement("button");
+            saveBtn.className = "surface-popup-primary";
+            saveBtn.textContent = "save current state here";
+            saveBtn.addEventListener("click", async () => {
+                if (!nameIn.value.trim()) { nameIn.focus(); return; }
+                // The module's own `name` + `slot` + `save` controls do the work; the popup is only
+                // the form that fills them, so the save path stays the one the tests cover.
+                await sendControl(moduleName, "name", nameIn.value.trim());
+                await sendControl(moduleName, "slot", slot);
+                await sendControl(moduleName, "save", 1);
+                close();
+                refetchState();
+            });
+            body.appendChild(saveBtn);
+            setTimeout(() => nameIn.focus(), 0);
+        }
+    });
+}
+
+// A rotary knob driving a range input. The input stays in the DOM (hidden) so every other path —
+// the WS live patch, defaults, keyboard — keeps working against it unchanged; this only draws the
+// value and turns drags into value changes.
+/// "What does this strip drive?" — the same popup for an encoder and a fader, since the question and
+/// the answer are identical for both. Right-click on a pointer, long-press on touch.
+function attachTargetPopup(row, input, ctrl) {
+    const show = () => openSurfacePopup(input, ctrl.name, (body) => {
+        const line = document.createElement("div");
+        line.className = "surface-popup-row";
+        line.textContent = ctrl.target ? `drives ${ctrl.target}` : "unassigned — no target yet";
+        body.appendChild(line);
+    });
+    row.addEventListener("contextmenu", (e) => { e.preventDefault(); show(); });
+    attachLongPress(row, show);
+}
+
+function buildKnob(input, ctrl) {
+    // Read the bounds LIVE rather than snapshotting them: the caller assigns input.min/max/value
+    // after this returns, so a snapshot here is NaN and the dial draws against nothing.
+    const bounds = () => {
+        const lo = Number(input.min), hi = Number(input.max);
+        return [Number.isFinite(lo) ? lo : 0, Number.isFinite(hi) ? hi : 255];
+    };
+    const wrap = document.createElement("div");
+    wrap.className = "knob";
+    const NS = "http://www.w3.org/2000/svg";
+    const svg = document.createElementNS(NS, "svg");
+    svg.setAttribute("viewBox", "0 0 40 40");
+    // The arc runs from 7 o'clock to 5 o'clock — the 270° sweep a real encoder cap shows, with the
+    // gap at the bottom so the pointer never sits in an ambiguous place.
+    const track = document.createElementNS(NS, "circle");
+    track.setAttribute("cx", "20"); track.setAttribute("cy", "20"); track.setAttribute("r", "15");
+    track.setAttribute("class", "knob-track");
+    const fill = document.createElementNS(NS, "circle");
+    fill.setAttribute("cx", "20"); fill.setAttribute("cy", "20"); fill.setAttribute("r", "15");
+    fill.setAttribute("class", "knob-fill");
+    const pointer = document.createElementNS(NS, "line");
+    pointer.setAttribute("class", "knob-pointer");
+    svg.append(track, fill, pointer);
+    wrap.appendChild(svg);
+
+    const CIRC = 2 * Math.PI * 15;
+    const SWEEP = 0.75;                       // 270° of the circle
+    // rotate() as an ATTRIBUTE, not CSS: a CSS transform on an SVG geometry element resolves against
+    // a different origin and drew a quarter arc instead of the intended 270°.
+    track.setAttribute("transform", "rotate(135 20 20)");
+    fill.setAttribute("transform", "rotate(135 20 20)");
+    track.setAttribute("stroke-dasharray", `${CIRC * SWEEP} ${CIRC}`);
+    const draw = () => {
+        const [min, max] = bounds();
+        const v = Number(input.value);
+        const frac = max > min ? Math.min(1, Math.max(0, (v - min) / (max - min))) : 0;
+        fill.style.strokeDasharray = `${CIRC * SWEEP * frac} ${CIRC}`;
+        // 135° is the 7 o'clock start; sweep clockwise from there.
+        const ang = (135 + frac * 270) * Math.PI / 180;
+        pointer.setAttribute("x1", String(20 + 6 * Math.cos(ang)));
+        pointer.setAttribute("y1", String(20 + 6 * Math.sin(ang)));
+        pointer.setAttribute("x2", String(20 + 13 * Math.cos(ang)));
+        pointer.setAttribute("y2", String(20 + 13 * Math.sin(ang)));
+    };
+    draw();
+    // Redraw when the value changes from anywhere — a drag here, or a WS push patching the input.
+    input.addEventListener("input", draw);
+    input.addEventListener("change", draw);
+    wrap._redraw = draw;
+
+    // Vertical drag turns the knob: up increases. 150px of travel covers the full range, which is
+    // fine for a coarse control and keeps the gesture inside a card.
+    // The gesture needs to be discoverable: without a hint the knob looks like a picture, and the
+    // range input underneath makes the browser offer a resize cursor that suggests the wrong action.
+    wrap.title = "drag up/down or scroll to turn";
+    wrap.addEventListener("pointerdown", (e) => {
+        e.preventDefault();
+        wrap.setPointerCapture(e.pointerId);
+        wrap.classList.add("knob-turning");
+        const startY = e.clientY, startV = Number(input.value);
+        const [min, max] = bounds();
+        const move = (ev) => {
+            const delta = (startY - ev.clientY) / 150 * (max - min);
+            const next = Math.round(Math.min(max, Math.max(min, startV + delta)));
+            if (next === Number(input.value)) return;
+            input.value = String(next);
+            input.dispatchEvent(new Event("input", {bubbles: true}));
+        };
+        // Every termination path runs this once: pointerup, but also pointercancel and
+        // lostpointercapture, which fire when the browser takes the gesture over (scroll, a system
+        // gesture). Without them the move listener stayed attached and the knob kept turning.
+        let ended = false;
+        const up = (ev) => {
+            if (ended) return;
+            ended = true;
+            wrap.classList.remove("knob-turning");
+            if (ev && ev.pointerId != null && wrap.hasPointerCapture(ev.pointerId))
+                wrap.releasePointerCapture(ev.pointerId);
+            wrap.removeEventListener("pointermove", move);
+            wrap.removeEventListener("pointerup", up);
+            wrap.removeEventListener("pointercancel", up);
+            wrap.removeEventListener("lostpointercapture", up);
+            input.dispatchEvent(new Event("change", {bubbles: true}));
+        };
+        wrap.addEventListener("pointermove", move);
+        wrap.addEventListener("pointerup", up);
+        wrap.addEventListener("pointercancel", up);
+        wrap.addEventListener("lostpointercapture", up);
+    });
+    // Scroll to turn: the gesture people try first on anything round, and the one that works without
+    // knowing the drag exists. `passive:false` so the page does not scroll underneath it.
+    wrap.addEventListener("wheel", (e) => {
+        e.preventDefault();
+        const [min, max] = bounds();
+        const step = Math.max(1, Math.round((max - min) / 100));
+        const next = Math.round(Math.min(max, Math.max(min,
+            Number(input.value) + (e.deltaY < 0 ? step : -step))));
+        if (next === Number(input.value)) return;
+        input.value = String(next);
+        input.dispatchEvent(new Event("input", {bubbles: true}));
+        input.dispatchEvent(new Event("change", {bubbles: true}));
+    }, {passive: false});
+    return wrap;
+}
+
+// A seven-segment readout, the way the hardware shows a value: three digits, lit segments over an
+// unlit ghost so the display reads like a real LED module rather than plain text.
+const SEG7 = {
+    "0": "abcdef", "1": "bc", "2": "abdeg", "3": "abcdg", "4": "bcfg",
+    "5": "acdfg", "6": "acdefg", "7": "abc", "8": "abcdefg", "9": "abcdfg", " ": "",
+};
+function buildSevenSeg(input) {
+    const NS = "http://www.w3.org/2000/svg";
+    const wrap = document.createElement("div");
+    wrap.className = "seg7";
+    const svg = document.createElementNS(NS, "svg");
+    svg.setAttribute("viewBox", "0 0 42 20");
+    // Segment geometry per digit, in the standard a..g naming.
+    const seg = (x, y, horiz) => {
+        const p = document.createElementNS(NS, "rect");
+        p.setAttribute("x", String(x)); p.setAttribute("y", String(y));
+        p.setAttribute("width", horiz ? "7" : "2");
+        p.setAttribute("height", horiz ? "2" : "7");
+        p.setAttribute("rx", "1");
+        return p;
+    };
+    const digits = [];
+    for (let d = 0; d < 3; d++) {
+        const ox = d * 14 + 1;
+        const map = {
+            a: seg(ox + 2, 1, true),  b: seg(ox + 9, 2, false), c: seg(ox + 9, 11, false),
+            d: seg(ox + 2, 17, true), e: seg(ox, 11, false),    f: seg(ox, 2, false),
+            g: seg(ox + 2, 9, true),
+        };
+        for (const el of Object.values(map)) { el.setAttribute("class", "seg7-off"); svg.appendChild(el); }
+        digits.push(map);
+    }
+    wrap.appendChild(svg);
+    const draw = () => {
+        // Right-aligned, blank-padded: "  7", " 42", "255" — how a 3-digit module displays.
+        const txt = String(Math.round(Number(input.value))).padStart(3, " ").slice(-3);
+        digits.forEach((map, i) => {
+            const on = SEG7[txt[i]] ?? "";
+            for (const [name, el] of Object.entries(map))
+                el.setAttribute("class", on.includes(name) ? "seg7-on" : "seg7-off");
+        });
+    };
+    draw();
+    input.addEventListener("input", draw);
+    input.addEventListener("change", draw);
+    // Same hook the knob exposes, so redrawRangeDecorations refreshes both without knowing what
+    // either one is.
+    wrap._redraw = draw;
+    return wrap;
+}
+
+function buildListPads(container, rows, opts) {
+    const moduleName = opts && opts.moduleName;
+    const ctrlName = opts && opts.ctrlName;
+    const editable = !!(opts && opts.editable);
+    const cols = (opts && opts.gridCols) | 0;
+    const gridRows = (opts && opts.gridRows) | 0;
+    const fixed = cols > 0 && gridRows > 0;
+    container.replaceChildren();
+    const grid = document.createElement("div");
+    grid.className = "list-pads" + (fixed ? " list-pads-fixed" : "");
+    // Columns track --surface-col, the ONE width the knob strips and fader strips also use, so the
+    // three banks line up as columns of a single surface. It is a clamp() against the card, so the
+    // alignment survives the right pane being dragged narrower or wider.
+    if (fixed) grid.style.gridTemplateColumns = `repeat(${cols}, var(--surface-col))`;
+    container.appendChild(grid);
+    if (!fixed && rows.length === 0) {
+        const empty = document.createElement("div");
+        empty.className = "list-empty";
+        empty.textContent = "(none)";
+        container.appendChild(empty);
+        return;
+    }
+    // On a FIXED surface every cell is rendered, occupied or not: an empty cell is a position you
+    // can drop a pad onto, which is what makes the grid a surface rather than a wrapped list.
+    const cells = fixed ? new Array(cols * gridRows).fill(null) : rows.slice();
+    if (fixed) for (const r of rows) {
+        const s = (r && r.slot) | 0;
+        if (s >= 0 && s < cells.length) cells[s] = r;
+    }
+    cells.forEach((item, i) => {
+        if (fixed && item == null) {
+            // An empty cell: a drop target and nothing else. It carries the slot index so a drop
+            // knows where it landed.
+            // A button, not a div: an empty cell is an ACTION (create a preset here), so it must be
+            // reachable and activatable from the keyboard like every other pad.
+            const hole = document.createElement("button");
+            hole.type = "button";
+            hole.className = "list-pad list-pad-empty";
+            hole.title = `pad ${i + 1} (empty) — click to save the current state here`;
+            hole.addEventListener("click", () => openPadEditor(hole, moduleName, ctrlName, null, i));
+            hole.addEventListener("dragover", (e) => {
+                e.preventDefault();
+                e.dataTransfer.dropEffect = "move";
+                hole.classList.add("list-drop-target");
+            });
+            hole.addEventListener("dragleave", () => hole.classList.remove("list-drop-target"));
+            hole.addEventListener("contextmenu", (e) => {
+                e.preventDefault();
+                openPadEditor(hole, moduleName, ctrlName, null, i);
+            });
+            attachLongPress(hole, () => openPadEditor(hole, moduleName, ctrlName, null, i));
+            hole.addEventListener("drop", (e) => {
+                e.preventDefault();
+                hole.classList.remove("list-drop-target");
+                const draggedId = parseInt(e.dataTransfer.getData("text/plain"));
+                if (!Number.isNaN(draggedId)) listMoveRow(moduleName, ctrlName, draggedId, i);
+            });
+            grid.appendChild(hole);
+            return;
+        }
+        const pad = document.createElement("button");
+        pad.type = "button";
+        pad.className = "list-pad" + (item && item.active ? " list-pad-active" : "");
+        // A pad is tinted by the roles it carries, so what a preset covers reads as color as well as
+        // emoji. When it is lit, the tint comes from the roles it still HOLDS (activeRoles): a mixed
+        // preset whose layer was superseded but whose layout is still on stays lit in the layout hue.
+        const padRoles = Array.isArray(item && item.roles) ? item.roles : [];
+        const litRoles = Array.isArray(item && item.activeRoles) ? item.activeRoles : [];
+        const hue = roleHue(litRoles.length ? litRoles : padRoles);
+        if (hue) pad.style.setProperty("--pad-hue", hue);
+        const label = String((item && item.name) ?? "");
+        // Role emoji through the SAME table the module cards use, so 🥞 means the same thing on a pad
+        // as on a card. A row that carries no roles simply gets no emoji.
+        const roles = Array.isArray(item && item.roles) ? item.roles : [];
+        const emoji = roles.map(r => ROLE_EMOJI[r] || "").join("");
+        if (emoji) {
+            const em = document.createElement("span");
+            em.className = "list-pad-emoji";
+            em.textContent = emoji;
+            pad.appendChild(em);
+        }
+        const nameEl = document.createElement("span");
+        nameEl.className = "list-pad-name";
+        nameEl.textContent = label;
+        pad.appendChild(nameEl);
+        pad.title = emoji ? `${label} (${roles.join(", ")})` : label;   // the full name when truncated
+        pad.addEventListener("click", async () => {
+            if (item == null || item.id == null) return;
+            pad.disabled = true;
+            // An ACTION field: the arrival is the whole message, so the value is unused. (The tests
+            // call setListRowField directly and pass the request BODY, which is why they read "{}".)
+            await listSetField(moduleName, ctrlName, item.id, "activate", "");
+            refetchState();
+            pad.disabled = false;
+        });
+        // Right-click edits the pad rather than triggering it: the controls belong on the thing they
+        // configure, not in a form at the bottom of the card that cannot say which pad it means.
+        pad.addEventListener("contextmenu", (e) => {
+            e.preventDefault();
+            openPadEditor(pad, moduleName, ctrlName, item, (item && item.slot) | 0);
+        });
+        // Touch has no right button, so a long press opens the same editor. Cancelled by movement so
+        // a drag to reorder is not mistaken for a press-and-hold.
+        attachLongPress(pad, () => openPadEditor(pad, moduleName, ctrlName, item, (item && item.slot) | 0));
+        // Drag to reorder, so a grid can be arranged to match a physical control surface. Same
+        // mechanism the list rows use (listMoveRow by stable id), and the same reason the ids are
+        // stable: a reorder must not change what a pad refers to.
+        if (editable && item && item.id != null) {
+            pad.draggable = true;
+            pad.addEventListener("dragstart", (e) => {
+                e.dataTransfer.effectAllowed = "move";
+                e.dataTransfer.setData("text/plain", String(item.id));
+                pad.classList.add("list-dragging");
+            });
+            pad.addEventListener("dragend", () => {
+                pad.classList.remove("list-dragging");
+                grid.querySelectorAll(".list-drop-target").forEach(el => el.classList.remove("list-drop-target"));
+            });
+            pad.addEventListener("dragover", (e) => {
+                e.preventDefault();
+                e.dataTransfer.dropEffect = "move";
+                pad.classList.add("list-drop-target");
+            });
+            pad.addEventListener("dragleave", () => pad.classList.remove("list-drop-target"));
+            pad.addEventListener("drop", (e) => {
+                e.preventDefault();
+                pad.classList.remove("list-drop-target");
+                const draggedId = parseInt(e.dataTransfer.getData("text/plain"));
+                if (!Number.isNaN(draggedId) && draggedId !== item.id) {
+                    // `i` is the SLOT on a fixed grid (the cell), or the row index on a flowing one.
+                    listMoveRow(moduleName, ctrlName, draggedId, i);
+                }
+            });
+        }
+        grid.appendChild(pad);
+    });
+}
+
 function buildListEntries(container, rows, details, openSet, opts) {
+    if (opts && opts.pads) { buildListPads(container, rows, opts); return; }
     const editable = !!(opts && opts.editable);
     const moduleName = opts && opts.moduleName;
     const ctrlName = opts && opts.ctrlName;
@@ -2118,6 +2722,22 @@ function fillEditableListDetail(panel, detail, moduleName, ctrlName, id, optionS
         if (f.readonly) {
             vEl.textContent = String(f.value ?? "");
             vEl.classList.add("list-detail-muted");
+        } else if (f.type === "button") {
+            // A row ACTION rather than a value: the click PATCHes the field like any edit, and the
+            // source reads the arrival as "do this to this row" (ControlModule's preset `apply`).
+            // Generic on purpose — a row button is a primitive the list has lacked, not a
+            // preset-specific affordance. Refetches, because an action typically changes the row set
+            // or the wider tree, unlike a field edit which the WS push reconciles.
+            const btn = document.createElement("button");
+            btn.className = "list-field-btn";
+            btn.textContent = f.label || f.name;
+            btn.addEventListener("click", async () => {
+                btn.disabled = true;
+                await listSetField(moduleName, ctrlName, id, f.name, "");
+                refetchState();
+                btn.disabled = false;
+            });
+            vEl.appendChild(btn);
         } else if (f.type === "select") {
             const sel = document.createElement("select");
             sel.className = "list-field-input";
@@ -2416,6 +3036,19 @@ function applyStatePatch(patch) {
     }
 }
 
+/// Refresh the decorations drawn ON TOP of a range input (the knob dial, the seven-segment readout).
+///
+/// A WebSocket patch assigns `input.value` directly, which fires NEITHER `input` NOR `change` — those
+/// only fire for user gestures. Anything listening for them therefore keeps showing the value it was
+/// built with, which is why the readouts read 880/50 while the knobs pointed elsewhere. Call this
+/// wherever a range input's value is set programmatically.
+function redrawRangeDecorations(input) {
+    if (!input) return;
+    for (const el of input.parentElement ? input.parentElement.children : []) {
+        if (typeof el._redraw === "function") el._redraw();
+    }
+}
+
 function updateValues() {
     if (!state || !state.modules) return;
     // Patch each visible card's controls and stats line; never rebuild the DOM here.
@@ -2585,10 +3218,15 @@ function updateModuleControls(mod) {
             case "int16":
             case "pin": {   // pin is a plain number input (no slider sibling); patches the same way
                 const input = document.querySelector(`input[data-mid="${mid}"][data-key="${k}"]`);
+                // While the demo sweep animates a control, leave it alone: the sweep restores the
+                // real value when it ends, and the next patch after that lands normally.
+                if (input && surfaceDemoRunning() &&
+                    (input.classList.contains("encoder-input") || input.classList.contains("fader-input"))) break;
                 if (input && Number(input.value) !== Number(ctrl.value)) {
                     input.value = ctrl.value ?? 0;
                     const val = input.nextElementSibling;
                     if (val && val.classList.contains("control-value-input")) val.value = ctrl.value ?? 0;
+                    redrawRangeDecorations(input);
                 }
                 break;
             }
@@ -2728,8 +3366,8 @@ function updateModuleControls(mod) {
                 // would jump a long list back to the top mid-edit of a row further down.
                 const prevScroll = list.querySelector(".list-scroll")?.scrollTop ?? 0;
                 buildListEntries(list, rows, details, open,
-                    {editable: ctrl.editable, moduleName: mod.name, ctrlName: ctrl.name,
-                     optionSets: ctrl.optionSets || {}});
+                    {editable: ctrl.editable, pads: ctrl.pads, gridCols: ctrl.gridCols, gridRows: ctrl.gridRows,
+                     moduleName: mod.name, ctrlName: ctrl.name, optionSets: ctrl.optionSets || {}});
                 const newScroll = list.querySelector(".list-scroll");
                 if (newScroll) newScroll.scrollTop = prevScroll;
                 break;
@@ -2790,6 +3428,24 @@ const ROLE_EMOJI = {
     generic:    "⚙️",
 };
 
+// Role → hue, the color half of the same vocabulary ROLE_EMOJI carries. Four capturable roles get a
+// distinct hue so a preset pad says what it covers before its name is read. Hues (not full colors) so
+// one value drives the face, the border and the glow at different mixes, and so several roles can be
+// averaged into one tint.
+const ROLE_HUE = {
+    layout:   210,   // blue
+    layer:    280,   // violet
+    driver:   150,   // green
+    service:   35,   // amber
+};
+
+/// The tint for a preset's role. A preset carries exactly one role, so this is a lookup: a file
+/// naming several is one an older build wrote, and gets no tint because it cannot be applied.
+function roleHue(roles) {
+    const hues = (roles || []).map(r => ROLE_HUE[r]).filter(h => h != null);
+    return hues.length === 1 ? String(hues[0]) : null;
+}
+
 // Dim int → emoji. Only effects carry `dim` (1/2/3); other modules have dim == 0
 // and contribute nothing here. Same MoonLight key. Keeps emojiTagsFor() the
 // single place that assembles the chip set per type.
diff --git a/src/ui/style.css b/src/ui/style.css
index 2973174f..9aa1104d 100644
--- a/src/ui/style.css
+++ b/src/ui/style.css
@@ -807,6 +807,296 @@ body.cards-resizing {
     border: 1px solid var(--border);
     border-radius: 4px;
 }
+/* A grid of uniform pads (the `pads` list presentation). auto-fill with a minimum track means the
+   same rule serves a handful of named preset pads and a dense field of numbered channel pads: the
+   grid simply fits more per row as the card widens, and wraps rather than scrolling sideways.
+   Uniform size is the point — a pad sized to its label gives a ragged grid that is harder to scan
+   and to hit, so a long name truncates instead of stretching its pad. */
+/* A ROTARY ENCODER: a range input drawn as a knob. Consecutive encoders form a row above the pads,
+   where both the X-Touch and the QCon put theirs. The input itself is a short horizontal range that
+   the knob face sits on — dragging it turns the value, which is the same gesture as a real encoder
+   without needing pointer-capture maths. */
+/* THE surface column. Knob strips, pads and fader strips all size against this one value, so the
+   three banks read as columns of a single control surface rather than three independently-wrapped
+   rows. clamp() rather than a fixed width so the columns follow the card when the right pane is
+   dragged narrower or wider, which is the behaviour the cards already have. The upper bound stops a
+   wide pane from inflating 8 columns into something that pushes the surface off-screen. */
+.card { --surface-col: clamp(26px, 5.2vw, 52px); }
+
+.control-encoder {
+    margin: 0;              /* strips sit in a row; the generic 6px row margin doubled the gaps */
+    /* Inline-flex siblings collapse whitespace differently per browser; box-sizing keeps the strip
+       exactly one --surface-col wide whatever padding lands on it. */
+    box-sizing: border-box;
+    display: inline-flex;
+    flex-direction: column;
+    align-items: center;
+    width: var(--surface-col);
+    vertical-align: top;
+    gap: 2px;
+}
+/* Order within a strip: knob, readout, then the name underneath — the way the hardware is laid out
+   and read. `order` does it without changing the DOM the generic control builder produces. */
+/* The generic .control-label is `flex: 0 0 100px` for the label column of a normal row. Inside a
+   52px strip that forced a 100px box, which is where the dead space between the knobs and the pads
+   came from. A strip's label is just its name under the control. */
+.control-encoder .control-label,
+.control-fader   .control-label { flex: 0 0 auto; text-align: center; }
+.control-encoder .control-label      { order: 3; font-size: 10px; }
+.control-encoder .knob               { order: 1; }
+.control-encoder .seg7               { order: 2; }
+.control-encoder .control-value-input,
+.control-fader   .control-value-input { display: none; }   /* the readout replaces the number box */
+/* The range input still exists and still owns the value, keyboard access and the WS patch path — the
+   knob is drawn on top of it, so it is hidden rather than removed. */
+/* Hidden but still focusable, so the value/keyboard/WS paths keep working. `position:absolute`
+   takes it out of flow — left in flow it added a phantom row between the knobs and the pads. */
+.encoder-input {
+    position: absolute; opacity: 0; pointer-events: none;
+    width: 1px; height: 1px; margin: 0; padding: 0;
+}
+
+.knob { width: 40px; height: 40px; touch-action: none; }
+/* The SVG is decoration: every pointer event belongs to the wrapper, which owns the drag and the
+   pointer capture. Without this the press lands on a <circle> and the capture never governs it,
+   so the knob looked interactive and did nothing. */
+.knob svg, .knob svg * { pointer-events: none; }
+.knob svg { display: block; width: 100%; height: 100%; }
+/* Both arcs are set from JS (dasharray + a rotate transform attribute), because the geometry
+   depends on the radius and the value. Only the colours live here. */
+.knob-track { fill: none; stroke: var(--border); stroke-width: 4; }
+.knob-fill  { fill: none; stroke: var(--accent); stroke-width: 4; stroke-linecap: round; }
+.knob-pointer { stroke: var(--fg); stroke-width: 2; stroke-linecap: round; }
+
+/* A seven-segment readout: lit segments over unlit ghosts, so it reads as a real LED module. */
+.seg7 { width: 42px; height: 20px; }
+.seg7 svg { display: block; width: 100%; height: 100%; }
+.seg7-on  { fill: #ff3b30; }
+.seg7-off { fill: #ff3b30; opacity: 0.12; }
+
+/* A floating popup anchored to a surface control: the place a pad or a fader is CONFIGURED, as
+   opposed to triggered. Floating rather than inline so opening one does not reflow the surface
+   underneath it. */
+.surface-popup {
+    position: fixed;
+    z-index: 40;
+    min-width: 200px;
+    background: var(--bg-1);
+    border: 1px solid var(--accent-soft);
+    border-radius: 6px;
+    padding: 8px;
+    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.45);
+}
+.surface-popup-title { font-size: 12px; color: var(--accent); margin-bottom: 6px; }
+.surface-popup-body { display: flex; flex-direction: column; gap: 6px; }
+.surface-popup-row { display: flex; align-items: center; gap: 6px; font-size: 12px; }
+.surface-popup-row span { min-width: 44px; color: var(--fg-dim, var(--fg)); }
+.surface-popup-primary,
+.surface-popup-danger {
+    padding: 4px 8px;
+    font-size: 12px;
+    border-radius: 4px;
+    cursor: pointer;
+}
+.surface-popup-primary { background: var(--accent); color: var(--bg); border: 1px solid var(--accent); }
+.surface-popup-danger  { background: transparent; color: #f87171; border: 1px solid #f87171; }
+
+/* A FADER: the same range input stood on end. Consecutive fader rows collapse into one bank via
+   flex, so six faders read as a bank rather than six stacked rows. `writing-mode` is the modern
+   vertical-range mechanism (no transform hacks, so the hit area stays correct). */
+.control-fader {
+    margin: 0;
+    box-sizing: border-box;
+    width: var(--surface-col);
+    display: inline-flex;
+    flex-direction: column-reverse;   /* label under the fader, like a channel strip */
+    align-items: center;
+    vertical-align: top;
+    gap: 4px;
+}
+.control-fader .control-label { font-size: 11px; }
+.fader-input {
+    writing-mode: vertical-lr;
+    direction: rtl;                   /* max at the top, the way a physical fader reads */
+    width: 24px;
+    height: 120px;
+    accent-color: var(--accent);
+}
+
+.list-pads {
+    display: grid;
+    grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
+    gap: 3px;
+    max-height: 220px;
+    overflow-y: auto;
+}
+/* A pad reads as a lit physical key rather than a flat button: a translucent face over the card,
+   a bright top edge where the light lands, and a soft glow that grows when it is the active preset.
+   `color-mix` keeps it one rule for both themes, since it tints the theme's own tokens rather than
+   hard-coding two palettes. */
+/* `--pad-hue` is set per pad from the roles it carries (roleHue in app.js). `--pad-tint` resolves to
+   that hue when present and to the theme foreground when not, so one set of rules serves a tinted pad
+   and an untinted one. */
+.list-pad {
+    --pad-tint: var(--fg);
+
+    padding: 6px 4px;
+    font-size: 12px;
+    background:
+        linear-gradient(to bottom,
+            color-mix(in srgb, var(--pad-tint) 26%, transparent),
+            color-mix(in srgb, var(--pad-tint) 11%, transparent));
+    color: var(--fg);
+    border: 1px solid color-mix(in srgb, var(--pad-tint) 34%, transparent);
+    border-top-color: color-mix(in srgb, var(--pad-tint) 48%, transparent);
+    border-radius: 7px;
+    backdrop-filter: blur(6px);
+    box-shadow:
+        inset 0 1px 0 color-mix(in srgb, var(--fg) 22%, transparent),
+        0 1px 2px rgba(0, 0, 0, 0.18);
+    transition: background 120ms ease, box-shadow 120ms ease, border-color 120ms ease;
+    cursor: pointer;
+}
+/* A pad that carries roles: the tint becomes the mixed role hue. Full saturation is reserved for the
+   lit state, so an idle pad is a hint of color rather than a block of it. */
+.list-pad[style*="--pad-hue"] {
+    --pad-tint: hsl(var(--pad-hue) 70% 60%);
+    /* One line, ellipsised: the pad keeps its size whatever the name is; the full name is in the
+       title attribute for a hover. */
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+}
+/* Emoji above, name below: the roles read at a glance, the name is what identifies the pad. */
+/* A FIXED surface: every cell is rendered, so the grid keeps its shape as pads come and go. Square
+   cells, because a control surface is a grid of equal pads rather than a wrapped list. */
+/* Pad size is CLAMPED, not a plain fraction of the card. With `1fr` columns a wide card stretched
+   each cell to ~120px and pushed the faders off-screen; a fixed size instead leaves a wide card
+   cramped and unable to use the room. So: grow with the card, but stop — the surface stays visible
+   whole at any card width, which is the point of a surface. The columns are set in JS (the count is
+   the grid's, not the CSS's); this bounds what each one may become. */
+.list-pads-fixed {
+    grid-auto-rows: auto;
+    justify-content: start;
+    max-height: none;
+}
+/* A fixed surface is a field of keys on the card, not a list in a box: the enclosing border and the
+   scroll box that a flowing list needs would draw a frame around the grid. */
+.control-list-row:has(.list-pads-fixed) .list-control {
+    border: none;
+    border-radius: 0;
+    overflow: visible;
+}
+.control-list-row:has(.list-pads-fixed) .list-scroll {
+    max-height: none;
+    overflow: visible;
+}
+/* The three banks share a column WIDTH; they must also share the spacing between columns, or the pads
+   drift out of line with the knobs after a few columns. The strips are inline-flex siblings (each IS
+   a .control-row), so their spacing is a margin rather than the grid's gap. */
+.list-pads-fixed { gap: 4px; }
+.control-encoder,
+.control-fader { margin-right: 4px; }
+.list-pads-fixed .list-pad {
+    aspect-ratio: 1 / 1;
+    padding: 2px;
+    font-size: 10px;
+}
+.list-pads-fixed .list-pad-emoji { font-size: 9px; }
+/* On a small pad a single ellipsised line loses too much ("grid la..."), so wrap to two lines and
+   clip there — two short lines identify a preset where one truncated line does not. The full name
+   is still on the pad's title for a hover. */
+.list-pads-fixed .list-pad-name {
+    white-space: normal;
+    overflow-wrap: anywhere;
+    line-height: 1.15;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+}
+/* An empty cell is a real position: visible enough to aim a drop at, quiet enough not to read as a
+   button that does something. */
+/* An empty slot is an UNLIT key, not a dashed hole: the same glass puck in grey, so the surface reads
+   as a full grid of keys of which some are lit. Dashed outlines read as a form field, which is what
+   the grid is trying not to look like. */
+.list-pad-empty {
+    background:
+        linear-gradient(to bottom,
+            color-mix(in srgb, var(--fg) 11%, transparent),
+            color-mix(in srgb, var(--fg) 4%, transparent));
+    border-color: color-mix(in srgb, var(--fg) 15%, transparent);
+    border-top-color: color-mix(in srgb, var(--fg) 22%, transparent);
+    box-shadow:
+        inset 0 1px 0 color-mix(in srgb, var(--fg) 10%, transparent),
+        0 1px 2px rgba(0, 0, 0, 0.12);
+    cursor: default;
+}
+/* Two classes, so this outranks the generic .list-pad:hover declared further down: an empty cell
+   must stay quiet on hover rather than lighting like a real key. */
+.list-pad.list-pad-empty:hover {
+    background:
+        linear-gradient(to bottom,
+            color-mix(in srgb, var(--fg) 13%, transparent),
+            color-mix(in srgb, var(--fg) 5%, transparent));
+    border-color: color-mix(in srgb, var(--fg) 20%, transparent);
+}
+.list-pad-emoji { display: block; font-size: 11px; line-height: 1.2; }
+.list-pad-name  { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.list-pad:hover { border-color: var(--accent); }
+.list-pad.list-dragging { opacity: 0.4; }
+.list-pad.list-drop-target { border-color: var(--accent); border-style: dashed; }
+.list-pad:disabled { opacity: 0.5; cursor: default; }
+/* The row currently active, so the grid answers "what is on right now" without a click. */
+/* Hover lifts the face a little, so a pad answers the pointer before it is clicked. */
+.list-pad:hover {
+    background:
+        linear-gradient(to bottom,
+            color-mix(in srgb, var(--pad-tint) 24%, transparent),
+            color-mix(in srgb, var(--pad-tint) 10%, transparent));
+    border-color: color-mix(in srgb, var(--pad-tint) 32%, transparent);
+}
+.list-pad:active { box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.25); }
+
+/* The applied preset: the accent lights the face from within rather than filling it flat, so the
+   name stays readable and the pad still looks like the same key, lit. */
+.list-pad-active {
+    --pad-tint: var(--accent);
+
+    background:
+        linear-gradient(to bottom,
+            color-mix(in srgb, var(--pad-tint) 62%, transparent),
+            color-mix(in srgb, var(--pad-tint) 34%, transparent));
+    border-color: color-mix(in srgb, var(--pad-tint) 78%, transparent);
+    box-shadow:
+        inset 0 1px 0 color-mix(in srgb, #fff 35%, transparent),
+        0 0 10px color-mix(in srgb, var(--pad-tint) 50%, transparent);
+}
+/* A lit pad WITH roles glows in its own hue, which is what lets a layout preset and a layer preset
+   both stay lit and stay distinguishable. */
+.list-pad-active[style*="--pad-hue"] { --pad-tint: hsl(var(--pad-hue) 75% 58%); }
+.list-pad-active:hover {
+    background:
+        linear-gradient(to bottom,
+            color-mix(in srgb, var(--pad-tint) 76%, transparent),
+            color-mix(in srgb, var(--pad-tint) 46%, transparent));
+}
+
+/* A row ACTION (the `button` field type): sized like the row's other inputs so a row of fields and
+   actions reads as one set, but styled as a button so it is obvious it does something rather than
+   holding a value. */
+.list-field-btn {
+    flex: 1; min-width: 0;
+    padding: 3px 6px;
+    font-size: 12px;
+    background: var(--accent);
+    color: var(--bg);
+    border: 1px solid var(--accent);
+    border-radius: 4px;
+    cursor: pointer;
+}
+.list-field-btn:disabled { opacity: 0.5; cursor: default; }
+
 .list-add-btn {
     display: block;
     width: 100%;
@@ -1352,3 +1642,48 @@ body.cards-resizing {
     padding: 10px 14px; border-top: 1px solid var(--border);
 }
 .fm-editor-status { color: var(--fg-muted); font-size: 0.85rem; }
+
+/* The capture toggles inside a pad popup: what a preset carries. A compact two-column grid so the
+   four of them cost one popup row rather than four. */
+.surface-popup-caption {
+    font-size: 10px;
+    text-transform: uppercase;
+    letter-spacing: 0.06em;
+    color: var(--fg-muted);
+    margin-top: 4px;
+}
+.surface-popup-captures {
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 2px 8px;
+}
+.surface-popup-capture {
+    display: flex;
+    align-items: center;
+    gap: 5px;
+    font-size: 11px;
+    cursor: pointer;
+}
+.surface-popup-capture input { margin: 0; }
+
+/* The knob is turned by dragging or scrolling; without a cursor hint it reads as a picture, and the
+   range input underneath offers a resize cursor that suggests the wrong gesture. */
+.knob { cursor: grab; }
+/* The range input is visually hidden, so a keyboard user had no focus feedback at all. The knob sits
+   BEFORE the input in the DOM, so a sibling combinator cannot reach it; scoping from the strip does. */
+.control-encoder:has(.encoder-input:focus-visible) .knob-track { stroke: var(--accent); }
+.control-encoder:has(.encoder-input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 6px; }
+.knob.knob-turning { cursor: grabbing; }
+.knob:hover .knob-track { stroke: color-mix(in srgb, var(--fg) 40%, transparent); }
+
+/* Surface demo sweep (REMOVABLE): the chasing pad during the power-on sweep. Delete with the
+   startSurfaceDemo block in app.js. */
+.list-pad-demo {
+    background:
+        linear-gradient(to bottom,
+            color-mix(in srgb, var(--pad-tint) 70%, transparent),
+            color-mix(in srgb, var(--pad-tint) 40%, transparent));
+    box-shadow:
+        inset 0 1px 0 color-mix(in srgb, #fff 40%, transparent),
+        0 0 12px color-mix(in srgb, var(--pad-tint) 55%, transparent);
+}
diff --git a/test/CMakeLists.txt b/test/CMakeLists.txt
index 3466da2f..27c3f5ea 100644
--- a/test/CMakeLists.txt
+++ b/test/CMakeLists.txt
@@ -26,6 +26,8 @@ add_executable(mm_tests
     unit/core/unit_PinsModule.cpp
     unit/core/unit_WledPacket.cpp
     unit/core/unit_FilesystemModule_persistence.cpp
+    unit/core/unit_ControlModule.cpp
+    unit/core/unit_FilesystemModule_subtree.cpp
     unit/core/unit_FirmwareUpdateModule.cpp
     unit/core/unit_HttpServerModule_apply.cpp
     unit/core/unit_ImprovFrame.cpp
diff --git a/test/scenarios/light/scenario_Audio_mutation.json b/test/scenarios/light/scenario_Audio_mutation.json
index ee7b1ac9..a18eb9fa 100644
--- a/test/scenarios/light/scenario_Audio_mutation.json
+++ b/test/scenarios/light/scenario_Audio_mutation.json
@@ -106,7 +106,7 @@
         "desktop-macos": {
           "tick_us": [
             8,
-            226
+            234
           ],
           "free_heap": [
             0,
@@ -118,7 +118,7 @@
           ],
           "at": [
             "2026-06-12",
-            "2026-07-15"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
@@ -308,7 +308,7 @@
         "desktop-macos": {
           "tick_us": [
             8,
-            88
+            390
           ],
           "free_heap": [
             0,
@@ -320,7 +320,7 @@
           ],
           "at": [
             "2026-06-13",
-            "2026-07-10"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
@@ -401,7 +401,7 @@
         "desktop-macos": {
           "tick_us": [
             8,
-            111
+            533
           ],
           "free_heap": [
             0,
@@ -413,7 +413,7 @@
           ],
           "at": [
             "2026-06-12",
-            "2026-07-10"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
@@ -492,7 +492,7 @@
         "desktop-macos": {
           "tick_us": [
             8,
-            133
+            488
           ],
           "free_heap": [
             0,
@@ -504,7 +504,7 @@
           ],
           "at": [
             "2026-06-12",
-            "2026-07-15"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
diff --git a/test/scenarios/light/scenario_Driver_mutation.json b/test/scenarios/light/scenario_Driver_mutation.json
index 582907c4..7ede1d4e 100644
--- a/test/scenarios/light/scenario_Driver_mutation.json
+++ b/test/scenarios/light/scenario_Driver_mutation.json
@@ -77,7 +77,7 @@
         "desktop-macos": {
           "tick_us": [
             8,
-            81
+            148
           ],
           "free_heap": [
             0,
@@ -89,7 +89,7 @@
           ],
           "at": [
             "2026-06-13",
-            "2026-07-10"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
@@ -170,7 +170,7 @@
         "desktop-macos": {
           "tick_us": [
             8,
-            101
+            103
           ],
           "free_heap": [
             0,
@@ -182,7 +182,7 @@
           ],
           "at": [
             "2026-06-13",
-            "2026-07-30"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
@@ -263,7 +263,7 @@
         "desktop-macos": {
           "tick_us": [
             8,
-            95
+            173
           ],
           "free_heap": [
             0,
@@ -275,7 +275,7 @@
           ],
           "at": [
             "2026-06-13",
-            "2026-07-10"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
@@ -354,7 +354,7 @@
         "desktop-macos": {
           "tick_us": [
             8,
-            83
+            114
           ],
           "free_heap": [
             0,
@@ -366,7 +366,7 @@
           ],
           "at": [
             "2026-06-13",
-            "2026-07-10"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
@@ -445,7 +445,7 @@
         "desktop-macos": {
           "tick_us": [
             8,
-            81
+            96
           ],
           "free_heap": [
             0,
@@ -457,7 +457,7 @@
           ],
           "at": [
             "2026-06-13",
-            "2026-07-10"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
diff --git a/test/scenarios/light/scenario_GridBlacks_blackpixel.json b/test/scenarios/light/scenario_GridBlacks_blackpixel.json
index 3880e29f..5d54bbd5 100644
--- a/test/scenarios/light/scenario_GridBlacks_blackpixel.json
+++ b/test/scenarios/light/scenario_GridBlacks_blackpixel.json
@@ -91,7 +91,7 @@
         "desktop-macos": {
           "tick_us": [
             1,
-            7
+            9
           ],
           "free_heap": [
             0,
@@ -103,7 +103,7 @@
           ],
           "at": [
             "2026-07-22",
-            "2026-07-30"
+            "2026-07-31"
           ]
         },
         "esp32s3-n16r8": {
@@ -172,7 +172,7 @@
         "desktop-macos": {
           "tick_us": [
             1,
-            8
+            15
           ],
           "free_heap": [
             0,
@@ -184,7 +184,7 @@
           ],
           "at": [
             "2026-07-22",
-            "2026-07-28"
+            "2026-07-31"
           ]
         },
         "esp32s3-n16r8": {
diff --git a/test/scenarios/light/scenario_Layers_composition.json b/test/scenarios/light/scenario_Layers_composition.json
index aae11f8a..f579e203 100644
--- a/test/scenarios/light/scenario_Layers_composition.json
+++ b/test/scenarios/light/scenario_Layers_composition.json
@@ -107,7 +107,7 @@
         "desktop-macos": {
           "tick_us": [
             52,
-            909
+            1385
           ],
           "free_heap": [
             0,
@@ -119,7 +119,7 @@
           ],
           "at": [
             "2026-06-25",
-            "2026-07-10"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
diff --git a/test/scenarios/light/scenario_Layouts_mutation.json b/test/scenarios/light/scenario_Layouts_mutation.json
index 128c9755..ce1ddbf0 100644
--- a/test/scenarios/light/scenario_Layouts_mutation.json
+++ b/test/scenarios/light/scenario_Layouts_mutation.json
@@ -79,7 +79,7 @@
         "desktop-macos": {
           "tick_us": [
             8,
-            123
+            303
           ],
           "free_heap": [
             0,
@@ -91,7 +91,7 @@
           ],
           "at": [
             "2026-06-05",
-            "2026-07-27"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
@@ -194,7 +194,7 @@
         "desktop-macos": {
           "tick_us": [
             9,
-            253
+            897
           ],
           "free_heap": [
             0,
@@ -206,7 +206,7 @@
           ],
           "at": [
             "2026-06-05",
-            "2026-06-27"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
@@ -304,7 +304,7 @@
         "desktop-macos": {
           "tick_us": [
             10,
-            511
+            1389
           ],
           "free_heap": [
             0,
@@ -316,7 +316,7 @@
           ],
           "at": [
             "2026-06-05",
-            "2026-06-27"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
@@ -413,7 +413,7 @@
         "desktop-macos": {
           "tick_us": [
             8,
-            151
+            205
           ],
           "free_heap": [
             0,
@@ -425,7 +425,7 @@
           ],
           "at": [
             "2026-06-05",
-            "2026-07-01"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
diff --git a/test/scenarios/light/scenario_MoonLiveEffect_livescript.json b/test/scenarios/light/scenario_MoonLiveEffect_livescript.json
index 73649f95..6bb744c5 100644
--- a/test/scenarios/light/scenario_MoonLiveEffect_livescript.json
+++ b/test/scenarios/light/scenario_MoonLiveEffect_livescript.json
@@ -414,7 +414,7 @@
         "desktop-macos": {
           "tick_us": [
             0,
-            28
+            59
           ],
           "free_heap": [
             0,
@@ -426,7 +426,7 @@
           ],
           "at": [
             "2026-06-26",
-            "2026-07-15"
+            "2026-07-31"
           ]
         },
         "esp32s3-n16r8": {
diff --git a/test/scenarios/light/scenario_modifier_chain.json b/test/scenarios/light/scenario_modifier_chain.json
index 68b9e97d..6e5062d3 100644
--- a/test/scenarios/light/scenario_modifier_chain.json
+++ b/test/scenarios/light/scenario_modifier_chain.json
@@ -194,7 +194,7 @@
         "desktop-macos": {
           "tick_us": [
             18,
-            153
+            186
           ],
           "free_heap": [
             0,
@@ -206,7 +206,7 @@
           ],
           "at": [
             "2026-06-26",
-            "2026-07-01"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
@@ -241,7 +241,7 @@
         "desktop-macos": {
           "tick_us": [
             32,
-            530
+            675
           ],
           "free_heap": [
             0,
@@ -253,7 +253,7 @@
           ],
           "at": [
             "2026-06-26",
-            "2026-07-15"
+            "2026-07-31"
           ]
         },
         "desktop-windows": {
diff --git a/test/scenarios/light/scenario_modifier_swap.json b/test/scenarios/light/scenario_modifier_swap.json
index ca7d7f64..6e149ab8 100644
--- a/test/scenarios/light/scenario_modifier_swap.json
+++ b/test/scenarios/light/scenario_modifier_swap.json
@@ -152,7 +152,7 @@
         "desktop-macos": {
           "tick_us": [
             6,
-            56
+            71
           ],
           "free_heap": [
             0,
@@ -164,7 +164,7 @@
           ],
           "at": [
             "2026-06-07",
-            "2026-07-28"
+            "2026-07-31"
           ]
         },
         "esp32-eth": {
@@ -274,7 +274,7 @@
         "desktop-macos": {
           "tick_us": [
             17,
-            239
+            260
           ],
           "free_heap": [
             0,
@@ -286,7 +286,7 @@
           ],
           "at": [
             "2026-06-07",
-            "2026-07-01"
+            "2026-07-31"
           ]
         },
         "esp32-eth": {
diff --git a/test/scenarios/light/scenario_perf_full.json b/test/scenarios/light/scenario_perf_full.json
index acd66ca4..ba92e16c 100644
--- a/test/scenarios/light/scenario_perf_full.json
+++ b/test/scenarios/light/scenario_perf_full.json
@@ -405,7 +405,7 @@
         "desktop-macos": {
           "tick_us": [
             0,
-            10
+            19
           ],
           "free_heap": [
             0,
@@ -417,7 +417,7 @@
           ],
           "at": [
             "2026-06-17",
-            "2026-07-04"
+            "2026-07-31"
           ]
         },
         "esp32s3-n16r8": {
@@ -517,7 +517,7 @@
         "desktop-macos": {
           "tick_us": [
             0,
-            15
+            18
           ],
           "free_heap": [
             0,
@@ -529,7 +529,7 @@
           ],
           "at": [
             "2026-06-17",
-            "2026-07-15"
+            "2026-07-31"
           ]
         },
         "esp32s3-n16r8": {
@@ -622,7 +622,7 @@
         "desktop-macos": {
           "tick_us": [
             0,
-            13
+            14
           ],
           "free_heap": [
             0,
@@ -634,7 +634,7 @@
           ],
           "at": [
             "2026-06-17",
-            "2026-07-15"
+            "2026-07-31"
           ]
         },
         "esp32s3-n16r8": {
@@ -858,7 +858,7 @@
         "desktop-macos": {
           "tick_us": [
             0,
-            13
+            14
           ],
           "free_heap": [
             0,
@@ -870,7 +870,7 @@
           ],
           "at": [
             "2026-06-17",
-            "2026-07-01"
+            "2026-07-31"
           ]
         },
         "esp32s3-n16r8": {
@@ -943,7 +943,7 @@
         "desktop-macos": {
           "tick_us": [
             0,
-            11
+            14
           ],
           "free_heap": [
             0,
@@ -955,7 +955,7 @@
           ],
           "at": [
             "2026-06-17",
-            "2026-07-01"
+            "2026-07-31"
           ]
         },
         "esp32p4-eth": {
@@ -1034,7 +1034,7 @@
         "desktop-macos": {
           "tick_us": [
             0,
-            10
+            15
           ],
           "free_heap": [
             0,
@@ -1046,7 +1046,7 @@
           ],
           "at": [
             "2026-06-17",
-            "2026-07-01"
+            "2026-07-31"
           ]
         },
         "esp32s3-n16r8": {
@@ -1145,7 +1145,7 @@
         "desktop-macos": {
           "tick_us": [
             1,
-            32
+            58
           ],
           "free_heap": [
             0,
@@ -1157,7 +1157,7 @@
           ],
           "at": [
             "2026-06-17",
-            "2026-07-10"
+            "2026-07-31"
           ]
         },
         "esp32s3-n16r8": {
@@ -1256,7 +1256,7 @@
         "desktop-macos": {
           "tick_us": [
             3,
-            125
+            148
           ],
           "free_heap": [
             0,
@@ -1268,7 +1268,7 @@
           ],
           "at": [
             "2026-06-17",
-            "2026-07-10"
+            "2026-07-31"
           ]
         },
         "esp32s3-n16r8": {
@@ -1486,7 +1486,7 @@
         "desktop-macos": {
           "tick_us": [
             3,
-            59
+            60
           ],
           "free_heap": [
             0,
@@ -1498,7 +1498,7 @@
           ],
           "at": [
             "2026-06-17",
-            "2026-07-16"
+            "2026-07-31"
           ]
         },
         "esp32s3-n16r8": {
@@ -1597,7 +1597,7 @@
         "desktop-macos": {
           "tick_us": [
             14,
-            98
+            117
           ],
           "free_heap": [
             0,
@@ -1609,7 +1609,7 @@
           ],
           "at": [
             "2026-06-17",
-            "2026-07-10"
+            "2026-07-31"
           ]
         },
         "esp32s3-n16r8": {
@@ -1708,7 +1708,7 @@
         "desktop-macos": {
           "tick_us": [
             62,
-            504
+            540
           ],
           "free_heap": [
             0,
@@ -1720,7 +1720,7 @@
           ],
           "at": [
             "2026-06-17",
-            "2026-07-22"
+            "2026-07-31"
           ]
         },
         "esp32s3-n16r8": {
@@ -1956,7 +1956,7 @@
         "desktop-macos": {
           "tick_us": [
             1,
-            15
+            72
           ],
           "free_heap": [
             0,
@@ -2289,7 +2289,7 @@
         "desktop-macos": {
           "tick_us": [
             61,
-            769
+            1936
           ],
           "free_heap": [
             0,
@@ -2301,7 +2301,7 @@
           ],
           "at": [
             "2026-06-17",
-            "2026-07-04"
+            "2026-07-31"
           ]
         },
         "esp32": {
diff --git a/test/scenarios/light/scenario_peripheral_grid_sweep.json b/test/scenarios/light/scenario_peripheral_grid_sweep.json
index bc1bd77e..0ef71561 100644
--- a/test/scenarios/light/scenario_peripheral_grid_sweep.json
+++ b/test/scenarios/light/scenario_peripheral_grid_sweep.json
@@ -156,7 +156,7 @@
         "desktop-macos": {
           "tick_us": [
             4,
-            21
+            34
           ],
           "free_heap": [
             0,
@@ -168,7 +168,7 @@
           ],
           "at": [
             "2026-07-26",
-            "2026-07-28"
+            "2026-07-31"
           ]
         }
       }
@@ -234,7 +234,7 @@
         "desktop-macos": {
           "tick_us": [
             17,
-            52
+            128
           ],
           "free_heap": [
             0,
@@ -246,7 +246,7 @@
           ],
           "at": [
             "2026-07-26",
-            "2026-07-28"
+            "2026-07-31"
           ]
         }
       }
@@ -312,7 +312,7 @@
         "desktop-macos": {
           "tick_us": [
             68,
-            245
+            357
           ],
           "free_heap": [
             0,
@@ -324,7 +324,7 @@
           ],
           "at": [
             "2026-07-26",
-            "2026-07-30"
+            "2026-07-31"
           ]
         }
       }
@@ -390,7 +390,7 @@
         "desktop-macos": {
           "tick_us": [
             273,
-            1115
+            1427
           ],
           "free_heap": [
             0,
@@ -402,7 +402,7 @@
           ],
           "at": [
             "2026-07-26",
-            "2026-07-28"
+            "2026-07-31"
           ]
         }
       }
@@ -489,7 +489,7 @@
         "desktop-macos": {
           "tick_us": [
             4,
-            13
+            21
           ],
           "free_heap": [
             0,
@@ -501,7 +501,7 @@
           ],
           "at": [
             "2026-07-26",
-            "2026-07-28"
+            "2026-07-31"
           ]
         }
       }
@@ -567,7 +567,7 @@
         "desktop-macos": {
           "tick_us": [
             17,
-            56
+            90
           ],
           "free_heap": [
             0,
@@ -579,7 +579,7 @@
           ],
           "at": [
             "2026-07-26",
-            "2026-07-28"
+            "2026-07-31"
           ]
         }
       }
@@ -723,7 +723,7 @@
         "desktop-macos": {
           "tick_us": [
             273,
-            984
+            1357
           ],
           "free_heap": [
             0,
@@ -735,7 +735,7 @@
           ],
           "at": [
             "2026-07-26",
-            "2026-07-28"
+            "2026-07-31"
           ]
         }
       }
@@ -822,7 +822,7 @@
         "desktop-macos": {
           "tick_us": [
             4,
-            20
+            22
           ],
           "free_heap": [
             0,
@@ -834,7 +834,7 @@
           ],
           "at": [
             "2026-07-26",
-            "2026-07-28"
+            "2026-07-31"
           ]
         }
       }
@@ -978,7 +978,7 @@
         "desktop-macos": {
           "tick_us": [
             68,
-            347
+            382
           ],
           "free_heap": [
             0,
@@ -990,7 +990,7 @@
           ],
           "at": [
             "2026-07-26",
-            "2026-07-28"
+            "2026-07-31"
           ]
         }
       }
@@ -1056,7 +1056,7 @@
         "desktop-macos": {
           "tick_us": [
             271,
-            945
+            1482
           ],
           "free_heap": [
             0,
@@ -1068,7 +1068,7 @@
           ],
           "at": [
             "2026-07-26",
-            "2026-07-30"
+            "2026-07-31"
           ]
         }
       }
@@ -1155,7 +1155,7 @@
         "desktop-macos": {
           "tick_us": [
             4,
-            19
+            22
           ],
           "free_heap": [
             0,
@@ -1167,7 +1167,7 @@
           ],
           "at": [
             "2026-07-26",
-            "2026-07-28"
+            "2026-07-31"
           ]
         }
       }
@@ -1233,7 +1233,7 @@
         "desktop-macos": {
           "tick_us": [
             17,
-            56
+            94
           ],
           "free_heap": [
             0,
@@ -1245,7 +1245,7 @@
           ],
           "at": [
             "2026-07-26",
-            "2026-07-28"
+            "2026-07-31"
           ]
         }
       }
@@ -1311,7 +1311,7 @@
         "desktop-macos": {
           "tick_us": [
             68,
-            284
+            365
           ],
           "free_heap": [
             0,
@@ -1389,7 +1389,7 @@
         "desktop-macos": {
           "tick_us": [
             273,
-            1357
+            1485
           ],
           "free_heap": [
             0,
@@ -1401,7 +1401,7 @@
           ],
           "at": [
             "2026-07-26",
-            "2026-07-28"
+            "2026-07-31"
           ]
         }
       }
diff --git a/test/scenarios/light/scenario_peripheral_switch.json b/test/scenarios/light/scenario_peripheral_switch.json
index 8b26beef..966485e3 100644
--- a/test/scenarios/light/scenario_peripheral_switch.json
+++ b/test/scenarios/light/scenario_peripheral_switch.json
@@ -254,7 +254,7 @@
         "desktop-macos": {
           "tick_us": [
             4,
-            15
+            31
           ],
           "free_heap": [
             0,
@@ -266,7 +266,7 @@
           ],
           "at": [
             "2026-07-24",
-            "2026-07-28"
+            "2026-07-31"
           ]
         },
         "esp32p4-eth": {
@@ -433,7 +433,7 @@
         "desktop-macos": {
           "tick_us": [
             4,
-            20
+            21
           ],
           "free_heap": [
             0,
@@ -445,7 +445,7 @@
           ],
           "at": [
             "2026-07-24",
-            "2026-07-28"
+            "2026-07-31"
           ]
         },
         "esp32p4-eth": {
@@ -629,7 +629,7 @@
         "desktop-macos": {
           "tick_us": [
             4,
-            15
+            22
           ],
           "free_heap": [
             0,
@@ -641,7 +641,7 @@
           ],
           "at": [
             "2026-07-24",
-            "2026-07-28"
+            "2026-07-31"
           ]
         },
         "esp32p4-eth": {
diff --git a/test/unit/core/unit_ControlModule.cpp b/test/unit/core/unit_ControlModule.cpp
new file mode 100644
index 00000000..56e9dfc2
--- /dev/null
+++ b/test/unit/core/unit_ControlModule.cpp
@@ -0,0 +1,826 @@
+// @module ControlModule
+// @also FilesystemModule, Scheduler
+
+// Presets end to end: a preset is a file, saving writes one, selecting reads it back. These pin the
+// behaviour a user would describe — save a look, change it, get it back — plus the ways a preset
+// file can be wrong, since a device that loses its state to a bad file is worse than one with no
+// presets at all.
+
+#include "doctest.h"
+#include "core/ControlModule.h"
+#include "core/FilesystemModule.h"
+#include "core/ModuleFactory.h"
+#include "core/Scheduler.h"
+#include "light/effects/NoiseEffect.h"
+#include "light/effects/RainbowEffect.h"
+#include "light/layers/Layer.h"
+#include "light/layers/Layers.h"
+#include "light/drivers/Drivers.h"
+#include "platform/platform.h"
+
+#include <cstdio>
+#include <cstring>
+#include <filesystem>
+#include <string>
+
+namespace {
+
+// A device with Layers and a ControlModule, built the way production builds one: through the
+// factory, with an isolated filesystem so the assertions do not depend on what is on this machine.
+struct Device {
+    mm::Scheduler scheduler;
+    mm::FilesystemModule* fs = nullptr;
+    mm::ControlModule* control = nullptr;
+    mm::MoonModule* layers = nullptr;
+    mm::MoonModule* drivers = nullptr;
+    char root_[256] = {};
+
+    Device() {
+        // A monotonic counter, not millis(): two fixtures constructed in the same millisecond would
+        // otherwise share a root and see each other's preset files.
+        static unsigned seq = 0;
+        std::snprintf(root_, sizeof(root_), "/tmp/mm_preset_test_%u", ++seq);
+        std::filesystem::remove_all(root_);
+        mm::platform::fsSetRoot(root_);
+
+        mm::ModuleFactory::registerType<mm::Layers>("Layers");
+        mm::ModuleFactory::registerType<mm::Layer>("Layer");
+        mm::ModuleFactory::registerType<mm::NoiseEffect>("NoiseEffect");
+        mm::ModuleFactory::registerType<mm::RainbowEffect>("RainbowEffect");
+        mm::ModuleFactory::registerType<mm::ControlModule>("ControlModule");
+        mm::ModuleFactory::registerType<mm::Drivers>("Drivers");
+
+        fs = new mm::FilesystemModule();
+        fs->setTypeName("FilesystemModule");
+        fs->setScheduler(&scheduler);
+        layers = mm::ModuleFactory::create("Layers");
+        drivers = mm::ModuleFactory::create("Drivers");
+        control = static_cast<mm::ControlModule*>(mm::ModuleFactory::create("ControlModule"));
+        scheduler.addModule(fs);
+        scheduler.addModule(layers);
+        scheduler.addModule(drivers);
+        scheduler.addModule(control);
+        scheduler.setup();
+    }
+
+    ~Device() { std::filesystem::remove_all(root_); }   // don't leave a directory per test behind
+
+    mm::MoonModule* add(mm::MoonModule* parent, const char* type) {
+        auto* m = mm::ModuleFactory::create(type);
+        REQUIRE(m != nullptr);
+        parent->addChild(m);
+        m->defineControls();
+        m->setup();
+        return m;
+    }
+
+    /// Set a control's text value. The change hook is NOT fired here — a test that needs it calls
+    /// press() explicitly, which is what the UI does as a second step.
+    void setText(const char* controlName, const char* value) {
+        auto& cs = control->controls();
+        for (uint8_t i = 0; i < cs.count(); i++) {
+            if (std::strcmp(cs[i].name, controlName) != 0) continue;
+            std::snprintf(static_cast<char*>(cs[i].ptr), static_cast<size_t>(cs[i].max), "%s", value);
+            return;
+        }
+        FAIL("no control named ", controlName);
+    }
+
+    /// What the next save captures: exactly one of Layouts / Layers / Drivers / Services.
+    void setCapture(const char* typeName) {
+        auto& cs = control->controls();
+        for (uint8_t i = 0; i < cs.count(); i++) {
+            if (std::strcmp(cs[i].name, "captures") != 0) continue;
+            for (uint8_t r = 0; r < mm::ControlModule::kCaptureCount; r++) {
+                if (std::strcmp(mm::ControlModule::kCapturable[r], typeName) != 0) continue;
+                *static_cast<uint8_t*>(cs[i].ptr) = r;
+                return;
+            }
+            FAIL("no capturable type named ", typeName);
+        }
+        FAIL("no captures control");
+    }
+
+    void press(const char* button) { control->onControlChanged(button); }
+
+    /// The row JSON for a preset by name, which is how the pad grid is inspected.
+    std::string rowNamed(const char* name) const {
+        for (uint8_t i = 0; i < control->listRowCount(); i++) {
+            mm::JsonSink sink;
+            control->writeListRow(sink, i);
+            std::string row(sink.data(), sink.size());
+            if (row.find(std::string("\"name\":\"") + name + "\"") != std::string::npos) return row;
+        }
+        return "";
+    }
+
+    /// Apply a preset by name, the way a pad click does.
+    void activate(const char* name) {
+        const std::string row = rowNamed(name);
+        REQUIRE_MESSAGE(!row.empty(), "no preset named ", name);
+        const uint32_t id = static_cast<uint32_t>(std::stoul(row.substr(row.find("\"id\":") + 5)));
+        control->setListRowField(id, "activate", "{}");
+    }
+
+    /// The module's own status, the one every module reports through MoonModule::setStatus and the
+    /// UI shows in the card's status chip.
+    const char* status() const { return control->status() ? control->status() : ""; }
+
+    const char* effectType() const {
+        auto* layer = layers->child(0);
+        if (!layer) return "";
+        auto* fx = layer->child(0);
+        return fx ? fx->typeName() : "";
+    }
+
+    /// The stable id of the one preset row, or 0 when the list is empty.
+    uint32_t firstRowId() const {
+        if (control->listRowCount() == 0) return 0;
+        mm::JsonSink sink;
+        control->writeListRow(sink, 0);
+        const std::string row(sink.data(), sink.size());
+        const size_t at = row.find("\"id\":");
+        return at == std::string::npos ? 0 : static_cast<uint32_t>(std::stoul(row.substr(at + 5)));
+    }
+};
+
+}  // namespace
+
+// The feature in one test: keep a look, change it, bring it back.
+TEST_CASE("ControlModule saves a look and puts it back") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+
+    d.setText("name", "sunset");
+    d.press("save");
+    REQUIRE(d.control->listRowCount() == 1);
+
+    // The user moves on to something else.
+    auto* old = layer->replaceChildAt(0, mm::ModuleFactory::create("RainbowEffect"));
+    if (old) { old->release(); mm::Scheduler::deleteTree(old); }
+    REQUIRE(std::strcmp(d.effectType(), "RainbowEffect") == 0);
+
+    d.control->setListRowField(d.firstRowId(), "apply", "{}");
+    CHECK(std::strcmp(d.effectType(), "NoiseEffect") == 0);
+}
+
+// A preset is a file, so the folder is the list: what is on disk is what the user sees.
+TEST_CASE("ControlModule lists one row per preset file") {
+    Device d;
+    d.add(d.layers, "Layer");
+
+    d.setText("name", "one");
+    d.press("save");
+    d.setText("name", "two");
+    d.press("save");
+
+    CHECK(d.control->listRowCount() == 2);
+}
+
+// Deleting a preset deletes its file. Nothing else holds preset state, so there is no second copy
+// that could disagree with the folder.
+TEST_CASE("ControlModule deletes a preset by deleting its file") {
+    Device d;
+    d.add(d.layers, "Layer");
+    d.setText("name", "throwaway");
+    d.press("save");
+    REQUIRE(d.control->listRowCount() == 1);
+
+    CHECK(d.control->deleteListRow(d.firstRowId()));
+    CHECK(d.control->listRowCount() == 0);
+}
+
+// Saving without a name would write ".json" and produce a nameless row, so it is refused with a
+// message rather than silently creating something the user cannot identify.
+TEST_CASE("ControlModule refuses to save a preset with no name") {
+    Device d;
+    d.add(d.layers, "Layer");
+
+    d.press("save");
+    CHECK(d.control->listRowCount() == 0);
+    CHECK(std::string(d.status()).find("name") != std::string::npos);
+}
+
+// A preset carries exactly ONE role, so a file written by an older build that names several is
+// listed but not applied: applying it would do something other than what its name suggests. It stays
+// on the grid (and on disk) so it can be seen and deleted, rather than silently disappearing.
+TEST_CASE("ControlModule refuses to apply a preset carrying several roles") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+
+    const char* body =
+        "{\"captures\":\"Layouts,Layers\","
+        "\"Layers.enabled\":true,"
+        "\"Layers.0.type\":\"Layer\",\"Layers.0.enabled\":true}";
+    mm::platform::fsMkdir(mm::ControlModule::kPresetDir);
+    char path[160];
+    std::snprintf(path, sizeof(path), "%s/legacy.json", mm::ControlModule::kPresetDir);
+    REQUIRE(mm::platform::fsWriteAtomic(path, body, std::strlen(body)));
+    d.control->setup();
+
+    REQUIRE(d.control->listRowCount() == 1);                 // visible, so it can be deleted
+    CHECK(d.control->roleOf(0) == mm::ControlModule::kCaptureCount);   // but it holds no single role
+    CHECK_FALSE(d.control->setListRowField(d.firstRowId(), "apply", "{}"));
+    CHECK(std::string(d.status()).find("several roles") != std::string::npos);
+}
+
+// A preset carrying a module this build does not have applies what it can and says what it skipped:
+// a preset from another board must degrade rather than refuse or crash.
+TEST_CASE("ControlModule refuses a preset whose subtree this build does not have") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+
+    // Hand-written: names a single module type no build registers, so the apply must refuse with a
+    // reason rather than report success for a preset that changed nothing.
+    const std::string body =
+        "{\"captures\":\"NoSuchTopLevelXyz\","
+        "\"Layers.enabled\":true,"
+        "\"Layers.0.type\":\"Layer\",\"Layers.0.enabled\":true,"
+        "\"Layers.0.0.type\":\"NoiseEffect\",\"Layers.0.0.enabled\":true}";
+    mm::platform::fsMkdir(mm::ControlModule::kPresetDir);
+    char path[128];
+    std::snprintf(path, sizeof(path), "%s/mixed.json", mm::ControlModule::kPresetDir);
+    REQUIRE(mm::platform::fsWriteAtomic(path, body.c_str(), body.size()));
+
+    d.control->setup();                      // rescan picks the file up
+    REQUIRE(d.control->listRowCount() == 1);
+
+    CHECK_FALSE(d.control->setListRowField(d.firstRowId(), "apply", "{}"));
+    CHECK(std::string(d.status()).find("nothing this build knows") != std::string::npos);
+}
+
+// A truncated file (an interrupted upload) must leave the device with the look it already had.
+TEST_CASE("ControlModule survives a corrupt preset file") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+
+    mm::platform::fsMkdir(mm::ControlModule::kPresetDir);
+    char path[128];
+    std::snprintf(path, sizeof(path), "%s/broken.json", mm::ControlModule::kPresetDir);
+    const char* truncated = "{\"captures\":\"Layers\",\"Layers.0.ty";
+    REQUIRE(mm::platform::fsWriteAtomic(path, truncated, std::strlen(truncated)));
+
+    d.control->setup();
+    REQUIRE(d.control->listRowCount() == 1);                         // the file IS listed
+    // Apply returns false: the row exists and was attempted, but nothing in it was usable. Asserting
+    // the return as well as the tree is what separates "rejected the bad file" from "silently did
+    // nothing at all", which an unchanged tree alone cannot tell apart.
+    CHECK_FALSE(d.control->setListRowField(d.firstRowId(), "apply", "{}"));
+
+    CHECK(d.layers->childCount() == 1);                              // the tree is untouched
+    CHECK(std::strcmp(d.effectType(), "NoiseEffect") == 0);
+}
+
+// The row says what the preset carries, so a user can tell a portable look from a device snapshot
+// before applying it.
+TEST_CASE("ControlModule shows what each preset captures") {
+    Device d;
+    d.add(d.layers, "Layer");
+    d.setText("name", "look");
+    d.press("save");
+
+    mm::JsonSink sink;
+    d.control->writeListRow(sink, 0);
+    const std::string row(sink.data(), sink.size());
+    CHECK(row.find("\"name\":\"look\"") != std::string::npos);
+    CHECK(row.find("Layers") != std::string::npos);
+}
+
+// The pad grid answers "what is on right now" without a click, so the applied preset marks itself
+// active and any other preset does not.
+TEST_CASE("ControlModule marks the applied preset as the active pad") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+
+    d.setText("name", "first");
+    d.press("save");
+    d.setText("name", "second");
+    d.press("save");
+    REQUIRE(d.control->listRowCount() == 2);
+
+    auto rowJson = [&](uint8_t i) {
+        mm::JsonSink sink;
+        d.control->writeListRow(sink, i);
+        return std::string(sink.data(), sink.size());
+    };
+    // Nothing applied yet: no pad is lit.
+    CHECK(rowJson(0).find("\"active\":true") == std::string::npos);
+    CHECK(rowJson(1).find("\"active\":true") == std::string::npos);
+
+    // Apply one, and exactly that one lights up.
+    mm::JsonSink idSink;
+    d.control->writeListRow(idSink, 0);
+    const std::string first(idSink.data(), idSink.size());
+    const uint32_t id = static_cast<uint32_t>(std::stoul(first.substr(first.find("\"id\":") + 5)));
+    d.control->setListRowField(id, "activate", "{}");
+
+    CHECK(rowJson(0).find("\"active\":true") != std::string::npos);
+    CHECK(rowJson(1).find("\"active\":true") == std::string::npos);
+}
+
+// A pad click and a row button are the same action from two presentations, so both reach apply.
+TEST_CASE("ControlModule applies a preset from either the pad or the row button") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+    d.setText("name", "look");
+    d.press("save");
+
+    auto swapToRainbow = [&] {
+        auto* old = layer->replaceChildAt(0, mm::ModuleFactory::create("RainbowEffect"));
+        if (old) { old->release(); mm::Scheduler::deleteTree(old); }
+    };
+
+    swapToRainbow();
+    CHECK(d.control->setListRowField(d.firstRowId(), "activate", "{}"));   // the pad
+    CHECK(std::strcmp(d.effectType(), "NoiseEffect") == 0);
+
+    swapToRainbow();
+    CHECK(d.control->setListRowField(d.firstRowId(), "apply", "{}"));      // the row button
+    CHECK(std::strcmp(d.effectType(), "NoiseEffect") == 0);
+}
+
+// Pads can be dragged into the order the user wants, so a grid can be arranged to match a physical
+// control surface, and that arrangement survives a rescan — the filesystem's own file order is not
+// the order anyone chose.
+TEST_CASE("ControlModule keeps the pad order the user arranged") {
+    Device d;
+    d.add(d.layers, "Layer");
+    for (const char* n : {"a", "b", "c"}) { d.setText("name", n); d.press("save"); }
+    REQUIRE(d.control->listRowCount() == 3);
+
+    auto nameAt = [&](uint8_t i) {
+        mm::JsonSink sink;
+        d.control->writeListRow(sink, i);
+        const std::string row(sink.data(), sink.size());
+        const size_t at = row.find("\"name\":\"") + 8;
+        return row.substr(at, row.find('"', at) - at);
+    };
+    auto idAt = [&](uint8_t i) {
+        mm::JsonSink sink;
+        d.control->writeListRow(sink, i);
+        const std::string row(sink.data(), sink.size());
+        return static_cast<uint32_t>(std::stoul(row.substr(row.find("\"id\":") + 5)));
+    };
+
+    // Move the last pad to the front, as a drag would.
+    const std::string last = nameAt(2);
+    REQUIRE(d.control->moveListRow(idAt(2), 0));
+    CHECK(nameAt(0) == last);
+
+    // And it is still first after a rescan, because the order lives in the files.
+    d.control->setup();
+    CHECK(nameAt(0) == last);
+}
+
+// A preset says which roles it covers, so a pad can show the same emoji the module cards use and a
+// user can tell a portable look from one that carries the hardware.
+TEST_CASE("ControlModule reports the roles a preset covers") {
+    Device d;
+    d.add(d.layers, "Layer");
+    d.setText("name", "look");
+    d.press("save");
+
+    mm::JsonSink sink;
+    d.control->writeListRow(sink, 0);
+    const std::string row(sink.data(), sink.size());
+    CHECK(row.find("\"roles\":[\"layer\"]") != std::string::npos);   // Layers is captured by default
+}
+
+// Fader 1 rides the global brightness every driver scales by, through the same setControl primitive
+// IR and the network bridges use — so a hardware surface bound to it later drives the device the
+// same way the on-screen fader does.
+TEST_CASE("ControlModule fader 1 drives the global brightness") {
+    Device d;
+    auto brightness = [&] {
+        auto& cs = d.drivers->controls();
+        for (uint8_t i = 0; i < cs.count(); i++)
+            if (std::strcmp(cs[i].name, "brightness") == 0) return *static_cast<uint8_t*>(cs[i].ptr);
+        return static_cast<uint8_t>(0);
+    };
+    const uint8_t before = brightness();
+
+    // Move the fader the way the UI does: set its value, then fire its change hook.
+    auto& cs = d.control->controls();
+    for (uint8_t i = 0; i < cs.count(); i++) {
+        if (std::strcmp(cs[i].name, "fader1") != 0) continue;
+        *static_cast<uint8_t*>(cs[i].ptr) = 200;
+        d.control->onControlChanged("fader1");
+        break;
+    }
+    CHECK(brightness() == 200);
+    CHECK(before != 200);   // the value really moved, rather than already being there
+}
+
+// The unassigned faders have no target yet, so moving one must be inert rather than driving
+// something by accident.
+TEST_CASE("ControlModule an unassigned fader drives nothing") {
+    Device d;
+    auto brightness = [&] {
+        auto& cs = d.drivers->controls();
+        for (uint8_t i = 0; i < cs.count(); i++)
+            if (std::strcmp(cs[i].name, "brightness") == 0) return *static_cast<uint8_t*>(cs[i].ptr);
+        return static_cast<uint8_t>(0);
+    };
+    const uint8_t before = brightness();
+
+    auto& cs = d.control->controls();
+    for (uint8_t i = 0; i < cs.count(); i++) {
+        if (std::strcmp(cs[i].name, "fader3") != 0) continue;
+        *static_cast<uint8_t*>(cs[i].ptr) = 99;
+        d.control->onControlChanged("fader3");
+        break;
+    }
+    CHECK(brightness() == before);
+}
+
+// A save lands on the pad the user right-clicked, not in the first free cell: on a surface, WHERE
+// something goes is the user's choice, and a save that ignored it would scatter presets.
+TEST_CASE("ControlModule saves a preset onto the chosen pad") {
+    Device d;
+    d.add(d.layers, "Layer");
+
+    auto setU8 = [&](const char* name, uint8_t v) {
+        auto& cs = d.control->controls();
+        for (uint8_t i = 0; i < cs.count(); i++)
+            if (std::strcmp(cs[i].name, name) == 0) { *static_cast<uint8_t*>(cs[i].ptr) = v; return; }
+        FAIL("no control named ", name);
+    };
+
+    d.setText("name", "corner");
+    setU8("slot", 20);                 // a pad well away from the first free cell
+    d.press("save");
+
+    mm::JsonSink sink;
+    d.control->writeListRow(sink, 0);
+    const std::string row(sink.data(), sink.size());
+    CHECK(row.find("\"slot\":20") != std::string::npos);
+}
+
+// The encoder row exists and is unassigned: the affordance ships before the binding UI, so an
+// encoder must be inert rather than driving something by accident.
+TEST_CASE("ControlModule has an encoder row that drives nothing yet") {
+    Device d;
+    auto brightness = [&] {
+        auto& cs = d.drivers->controls();
+        for (uint8_t i = 0; i < cs.count(); i++)
+            if (std::strcmp(cs[i].name, "brightness") == 0) return *static_cast<uint8_t*>(cs[i].ptr);
+        return static_cast<uint8_t>(0);
+    };
+    const uint8_t before = brightness();
+
+    auto& cs = d.control->controls();
+    uint8_t found = 0;
+    for (uint8_t i = 0; i < cs.count(); i++) {
+        if (std::strncmp(cs[i].name, "enc", 3) != 0) continue;
+        found++;
+        *static_cast<uint8_t*>(cs[i].ptr) = 123;
+        d.control->onControlChanged(cs[i].name);
+    }
+    CHECK(found == mm::ControlModule::kEncoderCount);
+    CHECK(brightness() == before);     // nothing was driven
+}
+
+
+// Presets hold their roles independently, which is what lets a surface show a layout choice and a
+// look choice lit at the same time. Applying a layer preset replaces the layer holder and leaves the
+// layout one alone, so both pads stay lit and the grid says what is on across all four roles.
+TEST_CASE("ControlModule keeps one active preset per captured role") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+
+    // A driver-only preset and a layer-only preset: two roles, two pads.
+    d.setCapture("Drivers");
+    d.setText("name", "geometry");
+    d.press("save");
+
+    d.setCapture("Layers");
+    d.setText("name", "look");
+    d.press("save");
+    REQUIRE(d.control->listRowCount() == 2);
+
+    d.activate("geometry");
+    CHECK(d.rowNamed("geometry").find("\"active\":true") != std::string::npos);
+
+    // The layer preset claims only the layer role, so the driver pad stays lit.
+    d.activate("look");
+    CHECK(d.rowNamed("look").find("\"active\":true") != std::string::npos);
+    CHECK(d.rowNamed("geometry").find("\"active\":true") != std::string::npos);
+
+    // And each reports WHICH role it holds, which is what the pad colors itself by.
+    CHECK(d.rowNamed("geometry").find("\"activeRoles\":[\"driver\"]") != std::string::npos);
+    CHECK(d.rowNamed("look").find("\"activeRoles\":[\"layer\"]") != std::string::npos);
+}
+
+// Each role is held independently, so applying a look replaces the look and leaves the geometry
+// alone. With one role per preset this is the whole supersede rule.
+TEST_CASE("ControlModule replaces only the role a preset carries") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+
+    d.setCapture("Drivers");
+    d.setText("name", "hardware");  d.press("save");
+    d.setCapture("Layers");
+    d.setText("name", "lookA");     d.press("save");
+    d.setText("name", "lookB");     d.press("save");
+
+    d.activate("hardware");
+    d.activate("lookA");
+    CHECK(d.rowNamed("hardware").find("\"active\":true") != std::string::npos);
+    CHECK(d.rowNamed("lookA").find("\"active\":true") != std::string::npos);
+
+    // A second look takes the layer role from the first; the driver preset is untouched.
+    d.activate("lookB");
+    CHECK(d.rowNamed("lookB").find("\"active\":true") != std::string::npos);
+    CHECK(d.rowNamed("lookA").find("\"active\":true") == std::string::npos);
+    CHECK(d.rowNamed("hardware").find("\"active\":true") != std::string::npos);
+}
+
+
+// Renaming a preset renames its file, so the pad keeps its contents under the new name. The name IS
+// the identity here (there is no id inside the file), which is what makes a rename a file move
+// rather than an edit.
+TEST_CASE("ControlModule renames a preset by renaming its file") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+
+    d.setText("name", "before");
+    d.press("save");
+    REQUIRE(d.control->listRowCount() == 1);
+
+    REQUIRE(d.control->setListRowField(d.firstRowId(), "name", "{\"value\":\"after\"}"));
+    REQUIRE(d.control->listRowCount() == 1);                  // still one preset, not two
+    CHECK(!d.rowNamed("after").empty());
+    CHECK(d.rowNamed("before").empty());
+
+    // The renamed preset still applies, so the rename moved the contents rather than just the label.
+    auto* old = layer->replaceChildAt(0, mm::ModuleFactory::create("RainbowEffect"));
+    if (old) { old->release(); mm::Scheduler::deleteTree(old); }
+    REQUIRE(std::strcmp(d.effectType(), "RainbowEffect") == 0);
+    d.activate("after");
+    CHECK(std::strcmp(d.effectType(), "NoiseEffect") == 0);
+}
+
+// A preset that captures nothing the device has still leaves a usable surface: the row exists, and
+// applying it reports failure rather than silently claiming success. Pins the distinction the status
+// line depends on — "applied" and "nothing applied" must not look the same to the caller.
+TEST_CASE("ControlModule reports an apply that changed nothing") {
+    Device d;
+    d.add(d.layers, "Layer");
+
+    d.setCapture("Layers");
+    d.setText("name", "look");
+    d.press("save");
+    REQUIRE(d.control->listRowCount() == 1);
+
+    // A file whose captures name a subtree this build does not have.
+    char path[160];
+    std::snprintf(path, sizeof(path), "%s/ghost.json", mm::ControlModule::kPresetDir);
+    const char* body = "{\"captures\":\"NoSuchModuleXyz\",\"NoSuchModuleXyz.enabled\":true}";
+    REQUIRE(mm::platform::fsWriteAtomic(path, body, std::strlen(body)));
+    d.control->setup();
+    REQUIRE(d.control->listRowCount() == 2);
+
+    const std::string row = d.rowNamed("ghost");
+    REQUIRE(!row.empty());
+    const uint32_t id = static_cast<uint32_t>(std::stoul(row.substr(row.find("\"id\":") + 5)));
+    CHECK_FALSE(d.control->setListRowField(id, "activate", "{}"));   // nothing applied, and it says so
+}
+
+
+// A preset name becomes a file name, so it must not be able to steer the path out of the preset
+// folder. ESP32's filesystem layer does no path normalization (the desktop one does), so a name
+// carrying `..` would escape on device while looking clean on a developer's machine — and delete and
+// rename write through the same path. The name control's validator is what closes that.
+TEST_CASE("ControlModule refuses a preset name that could escape its folder") {
+    Device d;
+    d.add(d.layers, "Layer");
+
+    auto* nameCtrl = [&]() -> const mm::ControlDescriptor* {
+        auto& cs = d.control->controls();
+        for (uint8_t i = 0; i < cs.count(); i++)
+            if (std::strcmp(cs[i].name, "name") == 0) return &cs[i];
+        return nullptr;
+    }();
+    REQUIRE(nameCtrl != nullptr);
+    REQUIRE(nameCtrl->validate != nullptr);          // the guard is bound, not just written
+
+    // Anything that could steer a path is refused...
+    CHECK_FALSE(nameCtrl->validate("../escape"));
+    CHECK_FALSE(nameCtrl->validate("../../etc/passwd"));
+    CHECK_FALSE(nameCtrl->validate("sub/dir"));
+    CHECK_FALSE(nameCtrl->validate("back\\slash"));
+    CHECK_FALSE(nameCtrl->validate("dot.name"));     // the .json suffix is ours to add
+    CHECK_FALSE(nameCtrl->validate(""));
+
+    // ...while ordinary names a user would pick still work.
+    CHECK(nameCtrl->validate("sunset"));
+    CHECK(nameCtrl->validate("Warm White 2"));
+
+    // And a rename cannot smuggle one in through the row-edit path either.
+    d.setText("name", "safe");
+    d.press("save");
+    REQUIRE(d.control->listRowCount() == 1);
+    CHECK_FALSE(d.control->setListRowField(d.firstRowId(), "name", "{\"value\":\"../escape\"}"));
+    CHECK(!d.rowNamed("safe").empty());              // the preset is untouched
+}
+
+
+// Renaming onto a name that already exists must refuse rather than overwrite: the write would clobber
+// the other preset and the follow-up remove would delete the source, losing a preset the user never
+// named. Same refuse-on-collision stance the pad move takes.
+TEST_CASE("ControlModule refuses to rename a preset over an existing one") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+
+    d.setText("name", "keep");
+    d.press("save");
+    d.setText("name", "other");
+    d.press("save");
+    REQUIRE(d.control->listRowCount() == 2);
+
+    const std::string row = d.rowNamed("other");
+    REQUIRE(!row.empty());
+    const uint32_t id = static_cast<uint32_t>(std::stoul(row.substr(row.find("\"id\":") + 5)));
+
+    CHECK_FALSE(d.control->setListRowField(id, "name", "{\"value\":\"keep\"}"));
+    CHECK(d.control->listRowCount() == 2);         // both survive
+    CHECK(!d.rowNamed("keep").empty());
+    CHECK(!d.rowNamed("other").empty());
+}
+
+
+// The saved file must be valid JSON, not merely readable by our own first-match key helpers: a
+// preset is downloaded, edited and re-uploaded by users and tools. The separator between the header
+// and each namespaced subtree is easy to get wrong in a way our lenient reader would not notice.
+TEST_CASE("ControlModule writes a preset that is well-formed JSON") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+
+    d.setCapture("Layers");
+    d.setText("name", "wellformed");
+    d.press("save");
+
+    char path[160];
+    std::snprintf(path, sizeof(path), "%s/wellformed.json", mm::ControlModule::kPresetDir);
+    const long size = mm::platform::fsSize(path);
+    REQUIRE(size > 0);
+    std::string body(static_cast<size_t>(size) + 1, '\0');
+    REQUIRE(mm::platform::fsRead(path, body.data(), body.size()) > 0);
+    body.resize(std::strlen(body.c_str()));
+
+    // A minimal structural check: balanced braces, no empty pair, and no doubled separator -- the
+    // three ways a hand-assembled object breaks.
+    CHECK(body.front() == '{');
+    CHECK(body.back() == '}');
+    CHECK(body.find(",,") == std::string::npos);
+    CHECK(body.find("{,") == std::string::npos);
+    CHECK(body.find(",}") == std::string::npos);
+    int depth = 0;
+    for (char c : body) { if (c == '{') depth++; else if (c == '}') depth--; }
+    CHECK(depth == 0);
+}
+
+
+// An applied preset must SURVIVE a reboot. Applying rebuilds the live tree, but the boot loader
+// restores from the config file -- so without marking the tree dirty the device renders the preset
+// now and comes back to the previous look after a restart, which reads as "the preset did not save".
+TEST_CASE("ControlModule persists the look a preset applied") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+
+    d.setCapture("Layers");
+    d.setText("name", "keeper");
+    d.press("save");
+
+    // Change the look, and let that change reach the config file.
+    auto* old = layer->replaceChildAt(0, mm::ModuleFactory::create("RainbowEffect"));
+    if (old) { old->release(); mm::Scheduler::deleteTree(old); }
+    d.fs->flush();
+    REQUIRE(std::strcmp(d.effectType(), "RainbowEffect") == 0);
+
+    d.activate("keeper");
+    REQUIRE(std::strcmp(d.effectType(), "NoiseEffect") == 0);   // applied to the LIVE tree
+
+    // The config file must now describe the applied look, not the one it replaced.
+    d.fs->flush();
+    char path[160];
+    std::snprintf(path, sizeof(path), "/.config/%s.json", d.layers->typeName());
+    const long size = mm::platform::fsSize(path);
+    REQUIRE(size > 0);
+    std::string body(static_cast<size_t>(size) + 1, '\0');
+    REQUIRE(mm::platform::fsRead(path, body.data(), body.size()) > 0);
+    body.resize(std::strlen(body.c_str()));
+    CHECK(body.find("NoiseEffect") != std::string::npos);
+    CHECK(body.find("RainbowEffect") == std::string::npos);
+}
+
+
+// Only a pure look may be reachable from outside. A preset that also carries Drivers or Layouts
+// rewires pins or geometry, and an external surface (a voice assistant, an automation) must not be
+// able to do that while it thinks it is picking a colour scheme.
+TEST_CASE("ControlModule exposes only look-only presets to external surfaces") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+
+    d.setCapture("Layers");
+    d.setText("name", "purelook");  d.press("save");
+
+    d.setCapture("Drivers");
+    d.setText("name", "pinsonly");  d.press("save");
+    REQUIRE(d.control->presetCount() == 2);
+
+    auto lookOnlyNamed = [&](const char* n) {
+        for (uint8_t i = 0; i < d.control->presetCount(); i++)
+            if (std::strcmp(d.control->presetName(i), n) == 0) return d.control->isLookOnly(i);
+        FAIL("no preset named ", n);
+        return false;
+    };
+    CHECK(lookOnlyNamed("purelook"));
+    CHECK_FALSE(lookOnlyNamed("pinsonly"));    // hardware, not a look
+
+    // And the apply entry point enforces it, not just the listing: naming a hardware-carrying preset
+    // through the external path is refused outright.
+    CHECK(d.control->applyLookByName("purelook"));
+    CHECK_FALSE(d.control->applyLookByName("pinsonly"));
+    CHECK_FALSE(d.control->applyLookByName("nosuchpreset"));
+
+    CHECK(std::string(d.control->currentLook()) == "purelook");
+}
+
+
+// The Home Assistant effect list is sized from what the device actually has, not from a fixed cap: a
+// cap would either reserve RAM a small setup never uses, or silently publish nothing once the list
+// outgrew it (a truncated config is refused, never sent, so the entity would just vanish).
+TEST_CASE("ControlModule sizes the Home Assistant look list to the presets that exist") {
+    Device d;
+    auto* layer = d.add(d.layers, "Layer");
+    d.add(layer, "NoiseEffect");
+
+    auto lookNames = [&]() {
+        size_t bytes = 0, count = 0;
+        for (uint8_t i = 0; i < d.control->presetCount(); i++) {
+            if (!d.control->isLookOnly(i)) continue;
+            bytes += std::strlen(d.control->presetName(i));
+            count++;
+        }
+        return std::make_pair(count, bytes);
+    };
+
+    // Nothing to publish yet.
+    CHECK(lookNames().first == 0);
+
+    d.setCapture("Layers");
+    d.setText("name", "one");       d.press("save");
+    const auto afterOne = lookNames();
+    CHECK(afterOne.first == 1);
+
+    d.setText("name", "twotwotwo"); d.press("save");
+    const auto afterTwo = lookNames();
+    CHECK(afterTwo.first == 2);
+    CHECK(afterTwo.second > afterOne.second);      // the requirement GREW with the longer name
+
+    // A hardware-carrying preset must not enlarge the list at all: it is never published.
+    d.setCapture("Drivers");
+    d.setText("name", "hardware");  d.press("save");
+    CHECK(lookNames().first == 2);
+    CHECK(lookNames().second == afterTwo.second);
+}
+
+
+// Home Assistant caches the preset list and only re-fetches when the device's presets-modified time
+// changes. A constant there means a preset saved, renamed or deleted after HA set the device up
+// never appears in its dropdown — the endpoint stays correct while HA shows a stale copy forever.
+TEST_CASE("ControlModule stamps a new revision whenever the preset set changes") {
+    Device d;
+    d.add(d.layers, "Layer");
+
+    d.setCapture("Layers");
+    d.setText("name", "first");
+    d.press("save");
+    const uint32_t afterFirst = d.control->presetsModifiedS();
+
+    // Saving another preset must move the stamp, or a consumer caching on it never re-reads.
+    mm::platform::delayMs(1100);            // the stamp has second resolution
+    d.setText("name", "second");
+    d.press("save");
+    CHECK(d.control->presetsModifiedS() > afterFirst);
+
+    // So must a delete: a removed preset has to disappear from a cached list too.
+    const uint32_t afterSecond = d.control->presetsModifiedS();
+    mm::platform::delayMs(1100);
+    REQUIRE(d.control->deleteListRow(d.firstRowId()));
+    CHECK(d.control->presetsModifiedS() > afterSecond);
+}
diff --git a/test/unit/core/unit_FilesystemModule_subtree.cpp b/test/unit/core/unit_FilesystemModule_subtree.cpp
new file mode 100644
index 00000000..1597655a
--- /dev/null
+++ b/test/unit/core/unit_FilesystemModule_subtree.cpp
@@ -0,0 +1,227 @@
+// @module FilesystemModule
+// @also Scheduler, Layer, ControlModule
+
+// The save/apply seams a preset is built on: `saveSubtreeTo` writes a subtree into a caller's buffer
+// rather than to /.config/<TypeName>.json, and `applySubtree` puts those bytes back onto a LIVE tree
+// at runtime, rebuilding whatever shape they describe.
+//
+// Boot already does both halves, but only as one fused operation at startup. What these pin is the
+// runtime behaviour a preset needs and boot never exercises: applying onto a tree that is already
+// set up, with children that must be created, replaced or destroyed while the device runs.
+
+#include "doctest.h"
+#include "core/FilesystemModule.h"
+#include "core/ModuleFactory.h"
+#include "core/Scheduler.h"
+#include "light/effects/NoiseEffect.h"
+#include "light/effects/RainbowEffect.h"
+#include "light/layers/Layer.h"
+#include "light/layers/Layers.h"
+#include "platform/platform.h"
+
+#include <cstdio>
+#include <cstring>
+#include <filesystem>
+#include <string>
+
+namespace {
+
+// A Layers tree the same way production builds one: through the factory, so every module carries a
+// real typeName(). That matters here rather than being ceremony — reconciliation matches children BY
+// TYPE, and a module constructed with `new` has an empty type name that can never match.
+//
+// Children are added AFTER scheduler.setup(), because the boot load trims a live tree down to what
+// its saved file describes: with no file, anything added before setup is deleted during it.
+struct Tree {
+    mm::Scheduler scheduler;
+    mm::FilesystemModule* fs = nullptr;
+    mm::MoonModule* layers = nullptr;
+    char root_[256] = {};
+
+    Tree() {
+        // Isolate the filesystem: without this the boot load reads the developer's real
+        // /.config/Layers.json and the tree arrives with whatever that machine happened to have,
+        // so the assertions below would depend on the box the tests run on.
+        // A monotonic counter, not millis(): two fixtures built in the same millisecond would share
+        // a root and read each other's files.
+        static unsigned seq = 0;
+        std::snprintf(root_, sizeof(root_), "/tmp/mm_subtree_test_%u", ++seq);
+        std::filesystem::remove_all(root_);
+        mm::platform::fsSetRoot(root_);
+
+        mm::ModuleFactory::registerType<mm::Layers>("Layers");
+        mm::ModuleFactory::registerType<mm::Layer>("Layer");
+        mm::ModuleFactory::registerType<mm::NoiseEffect>("NoiseEffect");
+        mm::ModuleFactory::registerType<mm::RainbowEffect>("RainbowEffect");
+
+        fs = new mm::FilesystemModule();
+        fs->setTypeName("FilesystemModule");
+        fs->setScheduler(&scheduler);
+        layers = mm::ModuleFactory::create("Layers");
+        scheduler.addModule(fs);
+        scheduler.addModule(layers);
+        scheduler.setup();
+    }
+
+    ~Tree() { std::filesystem::remove_all(root_); }   // don't leave a directory per test behind
+
+    /// Add a child at runtime, driving the lifecycle the caller owns (MoonModule.h's contract).
+    mm::MoonModule* add(mm::MoonModule* parent, const char* type) {
+        auto* m = mm::ModuleFactory::create(type);
+        REQUIRE(m != nullptr);
+        parent->addChild(m);
+        m->defineControls();
+        m->setup();
+        return m;
+    }
+
+    // The effect type at Layers→Layer[0]→child[0], or "" when there is none.
+    const char* effectType() const {
+        auto* layer = layers->child(0);
+        if (!layer) return "";
+        auto* fx = layer->child(0);
+        return fx ? fx->typeName() : "";
+    }
+};
+
+std::string serialize(mm::FilesystemModule* fs, mm::MoonModule* m) {
+    mm::JsonSink sink;
+    REQUIRE(fs->saveSubtreeTo(m, sink));
+    return std::string(sink.data(), sink.size());
+}
+
+}  // namespace
+
+// A subtree serializes into a caller's buffer, so a preset file can hold the same bytes the
+// persistence engine writes rather than needing a second serializer that could drift from it.
+TEST_CASE("saveSubtreeTo writes a subtree a caller can keep") {
+    Tree t;
+    auto* layer = t.add(t.layers, "Layer");
+    t.add(layer, "NoiseEffect");
+
+    const std::string json = serialize(t.fs, t.layers);
+
+    // The flat dotted-key form the loader reads back: positional child types, enabled per node.
+    CHECK(json.find("\"0.type\":\"Layer\"") != std::string::npos);
+    CHECK(json.find("\"0.0.type\":\"NoiseEffect\"") != std::string::npos);
+    CHECK(json.find("\"enabled\":") != std::string::npos);
+}
+
+// The round trip a preset IS: capture a tree, change it live, put the capture back. This is the
+// whole feature in one assertion.
+TEST_CASE("applySubtree restores a tree that changed since it was captured") {
+    Tree t;
+    auto* layer = t.add(t.layers, "Layer");
+    t.add(layer, "NoiseEffect");
+    REQUIRE(std::strcmp(t.effectType(), "NoiseEffect") == 0);
+
+    const std::string preset = serialize(t.fs, t.layers);
+
+    // The user changes the look: a different effect entirely.
+    auto* old = layer->replaceChildAt(0, mm::ModuleFactory::create("RainbowEffect"));
+    if (old) { old->release(); mm::Scheduler::deleteTree(old); }
+    REQUIRE(std::strcmp(t.effectType(), "RainbowEffect") == 0);
+
+    CHECK(t.fs->applySubtree(t.layers, preset.c_str()));
+    CHECK(std::strcmp(t.effectType(), "NoiseEffect") == 0);   // the captured look is back
+}
+
+// A preset that carries MORE than the device has must add what is missing: applying it on a tree
+// whose children were deleted rebuilds them, which is what makes a preset a restore rather than a
+// value overlay.
+TEST_CASE("applySubtree recreates children the live tree no longer has") {
+    Tree t;
+    auto* layer = t.add(t.layers, "Layer");
+    t.add(layer, "NoiseEffect");
+
+    const std::string preset = serialize(t.fs, t.layers);
+
+    // Everything under Layers is removed, as a user clearing their setup would.
+    auto* gone = t.layers->child(0);
+    t.layers->removeChild(gone);
+    gone->release();
+    mm::Scheduler::deleteTree(gone);
+    REQUIRE(t.layers->childCount() == 0);
+
+    CHECK(t.fs->applySubtree(t.layers, preset.c_str()));
+    REQUIRE(t.layers->childCount() == 1);
+    CHECK(std::strcmp(t.effectType(), "NoiseEffect") == 0);
+}
+
+// And the reverse: a preset captured from a smaller tree must REMOVE what it does not describe, or
+// applying it would leave the previous look layered underneath.
+TEST_CASE("applySubtree removes children the preset does not describe") {
+    Tree t;
+    auto* layer = t.add(t.layers, "Layer");
+
+    const std::string preset = serialize(t.fs, t.layers);   // captured with an EMPTY layer
+
+    t.add(layer, "NoiseEffect");
+    REQUIRE(layer->childCount() == 1);
+
+    CHECK(t.fs->applySubtree(t.layers, preset.c_str()));
+    CHECK(layer->childCount() == 0);
+}
+
+// A module type this build does not have is skipped and the rest of the preset still applies: a
+// preset from a newer firmware, or from a board with a driver this one lacks, must degrade rather
+// than refuse to load. Same tolerance the boot loader already has.
+TEST_CASE("applySubtree skips an unknown module type and applies the rest") {
+    Tree t;
+
+    // Hand-written: a Layer whose first child is a type no factory knows.
+    const char* preset =
+        "{\"enabled\":true,"
+        "\"0.type\":\"Layer\",\"0.enabled\":true,"
+        "\"0.0.type\":\"NoSuchEffectXyz\",\"0.0.enabled\":true,"
+        "\"0.1.type\":\"NoiseEffect\",\"0.1.enabled\":true}";
+
+    CHECK(t.fs->applySubtree(t.layers, preset));
+
+    REQUIRE(t.layers->childCount() == 1);                       // the Layer applied
+    CHECK(std::strcmp(t.effectType(), "NoiseEffect") == 0);      // and so did the effect after it
+}
+
+// Malformed JSON leaves the tree alone rather than half-applying or crashing. A truncated or
+// corrupted preset file is the realistic case (an interrupted upload), and the device must survive
+// it with the look it already had.
+TEST_CASE("applySubtree survives a corrupt preset") {
+    Tree t;
+    auto* layer = t.add(t.layers, "Layer");
+    t.add(layer, "NoiseEffect");
+
+    // Rejected, and it SAYS so: a caller reporting success to a user must be able to tell a real
+    // apply from a body that was never credible.
+    CHECK_FALSE(t.fs->applySubtree(t.layers, "{\"0.type\":\"Lay"));   // truncated mid-key
+    CHECK(t.layers->childCount() == 1);
+    CHECK(std::strcmp(t.effectType(), "NoiseEffect") == 0);
+
+    CHECK_FALSE(t.fs->applySubtree(t.layers, ""));                    // and an empty body
+    CHECK(t.layers->childCount() == 1);
+}
+
+// Several subtrees share one flat object, each under its own "<TypeName>." prefix, and each reads
+// back independently. This is the shape a preset file uses: it is what lets one file carry a
+// selectable set of captures without a nested-object parser.
+TEST_CASE("a prefixed subtree round-trips inside a larger object") {
+    Tree t;
+    auto* layer = t.add(t.layers, "Layer");
+    t.add(layer, "NoiseEffect");
+
+    mm::JsonSink sink;
+    sink.append("{\"captures\":\"Layers\",");
+    REQUIRE(t.fs->saveSubtreeTo(t.layers, sink, "Layers."));
+    sink.append("}");
+    const std::string preset(sink.data(), sink.size());
+
+    CHECK(preset.find("\"Layers.0.type\":\"Layer\"") != std::string::npos);
+    CHECK(preset.find("\"Layers.0.0.type\":\"NoiseEffect\"") != std::string::npos);
+
+    // Change the look, then restore it from the prefixed body.
+    auto* old = layer->replaceChildAt(0, mm::ModuleFactory::create("RainbowEffect"));
+    if (old) { old->release(); mm::Scheduler::deleteTree(old); }
+    REQUIRE(std::strcmp(t.effectType(), "RainbowEffect") == 0);
+
+    CHECK(t.fs->applySubtree(t.layers, preset.c_str(), "Layers."));
+    CHECK(std::strcmp(t.effectType(), "NoiseEffect") == 0);
+}