diff --git a/app/api/me/route.ts b/app/api/me/route.ts
index b8bf6e94..7e525a15 100644
--- a/app/api/me/route.ts
+++ b/app/api/me/route.ts
@@ -1,19 +1,16 @@
 // app/api/me/route.ts
 import { NextResponse } from "next/server";
 
-/** Read a cookie value from a raw Cookie header string */
 function readCookie(name: string, cookieHeader: string) {
     const m = cookieHeader.match(new RegExp(`(?:^|;\\s*)${name}=([^;]+)`));
     return m?.[1] ?? null;
 }
 
 export async function GET(req: Request) {
-    // Prefer DIRECTUS_URL if present; fall back to NEXT_PUBLIC_API_BASE_URL
-    const base =
-    process.env.DIRECTUS_URL || process.env.NEXT_PUBLIC_API_BASE_URL || "";
-    const url = `${base.replace(/\/$/, "")}/users/me?fields=id,username,display_name,first_name,last_name,email`;
+    const base = process.env.NEXT_PUBLIC_API_BASE_URL!;
+    // NOTE: include username explicitly
+    const url  = `${base}/users/me?fields=id,username,display_name,first_name,last_name,email`;
 
-    // Forward the incoming cookies (session), and also ma_at as Bearer (token setups)
     const cookieHeader = req.headers.get("cookie") ?? "";
     const ma_at = readCookie("ma_at", cookieHeader);
 
@@ -21,7 +18,7 @@ export async function GET(req: Request) {
     if (cookieHeader) headers.cookie = cookieHeader;
     if (ma_at) headers.authorization = `Bearer ${ma_at}`;
 
-    const res = await fetch(url, { headers, cache: "no-store" });
+    const res  = await fetch(url, { headers, cache: "no-store" });
     const body = await res.json().catch(() => ({}));
 
     return new NextResponse(JSON.stringify(body), {
diff --git a/app/api/options/laser_source/route.ts b/app/api/options/laser_source/route.ts
index 2bc4d0cb..fc4ca460 100644
--- a/app/api/options/laser_source/route.ts
+++ b/app/api/options/laser_source/route.ts
@@ -2,61 +2,56 @@
 export const dynamic = "force-dynamic";
 
 import { NextRequest, NextResponse } from "next/server";
+const BASE = (process.env.DIRECTUS_URL || "").replace(/\/$/, "");
 
-const BASE = (
-    process.env.DIRECTUS_URL || process.env.NEXT_PUBLIC_API_BASE_URL || ""
-).replace(/\/$/, "");
-
-function buildPath() {
-    // This collection uses make/model (no `name` field)
-    const url = new URL(`${BASE}/items/laser_source`);
-    url.searchParams.set("fields", "id,make,model");
-    url.searchParams.set("sort", "make,model");
-    return String(url);
-}
-
-async function dFetch(bearer: string) {
-    const res = await fetch(buildPath(), {
-        headers: { Accept: "application/json", Authorization: `Bearer ${bearer}` },
-        cache: "no-store",
-    });
-    const text = await res.text().catch(() => "");
-    let json: any = null;
-    try {
-        json = text ? JSON.parse(text) : null;
-    } catch {}
-    return { res, json, text };
+function nmForTarget(target?: string | null) {
+    // Optional: narrow list per tab; adjust if your data differs.
+    switch (target) {
+        case "fiber":      return 1064;
+        case "uv":         return 355;
+        case "co2-galvo":
+        case "co2-gantry": return 10600;
+        default:           return null;
+    }
 }
 
 export async function GET(req: NextRequest) {
     try {
-        const userAt = req.cookies.get("ma_at")?.value;
-        if (!userAt) {
-            return NextResponse.json({ error: "Not authenticated" }, { status: 401 });
+        const ma_at = req.cookies.get("ma_at")?.value;
+        if (!ma_at) return NextResponse.json({ error: "Not authenticated" }, { status: 401 });
+
+        const target = req.nextUrl.searchParams.get("target"); // "fiber" | "uv" | "co2-galvo" | "co2-gantry"
+        const url = new URL(`${BASE}/items/laser_source`);
+        // Your collection has make/model (no single "name")
+        url.searchParams.set("fields", "id,make,model,nm");
+        url.searchParams.set("sort", "make,model");
+
+        const nm = nmForTarget(target);
+        if (nm != null) {
+            url.searchParams.set("filter[nm][_eq]", String(nm));
         }
 
-        const r = await dFetch(userAt);
-        if (!r.res.ok) {
+        const res = await fetch(String(url), {
+            headers: { Accept: "application/json", Authorization: `Bearer ${ma_at}` },
+            cache: "no-store",
+        });
+
+        const text = await res.text().catch(() => "");
+        if (!res.ok) {
             return NextResponse.json(
-                { error: `Directus ${r.res.status}: ${r.text || r.res.statusText}` },
-                { status: r.res.status }
+                { error: `Directus ${res.status}: ${text || res.statusText}` },
+                { status: res.status }
             );
         }
 
-        const rows: Array<{ id: string | number; make?: string; model?: string }> =
-        r.json?.data ?? [];
-
-        // Compose human label from make + model
-        const data = rows.map(({ id, make, model }) => {
-            const label = [make, model].filter(Boolean).join(" ");
-            return { id, name: label, label };
-        });
+        const json = text ? JSON.parse(text) : { data: [] };
+        const data = (json?.data ?? []).map((r: any) => ({
+            id: r.id,
+            label: [r.make, r.model].filter(Boolean).join(" ").trim() || String(r.id),
+        }));
 
         return NextResponse.json({ data });
     } catch (e: any) {
-        return NextResponse.json(
-            { error: e?.message || "Failed to load laser sources" },
-            { status: 500 }
-        );
+        return NextResponse.json({ error: e?.message || "Failed to load laser sources" }, { status: 500 });
     }
 }
diff --git a/app/api/options/material_opacity/route.ts b/app/api/options/material_opacity/route.ts
new file mode 100644
index 00000000..1dd8d702
--- /dev/null
+++ b/app/api/options/material_opacity/route.ts
@@ -0,0 +1,39 @@
+// app/api/options/material_opacity/route.ts
+export const dynamic = "force-dynamic";
+
+import { NextRequest, NextResponse } from "next/server";
+const BASE = (process.env.DIRECTUS_URL || "").replace(/\/$/, "");
+
+export async function GET(req: NextRequest) {
+    try {
+        const ma_at = req.cookies.get("ma_at")?.value;
+        if (!ma_at) return NextResponse.json({ error: "Not authenticated" }, { status: 401 });
+
+        const url = new URL(`${BASE}/items/material_opacity`);
+        url.searchParams.set("fields", "id,opacity");
+        url.searchParams.set("sort", "sort,opacity");
+
+        const res = await fetch(String(url), {
+            headers: { Accept: "application/json", Authorization: `Bearer ${ma_at}` },
+            cache: "no-store",
+        });
+
+        const text = await res.text().catch(() => "");
+        if (!res.ok) {
+            return NextResponse.json(
+                { error: `Directus ${res.status}: ${text || res.statusText}` },
+                { status: res.status }
+            );
+        }
+
+        const json = text ? JSON.parse(text) : { data: [] };
+        const data = (json?.data ?? []).map((r: any) => ({
+            id: r.id,
+            label: r.opacity ?? String(r.id),
+        }));
+
+        return NextResponse.json({ data });
+    } catch (e: any) {
+        return NextResponse.json({ error: e?.message || "Failed to load opacity options" }, { status: 500 });
+    }
+}
diff --git a/app/components/forms/SettingsSubmit.tsx b/app/components/forms/SettingsSubmit.tsx
index 17c4b1cc..9b6b2206 100644
--- a/app/components/forms/SettingsSubmit.tsx
+++ b/app/components/forms/SettingsSubmit.tsx
@@ -4,12 +4,7 @@ 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";
-
+type Target = "settings_fiber" | "settings_co2gan" | "settings_co2gal" | "settings_uv";
 type Opt = { id: string; label: string };
 type Me = {
   id: string;
@@ -20,6 +15,11 @@ type Me = {
   email?: string;
 };
 
+function shortId(s?: string) {
+  if (!s) return "";
+  return s.length <= 12 ? s : `${s.slice(0, 8)}…${s.slice(-4)}`;
+}
+
 function useOptions(path: string) {
   const [opts, setOpts] = useState<Opt[]>([]);
   const [loading, setLoading] = useState(false);
@@ -28,9 +28,7 @@ function useOptions(path: string) {
   useEffect(() => {
     let alive = true;
     setLoading(true);
-    const url = `/api/options/${path}${
-      path.includes("?") ? "&" : "?"
-    }q=${encodeURIComponent(q)}`;
+    const url = `/api/options/${path}${path.includes("?") ? "&" : "?"}q=${encodeURIComponent(q)}`;
     fetch(url, { cache: "no-store", credentials: "include" })
     .then((r) => r.json())
     .then((j) => {
@@ -40,14 +38,9 @@ function useOptions(path: string) {
       ? raw
       .map((x) => ({
         id: String(x?.id ?? x?.value ?? x?.key ?? ""),
-                   // include `opacity` as a label fallback (fixes opacity IDs)
+                   // IMPORTANT: recognize 'opacity' too
                    label: String(
-                     x?.label ??
-                     x?.name ??
-                     x?.title ??
-                     x?.text ??
-                     x?.opacity ??
-                     ""
+                     x?.label ?? x?.name ?? x?.title ?? x?.text ?? x?.opacity ?? ""
                    ),
       }))
       .filter((o) => o.id && o.label)
@@ -104,10 +97,7 @@ function FilterableSelect({
     value={filter}
     onChange={(e) => setFilter(e.target.value)}
     />
-    <select
-    className="w-full border rounded px-2 py-1"
-    {...register(name, { required })}
-    >
+    <select className="w-full border rounded px-2 py-1" {...register(name, { required })}>
     <option value="">
     {placeholder}
     {loading ? " (loading…)" : ""}
@@ -122,15 +112,7 @@ function FilterableSelect({
   );
 }
 
-function BoolBox({
-  label,
-  name,
-  register,
-}: {
-  label: string;
-  name: string;
-  register: UseFormRegister<any>;
-}) {
+function BoolBox({ label, name, register }: { label: string; name: string; register: UseFormRegister<any> }) {
   return (
     <label className="flex items-center gap-1 text-sm">
     <input type="checkbox" {...register(name)} /> {label}
@@ -138,28 +120,23 @@ function BoolBox({
   );
 }
 
-export default function SettingsSubmit({
-  initialTarget,
-}: {
-  initialTarget?: Target;
-}) {
+export default function SettingsSubmit({ initialTarget }: { initialTarget?: Target }) {
   const router = useRouter();
   const sp = useSearchParams();
-  const initialFromQuery =
-  (sp.get("target") as Target) || initialTarget || "settings_fiber";
+  const initialFromQuery = (sp.get("target") as Target) || initialTarget || "settings_fiber";
   const [target, setTarget] = useState<Target>(initialFromQuery);
 
-  // Map collection -> options slug used by API (?target=)
+  // Map collection -> slug used by options endpoints
   const typeForOptions = useMemo(() => {
     switch (target) {
       case "settings_fiber":
         return "fiber";
       case "settings_uv":
         return "uv";
-      case "settings_co2gal":
-        return "co2-galvo";
       case "settings_co2gan":
         return "co2-gantry";
+      case "settings_co2gal":
+        return "co2-galvo";
       default:
         return "fiber";
     }
@@ -171,10 +148,10 @@ export default function SettingsSubmit({
   const [photoPreview, setPhotoPreview] = useState<string>("");
   const [screenPreview, setScreenPreview] = useState<string>("");
 
-  // UX errors
+  // UX error for auth/submit
   const [submitErr, setSubmitErr] = useState<string | null>(null);
 
-  // Signed-in user (banner)
+  // Current signed-in user (banner only)
   const [me, setMe] = useState<Me | null>(null);
   const [meErr, setMeErr] = useState<string | null>(null);
 
@@ -193,13 +170,13 @@ export default function SettingsSubmit({
       };
   }, []);
 
-  // prefer username specifically; then display_name, name, email, id
+  // Prefer username; then email; then names/display; lastly short id
   const meLabel =
   (me?.username && me.username.trim()) ||
-  (me?.display_name && me.display_name.trim()) ||
-  [me?.first_name, me?.last_name].filter(Boolean).join(" ").trim() ||
   (me?.email && me.email.trim()) ||
-  me?.id ||
+  ([me?.first_name, me?.last_name].filter(Boolean).join(" ").trim()) ||
+  (me?.display_name && me.display_name.trim()) ||
+  (me?.id && `User ${shortId(me.id)}`) ||
   "Unknown user";
 
     // Options
@@ -207,22 +184,16 @@ export default function SettingsSubmit({
     const coats = useOptions("material_coating");
     const colors = useOptions("material_color");
     const opacs = useOptions("material_opacity");
-    const soft = useOptions("laser_software");
+    const soft = useOptions("laser_software"); // required for ALL targets
 
-    // IMPORTANT: these expect ?target=slug
+    // IMPORTANT: your API expects ?target= for these two
     const srcs = useOptions(`laser_source?target=${typeForOptions}`);
     const lens = useOptions(`lens?target=${typeForOptions}`);
 
-    // Repeater choices
-    const fillType = useOptions(
-      `repeater-choices?target=${target}&group=fill_settings&field=type`
-    );
-    const rasterType = useOptions(
-      `repeater-choices?target=${target}&group=raster_settings&field=type`
-    );
-    const rasterDither = useOptions(
-      `repeater-choices?target=${target}&group=raster_settings&field=dither`
-    );
+    // Repeater choice options
+    const fillType = useOptions(`repeater-choices?target=${target}&group=fill_settings&field=type`);
+    const rasterType = useOptions(`repeater-choices?target=${target}&group=raster_settings&field=type`);
+    const rasterDither = useOptions(`repeater-choices?target=${target}&group=raster_settings&field=dither`);
 
     const {
       register,
@@ -243,7 +214,7 @@ export default function SettingsSubmit({
         lens: "",
         focus: "",
         laser_soft: "",
-        repeat_all: "", // now for ALL targets
+        repeat_all: "", // now visible for ALL targets
         fill_settings: [],
         line_settings: [],
         raster_settings: [],
@@ -254,8 +225,6 @@ export default function SettingsSubmit({
     const lines = useFieldArray({ control, name: "line_settings" });
     const rasters = useFieldArray({ control, name: "raster_settings" });
 
-    const isGantry = target === "settings_co2gan";
-
     function num(v: any) {
       return v === "" || v == null ? null : Number(v);
     }
@@ -265,11 +234,7 @@ export default function SettingsSubmit({
       setSubmitErr(null);
 
       if (!photoFile) {
-        (
-          document.querySelector(
-            'input[type="file"][data-role="photo"]'
-          ) as HTMLInputElement | null
-        )?.focus();
+        (document.querySelector('input[type="file"][data-role="photo"]') as HTMLInputElement | null)?.focus();
         return;
       }
 
@@ -285,9 +250,8 @@ export default function SettingsSubmit({
         source: values.source || null,
         lens: values.lens || null,
         focus: num(values.focus),
-        laser_soft: values.laser_soft || null, // required for all targets by the form
-        repeat_all: num(values.repeat_all), // required for all targets by the form
-
+        laser_soft: values.laser_soft || null, // required for ALL targets
+        repeat_all: num(values.repeat_all), // now included for ALL targets
         fill_settings: (values.fill_settings || []).map((r: any) => ({
           name: r.name || "",
           power: num(r.power),
@@ -304,7 +268,6 @@ export default function SettingsSubmit({
                                                                      flood: bool(r.flood),
                                                                      air: bool(r.air),
         })),
-
         line_settings: (values.line_settings || []).map((r: any) => ({
           name: r.name || "",
           power: num(r.power),
@@ -320,7 +283,6 @@ export default function SettingsSubmit({
                                                                      step: num(r.step),
                                                                      size: num(r.size),
         })),
-
         raster_settings: (values.raster_settings || []).map((r: any) => ({
           name: r.name || "",
           power: num(r.power),
@@ -345,15 +307,9 @@ export default function SettingsSubmit({
         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",
-          });
+          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",
@@ -365,12 +321,10 @@ export default function SettingsSubmit({
 
         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.");
+          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 form and previews
         reset();
         setPhotoFile(null);
         setScreenFile(null);
@@ -378,21 +332,13 @@ export default function SettingsSubmit({
         setScreenPreview("");
 
         const id = data?.id ? String(data.id) : "";
-        router.push(
-          `/submit/settings/success?target=${encodeURIComponent(
-            target
-          )}&id=${encodeURIComponent(id)}`
-        );
+        router.push(`/submit/settings/success?target=${encodeURIComponent(target)}&id=${encodeURIComponent(id)}`);
       } catch (e: any) {
         setSubmitErr(e?.message || "Submission failed");
       }
     }
 
-    function onPick(
-      file: File | null,
-      setFile: (f: File | null) => void,
-                    setPreview: (s: string) => void
-    ) {
+    function onPick(file: File | null, setFile: (f: File | null) => void, setPreview: (s: string) => void) {
       setFile(file);
       if (!file) {
         setPreview("");
@@ -446,12 +392,9 @@ export default function SettingsSubmit({
       ) : null}
 
       {submitErr ? (
-        <div className="border border-red-500 text-red-600 bg-red-50 rounded p-2 text-sm">
-        {submitErr}
-        </div>
+        <div className="border border-red-500 text-red-600 bg-red-50 rounded p-2 text-sm">{submitErr}</div>
       ) : null}
 
-      {/* Form */}
       <form onSubmit={handleSubmit(onSubmit)} className="space-y-4">
       {/* Title */}
       <div className="grid md:grid-cols-2 gap-3">
@@ -459,10 +402,7 @@ export default function SettingsSubmit({
       <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 })}
-      />
+      <input className="w-full border rounded px-2 py-1" {...register("setting_title", { required: true })} />
       </div>
       </div>
 
@@ -477,75 +417,43 @@ export default function SettingsSubmit({
       accept="image/*"
       data-role="photo"
       required
-      onChange={(e) =>
-        onPick(
-          e.target.files?.[0] ?? null,
-          setPhotoFile,
-          setPhotoPreview
-        )
-      }
+      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>
+        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}
+      {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>
+      <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
-        )
-      }
+      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>
+        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}
+      {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")}
-      />
+      <textarea rows={4} className="w-full border rounded px-2 py-1" {...register("setting_notes")} />
       </div>
 
       {/* Material / Source / Lens */}
@@ -586,8 +494,6 @@ export default function SettingsSubmit({
       onQuery={opacs.setQ}
       required
       />
-
-      {/* these now receive populated options */}
       <FilterableSelect
       label="Laser Source"
       name="source"
@@ -608,18 +514,11 @@ export default function SettingsSubmit({
       />
       </div>
 
-      {/* Focus, thickness, repeat_all (now on all targets) */}
+      {/* 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")}
-      />
+      <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">
@@ -641,12 +540,7 @@ export default function SettingsSubmit({
       <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 })}
-      />
+      <input type="number" step="1" className="w-full border rounded px-2 py-1" {...register("repeat_all", { required: true })} />
       </div>
       </div>
 
@@ -654,21 +548,13 @@ export default function SettingsSubmit({
       <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({})}
-      >
+      <button type="button" className="px-2 py-1 border rounded" onClick={() => fills.append({})}>
       + 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`)}
-        />
+        <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`}
@@ -678,102 +564,24 @@ export default function SettingsSubmit({
         onQuery={fillType.setQ}
         placeholder="Select type"
         />
-
-        {!isGantry && (
-          <>
-          <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`)}
-        />
-
-        {!isGantry && (
-          <>
-          <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>
-          </>
-        )}
+        <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="Flood"
-        name={`fill_settings.${i}.flood`}
-        register={register}
-        />
-        <BoolBox
-        label="Air"
-        name={`fill_settings.${i}.air`}
-        register={register}
-        />
+        <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)}
-        >
+        <button type="button" className="px-2 py-1 border rounded md:col-span-4" onClick={() => fills.remove(i)}>
         Remove
         </button>
         </div>
@@ -784,111 +592,27 @@ export default function SettingsSubmit({
       <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({})}
-      >
+      <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="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} />
 
-        {!isGantry && (
-          <>
-          <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`)}
-        />
-        {!isGantry && (
-          <>
-          <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)}
-        >
+        <button type="button" className="px-2 py-1 border rounded md:col-span-4" onClick={() => lines.remove(i)}>
         Remove
         </button>
         </div>
@@ -899,41 +623,15 @@ export default function SettingsSubmit({
       <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({})}
-      >
+      <button type="button" className="px-2 py-1 border rounded" onClick={() => rasters.append({})}>
       + 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`)}
-        />
-
-        {!isGantry && (
-          <>
-          <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`)}
-          />
-          </>
-        )}
-
+        <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`}
@@ -952,82 +650,20 @@ export default function SettingsSubmit({
         onQuery={rasterDither.setQ}
         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`)}
-        />
-
-        {!isGantry && (
-          <BoolBox
-          label="Cross"
-          name={`raster_settings.${i}.cross`}
-          register={register}
-          />
-        )}
+        <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}
-        />
+        <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)}
-        >
+        <button type="button" className="px-2 py-1 border rounded md:col-span-4" onClick={() => rasters.remove(i)}>
         Remove
         </button>
         </div>
@@ -1043,4 +679,686 @@ export default function SettingsSubmit({
       </form>
       </div>
     );
+}
+"use client";
+
+    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";
+    type Opt = { id: string; label: string };
+    type Me = {
+      id: string;
+      username?: string;
+      display_name?: string;
+      first_name?: string;
+      last_name?: string;
+      email?: string;
+    };
+
+    function shortId(s?: string) {
+      if (!s) return "";
+      return s.length <= 12 ? s : `${s.slice(0, 8)}…${s.slice(-4)}`;
+    }
+
+    function useOptions(path: string) {
+      const [opts, setOpts] = useState<Opt[]>([]);
+      const [loading, setLoading] = useState(false);
+      const [q, setQ] = useState("");
+
+      useEffect(() => {
+        let alive = true;
+        setLoading(true);
+        const url = `/api/options/${path}${path.includes("?") ? "&" : "?"}q=${encodeURIComponent(q)}`;
+        fetch(url, { cache: "no-store", credentials: "include" })
+        .then((r) => r.json())
+        .then((j) => {
+          if (!alive) return;
+          const raw = (j?.data ?? j) as any[];
+          const normalized: Opt[] = Array.isArray(raw)
+          ? raw
+          .map((x) => ({
+            id: String(x?.id ?? x?.value ?? x?.key ?? ""),
+                       // IMPORTANT: recognize 'opacity' too
+                       label: String(
+                         x?.label ?? x?.name ?? x?.title ?? x?.text ?? x?.opacity ?? ""
+                       ),
+          }))
+          .filter((o) => o.id && o.label)
+          : [];
+          setOpts(normalized);
+        })
+        .finally(() => alive && setLoading(false));
+        return () => {
+          alive = false;
+        };
+      }, [path, q]);
+
+      return { opts, loading, setQ };
+    }
+
+    function FilterableSelect({
+      label,
+      name,
+      register,
+      options,
+      loading,
+      onQuery,
+      placeholder = "—",
+      required = false,
+    }: {
+      label: string;
+      name: string;
+      register: UseFormRegister<any>;
+      options: Opt[];
+      loading?: boolean;
+      onQuery?: (q: string) => void;
+      placeholder?: string;
+      required?: boolean;
+    }) {
+      const [filter, setFilter] = useState("");
+      useEffect(() => {
+        onQuery?.(filter);
+      }, [filter, onQuery]);
+
+      const filtered = useMemo(() => {
+        if (!filter) return options;
+        const f = filter.toLowerCase();
+        return options.filter((o) => o.label.toLowerCase().includes(f));
+      }, [options, filter]);
+
+      return (
+        <div>
+        <label className="block text-sm mb-1">
+        {label} {required ? <span className="text-red-600">*</span> : null}
+        </label>
+        <input
+        className="w-full border rounded px-2 py-1 mb-1"
+        placeholder="Type to filter…"
+        value={filter}
+        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>
+        {filtered.map((o) => (
+          <option key={o.id} value={o.id}>
+          {o.label}
+          </option>
+        ))}
+        </select>
+        </div>
+      );
+    }
+
+    function BoolBox({ label, name, register }: { label: string; name: string; register: UseFormRegister<any> }) {
+      return (
+        <label className="flex items-center gap-1 text-sm">
+        <input type="checkbox" {...register(name)} /> {label}
+        </label>
+      );
+    }
+
+    export default function SettingsSubmit({ initialTarget }: { initialTarget?: Target }) {
+      const router = useRouter();
+      const sp = useSearchParams();
+      const initialFromQuery = (sp.get("target") as Target) || initialTarget || "settings_fiber";
+      const [target, setTarget] = useState<Target>(initialFromQuery);
+
+      // Map collection -> slug used by options endpoints
+      const typeForOptions = useMemo(() => {
+        switch (target) {
+          case "settings_fiber":
+            return "fiber";
+          case "settings_uv":
+            return "uv";
+          case "settings_co2gan":
+            return "co2-gantry";
+          case "settings_co2gal":
+            return "co2-galvo";
+          default:
+            return "fiber";
+        }
+      }, [target]);
+
+      // Image inputs
+      const [photoFile, setPhotoFile] = useState<File | null>(null);
+      const [screenFile, setScreenFile] = useState<File | null>(null);
+      const [photoPreview, setPhotoPreview] = useState<string>("");
+      const [screenPreview, setScreenPreview] = useState<string>("");
+
+      // UX error for auth/submit
+      const [submitErr, setSubmitErr] = useState<string | null>(null);
+
+      // Current signed-in user (banner only)
+      const [me, setMe] = useState<Me | null>(null);
+      const [meErr, setMeErr] = useState<string | null>(null);
+
+      useEffect(() => {
+        let alive = true;
+        fetch("/api/me", { cache: "no-store", credentials: "include" })
+        .then((r) => (r.ok ? r.json() : Promise.reject(r)))
+        .then((j) => {
+          if (alive) setMe(j?.data || j || null);
+        })
+        .catch(() => {
+          if (alive) setMeErr("not-signed-in");
+        });
+          return () => {
+            alive = false;
+          };
+      }, []);
+
+      // Prefer username; then email; then names/display; lastly short id
+      const meLabel =
+      (me?.username && me.username.trim()) ||
+      (me?.email && me.email.trim()) ||
+      ([me?.first_name, me?.last_name].filter(Boolean).join(" ").trim()) ||
+      (me?.display_name && me.display_name.trim()) ||
+      (me?.id && `User ${shortId(me.id)}`) ||
+      "Unknown user";
+
+        // Options
+        const mats = useOptions("material");
+        const coats = useOptions("material_coating");
+        const colors = useOptions("material_color");
+        const opacs = useOptions("material_opacity");
+        const soft = useOptions("laser_software"); // required for ALL targets
+
+        // IMPORTANT: your API expects ?target= for these two
+        const srcs = useOptions(`laser_source?target=${typeForOptions}`);
+        const lens = useOptions(`lens?target=${typeForOptions}`);
+
+        // Repeater choice options
+        const fillType = useOptions(`repeater-choices?target=${target}&group=fill_settings&field=type`);
+        const rasterType = useOptions(`repeater-choices?target=${target}&group=raster_settings&field=type`);
+        const rasterDither = useOptions(`repeater-choices?target=${target}&group=raster_settings&field=dither`);
+
+        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: "", // now visible for ALL targets
+            fill_settings: [],
+            line_settings: [],
+            raster_settings: [],
+          },
+        });
+
+        const fills = useFieldArray({ control, name: "fill_settings" });
+        const lines = useFieldArray({ control, name: "line_settings" });
+        const rasters = useFieldArray({ control, name: "raster_settings" });
+
+        function num(v: any) {
+          return v === "" || v == null ? null : Number(v);
+        }
+        const bool = (v: any) => !!v;
+
+        async function onSubmit(values: any) {
+          setSubmitErr(null);
+
+          if (!photoFile) {
+            (document.querySelector('input[type="file"][data-role="photo"]') as HTMLInputElement | null)?.focus();
+            return;
+          }
+
+          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, // required for ALL targets
+            repeat_all: num(values.repeat_all), // now included for 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 (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();
+            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");
+          }
+        }
+
+        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>.
+            </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({})}>
+          + 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`)} />
+            <FilterableSelect
+            label="Type"
+            name={`fill_settings.${i}.type`}
+            register={register}
+            options={fillType.opts}
+            loading={fillType.loading}
+            onQuery={fillType.setQ}
+            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 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({})}>
+          + 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={rasterType.loading}
+            onQuery={rasterType.setQ}
+            placeholder="Select type"
+            />
+            <FilterableSelect
+            label="Dither"
+            name={`raster_settings.${i}.dither`}
+            register={register}
+            options={rasterDither.opts}
+            loading={rasterDither.loading}
+            onQuery={rasterDither.setQ}
+            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 ? "Submitting…" : "Submit Settings"}
+          </button>
+          </form>
+          </div>
+        );
     }