feat(layout): renderer renders tile border markers (main red / side green)

2 files changed, 41 insertions, 0 deletions

diff --git a/src/features/layout/logic/marker.test.ts b/src/features/layout/logic/marker.test.ts
new file mode 100644
index 0000000..d9e3826
--- /dev/null
+++ b/src/features/layout/logic/marker.test.ts
@@ -0,0 +1,16 @@
+import { describe, expect, it } from "vitest";
+import { markerOutline } from "./marker";
+
+describe("markerOutline — the diagnostic tile-border mapping", () => {
+  it("main → a 4px solid red outline (the main tile's marker)", () => {
+    expect(markerOutline("main")).toBe("4px solid red");
+  });
+
+  it("side → a 4px solid green outline (the side tile's marker)", () => {
+    expect(markerOutline("side")).toBe("4px solid green");
+  });
+
+  it("no marker → no outline (existing trees render exactly as before)", () => {
+    expect(markerOutline(undefined)).toBeUndefined();
+  });
+});
diff --git a/src/features/layout/logic/marker.ts b/src/features/layout/logic/marker.ts
new file mode 100644
index 0000000..eb1ff84
--- /dev/null
+++ b/src/features/layout/logic/marker.ts
@@ -0,0 +1,25 @@
+/**
+ * Diagnostic tile-border markers (the contract's additive `TileMarker`
+ * presentation field) → the inline outline the renderer draws. Pure
+ * decision logic — the .svelte tile components just apply the returned
+ * style value.
+ *
+ * INLINE STYLES, deliberately: a marker value arrives in TREE DATA at
+ * runtime, and Tailwind only generates classes it sees in source files — a
+ * dynamic class from tree data would silently render nothing. An outline
+ * (not a border) is used so the diagnostic draws WITHOUT changing any
+ * tile's layout/size (4px solid, clearly visible).
+ *
+ * The marker is purely presentational: unknown/absent → no outline
+ * (existing trees render exactly as before), and no other behavior is
+ * attached to it anywhere in the renderer.
+ */
+
+import type { TileMarker } from "@dispatch/layout-contract";
+
+/** The diagnostic outline style for a marker — `undefined` = draw nothing. */
+export function markerOutline(marker: TileMarker | undefined): string | undefined {
+  if (marker === "main") return "4px solid red";
+  if (marker === "side") return "4px solid green";
+  return undefined;
+}