diff --git a/apps/blade/src/app/admin/forms/[slug]/client.tsx b/apps/blade/src/app/admin/forms/[slug]/client.tsx
index 46cc489c..502c301e 100644
--- a/apps/blade/src/app/admin/forms/[slug]/client.tsx
+++ b/apps/blade/src/app/admin/forms/[slug]/client.tsx
@@ -22,7 +22,7 @@ import {
   verticalListSortingStrategy,
 } from "@dnd-kit/sortable";
 import { CSS } from "@dnd-kit/utilities";
-import { ArrowLeft, Loader2, Plus, Save } from "lucide-react";
+import { ArrowLeft, Loader2, Plus, Save, Users } from "lucide-react";
 
 import type {
   FormType,
@@ -31,6 +31,16 @@ import type {
 } from "@forge/consts/knight-hacks";
 import { Button } from "@forge/ui/button";
 import { Card } from "@forge/ui/card";
+import { Checkbox } from "@forge/ui/checkbox";
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger,
+} from "@forge/ui/dialog";
 import { Input } from "@forge/ui/input";
 import { Label } from "@forge/ui/label";
 import { Switch } from "@forge/ui/switch";
@@ -61,6 +71,10 @@ function SortableItem({
   onDuplicateInstruction,
   onClick,
   onForceSave,
+  onMoveUp,
+  onMoveDown,
+  canMoveUp,
+  canMoveDown,
   error,
 }: {
   item: UIQuestion | UIInstruction;
@@ -73,6 +87,10 @@ function SortableItem({
   onDuplicateInstruction: (i: UIInstruction) => void;
   onClick: () => void;
   onForceSave: () => void;
+  onMoveUp?: () => void;
+  onMoveDown?: () => void;
+  canMoveUp?: boolean;
+  canMoveDown?: boolean;
   error?: string;
 }) {
   const { attributes, listeners, setNodeRef, transform, transition } =
@@ -102,6 +120,10 @@ function SortableItem({
             onDelete={onDelete}
             onDuplicate={onDuplicateInstruction}
             dragHandleProps={listeners}
+            onMoveUp={onMoveUp}
+            onMoveDown={onMoveDown}
+            canMoveUp={canMoveUp}
+            canMoveDown={canMoveDown}
           />
         ) : (
           <QuestionEditCard
@@ -113,6 +135,10 @@ function SortableItem({
             onForceSave={onForceSave}
             error={error}
             dragHandleProps={listeners}
+            onMoveUp={onMoveUp}
+            onMoveDown={onMoveDown}
+            canMoveUp={canMoveUp}
+            canMoveDown={canMoveDown}
           />
         )}
       </div>
@@ -162,6 +188,8 @@ export function EditorClient({
   const [instructions, setInstructions] = useState<UIInstruction[]>([]);
   const [duesOnly, setDuesOnly] = useState(false);
   const [allowResubmission, setAllowResubmission] = useState(true);
+  const [responseRoleIds, setResponseRoleIds] = useState<string[]>([]);
+  const [responseRolesDialogOpen, setResponseRolesDialogOpen] = useState(false);
   const [activeItemId, setActiveItemId] = useState<string | null>(null);
 
   const [isLoading, setIsLoading] = useState(true);
@@ -177,6 +205,8 @@ export function EditorClient({
     { retry: false, refetchOnWindowFocus: false },
   );
 
+  const { data: allRoles = [] } = api.roles.getAllLinks.useQuery();
+
   const updateFormMutation = api.forms.updateForm.useMutation({
     onMutate: () => setSaveStatus("Saving..."),
     onSuccess: () =>
@@ -227,6 +257,7 @@ export function EditorClient({
       },
       duesOnly,
       allowResubmission,
+      responseRoleIds,
     } as any);
   }, [
     formTitle,
@@ -265,6 +296,7 @@ export function EditorClient({
         setFormBanner(formData.formData.banner || "");
         setDuesOnly(formData.duesOnly);
         setAllowResubmission(formData.allowResubmission);
+        setResponseRoleIds((formData as any).responseRoleIds || []);
 
         const loadedQuestions: UIQuestion[] = formData.formData.questions.map(
           (q: FormQuestion & { order?: number }) => ({
@@ -292,7 +324,7 @@ export function EditorClient({
   // auto save trigger when toggle switches are changed
   useEffect(() => {
     if (!isLoading) handleSaveForm();
-  }, [duesOnly, allowResubmission, isLoading]); // removed handleSaveForm to prevent save-on-every-render
+  }, [duesOnly, allowResubmission, responseRoleIds, isLoading]); // removed handleSaveForm to prevent save-on-every-render
 
   // auto save when finishing editing an item (changing active card)
   useEffect(() => {
@@ -405,6 +437,44 @@ export function EditorClient({
     }),
   );
 
+  const reorderItems = React.useCallback(
+    (itemId: string, direction: "up" | "down") => {
+      const combined = [...questions, ...instructions].sort(
+        (a, b) => (a.order ?? 999) - (b.order ?? 999),
+      );
+      const currentIndex = combined.findIndex((item) => item.id === itemId);
+
+      if (currentIndex === -1) return;
+
+      const newIndex = direction === "up" ? currentIndex - 1 : currentIndex + 1;
+
+      if (newIndex < 0 || newIndex >= combined.length) return;
+
+      const reordered = arrayMove(combined, currentIndex, newIndex);
+
+      // Update order and split back into separate arrays
+      const updatedItems = reordered.map((item, idx) => ({
+        ...item,
+        order: idx,
+      }));
+      const newQuestions: UIQuestion[] = [];
+      const newInstructions: UIInstruction[] = [];
+
+      updatedItems.forEach((item) => {
+        if ("question" in item) {
+          newQuestions.push(item as UIQuestion);
+        } else {
+          newInstructions.push(item as UIInstruction);
+        }
+      });
+
+      setQuestions(newQuestions);
+      setInstructions(newInstructions);
+      setTimeout(() => handleSaveForm(), 100);
+    },
+    [questions, instructions, handleSaveForm],
+  );
+
   const handleDragEnd = (event: DragEndEvent) => {
     const { active, over } = event;
     if (over && active.id !== over.id) {
@@ -447,27 +517,36 @@ export function EditorClient({
 
   return (
     <div
-      className="min-h-screen bg-primary/5 p-8 pb-32"
+      className="min-h-screen bg-primary/5 px-3 py-8 pb-32 md:px-8"
       onClick={() => setActiveItemId(null)}
     >
       <div className="mx-auto max-w-3xl space-y-4">
-        <div className="flex flex-col items-center justify-between gap-4 rounded-xl border bg-card/50 p-4 shadow-sm backdrop-blur-sm md:flex-row">
-          <div className="flex items-center gap-4">
+        <div className="flex flex-col gap-3 rounded-xl border bg-card/50 p-3 shadow-sm backdrop-blur-sm md:flex-row md:items-center md:justify-between md:gap-4 md:p-4">
+          <div className="flex items-center gap-3 md:gap-4">
             <Button
-              variant="ghost"
+              variant="primary"
               size="icon"
               onClick={() => router.push("/admin/forms")}
               aria-label="Back to forms"
             >
               <ArrowLeft className="h-4 w-4" />
             </Button>
-            <div className="flex items-center gap-2 text-xs font-semibold uppercase tracking-widest text-muted-foreground">
-              <Save className="h-3 w-3" />
-              {saveStatus || "Synced with Database"}
+            <div className="flex items-center gap-2">
+              <Button
+                variant="primary"
+                size="icon"
+                onClick={handleSaveForm}
+                aria-label="Save form"
+              >
+                <Save className="h-3 w-3" />
+              </Button>
+              <span className="text-xs font-semibold uppercase tracking-widest text-muted-foreground">
+                {saveStatus || "Synced with Database"}
+              </span>
             </div>
           </div>
 
-          <div className="flex items-center gap-8">
+          <div className="flex flex-col gap-3 md:flex-row md:items-center md:gap-6 lg:gap-8">
             <div className="flex items-center gap-3">
               <Switch
                 id="dues-only"
@@ -494,11 +573,90 @@ export function EditorClient({
                 Allow Multiple Responses
               </Label>
             </div>
+            <Dialog
+              open={responseRolesDialogOpen}
+              onOpenChange={setResponseRolesDialogOpen}
+            >
+              <DialogTrigger asChild>
+                <Button variant="outline" size="sm" className="gap-2">
+                  <Users className="h-4 w-4" />
+                  Response Roles
+                  {responseRoleIds.length > 0 && (
+                    <span className="ml-1 rounded-full bg-primary px-2 py-0.5 text-xs text-primary-foreground">
+                      {responseRoleIds.length}
+                    </span>
+                  )}
+                </Button>
+              </DialogTrigger>
+              <DialogContent>
+                <DialogHeader>
+                  <DialogTitle>Configure Response Roles</DialogTitle>
+                  <DialogDescription>
+                    Select which roles can respond to this form. If no roles are
+                    selected, anyone can respond.
+                  </DialogDescription>
+                </DialogHeader>
+                <div className="max-h-[400px] overflow-y-auto py-4">
+                  <div className="space-y-3">
+                    {allRoles.map((role) => {
+                      const isSelected = responseRoleIds.includes(role.id);
+                      return (
+                        <div
+                          key={role.id}
+                          className="flex items-center gap-3 rounded-md border p-3 hover:bg-muted/50"
+                        >
+                          <Checkbox
+                            id={`role-${role.id}`}
+                            checked={isSelected}
+                            onCheckedChange={(checked) => {
+                              if (checked) {
+                                setResponseRoleIds([
+                                  ...responseRoleIds,
+                                  role.id,
+                                ]);
+                              } else {
+                                setResponseRoleIds(
+                                  responseRoleIds.filter(
+                                    (id) => id !== role.id,
+                                  ),
+                                );
+                              }
+                            }}
+                          />
+                          <Label
+                            htmlFor={`role-${role.id}`}
+                            className="flex-1 cursor-pointer text-sm font-normal"
+                          >
+                            {role.name}
+                          </Label>
+                        </div>
+                      );
+                    })}
+                    {allRoles.length === 0 && (
+                      <p className="text-sm text-muted-foreground">
+                        No roles available. Create roles first.
+                      </p>
+                    )}
+                  </div>
+                </div>
+                <DialogFooter>
+                  <Button
+                    variant="outline"
+                    onClick={() => setResponseRoleIds([])}
+                  >
+                    Clear All
+                  </Button>
+                  <Button onClick={() => setResponseRolesDialogOpen(false)}>
+                    Done
+                  </Button>
+                </DialogFooter>
+              </DialogContent>
+            </Dialog>
           </div>
         </div>
 
         <Card className="overflow-hidden border-t-[12px] border-t-primary bg-card shadow-lg transition-all">
-          <div className="flex flex-col gap-2 p-8">
+          <div className="flex flex-col gap-2 px-4 py-8 md:px-8">
             <Input
               className="h-auto border-none p-0 text-4xl font-extrabold focus-visible:ring-0"
               placeholder="Form Title"
@@ -542,8 +700,10 @@ export function EditorClient({
                 <div className="space-y-4">
                   {[...questions, ...instructions]
                     .sort((a, b) => (a.order ?? 999) - (b.order ?? 999))
-                    .map((item) => {
+                    .map((item, index, sortedArray) => {
                       const isInstruction = "title" in item;
+                      const canMoveUp = index > 0;
+                      const canMoveDown = index < sortedArray.length - 1;
                       return (
                         <div
                           key={item.id}
@@ -560,6 +720,10 @@ export function EditorClient({
                             onDuplicateInstruction={duplicateInstruction}
                             onClick={() => setActiveItemId(item.id)}
                             onForceSave={handleSaveForm}
+                            onMoveUp={() => reorderItems(item.id, "up")}
+                            onMoveDown={() => reorderItems(item.id, "down")}
+                            canMoveUp={canMoveUp}
+                            canMoveDown={canMoveDown}
                             error={
                               !isInstruction && duplicateIds.has(item.id)
                                 ? "Duplicate question title"
@@ -573,14 +737,14 @@ export function EditorClient({
               </SortableContext>
             </DndContext>
 
-            <div className="flex justify-center gap-4 pt-8">
+            <div className="flex flex-col justify-center gap-3 pt-8 md:flex-row md:gap-4">
               <Button
                 onClick={(e) => {
                   e.stopPropagation();
                   addQuestion();
                 }}
                 size="lg"
-                className="h-14 rounded-full px-10 text-lg font-bold shadow-2xl transition-all hover:scale-105 active:scale-95"
+                className="h-14 rounded-full px-6 text-lg font-bold shadow-2xl transition-all hover:scale-105 active:scale-95 md:px-10"
               >
                 <Plus className="mr-3 h-6 w-6" /> Add Question
               </Button>
@@ -591,7 +755,7 @@ export function EditorClient({
                 }}
                 size="lg"
                 variant="secondary"
-                className="h-14 rounded-full px-10 text-lg font-bold shadow-2xl transition-all hover:scale-105 active:scale-95"
+                className="h-14 rounded-full px-6 text-lg font-bold shadow-2xl transition-all hover:scale-105 active:scale-95 md:px-10"
               >
                 <Plus className="mr-3 h-6 w-6" /> Add Instruction
               </Button>
diff --git a/apps/blade/src/app/admin/forms/[slug]/responses/_components/AllResponsesView.tsx b/apps/blade/src/app/admin/forms/[slug]/responses/_components/AllResponsesView.tsx
index acb8734e..3573fd11 100644
--- a/apps/blade/src/app/admin/forms/[slug]/responses/_components/AllResponsesView.tsx
+++ b/apps/blade/src/app/admin/forms/[slug]/responses/_components/AllResponsesView.tsx
@@ -31,10 +31,11 @@ export function AllResponsesView({
       {/* max-w-4xl mx-auto centers the charts and limits width */}
       <div className="mx-auto max-w-4xl space-y-2 md:space-y-6">
         {formData.questions.map((question) => {
-          // render pie chart for MULTIPLE_CHOICE or DROPDOWN questions
+          // render pie chart for MULTIPLE_CHOICE, DROPDOWN, or BOOLEAN questions
           if (
             question.type === "MULTIPLE_CHOICE" ||
-            question.type === "DROPDOWN"
+            question.type === "DROPDOWN" ||
+            question.type === "BOOLEAN"
           ) {
             return (
               <ResponsePieChart
@@ -71,17 +72,16 @@ export function AllResponsesView({
         })}
       </div>
 
-      {/* text responses section - for SHORT_ANSWER, PARAGRAPH, EMAIL, PHONE, BOOLEAN, and LINK questions */}
+      {/* text responses section - for SHORT_ANSWER, PARAGRAPH, EMAIL, PHONE, and LINK questions */}
       {/* renders a separate table for each text-based question */}
       <div className="mx-auto mt-3 max-w-4xl space-y-2 md:mt-8 md:space-y-6">
         {formData.questions.map((question) => {
-          // render table for SHORT_ANSWER, PARAGRAPH, EMAIL, PHONE, BOOLEAN, or LINK questions
+          // render table for SHORT_ANSWER, PARAGRAPH, EMAIL, PHONE, or LINK questions
           if (
             question.type === "SHORT_ANSWER" ||
             question.type === "PARAGRAPH" ||
             question.type === "EMAIL" ||
             question.type === "PHONE" ||
-            question.type === "BOOLEAN" ||
             question.type === "LINK"
           ) {
             return (
diff --git a/apps/blade/src/app/admin/forms/[slug]/responses/_components/FileUploadResponsesTable.tsx b/apps/blade/src/app/admin/forms/[slug]/responses/_components/FileUploadResponsesTable.tsx
index 8158a785..cb10f7fd 100644
--- a/apps/blade/src/app/admin/forms/[slug]/responses/_components/FileUploadResponsesTable.tsx
+++ b/apps/blade/src/app/admin/forms/[slug]/responses/_components/FileUploadResponsesTable.tsx
@@ -46,7 +46,7 @@ export function FileUploadResponsesTable({
     return (
       <Card>
         <CardHeader>
-          <CardTitle>{question}</CardTitle>
+          <CardTitle className="whitespace-pre-line">{question}</CardTitle>
         </CardHeader>
         <CardContent>
           <p className="py-8 text-center text-muted-foreground">
@@ -60,7 +60,7 @@ export function FileUploadResponsesTable({
   return (
     <Card>
       <CardHeader>
-        <CardTitle>{question}</CardTitle>
+        <CardTitle className="whitespace-pre-line">{question}</CardTitle>
         <p className="mt-1 text-sm text-muted-foreground">
           {responses.length} {responses.length === 1 ? "response" : "responses"}
         </p>
diff --git a/apps/blade/src/app/admin/forms/[slug]/responses/_components/PerUserResponsesView.tsx b/apps/blade/src/app/admin/forms/[slug]/responses/_components/PerUserResponsesView.tsx
index aa7b12fa..44890b6e 100644
--- a/apps/blade/src/app/admin/forms/[slug]/responses/_components/PerUserResponsesView.tsx
+++ b/apps/blade/src/app/admin/forms/[slug]/responses/_components/PerUserResponsesView.tsx
@@ -214,7 +214,7 @@ export function PerUserResponsesView({
               return (
                 <div key={question.question}>
                   <div className="space-y-2">
-                    <h4 className="font-medium text-foreground">
+                    <h4 className="whitespace-pre-line font-medium text-foreground">
                       {question.question}
                       {!question.optional && (
                         <span className="ml-1 text-red-500">*</span>
@@ -234,7 +234,13 @@ export function PerUserResponsesView({
                         {formatResponseValue(answer)}
                       </Link>
                     ) : (
-                      <p className="break-words text-sm text-muted-foreground">
+                      <p
+                        className={`break-words text-sm text-muted-foreground ${
+                          question.type === "PARAGRAPH"
+                            ? "whitespace-pre-wrap"
+                            : ""
+                        }`}
+                      >
                         {formatResponseValue(answer)}
                       </p>
                     )}
diff --git a/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponseBarChart.tsx b/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponseBarChart.tsx
index 88f277b9..e5cf2da5 100644
--- a/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponseBarChart.tsx
+++ b/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponseBarChart.tsx
@@ -73,7 +73,9 @@ export function ResponseBarChart({
     <Card>
       <CardHeader className="pb-2 pt-3 md:pb-6 md:pt-6">
         {/* question text as card title */}
-        <CardTitle className="text-sm md:text-lg">{question}</CardTitle>
+        <CardTitle className="whitespace-pre-line text-sm md:text-lg">
+          {question}
+        </CardTitle>
         {/* show total number of responses */}
         <p className="mt-0.5 text-[10px] text-muted-foreground md:mt-1 md:text-sm">
           {responses.length} {responses.length === 1 ? "response" : "responses"}
diff --git a/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponseHorizontalBarChart.tsx b/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponseHorizontalBarChart.tsx
index 4d939a3f..10d7be57 100644
--- a/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponseHorizontalBarChart.tsx
+++ b/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponseHorizontalBarChart.tsx
@@ -88,7 +88,9 @@ export function ResponseHorizontalBarChart({
     <Card>
       <CardHeader className="pb-2 pt-3 md:pb-6 md:pt-6">
         {/* question text as card title */}
-        <CardTitle className="text-sm md:text-lg">{question}</CardTitle>
+        <CardTitle className="whitespace-pre-line text-sm md:text-lg">
+          {question}
+        </CardTitle>
         {/* show total number of responses */}
         <p className="mt-0.5 text-[10px] text-muted-foreground md:mt-1 md:text-sm">
           {responses.length} {responses.length === 1 ? "response" : "responses"}
diff --git a/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponsePieChart.tsx b/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponsePieChart.tsx
index aecb6184..bba25b2a 100644
--- a/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponsePieChart.tsx
+++ b/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponsePieChart.tsx
@@ -34,12 +34,22 @@ export function ResponsePieChart({
     if (answer !== undefined && answer !== null) {
       // increment count for this answer
       let answerStr: string;
-      if (typeof answer === "string") {
-        answerStr = answer;
+      if (typeof answer === "boolean") {
+        // convert boolean to "Yes" or "No" for display
+        answerStr = answer ? "Yes" : "No";
+      } else if (typeof answer === "string") {
+        // convert "true"/"false" strings to "Yes"/"No" for boolean questions
+        if (answer === "true") {
+          answerStr = "Yes";
+        } else if (answer === "false") {
+          answerStr = "No";
+        } else {
+          answerStr = answer;
+        }
       } else if (typeof answer === "object") {
         answerStr = JSON.stringify(answer);
       } else {
-        // for primitive types (number, boolean, etc.) - safe to stringify
+        // for primitive types (number, etc.) - safe to stringify
         // eslint-disable-next-line @typescript-eslint/no-base-to-string
         answerStr = String(answer);
       }
@@ -77,7 +87,9 @@ export function ResponsePieChart({
     <Card>
       <CardHeader className="pb-2 pt-3 md:pb-6 md:pt-6">
         {/* question text as card title */}
-        <CardTitle className="text-sm md:text-lg">{question}</CardTitle>
+        <CardTitle className="whitespace-pre-line text-sm md:text-lg">
+          {question}
+        </CardTitle>
         {/* show total number of responses */}
         <p className="mt-0.5 text-[10px] text-muted-foreground md:mt-1 md:text-sm">
           {responses.length} {responses.length === 1 ? "response" : "responses"}
diff --git a/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponsesTable.tsx b/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponsesTable.tsx
index 49d7342e..9f90636c 100644
--- a/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponsesTable.tsx
+++ b/apps/blade/src/app/admin/forms/[slug]/responses/_components/ResponsesTable.tsx
@@ -35,7 +35,7 @@ export function ResponsesTable({ question, responses }: ResponsesTableProps) {
     return (
       <Card>
         <CardHeader>
-          <CardTitle>{question}</CardTitle>
+          <CardTitle className="whitespace-pre-line">{question}</CardTitle>
         </CardHeader>
         <CardContent>
           <p className="py-8 text-center text-muted-foreground">
@@ -49,7 +49,7 @@ export function ResponsesTable({ question, responses }: ResponsesTableProps) {
   return (
     <Card>
       <CardHeader>
-        <CardTitle>{question}</CardTitle>
+        <CardTitle className="whitespace-pre-line">{question}</CardTitle>
         {/* show total response count */}
         <p className="mt-1 text-sm text-muted-foreground">
           {responses.length} {responses.length === 1 ? "response" : "responses"}
@@ -94,8 +94,10 @@ export function ResponsesTable({ question, responses }: ResponsesTableProps) {
                       </a>
                     );
                   } catch {
-                    // Not a valid URL, just display as string
-                    displayValue = answer;
+                    // Not a valid URL, just display as string (preserve newlines)
+                    displayValue = (
+                      <span className="whitespace-pre-wrap">{answer}</span>
+                    );
                   }
                 } else if (typeof answer === "object") {
                   displayValue = JSON.stringify(answer);
diff --git a/apps/blade/src/app/forms/[formName]/_components/question-response-card.tsx b/apps/blade/src/app/forms/[formName]/_components/question-response-card.tsx
index fbe9fc9a..631dc891 100644
--- a/apps/blade/src/app/forms/[formName]/_components/question-response-card.tsx
+++ b/apps/blade/src/app/forms/[formName]/_components/question-response-card.tsx
@@ -7,6 +7,7 @@ import Image from "next/image";
 import { FileUp, Loader2, X } from "lucide-react";
 
 import type { QuestionValidator } from "@forge/consts/knight-hacks";
+import { getDropdownOptionsFromConst } from "@forge/consts/knight-hacks";
 import { Button } from "@forge/ui/button";
 import { Card } from "@forge/ui/card";
 import { Checkbox } from "@forge/ui/checkbox";
@@ -14,6 +15,7 @@ import { DatePicker } from "@forge/ui/date-picker";
 import { Input } from "@forge/ui/input";
 import { Label } from "@forge/ui/label";
 import { RadioGroup, RadioGroupItem } from "@forge/ui/radio-group";
+import { ResponsiveComboBox } from "@forge/ui/responsive-combo-box";
 import {
   Select,
   SelectContent,
@@ -22,6 +24,7 @@ import {
   SelectValue,
 } from "@forge/ui/select";
 import { Slider } from "@forge/ui/slider";
+import { Textarea } from "@forge/ui/textarea";
 import { TimePicker } from "@forge/ui/time-picker";
 import { toast } from "@forge/ui/toast";
 
@@ -55,7 +58,7 @@ export function QuestionResponseCard({
       {/* Header */}
       <div className="flex flex-col gap-4">
         <div className="flex items-start gap-2">
-          <h3 className="text-base font-medium">
+          <h3 className="whitespace-pre-line text-base font-medium">
             {question.question}
             {isRequired && <span className="ml-1 text-red-500">*</span>}
           </h3>
@@ -106,19 +109,61 @@ function QuestionBody({
   formId?: string;
 }) {
   switch (question.type) {
-    case "SHORT_ANSWER":
-    case "PARAGRAPH":
+    case "SHORT_ANSWER": {
+      const currentValue = (value as string) || "";
+      const maxLength = 150;
+      const charCount = currentValue.length;
+      const isOverLimit = charCount > maxLength;
+
       return (
-        <div className="w-full md:w-2/3">
+        <div className="w-full">
           <Input
             placeholder="Your answer"
-            value={(value as string) || ""}
+            value={currentValue}
             onChange={(e) => onChange(e.target.value)}
             disabled={disabled}
             className="rounded-none border-x-0 border-b border-t-0 border-gray-300 bg-transparent px-0 shadow-none outline-none focus-visible:border-b-2 focus-visible:border-primary focus-visible:ring-0"
           />
+          <div className="mt-1 flex justify-end">
+            <span
+              className={`text-xs ${
+                isOverLimit ? "text-destructive" : "text-muted-foreground"
+              }`}
+            >
+              {charCount}/{maxLength}
+            </span>
+          </div>
+        </div>
+      );
+    }
+    case "PARAGRAPH": {
+      const currentValue = (value as string) || "";
+      const maxLength = 750;
+      const charCount = currentValue.length;
+      const isOverLimit = charCount > maxLength;
+
+      return (
+        <div className="w-full">
+          <Textarea
+            placeholder="Your answer"
+            value={currentValue}
+            onChange={(e) => onChange(e.target.value)}
+            disabled={disabled}
+            rows={3}
+            className="resize-none overflow-y-auto whitespace-pre-wrap rounded-none border-x-0 border-b border-t-0 border-gray-300 bg-transparent px-0 shadow-none outline-none focus-visible:border-b-2 focus-visible:border-primary focus-visible:ring-0"
+          />
+          <div className="mt-1 flex justify-end">
+            <span
+              className={`text-xs ${
+                isOverLimit ? "text-destructive" : "text-muted-foreground"
+              }`}
+            >
+              {charCount}/{maxLength}
+            </span>
+          </div>
         </div>
       );
+    }
 
     case "MULTIPLE_CHOICE":
       return (
@@ -186,7 +231,7 @@ function QuestionBody({
 
     case "EMAIL":
       return (
-        <div className="w-full md:w-2/3">
+        <div className="w-full">
           <Input
             type="email"
             placeholder="your.email@example.com"
@@ -201,7 +246,7 @@ function QuestionBody({
 
     case "NUMBER":
       return (
-        <div className="w-full md:w-1/3">
+        <div className="w-full">
           <Input
             type="number"
             placeholder="Enter a number"
@@ -227,7 +272,7 @@ function QuestionBody({
 
     case "PHONE":
       return (
-        <div className="w-full md:w-2/3">
+        <div className="w-full">
           <Input
             type="tel"
             placeholder="(123) 456-7890"
@@ -277,7 +322,7 @@ function QuestionBody({
 
     case "LINK":
       return (
-        <div className="w-full md:w-2/3">
+        <div className="w-full">
           <Input
             type="url"
             placeholder="https://example.com"
@@ -306,28 +351,104 @@ function MultipleChoiceInput({
   onChange: (value: string | string[] | number | Date | null) => void;
   disabled: boolean;
 }) {
-  const options = question.options || [];
+  // If optionsConst is set, load options from constants instead of question.options
+  const options = question.optionsConst
+    ? getDropdownOptionsFromConst(question.optionsConst)
+    : question.options || [];
   const questionKey = question.question.replace(/\s+/g, "-").toLowerCase();
+  const [otherText, setOtherText] = useState<string>("");
+  const OTHER_VALUE = "__OTHER__";
+  const allowOther = Boolean(question.allowOther);
+
+  const isOtherSelected =
+    value &&
+    typeof value === "string" &&
+    !options.includes(value) &&
+    value !== OTHER_VALUE;
+
+  React.useEffect(() => {
+    if (isOtherSelected && typeof value === "string") {
+      setOtherText(value);
+    }
+  }, [value, isOtherSelected]);
+
+  const capitalizeWords = (text: string): string => {
+    return text
+      .split(" ")
+      .map((word) => {
+        if (word.length === 0) return word;
+        return word[0]?.toUpperCase() + word.slice(1).toLowerCase();
+      })
+      .join(" ");
+  };
+
+  const handleOtherTextChange = (text: string) => {
+    const capitalized = capitalizeWords(text);
+    setOtherText(capitalized);
+    onChange(capitalized || null);
+  };
+
+  const handleRadioChange = (newValue: string) => {
+    if (newValue === OTHER_VALUE) {
+      // When "Other" is selected, don't clear the text, just mark as other
+      onChange(otherText || OTHER_VALUE);
+    } else {
+      onChange(newValue || null);
+    }
+  };
 
   return (
-    <RadioGroup
-      value={value || ""}
-      onValueChange={(newValue) => onChange(newValue || null)}
-      className="flex flex-col gap-3"
-      disabled={disabled}
-    >
-      {options.map((option, idx) => (
-        <div key={idx} className="flex items-center gap-3">
-          <RadioGroupItem value={option} id={`${questionKey}-${idx}`} />
-          <Label
-            htmlFor={`${questionKey}-${idx}`}
-            className="cursor-pointer font-normal"
-          >
-            {option}
-          </Label>
-        </div>
-      ))}
-    </RadioGroup>
+    <div className="flex flex-col gap-3">
+      <RadioGroup
+        value={
+          isOtherSelected ? OTHER_VALUE : typeof value === "string" ? value : ""
+        }
+        onValueChange={handleRadioChange}
+        className="flex flex-col gap-3"
+        disabled={disabled}
+      >
+        {options.map((option, idx) => (
+          <div key={idx} className="flex items-center gap-3">
+            <RadioGroupItem value={option} id={`${questionKey}-${idx}`} />
+            <Label
+              htmlFor={`${questionKey}-${idx}`}
+              className="cursor-pointer font-normal"
+            >
+              {option}
+            </Label>
+          </div>
+        ))}
+        {allowOther && (
+          <div className="flex items-center gap-3">
+            <RadioGroupItem value={OTHER_VALUE} id={`${questionKey}-other`} />
+            <Label
+              htmlFor={`${questionKey}-other`}
+              className="cursor-pointer font-normal"
+            >
+              Other:
+            </Label>
+          </div>
+        )}
+      </RadioGroup>
+      {allowOther &&
+        (isOtherSelected ||
+          (typeof value === "string" && value === OTHER_VALUE)) && (
+          <div className="ml-7 w-full">
+            <Input
+              placeholder="Please specify"
+              value={otherText}
+              onChange={(e) => handleOtherTextChange(e.target.value)}
+              onBlur={(e) => {
+                const capitalized = capitalizeWords(e.target.value);
+                setOtherText(capitalized);
+                onChange(capitalized || null);
+              }}
+              disabled={disabled}
+              className="rounded-none border-x-0 border-b border-t-0 border-gray-300 bg-transparent px-0 shadow-none outline-none focus-visible:border-b-2 focus-visible:border-primary focus-visible:ring-0"
+            />
+          </div>
+        )}
+    </div>
   );
 }
 
@@ -342,9 +463,38 @@ function CheckboxesInput({
   onChange: (value: string | string[] | number | Date | null) => void;
   disabled?: boolean;
 }) {
-  const options = question.options || [];
+  // If optionsConst is set, load options from constants instead of question.options
+  const options = question.optionsConst
+    ? getDropdownOptionsFromConst(question.optionsConst)
+    : question.options || [];
   const selectedValues = value || [];
   const questionKey = question.question.replace(/\s+/g, "-").toLowerCase();
+  const [otherText, setOtherText] = useState<string>("");
+  const OTHER_VALUE = "__OTHER__";
+  const allowOther = Boolean(question.allowOther);
+
+  // Get all "Other" values (values not in predefined options)
+  const otherValues = selectedValues.filter(
+    (v) => !options.includes(v) && v !== OTHER_VALUE,
+  );
+
+  // If there's an other value, use it as the otherText
+  React.useEffect(() => {
+    if (otherValues.length > 0) {
+      setOtherText(otherValues[0] ?? "");
+    }
+  }, [otherValues]);
+
+  // Helper function to capitalize first letter of each word
+  const capitalizeWords = (text: string): string => {
+    return text
+      .split(" ")
+      .map((word) => {
+        if (word.length === 0) return word;
+        return word[0]?.toUpperCase() + word.slice(1).toLowerCase();
+      })
+      .join(" ");
+  };
 
   const handleCheckboxChange = (option: string, checked: boolean) => {
     if (checked) {
@@ -354,6 +504,49 @@ function CheckboxesInput({
     }
   };
 
+  const isOtherChecked =
+    selectedValues.includes(OTHER_VALUE) || otherValues.length > 0;
+
+  const handleOtherCheckboxChange = (checked: boolean) => {
+    if (checked) {
+      // Add OTHER_VALUE marker and current otherText if it exists
+      const newValues = [...selectedValues.filter((v) => v !== OTHER_VALUE)];
+      if (otherText) {
+        newValues.push(otherText);
+      } else {
+        newValues.push(OTHER_VALUE);
+      }
+      onChange(newValues);
+    } else {
+      // Remove OTHER_VALUE and all other values
+      onChange(
+        selectedValues.filter(
+          (v) => v !== OTHER_VALUE && !otherValues.includes(v),
+        ),
+      );
+      setOtherText("");
+    }
+  };
+
+  const handleOtherTextChange = (text: string) => {
+    const capitalized = capitalizeWords(text);
+    setOtherText(capitalized);
+
+    // Update the selected values: remove old other values and add new one
+    const valuesWithoutOther = selectedValues.filter(
+      (v) => !otherValues.includes(v) && v !== OTHER_VALUE,
+    );
+    if (capitalized) {
+      onChange([...valuesWithoutOther, capitalized]);
+    } else {
+      onChange(
+        isOtherChecked
+          ? [...valuesWithoutOther, OTHER_VALUE]
+          : valuesWithoutOther,
+      );
+    }
+  };
+
   return (
     <div className="flex flex-col gap-3">
       {options.map((option, idx) => (
@@ -374,6 +567,40 @@ function CheckboxesInput({
           </Label>
         </div>
       ))}
+      {allowOther && (
+        <div className="flex items-center gap-3">
+          <Checkbox
+            id={`${questionKey}-other`}
+            checked={isOtherChecked}
+            onCheckedChange={(checked) =>
+              handleOtherCheckboxChange(checked === true)
+            }
+            disabled={disabled}
+          />
+          <Label
+            htmlFor={`${questionKey}-other`}
+            className="cursor-pointer font-normal"
+          >
+            Other:
+          </Label>
+        </div>
+      )}
+      {allowOther && isOtherChecked && (
+        <div className="ml-7 w-full">
+          <Input
+            placeholder="Please specify"
+            value={otherText}
+            onChange={(e) => handleOtherTextChange(e.target.value)}
+            onBlur={(e) => {
+              const capitalized = capitalizeWords(e.target.value);
+              setOtherText(capitalized);
+              handleOtherTextChange(capitalized);
+            }}
+            disabled={disabled}
+            className="rounded-none border-x-0 border-b border-t-0 border-gray-300 bg-transparent px-0 shadow-none outline-none focus-visible:border-b-2 focus-visible:border-primary focus-visible:ring-0"
+          />
+        </div>
+      )}
     </div>
   );
 }
@@ -389,7 +616,28 @@ function DropdownInput({
   onChange: (value: string | string[] | number | Date | null) => void;
   disabled: boolean;
 }) {
-  const options = question.options || [];
+  // If optionsConst is set, load options from constants instead of question.options
+  const options = question.optionsConst
+    ? getDropdownOptionsFromConst(question.optionsConst)
+    : question.options || [];
+
+  // Use ResponsiveComboBox for dropdowns with more than 15 options
+  if (options.length > 15) {
+    return (
+      <div className="w-full md:w-1/2">
+        <ResponsiveComboBox
+          items={options}
+          renderItem={(option) => <div>{option}</div>}
+          getItemValue={(option) => option}
+          getItemLabel={(option) => option}
+          onItemSelect={(option) => onChange(option || null)}
+          buttonPlaceholder="Select an option"
+          inputPlaceholder="Search options..."
+          isDisabled={disabled}
+        />
+      </div>
+    );
+  }
 
   return (
     <Select
@@ -482,9 +730,6 @@ function BooleanInput({
         }}
         disabled={disabled}
       />
-      <Label className="cursor-pointer font-normal">
-        {value ? "Yes" : "No"}
-      </Label>
     </div>
   );
 }
diff --git a/apps/blade/src/app/forms/[formName]/page.tsx b/apps/blade/src/app/forms/[formName]/page.tsx
index 8c227d50..7c34f2f3 100644
--- a/apps/blade/src/app/forms/[formName]/page.tsx
+++ b/apps/blade/src/app/forms/[formName]/page.tsx
@@ -1,9 +1,11 @@
 import { redirect } from "next/navigation";
+import { XCircle } from "lucide-react";
 import { stringify } from "superjson";
 
 import { appRouter } from "@forge/api";
 import { log } from "@forge/api/utils";
 import { auth } from "@forge/auth";
+import { Card } from "@forge/ui/card";
 
 import { SIGN_IN_PATH } from "~/consts";
 import { extractProcedures } from "~/lib/utils";
@@ -21,7 +23,14 @@ export default async function FormResponderPage({
   }
 
   if (!params.formName) {
-    return <div>Form not found</div>;
+    return (
+      <div className="flex min-h-screen items-center justify-center bg-primary/5 p-6">
+        <Card className="max-w-md p-8 text-center">
+          <XCircle className="mx-auto mb-4 h-16 w-16 text-destructive" />
+          <h1 className="mb-2 text-2xl font-bold">Form not found</h1>
+        </Card>
+      </div>
+    );
   }
 
   // handle url encode form names to allow spacing and special characters
@@ -39,6 +48,24 @@ export default async function FormResponderPage({
   }
 
   const form = await api.forms.getForm({ slug_name: formName });
+
+  const { canRespond } = await api.forms.checkResponseAccess({
+    formId: form.id,
+  });
+
+  if (!canRespond) {
+    return (
+      <div className="flex min-h-screen items-center justify-center bg-primary/5 p-6">
+        <Card className="max-w-md p-8 text-center">
+          <XCircle className="mx-auto mb-4 h-16 w-16 text-destructive" />
+          <h1 className="mb-2 text-2xl font-bold">
+            You do not have permission to respond to this form
+          </h1>
+        </Card>
+      </div>
+    );
+  }
+
   const connections = await api.forms.getConnections({ id: form.id });
   const procs = extractProcedures(appRouter);
 
diff --git a/apps/blade/src/components/admin/forms/instruction-edit-card.tsx b/apps/blade/src/components/admin/forms/instruction-edit-card.tsx
index edbada17..aa8978fa 100644
--- a/apps/blade/src/components/admin/forms/instruction-edit-card.tsx
+++ b/apps/blade/src/components/admin/forms/instruction-edit-card.tsx
@@ -5,6 +5,8 @@ import type { z } from "zod";
 import { useRef, useState } from "react";
 import Image from "next/image";
 import {
+  ArrowDown,
+  ArrowUp,
   Copy,
   GripHorizontal,
   Image as ImageIcon,
@@ -20,6 +22,7 @@ import { Button } from "@forge/ui/button";
 import { Card } from "@forge/ui/card";
 import { Textarea } from "@forge/ui/textarea";
 import { toast } from "@forge/ui/toast";
+import { useMediaQuery } from "@forge/ui/use-media-query";
 
 import { api } from "~/trpc/react";
 
@@ -31,6 +34,10 @@ interface InstructionEditCardProps {
   onUpdate: (updatedInstruction: FormInstruction & { id: string }) => void;
   onDelete: (id: string) => void;
   onDuplicate: (instruction: FormInstruction & { id: string }) => void;
+  onMoveUp?: () => void;
+  onMoveDown?: () => void;
+  canMoveUp?: boolean;
+  canMoveDown?: boolean;
   dragHandleProps?: DraggableSyntheticListeners;
 }
 
@@ -41,7 +48,12 @@ export function InstructionEditCard({
   onDelete,
   onDuplicate,
   dragHandleProps,
+  onMoveUp,
+  onMoveDown,
+  canMoveUp = false,
+  canMoveDown = false,
 }: InstructionEditCardProps) {
+  const isMobile = !useMediaQuery("(min-width: 768px)");
   const [isUploadingImage, setIsUploadingImage] = useState(false);
   const [isUploadingVideo, setIsUploadingVideo] = useState(false);
   const imageInputRef = useRef<HTMLInputElement>(null);
@@ -154,7 +166,7 @@ export function InstructionEditCard({
   return (
     <Card
       className={cn(
-        "relative flex flex-col gap-4 bg-card p-6 text-card-foreground transition-all",
+        "relative flex flex-col gap-4 bg-card px-4 py-6 text-card-foreground transition-all md:p-6",
         "mt-12 border-t-4 border-t-primary shadow-lg",
       )}
     >
@@ -296,12 +308,41 @@ export function InstructionEditCard({
 
       {/* Footer */}
       <div className="mt-4 flex items-center justify-between gap-2 border-t pt-4">
-        <div
-          className="cursor-move text-gray-300 hover:text-gray-500"
-          {...dragHandleProps}
-        >
-          <GripHorizontal className="h-5 w-5 rotate-90" />
-        </div>
+        {isMobile ? (
+          <div className="flex items-center gap-1">
+            <button
+              type="button"
+              onClick={(e) => {
+                e.stopPropagation();
+                onMoveUp?.();
+              }}
+              disabled={!canMoveUp}
+              className="rounded p-1 text-gray-300 hover:text-gray-500 disabled:cursor-not-allowed disabled:opacity-30"
+              aria-label="Move up"
+            >
+              <ArrowUp className="h-5 w-5" />
+            </button>
+            <button
+              type="button"
+              onClick={(e) => {
+                e.stopPropagation();
+                onMoveDown?.();
+              }}
+              disabled={!canMoveDown}
+              className="rounded p-1 text-gray-300 hover:text-gray-500 disabled:cursor-not-allowed disabled:opacity-30"
+              aria-label="Move down"
+            >
+              <ArrowDown className="h-5 w-5" />
+            </button>
+          </div>
+        ) : (
+          <div
+            className="cursor-move text-gray-300 hover:text-gray-500"
+            {...dragHandleProps}
+          >
+            <GripHorizontal className="h-5 w-5 rotate-90" />
+          </div>
+        )}
         <div className="flex items-center justify-end gap-2">
           <Copy
             className="h-5 w-5 cursor-pointer text-gray-500 hover:text-gray-700"
diff --git a/apps/blade/src/components/admin/forms/question-edit-card.tsx b/apps/blade/src/components/admin/forms/question-edit-card.tsx
index b594554b..feb70bc2 100644
--- a/apps/blade/src/components/admin/forms/question-edit-card.tsx
+++ b/apps/blade/src/components/admin/forms/question-edit-card.tsx
@@ -5,6 +5,8 @@ import type { z } from "zod";
 import * as React from "react";
 import {
   AlignLeft,
+  ArrowDown,
+  ArrowUp,
   AtSign,
   Calendar,
   CheckSquare,
@@ -26,7 +28,11 @@ import {
 } from "lucide-react";
 
 import type { QuestionValidator } from "@forge/consts/knight-hacks";
-import { FORM_QUESTION_TYPES } from "@forge/consts/knight-hacks";
+import {
+  AVAILABLE_DROPDOWN_CONSTANTS,
+  FORM_QUESTION_TYPES,
+  getDropdownOptionsFromConst,
+} from "@forge/consts/knight-hacks";
 import { cn } from "@forge/ui";
 import { Button } from "@forge/ui/button";
 import { Card } from "@forge/ui/card";
@@ -44,6 +50,7 @@ import {
 import { Slider } from "@forge/ui/slider";
 import { Textarea } from "@forge/ui/textarea";
 import { TimePicker } from "@forge/ui/time-picker";
+import { useMediaQuery } from "@forge/ui/use-media-query";
 
 type FormQuestion = z.infer<typeof QuestionValidator>;
 type QuestionType = FormQuestion["type"];
@@ -55,6 +62,10 @@ interface QuestionEditCardProps {
   onDelete: (id: string) => void;
   onDuplicate: (question: FormQuestion & { id: string }) => void;
   onForceSave?: () => void;
+  onMoveUp?: () => void;
+  onMoveDown?: () => void;
+  canMoveUp?: boolean;
+  canMoveDown?: boolean;
   error?: string;
   dragHandleProps?: DraggableSyntheticListeners;
 }
@@ -85,7 +96,12 @@ export function QuestionEditCard({
   onForceSave,
   error,
   dragHandleProps,
+  onMoveUp,
+  onMoveDown,
+  canMoveUp = false,
+  canMoveDown = false,
 }: QuestionEditCardProps) {
+  const isMobile = !useMediaQuery("(min-width: 768px)");
   // -- Handlers --
 
   const handleTitleChange = (e: React.ChangeEvent<HTMLTextAreaElement>) => {
@@ -140,7 +156,7 @@ export function QuestionEditCard({
   return (
     <Card
       className={cn(
-        "relative flex flex-col gap-4 border-l-4 bg-card p-6 text-card-foreground transition-all",
+        "relative flex flex-col gap-4 border-l-4 bg-card px-4 py-6 text-card-foreground transition-all md:p-6",
         isActive
           ? "border-l-primary shadow-md ring-1 ring-black/5"
           : "border-l-transparent hover:bg-muted/50",
@@ -206,12 +222,41 @@ export function QuestionEditCard({
 
       {/* Footer */}
       <div className="mt-4 flex items-center justify-between gap-2 border-t pt-4">
-        <div
-          className="cursor-move text-gray-300 hover:text-gray-500"
-          {...dragHandleProps}
-        >
-          <GripHorizontal className="h-5 w-5 rotate-90" />
-        </div>
+        {isMobile ? (
+          <div className="flex items-center gap-1">
+            <button
+              type="button"
+              onClick={(e) => {
+                e.stopPropagation();
+                onMoveUp?.();
+              }}
+              disabled={!canMoveUp}
+              className="rounded p-1 text-gray-300 hover:text-gray-500 disabled:cursor-not-allowed disabled:opacity-30"
+              aria-label="Move up"
+            >
+              <ArrowUp className="h-5 w-5" />
+            </button>
+            <button
+              type="button"
+              onClick={(e) => {
+                e.stopPropagation();
+                onMoveDown?.();
+              }}
+              disabled={!canMoveDown}
+              className="rounded p-1 text-gray-300 hover:text-gray-500 disabled:cursor-not-allowed disabled:opacity-30"
+              aria-label="Move down"
+            >
+              <ArrowDown className="h-5 w-5" />
+            </button>
+          </div>
+        ) : (
+          <div
+            className="cursor-move text-gray-300 hover:text-gray-500"
+            {...dragHandleProps}
+          >
+            <GripHorizontal className="h-5 w-5 rotate-90" />
+          </div>
+        )}
         <div className="flex items-center justify-end gap-2">
           <div className="mr-4 flex items-center gap-2 border-r pr-4">
             <Copy
@@ -255,7 +300,7 @@ function QuestionBody({
   switch (question.type) {
     case "SHORT_ANSWER":
       return (
-        <div className="w-1/2">
+        <div className="w-full">
           <Input
             placeholder="Short answer text"
             className="rounded-none border-x-0 border-b border-t-0 border-gray-300 bg-transparent px-0 shadow-none outline-none focus-visible:border-b-2 focus-visible:border-primary focus-visible:ring-0"
@@ -291,7 +336,7 @@ function QuestionBody({
       );
     case "EMAIL":
       return (
-        <div className="w-1/2">
+        <div className="w-full">
           <Input
             type="email"
             placeholder="email@example.com"
@@ -302,7 +347,7 @@ function QuestionBody({
       );
     case "NUMBER":
       return (
-        <div className="w-1/3">
+        <div className="w-full">
           <Input
             type="number"
             placeholder="Enter a number"
@@ -315,7 +360,7 @@ function QuestionBody({
       );
     case "PHONE":
       return (
-        <div className="w-1/2">
+        <div className="w-full">
           <Input
             type="tel"
             placeholder="(123) 456-7890"
@@ -344,7 +389,7 @@ function QuestionBody({
       );
     case "LINK":
       return (
-        <div className="w-1/2">
+        <div className="w-full">
           <Input
             type="url"
             placeholder="https://example.com"
@@ -423,65 +468,161 @@ function OptionList({
         ? CheckSquare
         : Circle;
 
+  const handleAllowOtherChange = (checked: boolean) => {
+    onUpdate({ ...question, allowOther: checked });
+  };
+
+  const allowOther = question.allowOther ?? false;
+  const optionsConst = question.optionsConst;
+  const isUsingConst = Boolean(optionsConst);
+
+  const handleConstChange = (constName: string | null) => {
+    if (constName) {
+      onUpdate({ ...question, optionsConst: constName, options: [] });
+    } else {
+      onUpdate({ ...question, optionsConst: undefined });
+    }
+  };
+
+  const showConstSelector =
+    question.type === "DROPDOWN" ||
+    question.type === "MULTIPLE_CHOICE" ||
+    question.type === "CHECKBOXES";
+
+  const isRestrictedType =
+    question.type === "MULTIPLE_CHOICE" || question.type === "CHECKBOXES";
+
+  const availableConstants = Object.entries(AVAILABLE_DROPDOWN_CONSTANTS).map(
+    ([key, label]) => {
+      const constOptions = getDropdownOptionsFromConst(key);
+      const isDisabled = isRestrictedType && constOptions.length >= 15;
+      return { key, label, isDisabled, length: constOptions.length };
+    },
+  );
+
   return (
     <div className="flex flex-col gap-2">
-      {options.map((optionValue, idx) => (
-        <div key={idx} className="group flex items-center gap-2">
+      {showConstSelector && (
+        <div className="mb-3 flex flex-col gap-2 border-b pb-3">
+          <Label className="text-sm font-medium">Use Preset Options</Label>
+          <Select
+            value={optionsConst || "__MANUAL__"}
+            onValueChange={(value) =>
+              handleConstChange(value === "__MANUAL__" ? null : value)
+            }
+          >
+            <SelectTrigger className="w-full">
+              <SelectValue placeholder="Select a constant (optional)" />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem value="__MANUAL__">Manual options</SelectItem>
+              {availableConstants.map(({ key, label, isDisabled }) => (
+                <SelectItem
+                  key={key}
+                  value={key}
+                  disabled={isDisabled}
+                  className={isDisabled ? "cursor-not-allowed opacity-50" : ""}
+                >
+                  {label}
+                  {isDisabled &&
+                    " (too long for this question type, max 15 options) Use Dropdown instead"}
+                </SelectItem>
+              ))}
+            </SelectContent>
+          </Select>
+          {isUsingConst && (
+            <p className="text-xs text-muted-foreground">
+              Using constant:{" "}
+              {
+                AVAILABLE_DROPDOWN_CONSTANTS[
+                  optionsConst as keyof typeof AVAILABLE_DROPDOWN_CONSTANTS
+                ]
+              }
+            </p>
+          )}
+        </div>
+      )}
+
+      {!isUsingConst &&
+        options.map((optionValue, idx) => (
+          <div key={idx} className="group flex items-center gap-2">
+            {question.type === "DROPDOWN" ? (
+              <span className="w-6 text-center text-sm">{idx + 1}.</span>
+            ) : (
+              <Icon className="h-5 w-5 text-gray-300" />
+            )}
+
+            <Input
+              value={optionValue}
+              onChange={(e) => handleOptionChange(idx, e.target.value)}
+              onPaste={(e) => handlePaste(e, idx)}
+              className="flex-1 rounded-none border-none px-0 hover:border-b hover:border-gray-200 focus:border-b-2 focus:border-blue-500 focus:ring-0"
+              placeholder={`Option ${idx + 1}`}
+              onKeyDown={(e) => {
+                if (e.key === "Enter") {
+                  e.preventDefault();
+                  addOption();
+                }
+                if (e.key === "Backspace" && optionValue === "") {
+                  e.preventDefault();
+                  removeOption(idx);
+                }
+              }}
+              autoFocus={idx === options.length - 1 && options.length > 1}
+            />
+
+            <Button
+              variant="ghost"
+              size="icon"
+              className="opacity-0 transition-opacity group-hover:opacity-100"
+              onClick={() => removeOption(idx)}
+              tabIndex={-1}
+            >
+              <X className="h-5 w-5 text-gray-500" />
+            </Button>
+          </div>
+        ))}
+
+      {/* Add Option Button - Only show when not using a constant */}
+      {!isUsingConst && (
+        <div className="mt-1 flex items-center gap-2">
           {question.type === "DROPDOWN" ? (
-            <span className="w-6 text-center text-sm">{idx + 1}.</span>
+            <span className="w-6 text-center text-sm">
+              {options.length + 1}.
+            </span>
           ) : (
-            <Icon className="h-5 w-5 text-gray-300" />
+            <Icon className="h-5 w-5 text-transparent" />
           )}
 
-          <Input
-            value={optionValue}
-            onChange={(e) => handleOptionChange(idx, e.target.value)}
-            onPaste={(e) => handlePaste(e, idx)}
-            className="flex-1 rounded-none border-none px-0 hover:border-b hover:border-gray-200 focus:border-b-2 focus:border-blue-500 focus:ring-0"
-            placeholder={`Option ${idx + 1}`}
-            onKeyDown={(e) => {
-              if (e.key === "Enter") {
-                e.preventDefault();
-                addOption();
-              }
-              if (e.key === "Backspace" && optionValue === "") {
-                e.preventDefault();
-                removeOption(idx);
-              }
-            }}
-            autoFocus={idx === options.length - 1 && options.length > 1}
-          />
-
-          <Button
-            variant="ghost"
-            size="icon"
-            className="opacity-0 transition-opacity group-hover:opacity-100"
-            onClick={() => removeOption(idx)}
-            tabIndex={-1}
-          >
-            <X className="h-5 w-5 text-gray-500" />
-          </Button>
+          <div className="flex items-center gap-1 text-sm text-gray-500">
+            <Button
+              variant="ghost"
+              className="h-auto px-0 py-1 text-gray-500 hover:bg-transparent hover:text-gray-800"
+              onClick={addOption}
+            >
+              Add option
+            </Button>
+          </div>
         </div>
-      ))}
-
-      {/* Add Option Button */}
-      <div className="mt-1 flex items-center gap-2">
-        {question.type === "DROPDOWN" ? (
-          <span className="w-6 text-center text-sm">{options.length + 1}.</span>
-        ) : (
-          <Icon className="h-5 w-5 text-transparent" />
-        )}
+      )}
 
-        <div className="flex items-center gap-1 text-sm text-gray-500">
-          <Button
-            variant="ghost"
-            className="h-auto px-0 py-1 text-gray-500 hover:bg-transparent hover:text-gray-800"
-            onClick={addOption}
+      {/* Allow Other Option Toggle - Only for MULTIPLE_CHOICE and CHECKBOXES */}
+      {(question.type === "MULTIPLE_CHOICE" ||
+        question.type === "CHECKBOXES") && (
+        <div className="mt-3 flex items-center gap-2 border-t pt-3">
+          <Checkbox
+            checked={allowOther}
+            onCheckedChange={handleAllowOtherChange}
+            id={`${question.id}-allowOther`}
+          />
+          <Label
+            htmlFor={`${question.id}-allowOther`}
+            className="cursor-pointer text-sm font-normal"
           >
-            Add option
-          </Button>
+            Allow "Other" option with custom text input
+          </Label>
         </div>
-      </div>
+      )}
     </div>
   );
 }
diff --git a/apps/blade/src/components/forms/section-manager-dialog.tsx b/apps/blade/src/components/forms/section-manager-dialog.tsx
index fd342411..14fba8c5 100644
--- a/apps/blade/src/components/forms/section-manager-dialog.tsx
+++ b/apps/blade/src/components/forms/section-manager-dialog.tsx
@@ -1,7 +1,15 @@
 "use client";
 
-import { useState } from "react";
-import { Pencil, Plus, Trash2, X } from "lucide-react";
+import { useEffect, useState } from "react";
+import {
+  ArrowDown,
+  ArrowUp,
+  Pencil,
+  Plus,
+  Trash2,
+  Users,
+  X,
+} from "lucide-react";
 import * as z from "zod";
 
 import { Button } from "@forge/ui/button";
@@ -38,6 +46,10 @@ const createSectionSchema = z.object({
   roleIds: z.array(z.string().uuid()).optional().default([]),
 });
 
+const editSectionRolesSchema = z.object({
+  roleIds: z.array(z.string().uuid()).optional().default([]),
+});
+
 export function SectionManagerDialog({
   trigger,
 }: {
@@ -45,8 +57,11 @@ export function SectionManagerDialog({
 }) {
   const [isOpen, setIsOpen] = useState(false);
   const [editingSection, setEditingSection] = useState<string | null>(null);
+  const [editingRolesFor, setEditingRolesFor] = useState<string | null>(null);
   const [isCreatingNew, setIsCreatingNew] = useState(false);
-  const utils = api.useUtils();
+  const [sectionRolesMap, setSectionRolesMap] = useState<
+    Map<string, { id: string; name: string }[]>
+  >(new Map());
 
   const { data: sections = [] } = api.forms.getSections.useQuery(undefined, {
     enabled: isOpen,
@@ -59,10 +74,39 @@ export function SectionManagerDialog({
     },
   );
 
-  const { data: roles = [] } = api.roles.getAllLinks.useQuery(undefined, {
-    enabled: isOpen && isCreatingNew,
+  const { data: allRoles = [] } = api.roles.getAllLinks.useQuery(undefined, {
+    enabled: isOpen,
   });
 
+  const utils = api.useUtils();
+
+  useEffect(() => {
+    if (!isOpen || sections.length === 0) return;
+
+    const fetchSectionRoles = async () => {
+      const newRolesMap = new Map<string, { id: string; name: string }[]>();
+
+      await Promise.all(
+        sections
+          .filter((s) => s !== "General")
+          .map(async (section) => {
+            try {
+              const roles = await utils.forms.getSectionRoles.fetch({
+                sectionName: section,
+              });
+              newRolesMap.set(section, roles);
+            } catch {
+              newRolesMap.set(section, []);
+            }
+          }),
+      );
+
+      setSectionRolesMap(newRolesMap);
+    };
+
+    void fetchSectionRoles();
+  }, [isOpen, sections, utils.forms.getSectionRoles]);
+
   const countMap = new Map<string, number>();
   if (Array.isArray(sectionCounts)) {
     for (const sc of sectionCounts) {
@@ -87,6 +131,13 @@ export function SectionManagerDialog({
     },
   });
 
+  const editRolesForm = useForm({
+    schema: editSectionRolesSchema,
+    defaultValues: {
+      roleIds: [],
+    },
+  });
+
   const renameSection = api.forms.renameSection.useMutation({
     onSuccess() {
       toast.success("Section renamed");
@@ -134,6 +185,48 @@ export function SectionManagerDialog({
     },
   });
 
+  const updateSectionRoles = api.forms.updateSectionRoles.useMutation({
+    onSuccess(_, variables) {
+      toast.success("Section roles updated");
+      setEditingRolesFor(null);
+      editRolesForm.reset();
+      void utils.forms.getSectionRoles
+        .fetch({ sectionName: variables.sectionName })
+        .then((roles) => {
+          setSectionRolesMap((prev) => {
+            const newMap = new Map(prev);
+            newMap.set(variables.sectionName, roles);
+            return newMap;
+          });
+        })
+        .catch(() => {
+          setSectionRolesMap((prev) => {
+            const newMap = new Map(prev);
+            newMap.set(variables.sectionName, []);
+            return newMap;
+          });
+        });
+    },
+    onError(error: unknown) {
+      const message =
+        error && typeof error === "object" && "message" in error
+          ? String(error.message)
+          : "Failed to update section roles";
+      toast.error(message);
+    },
+    async onSettled() {
+      await utils.forms.getSectionRoles.invalidate();
+      await utils.forms.getSections.invalidate();
+    },
+  });
+
+  const reorderSection = api.forms.reorderSection.useMutation({
+    async onSettled() {
+      await utils.forms.getSections.invalidate();
+      await utils.forms.getForms.invalidate();
+    },
+  });
+
   const handleRename = (oldName: string) => {
     const newName = renameForm.getValues().name;
     if (!newName || newName === oldName) {
@@ -175,7 +268,6 @@ export function SectionManagerDialog({
               <Form {...createSectionForm}>
                 <form
                   onSubmit={createSectionForm.handleSubmit((values) => {
-                    // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-unsafe-member-access
                     createSection.mutate({
                       name: values.name,
                       roleIds: values.roleIds,
@@ -213,7 +305,7 @@ export function SectionManagerDialog({
                           </FormDescription>
                         </div>
                         <div className="max-h-60 space-y-3 overflow-y-auto rounded-md border p-3">
-                          {roles.map((role) => (
+                          {allRoles.map((role) => (
                             <FormField
                               key={role.id}
                               control={createSectionForm.control}
@@ -249,7 +341,7 @@ export function SectionManagerDialog({
                               }}
                             />
                           ))}
-                          {roles.length === 0 && (
+                          {allRoles.length === 0 && (
                             <p className="text-sm text-muted-foreground">
                               No roles available. All users will have access.
                             </p>
@@ -279,84 +371,242 @@ export function SectionManagerDialog({
             </div>
           )}
 
-          {sections.map((section: string) => (
-            <div
-              key={section}
-              className="flex items-center justify-between rounded-md border p-3"
-            >
-              {editingSection === section ? (
-                <Form {...renameForm}>
-                  <form
-                    onSubmit={renameForm.handleSubmit(() =>
-                      handleRename(section),
-                    )}
-                    className="flex flex-1 items-center gap-2"
-                  >
-                    <FormField
-                      control={renameForm.control}
-                      name="name"
-                      render={({ field }) => (
-                        <FormItem className="flex-1">
-                          <FormControl>
-                            <Input
-                              {...field}
-                              placeholder="Section name"
-                              autoFocus
-                            />
-                          </FormControl>
-                        </FormItem>
+          {sections.map((section: string, index) => {
+            const sectionRoles = sectionRolesMap.get(section) ?? [];
+            const isEditingRoles = editingRolesFor === section;
+            const canMoveUp = index > 0;
+            const canMoveDown = index < sections.length - 1;
+
+            return (
+              <div key={section} className="space-y-2 rounded-md border p-3">
+                {editingSection === section ? (
+                  <Form {...renameForm}>
+                    <form
+                      onSubmit={renameForm.handleSubmit(() =>
+                        handleRename(section),
                       )}
-                    />
-                    <Button type="submit" size="sm">
-                      Save
-                    </Button>
-                    <Button
-                      type="button"
-                      size="sm"
-                      variant="ghost"
-                      onClick={() => {
-                        setEditingSection(null);
-                        renameForm.reset();
-                      }}
+                      className="flex flex-1 items-center gap-2"
                     >
-                      <X className="h-4 w-4" />
-                    </Button>
-                  </form>
-                </Form>
-              ) : (
-                <>
-                  <div className="flex flex-col gap-1">
-                    <span className="font-medium">{section}</span>
-                    <span className="text-sm text-muted-foreground">
-                      {countMap.get(section) ?? 0}{" "}
-                      {countMap.get(section) === 1 ? "form" : "forms"}
-                    </span>
-                  </div>
-                  <div className="flex gap-2">
-                    <Button
-                      variant="ghost"
-                      size="sm"
-                      onClick={() => {
-                        setEditingSection(section);
-                        renameForm.setValue("name", section);
-                      }}
-                    >
-                      <Pencil className="h-4 w-4" />
-                    </Button>
-                    {section !== "General" && (
+                      <FormField
+                        control={renameForm.control}
+                        name="name"
+                        render={({ field }) => (
+                          <FormItem className="flex-1">
+                            <FormControl>
+                              <Input
+                                {...field}
+                                placeholder="Section name"
+                                autoFocus
+                              />
+                            </FormControl>
+                          </FormItem>
+                        )}
+                      />
+                      <Button type="submit" size="sm">
+                        Save
+                      </Button>
                       <Button
-                        variant="ghost"
+                        type="button"
                         size="sm"
-                        onClick={() => handleDelete(section)}
+                        variant="ghost"
+                        onClick={() => {
+                          setEditingSection(null);
+                          renameForm.reset();
+                        }}
                       >
-                        <Trash2 className="h-4 w-4" />
+                        <X className="h-4 w-4" />
                       </Button>
-                    )}
+                    </form>
+                  </Form>
+                ) : isEditingRoles ? (
+                  <div className="space-y-3">
+                    <Form {...editRolesForm}>
+                      <form
+                        onSubmit={editRolesForm.handleSubmit((values) => {
+                          updateSectionRoles.mutate({
+                            sectionName: section,
+                            roleIds: values.roleIds,
+                          } as { sectionName: string; roleIds: string[] });
+                        })}
+                        className="space-y-3"
+                      >
+                        <FormField
+                          control={editRolesForm.control}
+                          name="roleIds"
+                          render={() => (
+                            <FormItem>
+                              <div className="mb-2">
+                                <FormLabel>
+                                  Restrict to Roles (Optional)
+                                </FormLabel>
+                                <FormDescription>
+                                  Select one or more roles that can access this
+                                  section. Leave empty to allow all users with
+                                  form access.
+                                </FormDescription>
+                              </div>
+                              <div className="max-h-60 space-y-3 overflow-y-auto rounded-md border p-3">
+                                {allRoles.map((role) => (
+                                  <FormField
+                                    key={role.id}
+                                    control={editRolesForm.control}
+                                    name="roleIds"
+                                    render={({ field }) => {
+                                      return (
+                                        <FormItem
+                                          key={role.id}
+                                          className="flex flex-row items-start space-x-3 space-y-0"
+                                        >
+                                          <FormControl>
+                                            <Checkbox
+                                              checked={field.value?.includes(
+                                                role.id,
+                                              )}
+                                              onCheckedChange={(checked) => {
+                                                return checked
+                                                  ? field.onChange([
+                                                      ...(field.value ?? []),
+                                                      role.id,
+                                                    ])
+                                                  : field.onChange(
+                                                      field.value?.filter(
+                                                        (value) =>
+                                                          value !== role.id,
+                                                      ) ?? [],
+                                                    );
+                                              }}
+                                            />
+                                          </FormControl>
+                                          <FormLabel className="cursor-pointer font-normal">
+                                            {role.name}
+                                          </FormLabel>
+                                        </FormItem>
+                                      );
+                                    }}
+                                  />
+                                ))}
+                              </div>
+                            </FormItem>
+                          )}
+                        />
+                        <div className="flex gap-2">
+                          <Button type="submit" size="sm">
+                            Save
+                          </Button>
+                          <Button
+                            type="button"
+                            size="sm"
+                            variant="ghost"
+                            onClick={() => {
+                              setEditingRolesFor(null);
+                              editRolesForm.reset();
+                            }}
+                          >
+                            <X className="h-4 w-4" />
+                          </Button>
+                        </div>
+                      </form>
+                    </Form>
                   </div>
-                </>
-              )}
-            </div>
-          ))}
+                ) : (
+                  <>
+                    <div className="flex items-center justify-between">
+                      <div className="flex flex-1 items-center gap-2">
+                        <div className="flex flex-col gap-1">
+                          <span className="font-medium">{section}</span>
+                          <span className="text-sm text-muted-foreground">
+                            {countMap.get(section) ?? 0}{" "}
+                            {countMap.get(section) === 1 ? "form" : "forms"}
+                          </span>
+                          {section !== "General" && sectionRoles.length > 0 && (
+                            <span className="text-xs text-muted-foreground">
+                              Roles:{" "}
+                              {sectionRoles.map((r) => r.name).join(", ")}
+                            </span>
+                          )}
+                          {section !== "General" &&
+                            sectionRoles.length === 0 && (
+                              <span className="text-xs text-muted-foreground">
+                                All users with form access
+                              </span>
+                            )}
+                        </div>
+                      </div>
+                      <div className="flex gap-2">
+                        {section !== "General" && (
+                          <>
+                            <button
+                              type="button"
+                              onClick={() =>
+                                reorderSection.mutate({
+                                  sectionName: section,
+                                  direction: "up",
+                                })
+                              }
+                              disabled={!canMoveUp}
+                              className="rounded p-1 text-gray-300 hover:text-gray-500 disabled:cursor-not-allowed disabled:opacity-30"
+                              aria-label="Move up"
+                            >
+                              <ArrowUp className="h-4 w-4" />
+                            </button>
+                            <button
+                              type="button"
+                              onClick={() =>
+                                reorderSection.mutate({
+                                  sectionName: section,
+                                  direction: "down",
+                                })
+                              }
+                              disabled={!canMoveDown}
+                              className="rounded p-1 text-gray-300 hover:text-gray-500 disabled:cursor-not-allowed disabled:opacity-30"
+                              aria-label="Move down"
+                            >
+                              <ArrowDown className="h-4 w-4" />
+                            </button>
+                          </>
+                        )}
+                        {section !== "General" && (
+                          <Button
+                            variant="ghost"
+                            size="sm"
+                            onClick={() => {
+                              setEditingRolesFor(section);
+                              const currentRoleIds = sectionRoles.map(
+                                (r) => r.id,
+                              );
+                              editRolesForm.setValue("roleIds", currentRoleIds);
+                            }}
+                            title="Edit roles"
+                          >
+                            <Users className="h-4 w-4" />
+                          </Button>
+                        )}
+                        <Button
+                          variant="ghost"
+                          size="sm"
+                          onClick={() => {
+                            setEditingSection(section);
+                            renameForm.setValue("name", section);
+                          }}
+                        >
+                          <Pencil className="h-4 w-4" />
+                        </Button>
+                        {section !== "General" && (
+                          <Button
+                            variant="ghost"
+                            size="sm"
+                            onClick={() => handleDelete(section)}
+                          >
+                            <Trash2 className="h-4 w-4" />
+                          </Button>
+                        )}
+                      </div>
+                    </div>
+                  </>
+                )}
+              </div>
+            );
+          })}
         </div>
 
         <DialogFooter className="flex items-center justify-between">
diff --git a/packages/api/src/routers/forms.ts b/packages/api/src/routers/forms.ts
index a2c41336..ccac6f8d 100644
--- a/packages/api/src/routers/forms.ts
+++ b/packages/api/src/routers/forms.ts
@@ -15,6 +15,7 @@ import { db } from "@forge/db/client";
 import { Permissions, Roles } from "@forge/db/schemas/auth";
 import {
   FormResponse,
+  FormResponseRoles,
   FormSchemaSchema,
   FormSectionRoles,
   FormSections,
@@ -102,7 +103,9 @@ export const formsRouter = {
         createdAt: true,
         formData: true,
         formValidatorJson: true,
-      }).extend({ formData: FormSchemaValidator }),
+      })
+        .extend({ formData: FormSchemaValidator })
+        .extend({ responseRoleIds: z.array(z.string().uuid()).optional() }),
     )
     .mutation(async ({ input, ctx }) => {
       controlPerms.or(["EDIT_FORMS"], ctx);
@@ -122,6 +125,15 @@ export const formsRouter = {
         where: (t, { eq }) => eq(t.id, input.id ?? ""),
       });
 
+      if (!existingForm) {
+        throw new TRPCError({
+          message: "Form not found",
+          code: "NOT_FOUND",
+        });
+      }
+
+      const formId = existingForm.id;
+
       await db
         .insert(FormsSchemas)
         .values({
@@ -129,7 +141,7 @@ export const formsRouter = {
           name: input.formData.name,
           slugName: slug_name,
           formValidatorJson: jsonSchema.schema,
-          sectionId: existingForm?.sectionId ?? null,
+          sectionId: existingForm.sectionId,
         })
         .onConflictDoUpdate({
           //If it already exists upsert it
@@ -139,9 +151,25 @@ export const formsRouter = {
             name: input.formData.name,
             slugName: slug_name,
             formValidatorJson: jsonSchema.schema,
-            sectionId: existingForm?.sectionId ?? null,
+            sectionId: existingForm.sectionId,
           },
         });
+
+      const { responseRoleIds } = input;
+      if (responseRoleIds !== undefined) {
+        await db
+          .delete(FormResponseRoles)
+          .where(eq(FormResponseRoles.formId, formId));
+
+        if (responseRoleIds.length > 0) {
+          await db.insert(FormResponseRoles).values(
+            responseRoleIds.map((roleId) => ({
+              formId,
+              roleId,
+            })),
+          );
+        }
+      }
     }),
 
   getForm: protectedProcedure
@@ -161,6 +189,11 @@ export const formsRouter = {
       const { formValidatorJson: _JSONValidator, ...retForm } = form;
       const formData = form.formData as FormType;
 
+      const responseRoles = await db
+        .select({ roleId: FormResponseRoles.roleId })
+        .from(FormResponseRoles)
+        .where(eq(FormResponseRoles.formId, form.id));
+
       // Regenerate presigned URLs for any media that has objectNames
       const instructionsWithFreshUrls = await regenerateMediaUrls(
         formData.instructions,
@@ -168,6 +201,7 @@ export const formsRouter = {
 
       return {
         ...retForm,
+        responseRoleIds: responseRoles.map((r) => r.roleId),
         formData: {
           ...formData,
           instructions: instructionsWithFreshUrls,
@@ -176,6 +210,35 @@ export const formsRouter = {
       };
     }),
 
+  checkResponseAccess: protectedProcedure
+    .input(z.object({ formId: z.string() }))
+    .query(async ({ input, ctx }) => {
+      const userId = ctx.session.user.id;
+
+      const responseRoles = await db
+        .select({ roleId: FormResponseRoles.roleId })
+        .from(FormResponseRoles)
+        .where(eq(FormResponseRoles.formId, input.formId));
+
+      if (responseRoles.length === 0) {
+        return { canRespond: true };
+      }
+
+      const userRoleIds = await db
+        .select({ roleId: Permissions.roleId })
+        .from(Permissions)
+        .where(sql`cast(${Permissions.userId} as text) = ${userId}`);
+
+      const userRoleIdSet = new Set(userRoleIds.map((r) => r.roleId));
+      const formRoleIdSet = new Set(responseRoles.map((r) => r.roleId));
+
+      const hasRequiredRole = Array.from(formRoleIdSet).some((roleId) =>
+        userRoleIdSet.has(roleId),
+      );
+
+      return { canRespond: hasRequiredRole };
+    }),
+
   deleteForm: permProcedure
     .input(z.object({ slug_name: z.string() }))
     .mutation(async ({ input, ctx }) => {
@@ -322,6 +385,32 @@ export const formsRouter = {
         });
       }
 
+      const responseRoles = await db
+        .select({ roleId: FormResponseRoles.roleId })
+        .from(FormResponseRoles)
+        .where(eq(FormResponseRoles.formId, input.form));
+
+      if (responseRoles.length > 0) {
+        const userRoleIds = await db
+          .select({ roleId: Permissions.roleId })
+          .from(Permissions)
+          .where(sql`cast(${Permissions.userId} as text) = ${userId}`);
+
+        const userRoleIdSet = new Set(userRoleIds.map((r) => r.roleId));
+        const formRoleIdSet = new Set(responseRoles.map((r) => r.roleId));
+
+        const hasRequiredRole = Array.from(formRoleIdSet).some((roleId) =>
+          userRoleIdSet.has(roleId),
+        );
+
+        if (!hasRequiredRole) {
+          throw new TRPCError({
+            message: "You don't have permission to respond to this form",
+            code: "FORBIDDEN",
+          });
+        }
+      }
+
       // check if user already submitted and form doesnt allow resubmission
       if (!form.allowResubmission) {
         const existing = await db.query.FormResponse.findFirst({
@@ -625,12 +714,19 @@ export const formsRouter = {
     }
 
     const allDbSections = await db
-      .select({ id: FormSections.id, name: FormSections.name })
-      .from(FormSections);
+      .select({
+        id: FormSections.id,
+        name: FormSections.name,
+        order: FormSections.order,
+      })
+      .from(FormSections)
+      .orderBy(FormSections.order);
 
     const sectionIdToName = new Map<string, string>();
+    const sectionIdToOrder = new Map<string, number>();
     for (const section of allDbSections) {
       sectionIdToName.set(section.id, section.name);
+      sectionIdToOrder.set(section.id, section.order);
     }
 
     const accessibleSectionIds = new Set<string>();
@@ -684,7 +780,26 @@ export const formsRouter = {
       }
     }
 
-    return Array.from(allSections).sort();
+    const sortedSections = Array.from(allSections).sort((a, b) => {
+      if (a === "General") return -1;
+      if (b === "General") return 1;
+
+      let aOrder = 999;
+      let bOrder = 999;
+
+      for (const section of allDbSections) {
+        if (section.name === a) {
+          aOrder = section.order;
+        }
+        if (section.name === b) {
+          bOrder = section.order;
+        }
+      }
+
+      return aOrder - bOrder;
+    });
+
+    return sortedSections;
   }),
 
   getSectionCounts: permProcedure.query(async ({ ctx }) => {
@@ -834,10 +949,19 @@ export const formsRouter = {
         }
       }
 
+      const maxOrderResult = await db
+        .select({
+          maxOrder: sql<number>`COALESCE(MAX(${FormSections.order}), 0)`,
+        })
+        .from(FormSections);
+
+      const maxOrder = maxOrderResult[0]?.maxOrder ?? 0;
+
       const [newSection] = await db
         .insert(FormSections)
         .values({
           name: input.name,
+          order: maxOrder + 1,
         })
         .returning();
 
@@ -870,6 +994,170 @@ export const formsRouter = {
       });
     }),
 
+  getSectionRoles: permProcedure
+    .input(z.object({ sectionName: z.string() }))
+    .query(async ({ input, ctx }) => {
+      controlPerms.or(["READ_FORMS", "EDIT_FORMS"], ctx);
+
+      const section = await db.query.FormSections.findFirst({
+        where: (t, { eq }) => eq(t.name, input.sectionName),
+      });
+
+      if (!section) {
+        return [];
+      }
+
+      const sectionRoles = await db
+        .select({
+          roleId: FormSectionRoles.roleId,
+        })
+        .from(FormSectionRoles)
+        .where(eq(FormSectionRoles.sectionId, section.id));
+
+      const roleIds = sectionRoles.map((sr) => sr.roleId);
+
+      if (roleIds.length === 0) {
+        return [];
+      }
+
+      const roles = await db
+        .select({ id: Roles.id, name: Roles.name })
+        .from(Roles)
+        .where(inArray(Roles.id, roleIds));
+
+      return roles;
+    }),
+
+  updateSectionRoles: permProcedure
+    .input(
+      z.object({
+        sectionName: z.string(),
+        roleIds: z.array(z.string().uuid()),
+      }),
+    )
+    .mutation(async ({ input, ctx }) => {
+      controlPerms.or(["EDIT_FORMS"], ctx);
+
+      const section = await db.query.FormSections.findFirst({
+        where: (t, { eq }) => eq(t.name, input.sectionName),
+      });
+
+      if (!section) {
+        throw new TRPCError({
+          message: "Section not found",
+          code: "NOT_FOUND",
+        });
+      }
+
+      const isOfficer = ctx.session.permissions.IS_OFFICER;
+
+      if (input.roleIds.length && !isOfficer) {
+        const userRoles = await db
+          .select({ roleId: Permissions.roleId })
+          .from(Permissions)
+          .where(
+            sql`cast(${Permissions.userId} as text) = ${ctx.session.user.id}`,
+          );
+
+        const userRoleIds = new Set(userRoles.map((r) => r.roleId));
+
+        const hasAllRoles = input.roleIds.every((roleId) =>
+          userRoleIds.has(roleId),
+        );
+
+        if (!hasAllRoles) {
+          throw new TRPCError({
+            message:
+              "You don't have permission to assign sections to one or more of the selected roles",
+            code: "UNAUTHORIZED",
+          });
+        }
+      }
+
+      await db
+        .delete(FormSectionRoles)
+        .where(eq(FormSectionRoles.sectionId, section.id));
+
+      if (input.roleIds.length > 0) {
+        await db.insert(FormSectionRoles).values(
+          input.roleIds.map((roleId) => ({
+            sectionId: section.id,
+            roleId,
+          })),
+        );
+      }
+
+      const roleNames = await db
+        .select({ name: Roles.name })
+        .from(Roles)
+        .where(inArray(Roles.id, input.roleIds));
+
+      await log({
+        title: `Form section roles updated`,
+        message: `**Form section:** ${input.sectionName}. Roles: ${roleNames.length > 0 ? roleNames.map((r) => r.name).join(", ") : "None (all users)"}`,
+        color: "success_green",
+        userId: ctx.session.user.discordUserId,
+      });
+    }),
+
+  reorderSection: permProcedure
+    .input(
+      z.object({
+        sectionName: z.string(),
+        direction: z.enum(["up", "down"]),
+      }),
+    )
+    .mutation(async ({ input, ctx }) => {
+      controlPerms.or(["EDIT_FORMS"], ctx);
+
+      const allSections = await db
+        .select({
+          id: FormSections.id,
+          name: FormSections.name,
+          order: FormSections.order,
+        })
+        .from(FormSections)
+        .orderBy(FormSections.order);
+
+      const currentIndex = allSections.findIndex(
+        (s) => s.name === input.sectionName,
+      );
+
+      if (currentIndex === -1) {
+        throw new TRPCError({
+          message: "Section not found",
+          code: "NOT_FOUND",
+        });
+      }
+
+      const newIndex =
+        input.direction === "up" ? currentIndex - 1 : currentIndex + 1;
+
+      if (newIndex < 0 || newIndex >= allSections.length) {
+        return;
+      }
+
+      const currentSection = allSections[currentIndex];
+      const targetSection = allSections[newIndex];
+
+      await db
+        .update(FormSections)
+        .set({ order: targetSection?.order ?? newIndex })
+        .where(eq(FormSections.id, currentSection?.id ?? ""));
+
+      await db
+        .update(FormSections)
+        .set({ order: currentSection?.order ?? currentIndex })
+        .where(eq(FormSections.id, targetSection?.id ?? ""));
+
+      await log({
+        title: `Form section reordered`,
+        message: `**Form section:** ${input.sectionName} moved ${input.direction}`,
+        color: "success_green",
+        userId: ctx.session.user.discordUserId,
+      });
+    }),
+
   checkFormEditAccess: permProcedure
     .input(z.object({ slug_name: z.string() }))
     .query(async ({ input, ctx }) => {
diff --git a/packages/api/src/routers/misc.ts b/packages/api/src/routers/misc.ts
index 15b4a8ab..13b864ce 100644
--- a/packages/api/src/routers/misc.ts
+++ b/packages/api/src/routers/misc.ts
@@ -2,10 +2,14 @@ import type { TRPCRouterRecord } from "@trpc/server";
 import { Routes } from "discord-api-types/v10";
 import { z } from "zod";
 
-import { RECRUITING_CHANNEL, TEAM_MAP } from "@forge/consts/knight-hacks";
+import {
+  generateFundingRequestEmailHtml,
+  RECRUITING_CHANNEL,
+  TEAM_MAP,
+} from "@forge/consts/knight-hacks";
 
 import { protectedProcedure } from "../trpc";
-import { discord } from "../utils";
+import { discord, sendEmail } from "../utils";
 
 // Miscellaneous routes (primarily for form integrations)
 export const miscRouter = {
@@ -91,4 +95,45 @@ export const miscRouter = {
         },
       });
     }),
+
+  fundingRequest: protectedProcedure
+    .meta({
+      id: "fundingRequest",
+      inputSchema: z.object({
+        team: z.string().min(1),
+        description: z.string(),
+        amount: z.number(),
+        itemization: z.string(),
+        importance: z.number(),
+        dateNeeded: z.string(),
+        deadlineType: z.string(),
+      }),
+    })
+    .input(
+      z.object({
+        team: z.string().min(1),
+        description: z.string(),
+        amount: z.number(),
+        itemization: z.string(),
+        importance: z.number(),
+        dateNeeded: z.string(),
+        deadlineType: z.string(),
+      }),
+    )
+    .mutation(async ({ input }) => {
+      const dateObj =
+        typeof input.dateNeeded === "string"
+          ? new Date(input.dateNeeded)
+          : input.dateNeeded;
+      const formattedDate = `${String(dateObj.getMonth() + 1).padStart(2, "0")}/${String(dateObj.getDate()).padStart(2, "0")}`;
+      const htmlContent = generateFundingRequestEmailHtml(input);
+
+      await sendEmail({
+        to: "treasurer@knighthacks.org",
+        cc: "exec@knighthacks.org",
+        subject: `KHFR - $${input.amount.toLocaleString()} | ${formattedDate} | ${input.team}`,
+        html: htmlContent,
+        from: "Funding Requests <funding-requests@knighthacks.org>",
+      });
+    }),
 } satisfies TRPCRouterRecord;
diff --git a/packages/api/src/utils.ts b/packages/api/src/utils.ts
index 0df7b1b4..b30c083e 100644
--- a/packages/api/src/utils.ts
+++ b/packages/api/src/utils.ts
@@ -201,19 +201,40 @@ export const sendEmail = async ({
   subject,
   html,
   from,
+  cc,
+  bcc,
 }: {
-  to: string;
+  to: string | string[];
   subject: string;
   html: string;
   from?: string;
+  cc?: string | string[];
+  bcc?: string | string[];
 }): Promise<{ success: true; messageId: string }> => {
   try {
-    const { data, error } = await resend.emails.send({
+    const emailPayload: {
+      from: string;
+      to: string | string[];
+      subject: string;
+      html: string;
+      cc?: string | string[];
+      bcc?: string | string[];
+    } = {
       from: from ?? env.RESEND_FROM_EMAIL,
       to,
       subject,
       html,
-    });
+    };
+
+    if (cc) {
+      emailPayload.cc = cc;
+    }
+
+    if (bcc) {
+      emailPayload.bcc = bcc;
+    }
+
+    const { data, error } = await resend.emails.send(emailPayload);
 
     if (error) {
       console.error("Resend error:", error);
@@ -358,6 +379,9 @@ function createJsonSchemaValidator({
     case "SHORT_ANSWER":
     case "PARAGRAPH":
       schema.type = "string";
+      if (max === undefined) {
+        schema.maxLength = type === "SHORT_ANSWER" ? 150 : 750;
+      }
       break;
     case "EMAIL":
       schema.type = "string";
@@ -418,7 +442,10 @@ function createJsonSchemaValidator({
   }
 
   if (max !== undefined) {
-    if (schema.type === "string") schema.maxLength = max;
+    if (schema.type === "string") {
+      // Explicit max value overrides any defaults
+      schema.maxLength = max;
+    }
     if (schema.type === "array") schema.maxItems = max;
     if (schema.type === "number") schema.maximum = max;
   }
diff --git a/packages/consts/src/knight-hacks.ts b/packages/consts/src/knight-hacks.ts
index e8695386..d0528a68 100644
--- a/packages/consts/src/knight-hacks.ts
+++ b/packages/consts/src/knight-hacks.ts
@@ -6754,7 +6754,7 @@ export const OFFICER_ROLE_ID =
 export const DEVPOST_TEAM_MEMBER_EMAIL_OFFSET = 3;
 
 export const QuestionValidator = z.object({
-  question: z.string().max(200),
+  question: z.string(),
   image: z.string().url().optional(),
   type: z.enum([
     "SHORT_ANSWER",
@@ -6773,7 +6773,9 @@ export const QuestionValidator = z.object({
     "LINK",
   ]),
   options: z.array(z.string()).optional(),
+  optionsConst: z.string().optional(),
   optional: z.boolean().optional(),
+  allowOther: z.boolean().optional(),
   min: z.number().optional(),
   max: z.number().optional(),
   order: z.number().optional(),
@@ -6805,6 +6807,201 @@ export type ValidatorOptions = Omit<QuestionValidatorType, "question">;
 
 export type QuestionsType = z.infer<typeof QuestionValidator>["type"];
 
+export const AVAILABLE_DROPDOWN_CONSTANTS = {
+  LEVELS_OF_STUDY: "Levels of Study",
+  ALLERGIES: "Allergies",
+  MAJORS: "Majors",
+  GENDERS: "Genders",
+  RACES_OR_ETHNICITIES: "Races or Ethnicities",
+  COUNTRIES: "Countries",
+  SCHOOLS: "Schools",
+  COMPANIES: "Companies",
+  SHIRT_SIZES: "Shirt Sizes",
+  EVENT_FEEDBACK_HEARD: "Event Feedback - How You Heard",
+  SHORT_LEVELS_OF_STUDY: "Short Levels of Study",
+  SHORT_RACES_AND_ETHNICITIES: "Short Races and Ethnicities",
+} as const;
+
+export type DropdownConstantKey = keyof typeof AVAILABLE_DROPDOWN_CONSTANTS;
+
+export function getDropdownOptionsFromConst(
+  constName: string,
+): readonly string[] {
+  switch (constName) {
+    case "LEVELS_OF_STUDY":
+      return LEVELS_OF_STUDY;
+    case "ALLERGIES":
+      return ALLERGIES;
+    case "MAJORS":
+      return MAJORS;
+    case "GENDERS":
+      return GENDERS;
+    case "RACES_OR_ETHNICITIES":
+      return RACES_OR_ETHNICITIES;
+    case "COUNTRIES":
+      return COUNTRIES;
+    case "SCHOOLS":
+      return SCHOOLS;
+    case "COMPANIES":
+      return COMPANIES;
+    case "SHIRT_SIZES":
+      return SHIRT_SIZES;
+    case "EVENT_FEEDBACK_HEARD":
+      return EVENT_FEEDBACK_HEARD;
+    case "SHORT_LEVELS_OF_STUDY":
+      return SHORT_LEVELS_OF_STUDY;
+    case "SHORT_RACES_AND_ETHNICITIES":
+      return SHORT_RACES_AND_ETHNICITIES;
+    default:
+      return [];
+  }
+}
+
+export interface FundingRequestInput {
+  team: string;
+  description: string;
+  amount: number;
+  itemization: string;
+  importance: number;
+  dateNeeded: string;
+  deadlineType: string;
+}
+
+export function generateFundingRequestEmailHtml(
+  input: FundingRequestInput,
+): string {
+  const formatText = (text: string | null | undefined): string => {
+    if (!text) return "N/A";
+    return text
+      .replace(/&/g, "&amp;")
+      .replace(/</g, "&lt;")
+      .replace(/>/g, "&gt;")
+      .replace(/"/g, "&quot;")
+      .replace(/'/g, "&#039;")
+      .replace(/\n/g, "<br>");
+  };
+
+  // Format date as MM/DD
+  const formatDate = (date: Date | string): string => {
+    const dateObj = typeof date === "string" ? new Date(date) : date;
+    const month = String(dateObj.getMonth() + 1).padStart(2, "0");
+    const day = String(dateObj.getDate()).padStart(2, "0");
+    return `${month}/${day}`;
+  };
+
+  const formattedDate = formatDate(input.dateNeeded);
+
+  return `<!DOCTYPE html>
+        <html lang="en">
+        <head>
+          <meta charset="UTF-8">
+          <meta name="viewport" content="width=device-width, initial-scale=1.0">
+          <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        </head>
+        <body style="margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; background-color: #f5f5f5; line-height: 1.6; color: #333333;">
+          <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="background-color: #f5f5f5; padding: 20px 0;">
+            <tr>
+              <td align="center">
+                <table role="presentation" width="600" cellpadding="0" cellspacing="0" border="0" style="background-color: #ffffff; border-radius: 8px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); max-width: 600px;">
+                  <!-- Header -->
+                  <tr>
+                    <td style="padding: 32px 40px 24px 40px; border-bottom: 1px solid #e5e5e5;">
+                      <h1 style="margin: 0; font-size: 24px; font-weight: 600; color: #1a1a1a; letter-spacing: -0.5px;">
+                        Funding Request
+                      </h1>
+                      <p style="margin: 8px 0 0 0; font-size: 14px; color: #666666;">
+                        A new funding request has been submitted for the <strong style="color: #1a1a1a;">${input.team}</strong> team
+                      </p>
+                    </td>
+                  </tr>
+                  
+                  <!-- Content -->
+                  <tr>
+                    <td style="padding: 32px 40px;">
+                      <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="margin: 0; padding: 0;">
+                        <tr>
+                          <td style="padding-bottom: 16px; vertical-align: top; width: 140px;">
+                            <strong style="color: #1a1a1a; font-size: 14px;">Team:</strong>
+                          </td>
+                          <td style="padding-bottom: 16px; color: #333333; font-size: 14px;">
+                            ${input.team}
+                          </td>
+                        </tr>
+                        <tr>
+                          <td style="padding-bottom: 16px; vertical-align: top;">
+                            <strong style="color: #1a1a1a; font-size: 14px;">Amount:</strong>
+                          </td>
+                          <td style="padding-bottom: 16px; color: #059669; font-size: 16px; font-weight: 600;">
+                            $${input.amount.toLocaleString()}
+                          </td>
+                        </tr>
+                        <tr>
+                          <td style="padding-bottom: 16px; vertical-align: top;">
+                            <strong style="color: #1a1a1a; font-size: 14px;">Date Needed:</strong>
+                          </td>
+                          <td style="padding-bottom: 16px; color: #333333; font-size: 14px;">
+                            ${formattedDate}
+                          </td>
+                        </tr>
+                        <tr>
+                          <td style="padding-bottom: 16px; vertical-align: top;">
+                            <strong style="color: #1a1a1a; font-size: 14px;">Importance:</strong>
+                          </td>
+                          <td style="padding-bottom: 16px;">
+                            <span style="display: inline-block; background-color: #eff6ff; color: #1e40af; padding: 4px 12px; border-radius: 4px; font-size: 14px; font-weight: 500;">
+                              ${input.importance}/10
+                            </span>
+                          </td>
+                        </tr>
+                        <tr>
+                          <td style="padding-bottom: 16px; vertical-align: top;">
+                            <strong style="color: #1a1a1a; font-size: 14px;">Deadline Type:</strong>
+                          </td>
+                          <td style="padding-bottom: 16px; color: #333333; font-size: 14px;">
+                            ${input.deadlineType || "N/A"}
+                          </td>
+                        </tr>
+                      </table>
+                      
+                      <div style="border-top: 1px solid #e5e5e5; margin-top: 16px; padding-top: 16px;">
+                        <strong style="color: #1a1a1a; font-size: 14px; display: block; margin-bottom: 8px;">Description:</strong>
+                        <div style="color: #333333; font-size: 14px; white-space: pre-wrap; margin: 0; padding: 0;">
+                          ${formatText(input.description)}
+                        </div>
+                      </div>
+                      
+                      <div style="margin-top: 16px; padding-top: 16px;">
+                        <strong style="color: #1a1a1a; font-size: 14px; display: block; margin-bottom: 8px;">Itemization:</strong>
+                        <div style="color: #333333; font-size: 14px; white-space: pre-wrap; margin: 0; padding: 0;">
+                          ${formatText(input.itemization)}
+                        </div>
+                      </div>
+                    </td>
+                  </tr>
+                  
+                  <!-- Footer -->
+                  <tr>
+                    <td style="padding: 24px 40px; background-color: #f9fafb; border-top: 1px solid #e5e5e5; border-radius: 0 0 8px 8px;">
+                      <p style="margin: 0; font-size: 12px; color: #999999; text-align: center;">
+                        Submitted at ${new Date().toLocaleString("en-US", {
+                          year: "numeric",
+                          month: "long",
+                          day: "numeric",
+                          hour: "numeric",
+                          minute: "2-digit",
+                          hour12: true,
+                        })}
+                      </p>
+                    </td>
+                  </tr>
+                </table>
+              </td>
+            </tr>
+          </table>
+        </body>
+</html>`;
+}
+
 export const FORM_QUESTION_TYPES = [
   { value: "SHORT_ANSWER", label: "Short answer" },
   { value: "PARAGRAPH", label: "Paragraph" },
diff --git a/packages/db/src/schemas/knight-hacks.ts b/packages/db/src/schemas/knight-hacks.ts
index f10cf6fc..e6c46289 100644
--- a/packages/db/src/schemas/knight-hacks.ts
+++ b/packages/db/src/schemas/knight-hacks.ts
@@ -540,6 +540,7 @@ export const InsertOtherCompaniesSchema = createInsertSchema(OtherCompanies);
 export const FormSections = createTable("form_sections", (t) => ({
   id: t.uuid().notNull().primaryKey().defaultRandom(),
   name: t.varchar({ length: 255 }).notNull().unique(),
+  order: t.integer().notNull().default(0),
   createdAt: t.timestamp().notNull().defaultNow(),
 }));
 
@@ -580,6 +581,23 @@ export const FormsSchemas = createTable("form_schemas", (t) => ({
 //Ts so dumb
 export const FormSchemaSchema = createInsertSchema(FormsSchemas);
 
+export const FormResponseRoles = createTable(
+  "form_response_roles",
+  (t) => ({
+    formId: t
+      .uuid()
+      .notNull()
+      .references(() => FormsSchemas.id, { onDelete: "cascade" }),
+    roleId: t
+      .uuid()
+      .notNull()
+      .references(() => Roles.id, { onDelete: "cascade" }),
+  }),
+  (t) => ({
+    pk: primaryKey({ columns: [t.formId, t.roleId] }),
+  }),
+);
+
 export const FormResponse = createTable("form_response", (t) => ({
   id: t.uuid().notNull().primaryKey().defaultRandom(),
   form: t