diff --git a/app/settings/co2-galvo/[id]/co2-galvo.tsx b/app/settings/co2-galvo/[id]/co2-galvo.tsx
index 7acc74ce..e0c83d0a 100644
--- a/app/settings/co2-galvo/[id]/co2-galvo.tsx
+++ b/app/settings/co2-galvo/[id]/co2-galvo.tsx
@@ -15,15 +15,15 @@ type Rec = {
   photo?: { id?: string } | string | null;
   screen?: { id?: string } | string | null;
 
-  // shapes pass-through for form
-  mat?: any;
-  mat_coat?: any;
-  mat_color?: any;
-  mat_opacity?: any;
+  // relations (may be id or object)
+  mat?: { id?: string | number } | string | number | null;
+  mat_coat?: { id?: string | number } | string | number | null;
+  mat_color?: { id?: string | number } | string | number | null;
+  mat_opacity?: { id?: string | number } | string | number | null;
   mat_thickness?: number | null;
 
-  source?: any;
-  lens?: any;
+  source?: { submission_id?: string | number } | string | number | null;
+  lens?: { id?: string | number } | string | number | null;
   focus?: number | null;
 
   laser_soft?: any;
@@ -69,25 +69,35 @@ export default function CO2GalvoSettingDetailPage() {
         setLoading(true);
         setErr(null);
 
+        // Request the specific IDs needed to prefill selects
         const fields = [
           "submission_id",
           "setting_title",
           "setting_notes",
           "photo.id",
           "screen.id",
-          "mat",
-          "mat_coat",
-          "mat_color",
-          "mat_opacity",
+
+          // relations: request their ids explicitly
+          "mat.id",
+          "mat_coat.id",
+          "mat_color.id",
+          "mat_opacity.id",
           "mat_thickness",
-          "source",
-          "lens",
+
+          // source is keyed by submission_id in the selector
+          "source.submission_id",
+
+          // lens select expects numeric id
+          "lens.id",
           "focus",
+
           "laser_soft",
           "repeat_all",
+
           "fill_settings",
           "line_settings",
           "raster_settings",
+
           "owner.id",
           "owner.username",
           "uploader",
@@ -121,8 +131,20 @@ export default function CO2GalvoSettingDetailPage() {
     if (!rec) return null;
 
     // normalize existing file refs to ids for the form
-    const photoId  = typeof rec.photo  === "string" ? rec.photo  : rec.photo?.id ?? null;
-    const screenId = typeof rec.screen === "string" ? rec.screen : rec.screen?.id ?? null;
+    const photoId  = typeof rec.photo  === "string" || typeof rec.photo === "number" ? String(rec.photo)  : rec.photo?.id ?? null;
+    const screenId = typeof rec.screen === "string" || typeof rec.screen === "number" ? String(rec.screen) : rec.screen?.id ?? null;
+
+    // normalize relations to id strings expected by <select>
+    const toId = (v: any) =>
+    v == null ? null : (typeof v === "object" ? (v.id ?? v.submission_id ?? null) : v);
+
+    const matId       = toId(rec.mat);
+    const coatId      = toId(rec.mat_coat);
+    const colorId     = toId(rec.mat_color);
+    const opacityId   = toId(rec.mat_opacity);
+    const lensId      = toId(rec.lens);
+    // laser_source options use submission_id as value
+    const sourceId    = rec.source && typeof rec.source === "object" ? (rec.source.submission_id ?? null) : rec.source ?? null;
 
     return {
       setting_title: rec.setting_title ?? "",
@@ -131,22 +153,22 @@ export default function CO2GalvoSettingDetailPage() {
       photo:  photoId,
       screen: screenId,
 
-      mat:           rec.mat ?? null,
-      mat_coat:      rec.mat_coat ?? null,
-      mat_color:     rec.mat_color ?? null,
-      mat_opacity:   rec.mat_opacity ?? null,
-      mat_thickness: rec.mat_thickness ?? null,
+      mat:           matId ? String(matId) : null,
+                                mat_coat:      coatId ? String(coatId) : null,
+                                mat_color:     colorId ? String(colorId) : null,
+                                mat_opacity:   opacityId ? String(opacityId) : null,
+                                mat_thickness: rec.mat_thickness ?? null,
 
-      source: rec.source ?? null,
-      lens:   rec.lens ?? null,
-      focus:  rec.focus ?? null,
+                                source: sourceId != null ? String(sourceId) : null,
+                                lens:   lensId != null ? String(lensId) : null,
+                                focus:  rec.focus ?? null,
 
-      laser_soft: rec.laser_soft ?? null,
-      repeat_all: rec.repeat_all ?? null,
+                                laser_soft: rec.laser_soft ?? null,
+                                repeat_all: rec.repeat_all ?? null,
 
-      fill_settings:   rec.fill_settings   ?? [],
-      line_settings:   rec.line_settings   ?? [],
-      raster_settings: rec.raster_settings ?? [],
+                                fill_settings:   rec.fill_settings   ?? [],
+                                line_settings:   rec.line_settings   ?? [],
+                                raster_settings: rec.raster_settings ?? [],
     };
   }, [rec]);
 
diff --git a/app/settings/co2-galvo/page.tsx b/app/settings/co2-galvo/page.tsx
index c1e74091..6099b526 100644
--- a/app/settings/co2-galvo/page.tsx
+++ b/app/settings/co2-galvo/page.tsx
@@ -8,7 +8,13 @@ import { useSearchParams } from "next/navigation";
 type Owner =
 | string
 | number
-| { id?: string | number; username?: string | null; first_name?: string | null; last_name?: string | null; email?: string | null }
+| {
+  id?: string | number;
+  username?: string | null;
+  first_name?: string | null;
+  last_name?: string | null;
+  email?: string | null;
+}
 | null
 | undefined;
 
@@ -34,6 +40,9 @@ export default function CO2GalvoSettingsPage() {
   const [loading, setLoading] = useState(true);
   const [resolvingOwners, setResolvingOwners] = useState(false);
 
+  // current signed-in user id (for "Edit" visibility)
+  const [meId, setMeId] = useState<string | null>(null);
+
   // Debounce search box
   useEffect(() => {
     const t = setTimeout(() => setDebouncedQuery(query), 300);
@@ -50,13 +59,35 @@ export default function CO2GalvoSettingsPage() {
     }
   }
 
+  // Load current user id (ignore errors; unauth just means no edit buttons)
+  useEffect(() => {
+    let dead = false;
+    (async () => {
+      try {
+        const r = await fetch(`/api/dx/users/me?fields=id`, {
+          cache: "no-store",
+          credentials: "include",
+        });
+        if (!r.ok) return; // unauth or error → no edit display
+        const j = await readJson(r);
+        const id = j?.data?.id ?? j?.id ?? null;
+        if (!dead) setMeId(id ? String(id) : null);
+      } catch {
+        /* swallow */
+      }
+    })();
+    return () => {
+      dead = true;
+    };
+  }, []);
+
   useEffect(() => {
     // ✅ include parent field `owner` AND subfields; use auth proxy
     const fields = [
       "submission_id",
       "setting_title",
       "uploader",
-      "owner",            // ← add comma here
+      "owner",
       "owner.id",
       "owner.username",
       "photo.id",
@@ -67,7 +98,9 @@ export default function CO2GalvoSettingsPage() {
       "lens.field_size",
     ].join(",");
 
-    const url = `/api/dx/items/settings_co2gal?fields=${encodeURIComponent(fields)}&limit=-1`;
+    const url = `/api/dx/items/settings_co2gal?fields=${encodeURIComponent(
+      fields
+    )}&limit=-1`;
 
     fetch(url, { cache: "no-store", credentials: "include" })
     .then(async (res) => {
@@ -154,6 +187,13 @@ export default function CO2GalvoSettingsPage() {
     })();
   }, [settings, ownerMap]);
 
+  const isMine = (o: Owner) => {
+    if (!meId || !o) return false;
+    if (typeof o === "string" || typeof o === "number") return String(o) === meId;
+    if (o.id != null) return String(o.id) === meId;
+    return false;
+  };
+
   const ownerLabel = (o: Owner) => {
     if (!o) return "—";
 
@@ -173,7 +213,10 @@ export default function CO2GalvoSettingsPage() {
 
   const highlight = (text?: string) => {
     if (!debouncedQuery) return text || "";
-    const regex = new RegExp(`(${debouncedQuery.replace(/[.*+?^${}()|[\\]\\\\]/g, "\\$&")})`, "gi");
+    const regex = new RegExp(
+      `(${debouncedQuery.replace(/[.*+?^${}()|[\\]\\\\]/g, "\\$&")})`,
+                             "gi"
+    );
     return (text || "").replace(regex, "<mark>$1</mark>");
   };
 
@@ -214,31 +257,71 @@ export default function CO2GalvoSettingsPage() {
       <thead>
       <tr className="bg-muted">
       <th className="px-2 py-2 text-left">Title</th>
-      <th className="px-2 py-2 text-left">Owner {resolvingOwners ? "…resolving" : ""}</th>
+      <th className="px-2 py-2 text-left">
+      Owner {resolvingOwners ? "…resolving" : ""}
+      </th>
       <th className="px-2 py-2 text-left">Material</th>
       <th className="px-2 py-2 text-left">Coating</th>
       <th className="px-2 py-2 text-left">Model</th>
       <th className="px-2 py-2 text-left">Field</th>
+      <th className="px-2 py-2 text-left">Actions</th>
       </tr>
       </thead>
       <tbody>
-      {filtered.map((s) => (
-        <tr key={s.submission_id} className="border-b hover:bg-muted/30">
-        <td className="px-2 py-2 whitespace-nowrap">
-        <Link href={`/settings/co2-galvo/${s.submission_id}`} className="underline">
-        <span dangerouslySetInnerHTML={{ __html: highlight(s.setting_title || "Untitled") }} />
-        </Link>
-        </td>
-        <td
-        className="px-2 py-2 whitespace-nowrap"
-        dangerouslySetInnerHTML={{ __html: highlight(ownerLabel(s.owner)) }}
-        />
-        <td className="px-2 py-2 whitespace-nowrap">{s.mat?.name || "—"}</td>
-        <td className="px-2 py-2 whitespace-nowrap">{s.mat_coat?.name || "—"}</td>
-        <td className="px-2 py-2 whitespace-nowrap">{s.source?.model || "—"}</td>
-        <td className="px-2 py-2 whitespace-nowrap">{s.lens?.field_size || "—"}</td>
-        </tr>
-      ))}
+      {filtered.map((s) => {
+        const mine = isMine(s.owner);
+        const ownerText =
+        ownerLabel(s.owner) + (mine ? " (you)" : "");
+        return (
+          <tr
+          key={s.submission_id}
+          className="border-b hover:bg-muted/30"
+          >
+          <td className="px-2 py-2 whitespace-nowrap">
+          <Link
+          href={`/settings/co2-galvo/${s.submission_id}`}
+          className="underline"
+          >
+          <span
+          dangerouslySetInnerHTML={{
+            __html: highlight(s.setting_title || "Untitled"),
+          }}
+          />
+          </Link>
+          </td>
+          <td
+          className="px-2 py-2 whitespace-nowrap"
+          dangerouslySetInnerHTML={{
+            __html: highlight(ownerText),
+          }}
+          />
+          <td className="px-2 py-2 whitespace-nowrap">
+          {s.mat?.name || "—"}
+          </td>
+          <td className="px-2 py-2 whitespace-nowrap">
+          {s.mat_coat?.name || "—"}
+          </td>
+          <td className="px-2 py-2 whitespace-nowrap">
+          {s.source?.model || "—"}
+          </td>
+          <td className="px-2 py-2 whitespace-nowrap">
+          {s.lens?.field_size || "—"}
+          </td>
+          <td className="px-2 py-2 whitespace-nowrap">
+          {mine ? (
+            <Link
+            href={`/settings/co2-galvo/${s.submission_id}?edit=1`}
+            className="underline"
+            >
+            Edit
+            </Link>
+          ) : (
+            <span className="opacity-50">—</span>
+          )}
+          </td>
+          </tr>
+        );
+      })}
       </tbody>
       </table>
       </div>
diff --git a/components/forms/SettingsSubmit.tsx b/components/forms/SettingsSubmit.tsx
index f8e99275..80578760 100644
--- a/components/forms/SettingsSubmit.tsx
+++ b/components/forms/SettingsSubmit.tsx
@@ -4,8 +4,17 @@ import { useEffect, useMemo, useState } from "react";
 import { useForm, useFieldArray, type UseFormRegister } from "react-hook-form";
 import { useRouter, useSearchParams } from "next/navigation";
 
-type Target = "settings_fiber" | "settings_co2gan" | "settings_co2gal" | "settings_uv";
+/* ────────────────────────────────────────────────────────────
+ * Types
+ * ──────────────────────────────────────────────────────────── */
+export type Target =
+| "settings_fiber"
+| "settings_co2gan"
+| "settings_co2gal"
+| "settings_uv";
+
 type Opt = { id: string; label: string };
+
 type Me = {
   id: string;
   username?: string;
@@ -15,11 +24,56 @@ type Me = {
   email?: string;
 };
 
+export type FormValues = {
+  setting_title: string;
+  setting_notes?: string;
+
+  // files (id string or File at the UI level)
+  photo?: string | File | null;
+  screen?: string | File | null;
+
+  // relations / numerics
+  mat?: any;
+  mat_coat?: any;
+  mat_color?: any;
+  mat_opacity?: any;
+  mat_thickness?: number | null;
+  source?: any;
+  lens?: any;
+  focus?: number | null;
+
+  // flags
+  laser_soft?: string | null;
+  repeat_all?: number | null;
+
+  // repeaters
+  fill_settings: any[];
+  line_settings: any[];
+  raster_settings: any[];
+};
+
+type CreateProps = {
+  mode?: "create";                 // default
+  initialTarget?: Target;
+  initialValues?: Partial<FormValues>;
+  onSaved?: (id: string | number) => void;
+};
+
+type EditProps = {
+  mode: "edit";
+  initialTarget: Target;           // locked target
+  submissionId: string | number;   // external submission_id
+  initialValues: FormValues;       // full snapshot to edit
+  onSaved?: (id: string | number) => void;
+};
+
+export type SettingsSubmitProps = CreateProps | EditProps;
+
+/* ──────────────────────────────────────────────────────────── */
+
 const API = (process.env.NEXT_PUBLIC_API_BASE_URL || "").replace(/\/$/, "");
 
-// ─────────────────────────────────────────────────────────────
 // Local enums (no schema introspection)
-// ─────────────────────────────────────────────────────────────
 const FILL_TYPE_OPTIONS = [
   { label: "UniDirectional", value: "uni" },
 { label: "BiDirectional", value: "bi" },
@@ -53,6 +107,9 @@ function shortId(s?: string) {
   return s.length <= 12 ? s : `${s.slice(0, 8)}…${s.slice(-4)}`;
 }
 
+/* ────────────────────────────────────────────────────────────
+ * Options helpers
+ * ──────────────────────────────────────────────────────────── */
 function useOptions(path: string) {
   const [opts, setOpts] = useState<Opt[]>([]);
   const [loading, setLoading] = useState(false);
@@ -102,7 +159,7 @@ function useOptions(path: string) {
       } else if (rawPath === "laser_software") {
         url = `${API}/items/laser_software?fields=id,name&limit=1000&sort=name`;
       } else if (rawPath === "laser_source") {
-        // fetch all and client-filter by nm until/if a numeric mirror field exists
+        // fetch all and client-filter by nm
         url = `${API}/items/laser_source?fields=submission_id,make,model,nm&limit=2000&sort=make,model`;
         const range = nmRangeFor(target);
         normalize = (rows) => {
@@ -169,6 +226,9 @@ function useOptions(path: string) {
   return { opts, loading, setQ };
 }
 
+/* ────────────────────────────────────────────────────────────
+ * Small inputs
+ * ──────────────────────────────────────────────────────────── */
 function FilterableSelect({
   label,
   name,
@@ -211,10 +271,7 @@ function FilterableSelect({
     onChange={(e) => setFilter(e.target.value)}
     />
     <select className="w-full border rounded px-2 py-1" {...register(name, { required })}>
-    <option value="">
-    {placeholder}
-    {loading ? " (loading…)" : ""}
-    </option>
+    <option value="">{placeholder}{loading ? " (loading…)" : ""}</option>
     {filtered.map((o) => (
       <option key={o.id} value={o.id}>
       {o.label}
@@ -233,11 +290,21 @@ function BoolBox({ label, name, register }: { label: string; name: string; regis
   );
 }
 
-export default function SettingsSubmit({ initialTarget }: { initialTarget?: Target }) {
+/* ────────────────────────────────────────────────────────────
+ * Component
+ * ──────────────────────────────────────────────────────────── */
+export default function SettingsSubmit(props: SettingsSubmitProps) {
+  const { mode = "create" } = props;
+  const isEdit = mode === "edit";
+
   const router = useRouter();
   const sp = useSearchParams();
-  const initialFromQuery = (sp.get("target") as Target) || initialTarget || "settings_fiber";
-  const [target, setTarget] = useState<Target>(initialFromQuery);
+
+  // initial target (locked in edit)
+  const initialTarget: Target =
+  isEdit ? props.initialTarget : ((sp.get("target") as Target) || props.initialTarget || "settings_fiber");
+
+  const [target, setTarget] = useState<Target>(initialTarget);
 
   // Map collection -> slug used by options selectors
   const typeForOptions = useMemo(() => {
@@ -310,496 +377,583 @@ export default function SettingsSubmit({ initialTarget }: { initialTarget?: Targ
   const rasterType = { opts: toOpts(RASTER_TYPE_OPTIONS), loading: false, setQ: (_: string) => {} };
   const rasterDither = { opts: toOpts(RASTER_DITHER_OPTIONS), loading: false, setQ: (_: string) => {} };
 
+  // Default values
+  const createDefaults: FormValues = {
+    setting_title: "",
+    setting_notes: "",
+    photo: null,
+    screen: null,
+    mat: "",
+    mat_coat: "",
+    mat_color: "",
+    mat_opacity: "",
+    mat_thickness: null,
+    source: "",
+    lens: "",
+    focus: null,
+    laser_soft: "",
+    repeat_all: null,
+    fill_settings: [],
+    line_settings: [],
+    raster_settings: [],
+  };
+
   const {
     register,
     handleSubmit,
     control,
     reset,
     formState: { isSubmitting },
-  } = useForm<any>({
-    defaultValues: {
-      setting_title: "",
-      setting_notes: "",
-      mat: "",
-      mat_coat: "",
-      mat_color: "",
-      mat_opacity: "",
-      mat_thickness: "",
-      source: "",
-      lens: "",
-      focus: "",
-      laser_soft: "",
-      repeat_all: "", // on all targets
-      fill_settings: [],
-      line_settings: [],
-      raster_settings: [],
-    },
+  } = useForm<FormValues>({
+    defaultValues: isEdit ? (props as EditProps).initialValues : (props.initialValues as any) || createDefaults,
   });
 
-  const fills = useFieldArray({ control, name: "fill_settings" });
-  const lines = useFieldArray({ control, name: "line_settings" });
-  const rasters = useFieldArray({ control, name: "raster_settings" });
+  // If edit props change (rare), sync the form
+  useEffect(() => {
+    if (isEdit) reset((props as EditProps).initialValues);
+  }, [isEdit, reset, props]);
 
-  function num(v: any) {
-    return v === "" || v == null ? null : Number(v);
-  }
-  const bool = (v: any) => !!v;
+    const fills = useFieldArray({ control, name: "fill_settings" });
+    const lines = useFieldArray({ control, name: "line_settings" });
+    const rasters = useFieldArray({ control, name: "raster_settings" });
 
-  async function onSubmit(values: any) {
-    setSubmitErr(null);
-
-    if (!photoFile) {
-      (document.querySelector('input[type="file"][data-role="photo"]') as HTMLInputElement | null)?.focus();
-      return;
+    function num(v: any) {
+      return v === "" || v == null ? null : Number(v);
     }
+    const bool = (v: any) => !!v;
 
-    const payload: any = {
-      target,
-      setting_title: values.setting_title,
-      setting_notes: values.setting_notes || "",
-      mat: values.mat || null,
-      mat_coat: values.mat_coat || null,
-      mat_color: values.mat_color || null,
-      mat_opacity: values.mat_opacity || null,
-      mat_thickness: num(values.mat_thickness),
-      source: values.source || null,
-      lens: values.lens || null,
-      focus: num(values.focus),
-      laser_soft: values.laser_soft || null, // all targets
-      repeat_all: num(values.repeat_all), // all targets
-      fill_settings: (values.fill_settings || []).map((r: any) => ({
-        name: r.name || "",
-        power: num(r.power),
-                                                                   speed: num(r.speed),
-                                                                   interval: num(r.interval),
-                                                                   pass: num(r.pass),
-                                                                   type: r.type || "", // now driven by local enum
-                                                                   frequency: num(r.frequency),
-                                                                   pulse: num(r.pulse),
-                                                                   angle: num(r.angle),
-                                                                   auto: bool(r.auto),
-                                                                   increment: num(r.increment),
-                                                                   cross: bool(r.cross),
-                                                                   flood: bool(r.flood),
-                                                                   air: bool(r.air),
-      })),
-      line_settings: (values.line_settings || []).map((r: any) => ({
-        name: r.name || "",
-        power: num(r.power),
-                                                                   speed: num(r.speed),
-                                                                   perf: bool(r.perf),
-                                                                   cut: r.cut || "",
-                                                                   skip: r.skip || "",
-                                                                   pass: num(r.pass),
-                                                                   air: bool(r.air),
-                                                                   frequency: num(r.frequency),
-                                                                   pulse: num(r.pulse),
-                                                                   wobble: bool(r.wobble),
-                                                                   step: num(r.step),
-                                                                   size: num(r.size),
-      })),
-      raster_settings: (values.raster_settings || []).map((r: any) => ({
-        name: r.name || "",
-        power: num(r.power),
-                                                                       speed: num(r.speed),
-                                                                       type: r.type || "",   // now driven by local enum
-                                                                       dither: r.dither || "", // now driven by local enum
-                                                                       halftone_cell: num(r.halftone_cell),
-                                                                       halftone_angle: num(r.halftone_angle),
-                                                                       inversion: bool(r.inversion),
-                                                                       interval: num(r.interval),
-                                                                       dot: num(r.dot),
-                                                                       pass: num(r.pass),
-                                                                       air: bool(r.air),
-                                                                       frequency: num(r.frequency),
-                                                                       pulse: num(r.pulse),
-                                                                       cross: bool(r.cross),
-      })),
+    const detailHref = (coll: Target, submissionId: string | number) => {
+      switch (coll) {
+        case "settings_co2gal": return `/settings/co2-galvo/${submissionId}?edit=1`;
+        case "settings_co2gan": return `/settings/co2-gantry/${submissionId}?edit=1`;
+        case "settings_fiber":  return `/settings/fiber/${submissionId}?edit=1`;
+        case "settings_uv":     return `/settings/uv/${submissionId}?edit=1`;
+      }
     };
 
-    try {
-      let res: Response;
-      if (photoFile || screenFile) {
-        const form = new FormData();
-        form.set("payload", JSON.stringify(payload));
-        if (photoFile) form.set("photo", photoFile, photoFile.name || "photo");
-        if (screenFile) form.set("screen", screenFile, screenFile.name || "screen");
-        res = await fetch("/api/submit/settings", { method: "POST", body: form, credentials: "include" });
-      } else {
-        res = await fetch("/api/submit/settings", {
-          method: "POST",
-          headers: { "Content-Type": "application/json" },
-          body: JSON.stringify(payload),
-                          credentials: "include",
-        });
+    async function onSubmit(values: FormValues) {
+      setSubmitErr(null);
+
+      // Build normalized payload/patch from form values
+      const payload: any = {
+        target,
+        setting_title: values.setting_title,
+        setting_notes: values.setting_notes || "",
+        mat: values.mat || null,
+        mat_coat: values.mat_coat || null,
+        mat_color: values.mat_color || null,
+        mat_opacity: values.mat_opacity || null,
+        mat_thickness: num(values.mat_thickness),
+        source: values.source || null,
+        lens: values.lens || null,
+        focus: num(values.focus),
+        laser_soft: values.laser_soft || null, // all targets
+        repeat_all: num(values.repeat_all),    // all targets
+        fill_settings: (values.fill_settings || []).map((r: any) => ({
+          name: r.name || "",
+          power: num(r.power),
+                                                                     speed: num(r.speed),
+                                                                     interval: num(r.interval),
+                                                                     pass: num(r.pass),
+                                                                     type: r.type || "",
+                                                                     frequency: num(r.frequency),
+                                                                     pulse: num(r.pulse),
+                                                                     angle: num(r.angle),
+                                                                     auto: bool(r.auto),
+                                                                     increment: num(r.increment),
+                                                                     cross: bool(r.cross),
+                                                                     flood: bool(r.flood),
+                                                                     air: bool(r.air),
+        })),
+        line_settings: (values.line_settings || []).map((r: any) => ({
+          name: r.name || "",
+          power: num(r.power),
+                                                                     speed: num(r.speed),
+                                                                     perf: bool(r.perf),
+                                                                     cut: r.cut || "",
+                                                                     skip: r.skip || "",
+                                                                     pass: num(r.pass),
+                                                                     air: bool(r.air),
+                                                                     frequency: num(r.frequency),
+                                                                     pulse: num(r.pulse),
+                                                                     wobble: bool(r.wobble),
+                                                                     step: num(r.step),
+                                                                     size: num(r.size),
+        })),
+        raster_settings: (values.raster_settings || []).map((r: any) => ({
+          name: r.name || "",
+          power: num(r.power),
+                                                                         speed: num(r.speed),
+                                                                         type: r.type || "",
+                                                                         dither: r.dither || "",
+                                                                         halftone_cell: num(r.halftone_cell),
+                                                                         halftone_angle: num(r.halftone_angle),
+                                                                         inversion: bool(r.inversion),
+                                                                         interval: num(r.interval),
+                                                                         dot: num(r.dot),
+                                                                         pass: num(r.pass),
+                                                                         air: bool(r.air),
+                                                                         frequency: num(r.frequency),
+                                                                         pulse: num(r.pulse),
+                                                                         cross: bool(r.cross),
+        })),
+      };
+
+      try {
+        let res: Response;
+
+        if (isEdit) {
+          // EDIT FLOW: call /api/my-settings/update
+          const { initialTarget, submissionId } = props as EditProps;
+
+          // When files are picked, send multipart so backend can upload & patch.
+          if (photoFile || screenFile) {
+            const form = new FormData();
+            form.set(
+              "payload",
+              JSON.stringify({
+                collection: initialTarget,
+                submission_id: submissionId,
+                patch: payload, // server decides which keys to persist
+              })
+            );
+            if (photoFile) form.set("photo", photoFile, photoFile.name || "photo");
+            if (screenFile) form.set("screen", screenFile, screenFile.name || "screen");
+
+            res = await fetch("/api/my-settings/update", {
+              method: "POST",
+              credentials: "include",
+              body: form,
+            });
+          } else {
+            // JSON only (no file changes)
+            res = await fetch("/api/my-settings/update", {
+              method: "POST",
+              credentials: "include",
+              headers: { "Content-Type": "application/json", Accept: "application/json" },
+              body: JSON.stringify({
+                collection: initialTarget,
+                submission_id: submissionId,
+                patch: payload,
+              }),
+            });
+          }
+
+          const txt = await res.text();
+          const data = txt ? JSON.parse(txt) : null;
+          if (!res.ok || !data?.ok) {
+            const msg = data?.error || data?.message || `HTTP ${res.status}`;
+            throw new Error(msg);
+          }
+
+          const savedId = data?.id ?? (props as EditProps).submissionId;
+          props.onSaved?.(savedId);
+          router.push(detailHref(initialTarget, savedId));
+          return;
+        }
+
+        // CREATE FLOW: photo is required
+        if (!photoFile) {
+          (document.querySelector('input[type="file"][data-role="photo"]') as HTMLInputElement | null)?.focus();
+          throw new Error("Please select a Result Photo.");
+        }
+
+        if (photoFile || screenFile) {
+          const form = new FormData();
+          form.set("payload", JSON.stringify(payload));
+          if (photoFile) form.set("photo", photoFile, photoFile.name || "photo");
+          if (screenFile) form.set("screen", screenFile, screenFile.name || "screen");
+          res = await fetch("/api/submit/settings", { method: "POST", body: form, credentials: "include" });
+        } else {
+          res = await fetch("/api/submit/settings", {
+            method: "POST",
+            headers: { "Content-Type": "application/json" },
+            body: JSON.stringify(payload),
+                            credentials: "include",
+          });
+        }
+
+        const data = await res.json().catch(() => ({}));
+        if (!res.ok) {
+          if (res.status === 401 || res.status === 403) throw new Error("You must be signed in to submit settings.");
+          throw new Error(data?.error || "Submission failed");
+        }
+
+        reset(createDefaults);
+        setPhotoFile(null);
+        setScreenFile(null);
+        setPhotoPreview("");
+        setScreenPreview("");
+
+        const id = data?.id ? String(data.id) : "";
+        props.onSaved?.(id);
+        router.push(`/submit/settings/success?target=${encodeURIComponent(target)}&id=${encodeURIComponent(id)}`);
+      } catch (e: any) {
+        setSubmitErr(e?.message || "Submission failed");
       }
+    }
 
-      const data = await res.json().catch(() => ({}));
-      if (!res.ok) {
-        if (res.status === 401 || res.status === 403) throw new Error("You must be signed in to submit settings.");
-        throw new Error(data?.error || "Submission failed");
+    function onPick(file: File | null, setFile: (f: File | null) => void, setPreview: (s: string) => void) {
+      setFile(file);
+      if (!file) {
+        setPreview("");
+        return;
       }
-
-      reset();
-      setPhotoFile(null);
-      setScreenFile(null);
-      setPhotoPreview("");
-      setScreenPreview("");
-
-      const id = data?.id ? String(data.id) : "";
-      router.push(`/submit/settings/success?target=${encodeURIComponent(target)}&id=${encodeURIComponent(id)}`);
-    } catch (e: any) {
-      setSubmitErr(e?.message || "Submission failed");
+      const reader = new FileReader();
+      reader.onload = () => setPreview(String(reader.result || ""));
+      reader.readAsDataURL(file);
     }
-  }
 
-  function onPick(file: File | null, setFile: (f: File | null) => void, setPreview: (s: string) => void) {
-    setFile(file);
-    if (!file) {
-      setPreview("");
-      return;
-    }
-    const reader = new FileReader();
-    reader.onload = () => setPreview(String(reader.result || ""));
-    reader.readAsDataURL(file);
-  }
-
-  return (
-    <div className="max-w-3xl mx-auto space-y-4">
-    {/* Target + Software (Software required for ALL targets) */}
-    <div className="flex flex-wrap gap-3 items-end">
-    <div>
-    <label className="block text-sm mb-1">Target</label>
-    <select
-    className="border rounded px-2 py-1"
-    value={target}
-    onChange={(e) => setTarget(e.target.value as Target)}
-    >
-    <option value="settings_fiber">Fiber</option>
-    <option value="settings_co2gan">CO₂ Gantry</option>
-    <option value="settings_co2gal">CO₂ Galvo</option>
-    <option value="settings_uv">UV</option>
-    </select>
-    </div>
-
-    <div className="flex-1 min-w-[220px]">
-    <FilterableSelect
-    label="Software"
-    name="laser_soft"
-    register={register}
-    options={soft.opts}
-    loading={soft.loading}
-    onQuery={soft.setQ}
-    required={true}
-    />
-    </div>
-    </div>
-
-    {/* Submitting-as banner */}
-    {me ? (
-      <div className="text-sm text-muted-foreground">
-      Submitting as <span className="font-medium">{meLabel}</span>.
+    return (
+      <div className="max-w-3xl mx-auto space-y-4">
+      {/* Target + Software (Software required for ALL targets) */}
+      <div className="flex flex-wrap gap-3 items-end">
+      <div>
+      <label className="block text-sm mb-1">Target</label>
+      <select
+      className="border rounded px-2 py-1"
+      value={target}
+      onChange={(e) => setTarget(e.target.value as Target)}
+      disabled={isEdit} // lock in edit mode
+      >
+      <option value="settings_fiber">Fiber</option>
+      <option value="settings_co2gan">CO₂ Gantry</option>
+      <option value="settings_co2gal">CO₂ Galvo</option>
+      <option value="settings_uv">UV</option>
+      </select>
+      {isEdit && <p className="text-xs text-muted-foreground mt-1">Target is fixed while editing.</p>}
       </div>
-    ) : meErr ? (
-      <div className="border border-yellow-600 bg-yellow-50 text-yellow-800 rounded p-2 text-sm">
-      You’re not signed in. Submissions will fail until you sign in.
-      </div>
-    ) : null}
 
-    {submitErr ? (
-      <div className="border border-red-500 text-red-600 bg-red-50 rounded p-2 text-sm">{submitErr}</div>
-    ) : null}
-
-    <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
-    {/* Title */}
-    <div className="grid md:grid-cols-2 gap-3">
-    <div className="md:col-span-2">
-    <label className="block text-sm mb-1">
-    Title <span className="text-red-600">*</span>
-    </label>
-    <input className="w-full border rounded px-2 py-1" {...register("setting_title", { required: true })} />
-    </div>
-    </div>
-
-    {/* Images */}
-    <div className="grid md:grid-cols-2 gap-4">
-    <div>
-    <label className="block text-sm mb-1">
-    Result Photo <span className="text-red-600">*</span>
-    </label>
-    <input
-    type="file"
-    accept="image/*"
-    data-role="photo"
-    required
-    onChange={(e) => onPick(e.target.files?.[0] ?? null, setPhotoFile, setPhotoPreview)}
-    />
-    <p className="text-xs text-muted-foreground mt-1">
-    {photoFile ? (
-      <>
-      Selected: <span className="font-mono">{photoFile.name}</span>
-      </>
-    ) : (
-      "Max 25 MB. JPG/PNG/WebP recommended."
-    )}
-    </p>
-    {photoPreview ? <img src={photoPreview} alt="Result preview" className="mt-2 rounded border" /> : null}
-    </div>
-    <div>
-    <label className="block text-sm mb-1">Settings Screenshot (optional)</label>
-    <input
-    type="file"
-    accept="image/*"
-    onChange={(e) => onPick(e.target.files?.[0] ?? null, setScreenFile, setScreenPreview)}
-    />
-    <p className="text-xs text-muted-foreground mt-1">
-    {screenFile ? (
-      <>
-      Selected: <span className="font-mono">{screenFile.name}</span>
-      </>
-    ) : (
-      "Max 25 MB. JPG/PNG/WebP recommended."
-    )}
-    </p>
-    {screenPreview ? <img src={screenPreview} alt="Settings preview" className="mt-2 rounded border" /> : null}
-    </div>
-    </div>
-
-    {/* Notes */}
-    <div>
-    <label className="block text-sm mb-1">Notes</label>
-    <textarea rows={4} className="w-full border rounded px-2 py-1" {...register("setting_notes")} />
-    </div>
-
-    {/* Material / Source / Lens */}
-    <div className="grid md:grid-cols-2 gap-3">
-    <FilterableSelect
-    label="Material"
-    name="mat"
-    register={register}
-    options={mats.opts}
-    loading={mats.loading}
-    onQuery={mats.setQ}
-    required
-    />
-    <FilterableSelect
-    label="Coating"
-    name="mat_coat"
-    register={register}
-    options={coats.opts}
-    loading={coats.loading}
-    onQuery={coats.setQ}
-    required
-    />
-    <FilterableSelect
-    label="Color"
-    name="mat_color"
-    register={register}
-    options={colors.opts}
-    loading={colors.loading}
-    onQuery={colors.setQ}
-    required
-    />
-    <FilterableSelect
-    label="Opacity"
-    name="mat_opacity"
-    register={register}
-    options={opacs.opts}
-    loading={opacs.loading}
-    onQuery={opacs.setQ}
-    required
-    />
-    <FilterableSelect
-    label="Laser Source"
-    name="source"
-    register={register}
-    options={srcs.opts}
-    loading={srcs.loading}
-    onQuery={srcs.setQ}
-    required
-    />
-    <FilterableSelect
-    label="Lens"
-    name="lens"
-    register={register}
-    options={lens.opts}
-    loading={lens.loading}
-    onQuery={lens.setQ}
-    required
-    />
-    </div>
-
-    {/* Focus, thickness, repeat_all */}
-    <div className="grid md:grid-cols-3 gap-3">
-    <div>
-    <label className="block text-sm mb-1">Material Thickness (mm)</label>
-    <input type="number" step="0.01" className="w-full border rounded px-2 py-1" {...register("mat_thickness")} />
-    </div>
-    <div>
-    <label className="block text-sm mb-1">
-    Focus (mm) <span className="text-red-600">*</span>
-    </label>
-    <input
-    type="number"
-    min={-10}
-    max={10}
-    step="1"
-    className="w-full border rounded px-2 py-1"
-    {...register("focus", { required: true })}
-    />
-    <p className="text-xs text-muted-foreground mt-1">
-    0 = in focus. Negative = focus closer. Positive = focus further.
-    </p>
-    </div>
-    <div>
-    <label className="block text-sm mb-1">
-    Repeat All <span className="text-red-600">*</span>
-    </label>
-    <input type="number" step="1" className="w-full border rounded px-2 py-1" {...register("repeat_all", { required: true })} />
-    </div>
-    </div>
-
-    {/* FILL */}
-    <fieldset className="border rounded p-3 space-y-2">
-    <div className="flex items-center justify-between">
-    <legend className="font-semibold">Fill Settings</legend>
-    <button
-    type="button"
-    className="px-2 py-1 border rounded"
-    onClick={() => fills.append({ type: "uni" })} // default ensures value populated
-    >
-    + Add
-    </button>
-    </div>
-    {fills.fields.map((f, i) => (
-      <div key={f.id} className="grid md:grid-cols-4 gap-2">
-      <input placeholder="Name" className="border rounded px-2 py-1 md:col-span-2" {...register(`fill_settings.${i}.name`)} />
+      <div className="flex-1 min-w-[220px]">
       <FilterableSelect
-      label="Type"
-      name={`fill_settings.${i}.type`}
+      label="Software"
+      name="laser_soft"
       register={register}
-      options={fillType.opts}
-      loading={false}
-      onQuery={() => {}}
-      placeholder="Select type"
+      options={soft.opts}
+      loading={soft.loading}
+      onQuery={soft.setQ}
+      required={true}
       />
-      <input placeholder="Frequency (kHz)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.frequency`)} />
-      <input placeholder="Pulse (ns)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.pulse`)} />
-      <input placeholder="Power (%)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.power`)} />
-      <input placeholder="Speed (mm/s)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.speed`)} />
-      <input placeholder="Interval (mm)" type="number" step="0.001" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.interval`)} />
-      <input placeholder="Pass" type="number" step="1" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.pass`)} />
-      <input placeholder="Angle (°)" type="number" step="1" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.angle`)} />
-      <input placeholder="Increment" type="number" step="0.001" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.increment`)} />
-      <div className="flex items-center gap-3">
-      <BoolBox label="Auto" name={`fill_settings.${i}.auto`} register={register} />
-      <BoolBox label="Cross" name={`fill_settings.${i}.cross`} register={register} />
       </div>
-      <div className="flex items-center gap-3">
-      <BoolBox label="Flood" name={`fill_settings.${i}.flood`} register={register} />
-      <BoolBox label="Air" name={`fill_settings.${i}.air`} register={register} />
       </div>
 
-      <button type="button" className="px-2 py-1 border rounded md:col-span-4" onClick={() => fills.remove(i)}>
-      Remove
-      </button>
+      {/* Submitting-as banner */}
+      {me ? (
+        <div className="text-sm text-muted-foreground">
+        {isEdit ? "Editing as " : "Submitting as "}
+        <span className="font-medium">{meLabel}</span>.
+        </div>
+      ) : meErr ? (
+        <div className="border border-yellow-600 bg-yellow-50 text-yellow-800 rounded p-2 text-sm">
+        You’re not signed in. {isEdit ? "Saving changes" : "Submissions"} will fail until you sign in.
+        </div>
+      ) : null}
+
+      {submitErr ? (
+        <div className="border border-red-500 text-red-600 bg-red-50 rounded p-2 text-sm">{submitErr}</div>
+      ) : null}
+
+      <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
+      {/* Title */}
+      <div className="grid md:grid-cols-2 gap-3">
+      <div className="md:col-span-2">
+      <label className="block text-sm mb-1">
+      Title <span className="text-red-600">*</span>
+      </label>
+      <input className="w-full border rounded px-2 py-1" {...register("setting_title", { required: true })} />
       </div>
-    ))}
-    </fieldset>
-
-    {/* LINE */}
-    <fieldset className="border rounded p-3 space-y-2">
-    <div className="flex items-center justify-between">
-    <legend className="font-semibold">Line Settings</legend>
-    <button type="button" className="px-2 py-1 border rounded" onClick={() => lines.append({})}>
-    + Add
-    </button>
-    </div>
-    {lines.fields.map((f, i) => (
-      <div key={f.id} className="grid md:grid-cols-4 gap-2">
-      <input placeholder="Name" className="border rounded px-2 py-1 md:col-span-2" {...register(`line_settings.${i}.name`)} />
-      <input placeholder="Frequency (kHz)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`line_settings.${i}.frequency`)} />
-      <input placeholder="Pulse (ns)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`line_settings.${i}.pulse`)} />
-      <input placeholder="Power (%)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`line_settings.${i}.power`)} />
-      <input placeholder="Speed (mm/s)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`line_settings.${i}.speed`)} />
-      <input placeholder="Perf" className="border rounded px-2 py-1" {...register(`line_settings.${i}.perf`)} />
-      <input placeholder="Cut" className="border rounded px-2 py-1" {...register(`line_settings.${i}.cut`)} />
-      <input placeholder="Skip" className="border rounded px-2 py-1" {...register(`line_settings.${i}.skip`)} />
-      <input placeholder="Pass" type="number" step="1" className="border rounded px-2 py-1" {...register(`line_settings.${i}.pass`)} />
-      <input placeholder="Step" type="number" step="0.001" className="border rounded px-2 py-1" {...register(`line_settings.${i}.step`)} />
-      <input placeholder="Size" type="number" step="0.001" className="border rounded px-2 py-1" {...register(`line_settings.${i}.size`)} />
-      <BoolBox label="Wobble" name={`line_settings.${i}.wobble`} register={register} />
-      <BoolBox label="Air" name={`line_settings.${i}.air`} register={register} />
-
-      <button type="button" className="px-2 py-1 border rounded md:col-span-4" onClick={() => lines.remove(i)}>
-      Remove
-      </button>
       </div>
-    ))}
-    </fieldset>
 
-    {/* RASTER */}
-    <fieldset className="border rounded p-3 space-y-2">
-    <div className="flex items-center justify-between">
-    <legend className="font-semibold">Raster Settings</legend>
-    <button
-    type="button"
-    className="px-2 py-1 border rounded"
-    onClick={() => rasters.append({ type: "uni", dither: "threshold" })} // defaults ensure values are set
-    >
-    + Add
-    </button>
-    </div>
-    {rasters.fields.map((f, i) => (
-      <div key={f.id} className="grid md:grid-cols-4 gap-2">
-      <input placeholder="Name" className="border rounded px-2 py-1 md:col-span-2" {...register(`raster_settings.${i}.name`)} />
-      <input placeholder="Frequency (kHz)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.frequency`)} />
-      <input placeholder="Pulse (ns)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.pulse`)} />
+      {/* Images */}
+      <div className="grid md:grid-cols-2 gap-4">
+      <div>
+      <label className="block text-sm mb-1">
+      Result Photo {isEdit ? null : <span className="text-red-600">*</span>}
+      </label>
+      {isEdit && typeof (props as EditProps).initialValues?.photo === "string" && (
+        <p className="text-xs text-muted-foreground mb-1">
+        Current: <span className="font-mono">{shortId((props as EditProps).initialValues.photo)}</span>
+        </p>
+      )}
+      <input
+      type="file"
+      accept="image/*"
+      data-role="photo"
+      required={!isEdit}
+      onChange={(e) => onPick(e.target.files?.[0] ?? null, setPhotoFile, setPhotoPreview)}
+      />
+      <p className="text-xs text-muted-foreground mt-1">
+      {photoFile ? (
+        <>
+        Selected: <span className="font-mono">{photoFile.name}</span>
+        </>
+      ) : (
+        "Max 25 MB. JPG/PNG/WebP recommended."
+      )}
+      </p>
+      {photoPreview ? <img src={photoPreview} alt="Result preview" className="mt-2 rounded border" /> : null}
+      </div>
+
+      <div>
+      <label className="block text-sm mb-1">Settings Screenshot (optional)</label>
+      {isEdit && typeof (props as EditProps).initialValues?.screen === "string" && (
+        <p className="text-xs text-muted-foreground mb-1">
+        Current: <span className="font-mono">{shortId((props as EditProps).initialValues.screen)}</span>
+        </p>
+      )}
+      <input
+      type="file"
+      accept="image/*"
+      onChange={(e) => onPick(e.target.files?.[0] ?? null, setScreenFile, setScreenPreview)}
+      />
+      <p className="text-xs text-muted-foreground mt-1">
+      {screenFile ? (
+        <>
+        Selected: <span className="font-mono">{screenFile.name}</span>
+        </>
+      ) : (
+        "Max 25 MB. JPG/PNG/WebP recommended."
+      )}
+      </p>
+      {screenPreview ? <img src={screenPreview} alt="Settings preview" className="mt-2 rounded border" /> : null}
+      </div>
+      </div>
+
+      {/* Notes */}
+      <div>
+      <label className="block text-sm mb-1">Notes</label>
+      <textarea rows={4} className="w-full border rounded px-2 py-1" {...register("setting_notes")} />
+      </div>
+
+      {/* Material / Source / Lens */}
+      <div className="grid md:grid-cols-2 gap-3">
       <FilterableSelect
-      label="Type"
-      name={`raster_settings.${i}.type`}
+      label="Material"
+      name="mat"
       register={register}
-      options={rasterType.opts}
-      loading={false}
-      onQuery={() => {}}
-      placeholder="Select type"
+      options={mats.opts}
+      loading={mats.loading}
+      onQuery={mats.setQ}
+      required
       />
       <FilterableSelect
-      label="Dither"
-      name={`raster_settings.${i}.dither`}
+      label="Coating"
+      name="mat_coat"
       register={register}
-      options={rasterDither.opts}
-      loading={false}
-      onQuery={() => {}}
-      placeholder="Select dither"
+      options={coats.opts}
+      loading={coats.loading}
+      onQuery={coats.setQ}
+      required
+      />
+      <FilterableSelect
+      label="Color"
+      name="mat_color"
+      register={register}
+      options={colors.opts}
+      loading={colors.loading}
+      onQuery={colors.setQ}
+      required
+      />
+      <FilterableSelect
+      label="Opacity"
+      name="mat_opacity"
+      register={register}
+      options={opacs.opts}
+      loading={opacs.loading}
+      onQuery={opacs.setQ}
+      required
+      />
+      <FilterableSelect
+      label="Laser Source"
+      name="source"
+      register={register}
+      options={srcs.opts}
+      loading={srcs.loading}
+      onQuery={srcs.setQ}
+      required
+      />
+      <FilterableSelect
+      label="Lens"
+      name="lens"
+      register={register}
+      options={lens.opts}
+      loading={lens.loading}
+      onQuery={lens.setQ}
+      required
       />
-      <input placeholder="Power (%)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.power`)} />
-      <input placeholder="Speed (mm/s)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.speed`)} />
-      <input placeholder="Halftone Cell" type="number" step="1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.halftone_cell`)} />
-      <input placeholder="Halftone Angle" type="number" step="1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.halftone_angle`)} />
-      <input placeholder="Interval (mm)" type="number" step="0.001" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.interval`)} />
-      <input placeholder="Dot" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.dot`)} />
-      <input placeholder="Pass" type="number" step="1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.pass`)} />
-      <BoolBox label="Cross" name={`raster_settings.${i}.cross`} register={register} />
-      <div className="flex items-center gap-3">
-      <BoolBox label="Inversion" name={`raster_settings.${i}.inversion`} register={register} />
-      <BoolBox label="Air" name={`raster_settings.${i}.air`} register={register} />
       </div>
 
-      <button type="button" className="px-2 py-1 border rounded md:col-span-4" onClick={() => rasters.remove(i)}>
-      Remove
+      {/* Focus, thickness, repeat_all */}
+      <div className="grid md:grid-cols-3 gap-3">
+      <div>
+      <label className="block text-sm mb-1">Material Thickness (mm)</label>
+      <input type="number" step="0.01" className="w-full border rounded px-2 py-1" {...register("mat_thickness")} />
+      </div>
+      <div>
+      <label className="block text-sm mb-1">
+      Focus (mm) <span className="text-red-600">*</span>
+      </label>
+      <input
+      type="number"
+      min={-10}
+      max={10}
+      step="1"
+      className="w-full border rounded px-2 py-1"
+      {...register("focus", { required: true })}
+      />
+      <p className="text-xs text-muted-foreground mt-1">
+      0 = in focus. Negative = focus closer. Positive = focus further.
+      </p>
+      </div>
+      <div>
+      <label className="block text-sm mb-1">
+      Repeat All <span className="text-red-600">*</span>
+      </label>
+      <input type="number" step="1" className="w-full border rounded px-2 py-1" {...register("repeat_all", { required: true })} />
+      </div>
+      </div>
+
+      {/* FILL */}
+      <fieldset className="border rounded p-3 space-y-2">
+      <div className="flex items-center justify-between">
+      <legend className="font-semibold">Fill Settings</legend>
+      <button
+      type="button"
+      className="px-2 py-1 border rounded"
+      onClick={() => fills.append({ type: "uni" })} // default ensures value populated
+      >
+      + Add
       </button>
       </div>
-    ))}
-    </fieldset>
+      {fills.fields.map((f, i) => (
+        <div key={f.id} className="grid md:grid-cols-4 gap-2">
+        <input placeholder="Name" className="border rounded px-2 py-1 md:col-span-2" {...register(`fill_settings.${i}.name`)} />
+        <FilterableSelect
+        label="Type"
+        name={`fill_settings.${i}.type`}
+        register={register}
+        options={fillType.opts}
+        loading={false}
+        onQuery={() => {}}
+        placeholder="Select type"
+        />
+        <input placeholder="Frequency (kHz)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.frequency`)} />
+        <input placeholder="Pulse (ns)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.pulse`)} />
+        <input placeholder="Power (%)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.power`)} />
+        <input placeholder="Speed (mm/s)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.speed`)} />
+        <input placeholder="Interval (mm)" type="number" step="0.001" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.interval`)} />
+        <input placeholder="Pass" type="number" step="1" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.pass`)} />
+        <input placeholder="Angle (°)" type="number" step="1" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.angle`)} />
+        <input placeholder="Increment" type="number" step="0.001" className="border rounded px-2 py-1" {...register(`fill_settings.${i}.increment`)} />
+        <div className="flex items-center gap-3">
+        <BoolBox label="Auto" name={`fill_settings.${i}.auto`} register={register} />
+        <BoolBox label="Cross" name={`fill_settings.${i}.cross`} register={register} />
+        </div>
+        <div className="flex items-center gap-3">
+        <BoolBox label="Flood" name={`fill_settings.${i}.flood`} register={register} />
+        <BoolBox label="Air" name={`fill_settings.${i}.air`} register={register} />
+        </div>
 
-    <button
-    disabled={isSubmitting}
-    className="px-3 py-2 border rounded bg-accent text-background hover:opacity-90 disabled:opacity-50"
-    >
-    {isSubmitting ? "Submitting…" : "Submit Settings"}
-    </button>
-    </form>
-    </div>
-  );
+        <button type="button" className="px-2 py-1 border rounded md:col-span-4" onClick={() => fills.remove(i)}>
+        Remove
+        </button>
+        </div>
+      ))}
+      </fieldset>
+
+      {/* LINE */}
+      <fieldset className="border rounded p-3 space-y-2">
+      <div className="flex items-center justify-between">
+      <legend className="font-semibold">Line Settings</legend>
+      <button type="button" className="px-2 py-1 border rounded" onClick={() => lines.append({})}>
+      + Add
+      </button>
+      </div>
+      {lines.fields.map((f, i) => (
+        <div key={f.id} className="grid md:grid-cols-4 gap-2">
+        <input placeholder="Name" className="border rounded px-2 py-1 md:col-span-2" {...register(`line_settings.${i}.name`)} />
+        <input placeholder="Frequency (kHz)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`line_settings.${i}.frequency`)} />
+        <input placeholder="Pulse (ns)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`line_settings.${i}.pulse`)} />
+        <input placeholder="Power (%)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`line_settings.${i}.power`)} />
+        <input placeholder="Speed (mm/s)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`line_settings.${i}.speed`)} />
+        <input placeholder="Perf" className="border rounded px-2 py-1" {...register(`line_settings.${i}.perf`)} />
+        <input placeholder="Cut" className="border rounded px-2 py-1" {...register(`line_settings.${i}.cut`)} />
+        <input placeholder="Skip" className="border rounded px-2 py-1" {...register(`line_settings.${i}.skip`)} />
+        <input placeholder="Pass" type="number" step="1" className="border rounded px-2 py-1" {...register(`line_settings.${i}.pass`)} />
+        <input placeholder="Step" type="number" step="0.001" className="border rounded px-2 py-1" {...register(`line_settings.${i}.step`)} />
+        <input placeholder="Size" type="number" step="0.001" className="border rounded px-2 py-1" {...register(`line_settings.${i}.size`)} />
+        <BoolBox label="Wobble" name={`line_settings.${i}.wobble`} register={register} />
+        <BoolBox label="Air" name={`line_settings.${i}.air`} register={register} />
+
+        <button type="button" className="px-2 py-1 border rounded md:col-span-4" onClick={() => lines.remove(i)}>
+        Remove
+        </button>
+        </div>
+      ))}
+      </fieldset>
+
+      {/* RASTER */}
+      <fieldset className="border rounded p-3 space-y-2">
+      <div className="flex items-center justify-between">
+      <legend className="font-semibold">Raster Settings</legend>
+      <button
+      type="button"
+      className="px-2 py-1 border rounded"
+      onClick={() => rasters.append({ type: "uni", dither: "threshold" })} // defaults ensure values are set
+      >
+      + Add
+      </button>
+      </div>
+      {rasters.fields.map((f, i) => (
+        <div key={f.id} className="grid md:grid-cols-4 gap-2">
+        <input placeholder="Name" className="border rounded px-2 py-1 md:col-span-2" {...register(`raster_settings.${i}.name`)} />
+        <input placeholder="Frequency (kHz)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.frequency`)} />
+        <input placeholder="Pulse (ns)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.pulse`)} />
+        <FilterableSelect
+        label="Type"
+        name={`raster_settings.${i}.type`}
+        register={register}
+        options={rasterType.opts}
+        loading={false}
+        onQuery={() => {}}
+        placeholder="Select type"
+        />
+        <FilterableSelect
+        label="Dither"
+        name={`raster_settings.${i}.dither`}
+        register={register}
+        options={rasterDither.opts}
+        loading={false}
+        onQuery={() => {}}
+        placeholder="Select dither"
+        />
+        <input placeholder="Power (%)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.power`)} />
+        <input placeholder="Speed (mm/s)" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.speed`)} />
+        <input placeholder="Halftone Cell" type="number" step="1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.halftone_cell`)} />
+        <input placeholder="Halftone Angle" type="number" step="1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.halftone_angle`)} />
+        <input placeholder="Interval (mm)" type="number" step="0.001" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.interval`)} />
+        <input placeholder="Dot" type="number" step="0.1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.dot`)} />
+        <input placeholder="Pass" type="number" step="1" className="border rounded px-2 py-1" {...register(`raster_settings.${i}.pass`)} />
+        <BoolBox label="Cross" name={`raster_settings.${i}.cross`} register={register} />
+        <div className="flex items-center gap-3">
+        <BoolBox label="Inversion" name={`raster_settings.${i}.inversion`} register={register} />
+        <BoolBox label="Air" name={`raster_settings.${i}.air`} register={register} />
+        </div>
+
+        <button type="button" className="px-2 py-1 border rounded md:col-span-4" onClick={() => rasters.remove(i)}>
+        Remove
+        </button>
+        </div>
+      ))}
+      </fieldset>
+
+      <button
+      disabled={isSubmitting}
+      className="px-3 py-2 border rounded bg-accent text-background hover:opacity-90 disabled:opacity-50"
+      >
+      {isSubmitting ? (isEdit ? "Saving…" : "Submitting…") : (isEdit ? "Save Changes" : "Submit Settings")}
+      </button>
+      </form>
+      </div>
+    );
 }