From 4dc5aad0252a67306633b9f63e56d9d5737bce7d Mon Sep 17 00:00:00 2001
From: JoachimLK <joachim.l.kolle.pers@gmail.com>
Date: Wed, 29 Apr 2026 16:14:47 +0200
Subject: [PATCH 1/9] feat: add property management utilities and schemas

- Implemented property loading and attachment helpers in `properties.ts` for managing custom properties.
- Created Zod schemas for property definitions and configurations in `schemas/property.ts`.
- Introduced shared types and utility functions for properties in `shared/properties.ts`.

Co-authored-by: Copilot <copilot@github.com>
---
 app/components/AppTopBar.vue                  |  140 +-
 app/components/ColumnsMenu.vue                |   88 +
 app/components/FilterDrawer.vue               |  195 +
 app/components/JobSubNavActions.vue           |   36 +-
 app/components/PropertyBlock.vue              |  173 +
 app/components/PropertyFilterBar.vue          |  318 +
 app/components/PropertySchemaEditor.vue       |  416 ++
 app/components/PropertyTableCell.vue          |   69 +
 app/components/PropertyValueDisplay.vue       |  143 +
 app/components/PropertyValueEditor.vue        |  326 +
 app/components/SavedViewsMenu.vue             |  227 +
 app/composables/useApplications.ts            |   16 +-
 app/composables/useCandidates.ts              |   18 +-
 app/composables/useProperties.ts              |  160 +
 app/composables/useSavedViews.ts              |  119 +
 app/pages/dashboard/applications/[id].vue     |   14 +-
 app/pages/dashboard/applications/index.vue    |  392 +-
 app/pages/dashboard/candidates/[id].vue       |   11 +
 app/pages/dashboard/candidates/index.vue      |  329 +-
 app/pages/dashboard/jobs/index.vue            | 1040 +++-
 server/api/applications/[id].get.ts           |   10 +-
 .../[id]/properties/[propId].put.ts           |   84 +
 server/api/applications/index.get.ts          |   51 +-
 server/api/candidates/[id].get.ts             |    9 +
 .../[id]/properties/[propId].put.ts           |   72 +
 server/api/candidates/index.get.ts            |   40 +-
 server/api/jobs/index.get.ts                  |    2 +
 server/api/properties/[id].delete.ts          |   33 +
 server/api/properties/[id].patch.ts           |   39 +
 server/api/properties/index.get.ts            |   59 +
 server/api/properties/index.post.ts           |   76 +
 server/api/properties/reorder.post.ts         |   47 +
 .../migrations/0028_custom_properties.sql     |   42 +
 .../migrations/meta/0028_snapshot.json        | 5372 +++++++++++++++++
 server/database/migrations/meta/_journal.json |    7 +
 server/database/schema/app.ts                 |   79 +
 server/utils/properties.ts                    |  312 +
 server/utils/schemas/application.ts           |    2 +
 server/utils/schemas/candidate.ts             |    2 +
 server/utils/schemas/property.ts              |  169 +
 shared/properties.ts                          |  158 +
 41 files changed, 10529 insertions(+), 366 deletions(-)
 create mode 100644 app/components/ColumnsMenu.vue
 create mode 100644 app/components/FilterDrawer.vue
 create mode 100644 app/components/PropertyBlock.vue
 create mode 100644 app/components/PropertyFilterBar.vue
 create mode 100644 app/components/PropertySchemaEditor.vue
 create mode 100644 app/components/PropertyTableCell.vue
 create mode 100644 app/components/PropertyValueDisplay.vue
 create mode 100644 app/components/PropertyValueEditor.vue
 create mode 100644 app/components/SavedViewsMenu.vue
 create mode 100644 app/composables/useProperties.ts
 create mode 100644 app/composables/useSavedViews.ts
 create mode 100644 server/api/applications/[id]/properties/[propId].put.ts
 create mode 100644 server/api/candidates/[id]/properties/[propId].put.ts
 create mode 100644 server/api/properties/[id].delete.ts
 create mode 100644 server/api/properties/[id].patch.ts
 create mode 100644 server/api/properties/index.get.ts
 create mode 100644 server/api/properties/index.post.ts
 create mode 100644 server/api/properties/reorder.post.ts
 create mode 100644 server/database/migrations/0028_custom_properties.sql
 create mode 100644 server/database/migrations/meta/0028_snapshot.json
 create mode 100644 server/utils/properties.ts
 create mode 100644 server/utils/schemas/property.ts
 create mode 100644 shared/properties.ts

diff --git a/app/components/AppTopBar.vue b/app/components/AppTopBar.vue
index 0bdbb6e0..2190eeea 100644
--- a/app/components/AppTopBar.vue
+++ b/app/components/AppTopBar.vue
@@ -6,7 +6,7 @@ import {
   ChevronDown, Menu, X, Users, ChevronLeft,
   LayoutDashboard, Calendar, ArrowUpCircle,
   Cloud, Server, Sparkles, Radio, History,
-  MessageCircle,
+  MessageCircle, MoreHorizontal,
 } from 'lucide-vue-next'
 
 const route = useRoute()
@@ -20,6 +20,8 @@ const showFeedbackModal = ref(false)
 const showUserMenu = ref(false)
 const showMobileMenu = ref(false)
 const showGetStartedMenu = ref(false)
+const showMoreNav = ref(false)
+const showMoreActions = ref(false)
 
 const config = useRuntimeConfig()
 const { activeOrg } = useCurrentOrg()
@@ -162,6 +164,10 @@ function isActiveRoute(to: string, exact: boolean) {
   return route.path === localizedTo || route.path.startsWith(`${localizedTo}/`)
 }
 
+const primaryNavLabels = ['Dashboard', 'Jobs', 'Candidates', 'Applications', 'Interviews']
+const primaryNavItems = computed(() => navItems.value.filter(i => primaryNavLabels.includes(i.label)))
+const moreNavItems = computed(() => navItems.value.filter(i => !primaryNavLabels.includes(i.label)))
+
 // Close menus on route change
 watch(() => route.path, () => {
   showUserMenu.value = false
@@ -221,23 +227,66 @@ onUnmounted(() => {
           <!-- Desktop nav links -->
           <nav class="hidden md:flex items-center gap-0.5">
             <NuxtLink
-              v-for="item in navItems"
+              v-for="item in primaryNavItems"
               :key="item.to"
               :to="$localePath(item.to)"
-              class="relative flex items-center gap-2 px-3 py-1.5 rounded-lg text-[13px] font-medium transition-all duration-200 no-underline"
+              class="relative flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-[13px] font-medium transition-all duration-200 no-underline"
               :class="isActiveRoute(item.to, item.exact)
                 ? 'text-brand-700 dark:text-brand-300 bg-brand-50/80 dark:bg-brand-950/40'
                 : 'text-surface-600 dark:text-surface-400 hover:text-surface-900 dark:hover:text-surface-100 hover:bg-surface-100/80 dark:hover:bg-surface-800/60'"
             >
               <component :is="item.icon" class="size-4" />
               {{ item.label }}
-              <span
-                v-if="item.comingSoon"
-                class="ml-0.5 inline-flex items-center rounded-full bg-amber-50 dark:bg-amber-950/40 px-1.5 py-0.5 text-[9px] font-semibold leading-none text-amber-700 dark:text-amber-400 ring-1 ring-inset ring-amber-200/60 dark:ring-amber-800/40"
-              >
-                Soon
-              </span>
             </NuxtLink>
+
+            <!-- More nav dropdown -->
+            <div
+              v-if="moreNavItems.length"
+              class="relative"
+              @mouseenter="showMoreNav = true"
+              @mouseleave="showMoreNav = false"
+            >
+              <button
+                class="relative flex items-center gap-1.5 px-3 py-1.5 rounded-lg text-[13px] font-medium transition-all duration-200 cursor-pointer border-0 bg-transparent"
+                :class="moreNavItems.some(i => isActiveRoute(i.to, i.exact))
+                  ? 'text-brand-700 dark:text-brand-300 bg-brand-50/80 dark:bg-brand-950/40'
+                  : 'text-surface-600 dark:text-surface-400 hover:text-surface-900 dark:hover:text-surface-100 hover:bg-surface-100/80 dark:hover:bg-surface-800/60'"
+              >
+                More
+                <ChevronDown
+                  class="size-3 opacity-60 transition-transform duration-200"
+                  :class="showMoreNav ? 'rotate-180' : ''"
+                />
+              </button>
+              <Transition
+                enter-active-class="transition duration-150 ease-out"
+                enter-from-class="opacity-0 scale-95 -translate-y-1"
+                enter-to-class="opacity-100 scale-100 translate-y-0"
+                leave-active-class="transition duration-100 ease-in"
+                leave-from-class="opacity-100 scale-100 translate-y-0"
+                leave-to-class="opacity-0 scale-95 -translate-y-1"
+              >
+                <div
+                  v-if="showMoreNav"
+                  class="absolute left-0 top-full z-50 pt-1.5"
+                >
+                  <div class="w-52 rounded-xl border border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 shadow-xl shadow-surface-900/8 dark:shadow-surface-950/30 overflow-hidden py-1">
+                    <NuxtLink
+                      v-for="item in moreNavItems"
+                      :key="item.to"
+                      :to="$localePath(item.to)"
+                      class="flex items-center gap-2.5 px-3 py-2 text-[13px] font-medium transition-colors no-underline"
+                      :class="isActiveRoute(item.to, item.exact)
+                        ? 'text-brand-700 dark:text-brand-300 bg-brand-50 dark:bg-brand-950/40'
+                        : 'text-surface-600 dark:text-surface-400 hover:text-surface-900 dark:hover:text-surface-100 hover:bg-surface-100 dark:hover:bg-surface-800'"
+                    >
+                      <component :is="item.icon" class="size-4" />
+                      {{ item.label }}
+                    </NuxtLink>
+                  </div>
+                </div>
+              </Transition>
+            </div>
           </nav>
         </div>
 
@@ -325,39 +374,64 @@ onUnmounted(() => {
 
           <!-- Color mode toggle -->
           <button
-            class="flex items-center justify-center size-8 rounded-lg text-surface-500 dark:text-surface-400 hover:text-surface-700 dark:hover:text-surface-200 hover:bg-surface-100 dark:hover:bg-surface-800 transition-all duration-200 cursor-pointer border-0 bg-transparent"
-            :title="isDark ? 'Switch to light' : 'Switch to dark'"
+            class="inline-flex items-center justify-center size-8 rounded-lg text-surface-500 dark:text-surface-400 hover:text-surface-700 dark:hover:text-surface-200 hover:bg-surface-100 dark:hover:bg-surface-800 transition-all duration-200 cursor-pointer border-0 bg-transparent"
+            :title="isDark ? 'Switch to light mode' : 'Switch to dark mode'"
             @click="toggleColorMode"
           >
             <Sun v-if="isDark" class="size-4" />
             <Moon v-else class="size-4" />
           </button>
 
-          <!-- Updates button -->
-          <NuxtLink
-            :to="$localePath('/dashboard/updates')"
-            class="hidden sm:flex items-center justify-center size-8 rounded-lg transition-all duration-200 no-underline"
-            :class="isActiveRoute('/dashboard/updates', false)
-              ? 'text-brand-600 dark:text-brand-400 bg-brand-50 dark:bg-brand-950/40'
-              : 'text-surface-500 dark:text-surface-400 hover:text-surface-700 dark:hover:text-surface-200 hover:bg-surface-100 dark:hover:bg-surface-800'"
-            title="Updates & changelog"
-            aria-label="Updates & changelog"
+          <!-- More actions dropdown -->
+          <div
+            class="relative hidden sm:block"
+            @mouseenter="showMoreActions = true"
+            @mouseleave="showMoreActions = false"
           >
-            <ArrowUpCircle class="size-4" />
-          </NuxtLink>
-
-          <!-- Feedback button -->
-          <button
-            v-if="isFeedbackEnabled"
-            class="flex items-center justify-center size-8 rounded-lg text-surface-500 dark:text-surface-400 hover:text-surface-700 dark:hover:text-surface-200 hover:bg-surface-100 dark:hover:bg-surface-800 transition-all duration-200 cursor-pointer border-0 bg-transparent"
-            title="Report issue"
-            @click="showFeedbackModal = true"
-          >
-            <MessageSquarePlus class="size-4" />
-          </button>
+            <button
+              class="inline-flex items-center justify-center size-8 rounded-lg text-surface-500 dark:text-surface-400 hover:text-surface-700 dark:hover:text-surface-200 hover:bg-surface-100 dark:hover:bg-surface-800 transition-all duration-200 cursor-pointer border-0 bg-transparent"
+              title="More options"
+            >
+              <MoreHorizontal class="size-4" />
+            </button>
+            <Transition
+              enter-active-class="transition duration-150 ease-out"
+              enter-from-class="opacity-0 scale-95 -translate-y-1"
+              enter-to-class="opacity-100 scale-100 translate-y-0"
+              leave-active-class="transition duration-100 ease-in"
+              leave-from-class="opacity-100 scale-100 translate-y-0"
+              leave-to-class="opacity-0 scale-95 -translate-y-1"
+            >
+              <div
+                v-if="showMoreActions"
+                class="absolute right-0 top-full z-50 pt-1.5"
+              >
+                <div class="w-52 rounded-xl border border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 shadow-xl shadow-surface-900/8 dark:shadow-surface-950/30 overflow-hidden py-1">
+                  <NuxtLink
+                    :to="$localePath('/dashboard/updates')"
+                    class="flex items-center gap-2.5 px-3 py-2 text-[13px] font-medium transition-colors no-underline"
+                    :class="isActiveRoute('/dashboard/updates', false)
+                      ? 'text-brand-700 dark:text-brand-300 bg-brand-50 dark:bg-brand-950/40'
+                      : 'text-surface-600 dark:text-surface-400 hover:text-surface-900 dark:hover:text-surface-100 hover:bg-surface-100 dark:hover:bg-surface-800'"
+                  >
+                    <ArrowUpCircle class="size-4" />
+                    Updates & changelog
+                  </NuxtLink>
+                  <button
+                    v-if="isFeedbackEnabled"
+                    class="flex items-center gap-2.5 w-full px-3 py-2 text-[13px] font-medium text-surface-600 dark:text-surface-400 hover:text-surface-900 dark:hover:text-surface-100 hover:bg-surface-100 dark:hover:bg-surface-800 transition-colors cursor-pointer border-0 bg-transparent text-left"
+                    @click="showFeedbackModal = true; showMoreActions = false"
+                  >
+                    <MessageSquarePlus class="size-4" />
+                    Report issue
+                  </button>
+                </div>
+              </div>
+            </Transition>
+          </div>
 
           <!-- Divider -->
-          <div class="hidden sm:block w-px h-6 bg-surface-200 dark:bg-surface-700 mx-1" />
+          <div class="hidden sm:block w-px h-6 bg-surface-200 dark:bg-surface-700 mx-0.5" />
 
           <!-- User menu -->
           <div ref="userMenuRoot" class="relative">
diff --git a/app/components/ColumnsMenu.vue b/app/components/ColumnsMenu.vue
new file mode 100644
index 00000000..9a26550d
--- /dev/null
+++ b/app/components/ColumnsMenu.vue
@@ -0,0 +1,88 @@
+<script setup lang="ts">
+import { Columns2, Check } from 'lucide-vue-next'
+
+const props = defineProps<{
+  columns: { key: string; label: string; required?: boolean }[]
+  modelValue: Record<string, boolean>
+}>()
+
+const emit = defineEmits<{
+  'update:modelValue': [value: Record<string, boolean>]
+}>()
+
+const open = ref(false)
+const menuRef = ref<HTMLElement | null>(null)
+
+function toggle(key: string) {
+  emit('update:modelValue', { ...props.modelValue, [key]: !props.modelValue[key] })
+}
+
+function handleClickOutside(e: MouseEvent) {
+  if (menuRef.value && !menuRef.value.contains(e.target as Node)) {
+    open.value = false
+  }
+}
+
+watch(open, (val) => {
+  if (val) document.addEventListener('click', handleClickOutside)
+  else document.removeEventListener('click', handleClickOutside)
+})
+
+onUnmounted(() => {
+  document.removeEventListener('click', handleClickOutside)
+})
+
+const hiddenCount = computed(() =>
+  props.columns.filter(col => !col.required && !props.modelValue[col.key]).length,
+)
+</script>
+
+<template>
+  <div ref="menuRef" class="relative">
+    <button
+      type="button"
+      class="inline-flex items-center gap-1.5 rounded-lg border px-3 py-2 text-sm font-medium transition-colors"
+      :class="hiddenCount > 0
+        ? 'border-brand-300 bg-brand-50 text-brand-700 dark:border-brand-700 dark:bg-brand-950 dark:text-brand-300'
+        : 'border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 text-surface-600 dark:text-surface-400 hover:bg-surface-50 dark:hover:bg-surface-800'"
+      @click.stop="open = !open"
+    >
+      <Columns2 class="size-4" />
+      Columns
+      <span
+        v-if="hiddenCount > 0"
+        class="inline-flex items-center justify-center min-w-[1rem] h-4 px-1 rounded-full bg-brand-600 text-white text-[10px] font-semibold"
+      >{{ hiddenCount }}</span>
+    </button>
+
+    <div
+      v-if="open"
+      class="absolute right-0 z-50 mt-1 w-48 rounded-lg border border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 shadow-lg py-1"
+    >
+      <div class="px-3 py-1.5 text-xs font-semibold uppercase tracking-wide text-surface-400 dark:text-surface-500 border-b border-surface-100 dark:border-surface-800 mb-1">
+        Toggle columns
+      </div>
+      <button
+        v-for="col in columns"
+        :key="col.key"
+        type="button"
+        class="flex w-full items-center gap-2.5 px-3 py-1.5 text-sm transition-colors"
+        :class="col.required
+          ? 'text-surface-400 dark:text-surface-500 cursor-not-allowed'
+          : 'text-surface-700 dark:text-surface-300 hover:bg-surface-50 dark:hover:bg-surface-800'"
+        :disabled="col.required"
+        @click="!col.required && toggle(col.key)"
+      >
+        <span
+          class="flex size-4 shrink-0 items-center justify-center rounded border transition-colors"
+          :class="(col.required || modelValue[col.key])
+            ? 'bg-brand-600 border-brand-600 text-white'
+            : 'border-surface-300 dark:border-surface-600'"
+        >
+          <Check v-if="col.required || modelValue[col.key]" class="size-3" />
+        </span>
+        {{ col.label }}
+      </button>
+    </div>
+  </div>
+</template>
diff --git a/app/components/FilterDrawer.vue b/app/components/FilterDrawer.vue
new file mode 100644
index 00000000..64fb25da
--- /dev/null
+++ b/app/components/FilterDrawer.vue
@@ -0,0 +1,195 @@
+<script setup lang="ts">
+import { X, RotateCcw, Bookmark, Plus, Check } from 'lucide-vue-next'
+
+const props = defineProps<{
+  modelValue: boolean
+  title?: string
+  description?: string
+  activeCount?: number
+  /** Show the "Save as view" affordance in the footer. */
+  saveable?: boolean
+  /** Suggested default name when saving a new view. */
+  defaultSaveName?: string
+}>()
+
+const emit = defineEmits<{
+  'update:modelValue': [value: boolean]
+  'reset': []
+  'save-view': [name: string]
+}>()
+
+function close() {
+  emit('update:modelValue', false)
+}
+
+const showSaveForm = ref(false)
+const newName = ref('')
+const nameInput = ref<HTMLInputElement | null>(null)
+
+async function openSaveForm() {
+  showSaveForm.value = true
+  newName.value = props.defaultSaveName ?? 'New view'
+  await nextTick()
+  nameInput.value?.focus()
+  nameInput.value?.select()
+}
+
+function submitSave() {
+  const name = newName.value.trim()
+  if (!name) return
+  emit('save-view', name)
+  showSaveForm.value = false
+  newName.value = ''
+}
+
+// Reset save form when drawer closes
+watch(() => props.modelValue, (open) => {
+  if (!open) {
+    showSaveForm.value = false
+    newName.value = ''
+  }
+})
+
+// Lock body scroll while open
+watch(() => props.modelValue, (open) => {
+  if (typeof document === 'undefined') return
+  document.body.style.overflow = open ? 'hidden' : ''
+})
+
+// Close on Escape
+function onKeydown(e: KeyboardEvent) {
+  if (e.key === 'Escape' && props.modelValue) close()
+}
+onMounted(() => document.addEventListener('keydown', onKeydown))
+onUnmounted(() => {
+  document.removeEventListener('keydown', onKeydown)
+  if (typeof document !== 'undefined') document.body.style.overflow = ''
+})
+</script>
+
+<template>
+  <Teleport to="body">
+    <Transition
+      enter-active-class="transition-opacity duration-200"
+      leave-active-class="transition-opacity duration-150"
+      enter-from-class="opacity-0"
+      leave-to-class="opacity-0"
+    >
+      <div
+        v-if="modelValue"
+        class="fixed inset-0 z-[55] bg-surface-900/40"
+        @click="close"
+      />
+    </Transition>
+
+    <Transition
+      enter-active-class="transition-transform duration-300 ease-out"
+      leave-active-class="transition-transform duration-200 ease-in"
+      enter-from-class="translate-x-full"
+      leave-to-class="translate-x-full"
+    >
+      <aside
+        v-if="modelValue"
+        class="fixed inset-y-0 right-0 z-[60] w-full max-w-md flex flex-col bg-white dark:bg-surface-900 shadow-2xl border-l border-surface-200 dark:border-surface-800"
+        role="dialog"
+        aria-modal="true"
+        :aria-label="title || 'Filters'"
+      >
+        <!-- Header -->
+        <header class="flex items-start justify-between gap-3 px-5 py-4 border-b border-surface-200 dark:border-surface-800">
+          <div class="min-w-0">
+            <h2 class="text-base font-semibold text-surface-900 dark:text-surface-50 flex items-center gap-2">
+              {{ title || 'Filters' }}
+              <span
+                v-if="activeCount && activeCount > 0"
+                class="inline-flex items-center justify-center min-w-5 h-5 px-1.5 rounded-full bg-brand-600 text-white text-xs font-semibold"
+              >{{ activeCount }}</span>
+            </h2>
+            <p v-if="description" class="text-xs text-surface-500 dark:text-surface-400 mt-0.5">
+              {{ description }}
+            </p>
+          </div>
+          <button
+            type="button"
+            class="shrink-0 rounded-md p-1.5 text-surface-400 hover:text-surface-900 dark:hover:text-surface-100 hover:bg-surface-100 dark:hover:bg-surface-800 transition-colors"
+            aria-label="Close"
+            @click="close"
+          >
+            <X class="size-4" />
+          </button>
+        </header>
+
+        <!-- Body (scrollable) -->
+        <div class="flex-1 overflow-y-auto px-5 py-4">
+          <slot />
+        </div>
+
+        <!-- Footer -->
+        <footer class="border-t border-surface-200 dark:border-surface-800 bg-surface-50/60 dark:bg-surface-800/40">
+          <!-- Inline save-view form -->
+          <div v-if="saveable && showSaveForm" class="flex items-center gap-2 px-5 py-3 border-b border-surface-200 dark:border-surface-800">
+            <Bookmark class="size-4 text-brand-600 shrink-0" />
+            <input
+              ref="nameInput"
+              v-model="newName"
+              type="text"
+              placeholder="Name this view"
+              maxlength="60"
+              class="flex-1 rounded-md border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2.5 py-1.5 text-sm text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500"
+              @keydown.enter.prevent="submitSave"
+              @keydown.escape.prevent="showSaveForm = false; newName = ''"
+            />
+            <button
+              type="button"
+              :disabled="!newName.trim()"
+              class="inline-flex items-center gap-1 rounded-md bg-brand-600 px-3 py-1.5 text-xs font-semibold text-white hover:bg-brand-700 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
+              @click="submitSave"
+            >
+              <Check class="size-3.5" />
+              Save
+            </button>
+            <button
+              type="button"
+              class="rounded-md p-1.5 text-surface-400 hover:text-surface-700 dark:hover:text-surface-200 hover:bg-surface-100 dark:hover:bg-surface-800 transition-colors"
+              aria-label="Cancel"
+              @click="showSaveForm = false; newName = ''"
+            >
+              <X class="size-3.5" />
+            </button>
+          </div>
+
+          <div class="flex items-center justify-between gap-2 px-5 py-3">
+            <button
+              type="button"
+              class="inline-flex items-center gap-1.5 text-xs font-medium text-surface-500 dark:text-surface-400 hover:text-danger-600 dark:hover:text-danger-400 transition-colors"
+              @click="emit('reset')"
+            >
+              <RotateCcw class="size-3.5" />
+              Reset all
+            </button>
+            <div class="flex items-center gap-2">
+              <button
+                v-if="saveable && !showSaveForm"
+                type="button"
+                class="inline-flex items-center gap-1.5 rounded-lg border border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 px-3 py-2 text-sm font-medium text-surface-700 dark:text-surface-300 hover:bg-surface-50 dark:hover:bg-surface-800 transition-colors"
+                @click="openSaveForm"
+              >
+                <Plus class="size-3.5" />
+                Save as view
+              </button>
+              <slot name="footer">
+                <button
+                  type="button"
+                  class="rounded-lg bg-surface-900 dark:bg-surface-100 px-4 py-2 text-sm font-medium text-white dark:text-surface-900 hover:opacity-90 transition-opacity"
+                  @click="close"
+                >
+                  Done
+                </button>
+              </slot>
+            </div>
+          </div>
+        </footer>
+      </aside>
+    </Transition>
+  </Teleport>
+</template>
diff --git a/app/components/JobSubNavActions.vue b/app/components/JobSubNavActions.vue
index 99e371f0..bf65ac1b 100644
--- a/app/components/JobSubNavActions.vue
+++ b/app/components/JobSubNavActions.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { UserPlus, Pencil, Trash2, MoreHorizontal, Brain } from 'lucide-vue-next'
+import { UserPlus, Pencil, Trash2, MoreHorizontal, Brain, Settings2 } from 'lucide-vue-next'
 import { JOB_STATUS_TRANSITIONS } from '~~/shared/status-transitions'
 
 const props = defineProps<{
@@ -182,6 +182,18 @@ watch(showMoreMenu, (val) => {
 onBeforeUnmount(() => {
   document.removeEventListener('click', handleClickOutside)
 })
+
+// ─────────────────────────────────────────────
+// Property schema editor (per-job)
+// ─────────────────────────────────────────────
+
+const showPropertyEditor = ref(false)
+const propertyEditorScope = ref<'org' | 'job'>('job')
+function openPropertyEditor(scope: 'org' | 'job') {
+  propertyEditorScope.value = scope
+  showPropertyEditor.value = true
+  showMoreMenu.value = false
+}
 </script>
 
 <template>
@@ -255,6 +267,20 @@ onBeforeUnmount(() => {
                 <Brain class="size-3.5 text-surface-400" />
                 {{ isScoringAll ? `Scoring ${scoringProgress.done}/${scoringProgress.total}…` : 'Score All Candidates' }}
               </button>
+              <button
+                class="flex w-full cursor-pointer items-center gap-2.5 px-3.5 py-2 text-sm text-surface-700 dark:text-surface-300 hover:bg-surface-50 dark:hover:bg-surface-800/80 transition-colors"
+                @click="openPropertyEditor('job')"
+              >
+                <Settings2 class="size-3.5 text-surface-400" />
+                Manage Job Properties
+              </button>
+              <button
+                class="flex w-full cursor-pointer items-center gap-2.5 px-3.5 py-2 text-sm text-surface-700 dark:text-surface-300 hover:bg-surface-50 dark:hover:bg-surface-800/80 transition-colors"
+                @click="openPropertyEditor('org')"
+              >
+                <Settings2 class="size-3.5 text-surface-400" />
+                Manage Application Properties
+              </button>
               <template v-if="secondaryJobTransitions.length > 0">
                 <div class="border-t border-surface-100 dark:border-surface-800 my-1.5 mx-2" />
                 <button
@@ -282,6 +308,14 @@ onBeforeUnmount(() => {
     </div>
   </Teleport>
 
+  <!-- Property schema editor (per-job application properties) -->
+  <PropertySchemaEditor
+    :open="showPropertyEditor"
+    entity-type="application"
+    :job-id="propertyEditorScope === 'job' ? jobId : null"
+    @close="showPropertyEditor = false"
+  />
+
   <!-- Delete Job Confirm -->
   <Teleport to="body">
     <div v-if="showDeleteConfirm" class="fixed inset-0 z-50 flex items-center justify-center">
diff --git a/app/components/PropertyBlock.vue b/app/components/PropertyBlock.vue
new file mode 100644
index 00000000..6d5e5135
--- /dev/null
+++ b/app/components/PropertyBlock.vue
@@ -0,0 +1,173 @@
+<script setup lang="ts">
+import {
+  AlignLeft, Calendar, CheckSquare, CircleDot, Hash, Link as LinkIcon,
+  List, Mail, Paperclip, Plus, Settings2, Text as TextIcon, User,
+} from 'lucide-vue-next'
+import type {
+  PropertyDefinition,
+  PropertyEntityType,
+  PropertyEntry,
+  PropertyType,
+} from '~~/shared/properties'
+
+/**
+ * PropertyBlock — Notion-style properties area for an entity detail page.
+ *
+ * Renders one row per property: [icon] [name]  [editable value].
+ * Includes "+ Add property" + "Manage properties" affordances at the bottom
+ * which both open PropertySchemaEditor.
+ *
+ * The parent page owns the entity's property entries (via the entity GET endpoint)
+ * and passes them in. This component handles UI + writes back via the API.
+ */
+
+const props = defineProps<{
+  entityType: PropertyEntityType
+  entityId: string
+  /** Job id, only used to scope per-job application properties + the schema editor. */
+  jobId?: string | null
+  entries: PropertyEntry[]
+  /** Optional read-only entries to render above (e.g. form question responses). */
+  readOnlyEntries?: PropertyEntry[]
+  /** Hide management affordances (used in dense embeds). */
+  managementDisabled?: boolean
+}>()
+
+const emit = defineEmits<{
+  (e: 'refresh'): void
+}>()
+
+const toast = useToast()
+const { handlePreviewReadOnlyError } = usePreviewReadOnly()
+
+// Local working copy of entries so optimistic updates feel instant.
+const localEntries = ref<PropertyEntry[]>(props.entries)
+watch(
+  () => props.entries,
+  (next) => { localEntries.value = next },
+  { deep: false },
+)
+
+const { setValue: persistValue } = useEntityPropertyMutations({
+  entityType: props.entityType,
+  entityId: () => props.entityId,
+  entries: localEntries,
+  // No full-page refresh needed: optimistic update + server reconciliation
+  // already keeps localEntries in sync. A full refresh causes visible flicker.
+})
+
+const savingId = ref<string | null>(null)
+
+async function handleUpdate(propertyDefinitionId: string, value: unknown) {
+  savingId.value = propertyDefinitionId
+  try {
+    await persistValue(propertyDefinitionId, value)
+  } catch (err: unknown) {
+    if (handlePreviewReadOnlyError(err)) return
+    const message = (err as { data?: { statusMessage?: string } })?.data?.statusMessage ?? 'Failed to save'
+    toast.error(message)
+  } finally {
+    savingId.value = null
+  }
+}
+
+const ICON_MAP: Record<PropertyType, unknown> = {
+  text: TextIcon,
+  long_text: AlignLeft,
+  number: Hash,
+  select: CircleDot,
+  multi_select: List,
+  date: Calendar,
+  checkbox: CheckSquare,
+  url: LinkIcon,
+  email: Mail,
+  person: User,
+  file: Paperclip,
+}
+
+function iconFor(def: PropertyDefinition) {
+  return ICON_MAP[def.type]
+}
+
+const editorOpen = ref(false)
+const editorScope = ref<'org' | 'job'>('org')
+function openEditor(scope: 'org' | 'job') {
+  editorScope.value = scope
+  editorOpen.value = true
+}
+</script>
+
+<template>
+  <section class="space-y-1">
+    <!-- Read-only entries (e.g. form question responses) -->
+    <template v-if="readOnlyEntries && readOnlyEntries.length">
+      <div
+        v-for="entry in readOnlyEntries"
+        :key="`ro-${entry.definition.id}`"
+        class="group grid grid-cols-[200px_1fr] items-start gap-2 rounded px-2 py-1"
+      >
+        <div class="flex items-center gap-1.5 pt-1 text-sm text-surface-500 dark:text-surface-400 min-w-0">
+          <component :is="iconFor(entry.definition) as never" class="size-3.5 shrink-0" />
+          <span class="truncate">{{ entry.definition.name }}</span>
+          <span class="ml-1 rounded bg-surface-100 dark:bg-surface-800 px-1.5 py-0.5 text-[10px] font-medium uppercase tracking-wide text-surface-500">Form</span>
+        </div>
+        <div class="min-w-0 px-2 py-1">
+          <PropertyValueDisplay :definition="entry.definition" :value="entry.value" />
+        </div>
+      </div>
+      <div v-if="localEntries.length" class="my-2 border-t border-surface-100 dark:border-surface-800" />
+    </template>
+
+    <!-- Editable entries -->
+    <div
+      v-for="entry in localEntries"
+      :key="entry.definition.id"
+      class="grid grid-cols-[200px_1fr] items-start gap-2 rounded px-2 py-0.5"
+    >
+      <div class="flex items-center gap-1.5 pt-1.5 text-sm text-surface-500 dark:text-surface-400 min-w-0">
+        <component :is="iconFor(entry.definition) as never" class="size-3.5 shrink-0" />
+        <span class="truncate">{{ entry.definition.name }}</span>
+        <span
+          v-if="entry.definition.jobId"
+          class="ml-1 rounded bg-brand-50 dark:bg-brand-950/40 px-1.5 py-0.5 text-[10px] font-medium uppercase tracking-wide text-brand-600 dark:text-brand-300"
+          title="Defined for this job only"
+        >Job</span>
+      </div>
+      <div class="min-w-0">
+        <PropertyValueEditor
+          :definition="entry.definition"
+          :model-value="entry.value"
+          :saving="savingId === entry.definition.id"
+          @update="(v) => handleUpdate(entry.definition.id, v)"
+        />
+      </div>
+    </div>
+
+    <!-- Management affordances -->
+    <div v-if="!managementDisabled" class="flex items-center gap-2 pt-1">
+      <button
+        type="button"
+        class="inline-flex items-center gap-1 rounded px-2 py-1 text-xs text-surface-500 hover:text-surface-800 dark:hover:text-surface-100 hover:bg-surface-100 dark:hover:bg-surface-800 cursor-pointer"
+        @click="openEditor('org')"
+      >
+        <Plus class="size-3.5" /> Add property
+      </button>
+      <button
+        v-if="jobId && entityType === 'application'"
+        type="button"
+        class="inline-flex items-center gap-1 rounded px-2 py-1 text-xs text-surface-500 hover:text-surface-800 dark:hover:text-surface-100 hover:bg-surface-100 dark:hover:bg-surface-800 cursor-pointer"
+        @click="openEditor('job')"
+      >
+        <Settings2 class="size-3.5" /> Manage job properties
+      </button>
+    </div>
+
+    <PropertySchemaEditor
+      :open="editorOpen"
+      :entity-type="entityType"
+      :job-id="editorScope === 'job' ? jobId ?? null : null"
+      @close="editorOpen = false"
+      @changed="emit('refresh')"
+    />
+  </section>
+</template>
diff --git a/app/components/PropertyFilterBar.vue b/app/components/PropertyFilterBar.vue
new file mode 100644
index 00000000..669d0681
--- /dev/null
+++ b/app/components/PropertyFilterBar.vue
@@ -0,0 +1,318 @@
+<script setup lang="ts">
+import { Filter, Plus, X } from 'lucide-vue-next'
+import {
+  PROPERTY_COLOR_CLASSES,
+  type PropertyDefinition,
+  type PropertyEntityType,
+  type PropertyFilter,
+  type PropertyOperator,
+} from '~~/shared/properties'
+
+/**
+ * PropertyFilterBar — chip-style filter UI for list pages.
+ *
+ * Holds an array of `PropertyFilter` and emits `update:modelValue` whenever
+ * a filter is added, removed, or modified. The parent serializes this to
+ * the `propertyFilters` query string param to send to the list endpoint.
+ */
+
+const props = defineProps<{
+  modelValue: PropertyFilter[]
+  entityType: PropertyEntityType
+  /** Optional jobId to also include per-job application properties in the picker. */
+  jobId?: string | null
+}>()
+
+const emit = defineEmits<{
+  (e: 'update:modelValue', value: PropertyFilter[]): void
+}>()
+
+const { definitions } = useProperties({
+  entityType: () => props.entityType,
+  jobId: () => props.jobId ?? null,
+})
+
+const definitionMap = computed(() => {
+  const map = new Map<string, PropertyDefinition>()
+  for (const d of definitions.value) map.set(d.id, d)
+  return map
+})
+
+const pickerOpen = ref(false)
+const pickerEl = ref<HTMLElement | null>(null)
+
+function closePickerOnOutside(e: PointerEvent) {
+  if (!pickerOpen.value || !pickerEl.value) return
+  if (!pickerEl.value.contains(e.target as Node)) pickerOpen.value = false
+}
+watchEffect((onCleanup) => {
+  if (pickerOpen.value && import.meta.client) {
+    document.addEventListener('pointerdown', closePickerOnOutside, true)
+    onCleanup(() => document.removeEventListener('pointerdown', closePickerOnOutside, true))
+  }
+})
+
+function defaultOpFor(def: PropertyDefinition): PropertyOperator {
+  switch (def.type) {
+    case 'select':
+    case 'checkbox':
+      return 'equals'
+    case 'multi_select':
+      return 'in'
+    case 'text':
+    case 'long_text':
+    case 'url':
+    case 'email':
+    case 'person':
+      return 'contains'
+    default:
+      return 'isNotEmpty'
+  }
+}
+
+function operatorsFor(def: PropertyDefinition): PropertyOperator[] {
+  switch (def.type) {
+    case 'select':
+      return ['equals', 'isNotEmpty']
+    case 'multi_select':
+      return ['in', 'isNotEmpty']
+    case 'checkbox':
+      return ['equals']
+    case 'text':
+    case 'long_text':
+    case 'url':
+    case 'email':
+    case 'person':
+      return ['contains', 'equals', 'isNotEmpty']
+    case 'number':
+    case 'date':
+      return ['equals', 'isNotEmpty']
+    case 'file':
+      return ['isNotEmpty']
+  }
+}
+
+const OPERATOR_LABELS: Record<PropertyOperator, string> = {
+  equals: 'is',
+  contains: 'contains',
+  in: 'is any of',
+  isEmpty: 'is empty',
+  isNotEmpty: 'is set',
+}
+
+function addFilter(def: PropertyDefinition) {
+  const op = defaultOpFor(def)
+  const next: PropertyFilter = {
+    propertyDefinitionId: def.id,
+    op,
+    value: op === 'equals' && def.type === 'checkbox' ? true : op === 'in' ? [] : '',
+  }
+  emit('update:modelValue', [...props.modelValue, next])
+  pickerOpen.value = false
+}
+
+function removeFilter(idx: number) {
+  const next = props.modelValue.filter((_, i) => i !== idx)
+  emit('update:modelValue', next)
+}
+
+function patchFilter(idx: number, patch: Partial<PropertyFilter>) {
+  const next = props.modelValue.map((f, i) => (i === idx ? { ...f, ...patch } : f))
+  emit('update:modelValue', next)
+}
+
+function clearAll() {
+  emit('update:modelValue', [])
+}
+
+const editingIdx = ref<number | null>(null)
+const editEl = ref<HTMLElement | null>(null)
+function closeEditOnOutside(e: PointerEvent) {
+  if (editingIdx.value === null || !editEl.value) return
+  if (!editEl.value.contains(e.target as Node)) editingIdx.value = null
+}
+watchEffect((onCleanup) => {
+  if (editingIdx.value !== null && import.meta.client) {
+    document.addEventListener('pointerdown', closeEditOnOutside, true)
+    onCleanup(() => document.removeEventListener('pointerdown', closeEditOnOutside, true))
+  }
+})
+
+function summarizeFilter(f: PropertyFilter): string {
+  const def = definitionMap.value.get(f.propertyDefinitionId)
+  if (!def) return ''
+  const opLabel = OPERATOR_LABELS[f.op]
+  if (f.op === 'isEmpty' || f.op === 'isNotEmpty') return `${def.name} ${opLabel}`
+  if (f.op === 'in') {
+    const ids = (f.value as string[]) ?? []
+    const opts = (def.config as { options?: { id: string; label: string }[] } | null)?.options ?? []
+    const labels = ids.map((id) => opts.find((o) => o.id === id)?.label).filter(Boolean)
+    return `${def.name} ${opLabel} ${labels.join(', ') || '…'}`
+  }
+  if (def.type === 'select') {
+    const opts = (def.config as { options?: { id: string; label: string }[] } | null)?.options ?? []
+    const label = opts.find((o) => o.id === f.value)?.label ?? '…'
+    return `${def.name} ${opLabel} ${label}`
+  }
+  if (def.type === 'checkbox') return `${def.name} ${opLabel} ${f.value ? 'checked' : 'unchecked'}`
+  return `${def.name} ${opLabel} ${f.value || '…'}`
+}
+
+const showableDefs = computed(() => definitions.value)
+</script>
+
+<template>
+  <div class="flex flex-wrap items-center gap-2">
+    <!-- Existing filter chips -->
+    <div
+      v-for="(f, idx) in modelValue"
+      :key="`${f.propertyDefinitionId}-${idx}`"
+      class="relative"
+    >
+      <button
+        type="button"
+        class="inline-flex items-center gap-1.5 rounded-full border border-brand-200 dark:border-brand-800 bg-brand-50 dark:bg-brand-950/40 px-2.5 py-1 text-xs font-medium text-brand-700 dark:text-brand-200 hover:bg-brand-100 dark:hover:bg-brand-950 cursor-pointer"
+        @click="editingIdx = editingIdx === idx ? null : idx"
+      >
+        <span class="max-w-[20rem] truncate">{{ summarizeFilter(f) }}</span>
+        <span class="ml-1 text-brand-500 hover:text-brand-700" @click.stop="removeFilter(idx)">
+          <X class="size-3" />
+        </span>
+      </button>
+
+      <!-- Edit popover -->
+      <div
+        v-if="editingIdx === idx"
+        ref="editEl"
+        class="absolute left-0 top-full z-30 mt-1 w-80 max-w-[calc(100vw-2rem)] rounded-lg border border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 p-3 shadow-lg"
+      >
+        <template v-if="definitionMap.get(f.propertyDefinitionId) as PropertyDefinition">
+          <div class="space-y-2">
+            <div class="text-xs font-semibold text-surface-700 dark:text-surface-200">
+              {{ definitionMap.get(f.propertyDefinitionId)!.name }}
+            </div>
+            <select
+              :value="f.op"
+              class="w-full rounded border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2 py-1 text-sm text-surface-900 dark:text-surface-50 focus:border-brand-500 focus:ring-2 focus:ring-brand-500/20 outline-none"
+              @change="(e) => patchFilter(idx, { op: (e.target as HTMLSelectElement).value as PropertyOperator })"
+            >
+              <option v-for="op in operatorsFor(definitionMap.get(f.propertyDefinitionId)!)" :key="op" :value="op">
+                {{ OPERATOR_LABELS[op] }}
+              </option>
+            </select>
+
+            <!-- Value input by op + type -->
+            <template v-if="!['isEmpty', 'isNotEmpty'].includes(f.op)">
+              <!-- select equals -->
+              <select
+                v-if="definitionMap.get(f.propertyDefinitionId)!.type === 'select' && f.op === 'equals'"
+                :value="(f.value as string) ?? ''"
+                class="w-full rounded border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2 py-1 text-sm focus:border-brand-500 focus:ring-2 focus:ring-brand-500/20 outline-none"
+                @change="(e) => patchFilter(idx, { value: (e.target as HTMLSelectElement).value || null })"
+              >
+                <option value="">—</option>
+                <option v-for="opt in ((definitionMap.get(f.propertyDefinitionId)!.config as { options?: { id: string; label: string }[] } | null)?.options ?? [])" :key="opt.id" :value="opt.id">
+                  {{ opt.label }}
+                </option>
+              </select>
+
+              <!-- multi_select in -->
+              <div v-else-if="definitionMap.get(f.propertyDefinitionId)!.type === 'multi_select' && f.op === 'in'" class="flex flex-wrap gap-1">
+                <button
+                  v-for="opt in ((definitionMap.get(f.propertyDefinitionId)!.config as { options?: { id: string; label: string; color: keyof typeof PROPERTY_COLOR_CLASSES }[] } | null)?.options ?? [])"
+                  :key="opt.id"
+                  type="button"
+                  class="cursor-pointer rounded-full px-2 py-0.5 text-xs font-medium transition-opacity"
+                  :class="[PROPERTY_COLOR_CLASSES[opt.color].chip, ((f.value as string[]) ?? []).includes(opt.id) ? '' : 'opacity-50 hover:opacity-100']"
+                  @click="() => {
+                    const arr = ((f.value as string[]) ?? []).slice()
+                    const i = arr.indexOf(opt.id)
+                    if (i >= 0) arr.splice(i, 1); else arr.push(opt.id)
+                    patchFilter(idx, { value: arr })
+                  }"
+                >{{ opt.label }}</button>
+              </div>
+
+              <!-- checkbox equals -->
+              <select
+                v-else-if="definitionMap.get(f.propertyDefinitionId)!.type === 'checkbox'"
+                :value="String(f.value ?? false)"
+                class="w-full rounded border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2 py-1 text-sm focus:border-brand-500 focus:ring-2 focus:ring-brand-500/20 outline-none"
+                @change="(e) => patchFilter(idx, { value: (e.target as HTMLSelectElement).value === 'true' })"
+              >
+                <option value="true">checked</option>
+                <option value="false">unchecked</option>
+              </select>
+
+              <!-- date / number equals -->
+              <input
+                v-else-if="definitionMap.get(f.propertyDefinitionId)!.type === 'date' && f.op === 'equals'"
+                type="date"
+                :value="(f.value as string) ?? ''"
+                class="w-full rounded border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2 py-1 text-sm focus:border-brand-500 focus:ring-2 focus:ring-brand-500/20 outline-none"
+                @change="(e) => patchFilter(idx, { value: (e.target as HTMLInputElement).value || null })"
+              />
+              <input
+                v-else-if="definitionMap.get(f.propertyDefinitionId)!.type === 'number' && f.op === 'equals'"
+                type="number"
+                step="any"
+                :value="(f.value as number) ?? ''"
+                class="w-full rounded border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2 py-1 text-sm focus:border-brand-500 focus:ring-2 focus:ring-brand-500/20 outline-none"
+                @input="(e) => { const v = (e.target as HTMLInputElement).value; patchFilter(idx, { value: v === '' ? null : Number(v) }) }"
+              />
+
+              <!-- default text -->
+              <input
+                v-else
+                type="text"
+                :value="(f.value as string) ?? ''"
+                placeholder="Value"
+                class="w-full rounded border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2 py-1 text-sm focus:border-brand-500 focus:ring-2 focus:ring-brand-500/20 outline-none"
+                @input="(e) => patchFilter(idx, { value: (e.target as HTMLInputElement).value })"
+              />
+            </template>
+          </div>
+        </template>
+      </div>
+    </div>
+
+    <!-- Add filter -->
+    <div class="relative" ref="pickerEl">
+      <button
+        type="button"
+        class="inline-flex items-center gap-1 rounded-full border border-dashed border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2.5 py-1 text-xs font-medium text-surface-500 hover:text-surface-800 hover:border-surface-400 dark:hover:text-surface-100 cursor-pointer"
+        @click="pickerOpen = !pickerOpen"
+      >
+        <component :is="modelValue.length === 0 ? Filter : Plus" class="size-3.5" />
+        {{ modelValue.length === 0 ? 'Filter' : 'Add filter' }}
+      </button>
+      <div
+        v-if="pickerOpen"
+        class="absolute left-0 top-full z-30 mt-1 w-64 max-w-[calc(100vw-2rem)] rounded-lg border border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 shadow-lg"
+      >
+        <div class="max-h-72 overflow-y-auto py-1">
+          <button
+            v-for="def in showableDefs"
+            :key="def.id"
+            type="button"
+            class="flex w-full cursor-pointer items-center justify-between px-3 py-1.5 text-left text-sm hover:bg-surface-100 dark:hover:bg-surface-800"
+            @click="addFilter(def)"
+          >
+            <span class="truncate text-surface-800 dark:text-surface-100">{{ def.name }}</span>
+            <span class="text-[10px] uppercase tracking-wide text-surface-400">{{ def.type }}</span>
+          </button>
+          <div v-if="showableDefs.length === 0" class="px-3 py-2 text-xs text-surface-400">
+            No properties to filter by yet.
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <button
+      v-if="modelValue.length > 0"
+      type="button"
+      class="text-xs text-surface-500 hover:text-surface-800 dark:hover:text-surface-100 cursor-pointer"
+      @click="clearAll"
+    >Clear all</button>
+  </div>
+</template>
diff --git a/app/components/PropertySchemaEditor.vue b/app/components/PropertySchemaEditor.vue
new file mode 100644
index 00000000..b42fa295
--- /dev/null
+++ b/app/components/PropertySchemaEditor.vue
@@ -0,0 +1,416 @@
+<script setup lang="ts">
+import { GripVertical, Pencil, Plus, Trash2, X } from 'lucide-vue-next'
+import {
+  PROPERTY_COLOR_CLASSES,
+  PROPERTY_OPTION_COLORS,
+  PROPERTY_TYPE_LABELS,
+  PROPERTY_TYPES,
+  type PropertyDefinition,
+  type PropertyEntityType,
+  type PropertyOptionColor,
+  type PropertySelectOption,
+  type PropertyType,
+} from '~~/shared/properties'
+
+const props = defineProps<{
+  /** Slide-over visibility. */
+  open: boolean
+  entityType: PropertyEntityType
+  /** When set, edits per-job props for this job; otherwise org-global. */
+  jobId?: string | null
+  /** Optional title override. */
+  title?: string
+}>()
+
+const emit = defineEmits<{ (e: 'close'): void; (e: 'changed'): void }>()
+
+const toast = useToast()
+
+const {
+  definitions,
+  createDefinition,
+  updateDefinition,
+  deleteDefinition,
+  reorderDefinitions,
+  refresh,
+} = useProperties({
+  entityType: () => props.entityType,
+  jobId: () => props.jobId ?? null,
+  jobOnly: () => Boolean(props.jobId),
+})
+
+watch(() => props.open, (isOpen) => {
+  if (isOpen) refresh()
+})
+
+// ─── Form state for create / edit ───
+type FormMode = 'create' | 'edit'
+const formMode = ref<FormMode | null>(null)
+const editingId = ref<string | null>(null)
+const formType = ref<PropertyType>('text')
+const formName = ref('')
+const formDescription = ref('')
+const formOptions = ref<PropertySelectOption[]>([])
+const formNumberFormat = ref<'plain' | 'percent' | 'currency'>('plain')
+const formCurrency = ref('$')
+const formError = ref<string | null>(null)
+const isSaving = ref(false)
+
+function openCreate() {
+  formMode.value = 'create'
+  editingId.value = null
+  formType.value = 'text'
+  formName.value = ''
+  formDescription.value = ''
+  formOptions.value = []
+  formNumberFormat.value = 'plain'
+  formCurrency.value = '$'
+  formError.value = null
+}
+
+function openEdit(def: PropertyDefinition) {
+  formMode.value = 'edit'
+  editingId.value = def.id
+  formType.value = def.type
+  formName.value = def.name
+  formDescription.value = def.description ?? ''
+  const cfg = def.config as { options?: PropertySelectOption[]; format?: 'plain' | 'percent' | 'currency'; currency?: string } | null
+  formOptions.value = cfg?.options ? cfg.options.map((o) => ({ ...o })) : []
+  formNumberFormat.value = cfg?.format ?? 'plain'
+  formCurrency.value = cfg?.currency ?? '$'
+  formError.value = null
+}
+
+function cancelForm() {
+  formMode.value = null
+  editingId.value = null
+}
+
+const supportsOptions = computed(() => formType.value === 'select' || formType.value === 'multi_select')
+const supportsNumberFormat = computed(() => formType.value === 'number')
+
+function addOption() {
+  const id = (typeof crypto !== 'undefined' && crypto.randomUUID) ? crypto.randomUUID() : `${Date.now()}-${Math.random()}`
+  formOptions.value.push({ id, label: '', color: 'gray' })
+}
+
+function removeOption(id: string) {
+  formOptions.value = formOptions.value.filter((o) => o.id !== id)
+}
+
+function buildConfig() {
+  if (supportsOptions.value) {
+    return { options: formOptions.value.filter((o) => o.label.trim().length > 0) }
+  }
+  if (supportsNumberFormat.value) {
+    if (formNumberFormat.value === 'currency') return { format: 'currency', currency: formCurrency.value || '$' }
+    return { format: formNumberFormat.value }
+  }
+  return null
+}
+
+async function submitForm() {
+  formError.value = null
+  if (!formName.value.trim()) {
+    formError.value = 'Name is required'
+    return
+  }
+  isSaving.value = true
+  try {
+    if (formMode.value === 'create') {
+      await createDefinition({
+        entityType: props.entityType,
+        type: formType.value,
+        name: formName.value.trim(),
+        description: formDescription.value.trim() || null,
+        jobId: props.jobId ?? null,
+        config: buildConfig(),
+      })
+    } else if (formMode.value === 'edit' && editingId.value) {
+      await updateDefinition(editingId.value, {
+        name: formName.value.trim(),
+        description: formDescription.value.trim() || null,
+        config: buildConfig(),
+      })
+    }
+    formMode.value = null
+    editingId.value = null
+    emit('changed')
+  } catch (err: unknown) {
+    const message = (err as { data?: { statusMessage?: string }; statusMessage?: string })?.data?.statusMessage
+      ?? (err as { statusMessage?: string }).statusMessage
+      ?? 'Failed to save property'
+    formError.value = message
+  } finally {
+    isSaving.value = false
+  }
+}
+
+const confirmDeleteId = ref<string | null>(null)
+const isDeleting = ref(false)
+
+async function confirmDelete() {
+  if (!confirmDeleteId.value) return
+  isDeleting.value = true
+  try {
+    await deleteDefinition(confirmDeleteId.value)
+    confirmDeleteId.value = null
+    emit('changed')
+  } catch (err: unknown) {
+    const message = (err as { data?: { statusMessage?: string } })?.data?.statusMessage ?? 'Failed to delete'
+    toast.error(message)
+  } finally {
+    isDeleting.value = false
+  }
+}
+
+// ─── Drag-to-reorder ───
+const dragId = ref<string | null>(null)
+
+function onDragStart(id: string) {
+  dragId.value = id
+}
+
+async function onDrop(targetId: string) {
+  if (!dragId.value || dragId.value === targetId) return
+  const ids = definitions.value.map((d) => d.id)
+  const fromIdx = ids.indexOf(dragId.value)
+  const toIdx = ids.indexOf(targetId)
+  if (fromIdx < 0 || toIdx < 0) return
+  ids.splice(toIdx, 0, ids.splice(fromIdx, 1)[0]!)
+  dragId.value = null
+  try {
+    await reorderDefinitions(ids)
+    emit('changed')
+  } catch (err: unknown) {
+    const message = (err as { data?: { statusMessage?: string } })?.data?.statusMessage ?? 'Failed to reorder'
+    toast.error(message)
+  }
+}
+
+const overlayTitle = computed(() => {
+  if (props.title) return props.title
+  const scope = props.jobId ? 'Job-specific' : 'Organization'
+  const noun = props.entityType === 'candidate' ? 'candidate' : 'application'
+  return `${scope} ${noun} properties`
+})
+</script>
+
+<template>
+  <Teleport to="body">
+    <Transition name="fade">
+      <div v-if="open" class="fixed inset-0 z-50 bg-black/40" @click="emit('close')" />
+    </Transition>
+    <Transition name="slide-right">
+      <aside
+        v-if="open"
+        class="fixed right-0 top-0 z-50 flex h-full w-full max-w-md flex-col border-l border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 shadow-2xl"
+      >
+        <header class="flex items-center justify-between border-b border-surface-200 dark:border-surface-800 px-5 py-4">
+          <div class="min-w-0">
+            <h2 class="text-base font-semibold text-surface-900 dark:text-surface-50 truncate">{{ overlayTitle }}</h2>
+            <p class="text-xs text-surface-500 dark:text-surface-400 mt-0.5">
+              {{ jobId ? 'Visible only on applications to this job.' : 'Visible everywhere in your workspace.' }}
+            </p>
+          </div>
+          <button class="rounded p-1.5 text-surface-500 hover:bg-surface-100 dark:hover:bg-surface-800 cursor-pointer" @click="emit('close')">
+            <X class="size-4" />
+          </button>
+        </header>
+
+        <div class="flex-1 overflow-y-auto">
+          <!-- List existing definitions -->
+          <ul class="divide-y divide-surface-100 dark:divide-surface-800">
+            <li
+              v-for="def in definitions"
+              :key="def.id"
+              draggable="true"
+              class="flex items-center gap-2 px-3 py-2 hover:bg-surface-50 dark:hover:bg-surface-800/50"
+              @dragstart="onDragStart(def.id)"
+              @dragover.prevent
+              @drop.prevent="onDrop(def.id)"
+            >
+              <GripVertical class="size-4 text-surface-300 dark:text-surface-600 cursor-grab active:cursor-grabbing" />
+              <div class="min-w-0 flex-1">
+                <div class="flex items-center gap-2">
+                  <span class="text-sm font-medium text-surface-800 dark:text-surface-100 truncate">{{ def.name }}</span>
+                  <span class="rounded bg-surface-100 dark:bg-surface-800 px-1.5 py-0.5 text-[10px] font-medium uppercase tracking-wide text-surface-500 dark:text-surface-400">
+                    {{ PROPERTY_TYPE_LABELS[def.type] }}
+                  </span>
+                </div>
+                <p v-if="def.description" class="text-xs text-surface-500 dark:text-surface-400 truncate mt-0.5">{{ def.description }}</p>
+              </div>
+              <button class="rounded p-1.5 text-surface-400 hover:text-surface-700 hover:bg-surface-100 dark:hover:bg-surface-800 cursor-pointer" @click="openEdit(def)">
+                <Pencil class="size-3.5" />
+              </button>
+              <button class="rounded p-1.5 text-surface-400 hover:text-danger-600 hover:bg-danger-50 dark:hover:bg-danger-950/30 cursor-pointer" @click="confirmDeleteId = def.id">
+                <Trash2 class="size-3.5" />
+              </button>
+            </li>
+          </ul>
+
+          <div v-if="definitions.length === 0 && formMode !== 'create'" class="px-5 py-10 text-center">
+            <p class="text-sm text-surface-500 dark:text-surface-400">No properties yet.</p>
+            <p class="text-xs text-surface-400 dark:text-surface-500 mt-1">Add one to start tracking custom data.</p>
+          </div>
+
+          <!-- Add / edit form -->
+          <div v-if="formMode" class="border-t border-surface-200 dark:border-surface-800 bg-surface-50 dark:bg-surface-950/50 px-5 py-4">
+            <h3 class="text-sm font-semibold text-surface-900 dark:text-surface-100 mb-3">
+              {{ formMode === 'create' ? 'New property' : 'Edit property' }}
+            </h3>
+
+            <div class="space-y-3">
+              <div>
+                <label class="block text-xs font-medium text-surface-600 dark:text-surface-300 mb-1">Name</label>
+                <input
+                  v-model="formName"
+                  type="text"
+                  maxlength="80"
+                  class="w-full rounded border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2.5 py-1.5 text-sm text-surface-900 dark:text-surface-50 focus:border-brand-500 focus:ring-2 focus:ring-brand-500/20 outline-none"
+                />
+              </div>
+
+              <div v-if="formMode === 'create'">
+                <label class="block text-xs font-medium text-surface-600 dark:text-surface-300 mb-1">Type</label>
+                <select
+                  v-model="formType"
+                  class="w-full rounded border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2.5 py-1.5 text-sm text-surface-900 dark:text-surface-50 focus:border-brand-500 focus:ring-2 focus:ring-brand-500/20 outline-none"
+                >
+                  <option v-for="t in PROPERTY_TYPES" :key="t" :value="t">{{ PROPERTY_TYPE_LABELS[t] }}</option>
+                </select>
+                <p class="text-[11px] text-surface-400 mt-1">Type cannot be changed after creation.</p>
+              </div>
+
+              <div>
+                <label class="block text-xs font-medium text-surface-600 dark:text-surface-300 mb-1">Description (optional)</label>
+                <input
+                  v-model="formDescription"
+                  type="text"
+                  maxlength="500"
+                  class="w-full rounded border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2.5 py-1.5 text-sm text-surface-900 dark:text-surface-50 focus:border-brand-500 focus:ring-2 focus:ring-brand-500/20 outline-none"
+                />
+              </div>
+
+              <!-- Number format -->
+              <div v-if="supportsNumberFormat">
+                <label class="block text-xs font-medium text-surface-600 dark:text-surface-300 mb-1">Format</label>
+                <div class="flex items-center gap-2">
+                  <select
+                    v-model="formNumberFormat"
+                    class="rounded border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2 py-1 text-sm focus:border-brand-500 focus:ring-2 focus:ring-brand-500/20 outline-none"
+                  >
+                    <option value="plain">Plain</option>
+                    <option value="percent">Percent</option>
+                    <option value="currency">Currency</option>
+                  </select>
+                  <input
+                    v-if="formNumberFormat === 'currency'"
+                    v-model="formCurrency"
+                    type="text"
+                    maxlength="8"
+                    placeholder="$"
+                    class="w-20 rounded border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2 py-1 text-sm focus:border-brand-500 focus:ring-2 focus:ring-brand-500/20 outline-none"
+                  />
+                </div>
+              </div>
+
+              <!-- Options editor -->
+              <div v-if="supportsOptions">
+                <label class="block text-xs font-medium text-surface-600 dark:text-surface-300 mb-1">Options</label>
+                <ul class="space-y-1.5">
+                  <li v-for="opt in formOptions" :key="opt.id" class="flex items-center gap-1.5">
+                    <select
+                      v-model="opt.color"
+                      class="shrink-0 rounded border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-1 py-0.5 text-xs focus:border-brand-500 focus:ring-2 focus:ring-brand-500/20 outline-none"
+                    >
+                      <option v-for="c in PROPERTY_OPTION_COLORS" :key="c" :value="c">{{ c }}</option>
+                    </select>
+                    <input
+                      v-model="opt.label"
+                      type="text"
+                      maxlength="80"
+                      class="flex-1 min-w-0 rounded border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2 py-1 text-sm focus:border-brand-500 focus:ring-2 focus:ring-brand-500/20 outline-none"
+                      placeholder="Option label"
+                    />
+                    <span class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium" :class="PROPERTY_COLOR_CLASSES[opt.color as PropertyOptionColor].chip">
+                      {{ opt.label || '—' }}
+                    </span>
+                    <button class="rounded p-1 text-surface-400 hover:text-danger-600 hover:bg-danger-50 dark:hover:bg-danger-950/30 cursor-pointer" @click="removeOption(opt.id)">
+                      <X class="size-3.5" />
+                    </button>
+                  </li>
+                </ul>
+                <button
+                  type="button"
+                  class="mt-2 inline-flex items-center gap-1 text-xs text-brand-600 hover:text-brand-700 cursor-pointer"
+                  @click="addOption"
+                >
+                  <Plus class="size-3.5" /> Add option
+                </button>
+              </div>
+
+              <p v-if="formError" class="text-xs text-danger-600">{{ formError }}</p>
+
+              <div class="flex items-center justify-end gap-2 pt-1">
+                <button
+                  type="button"
+                  class="rounded px-3 py-1.5 text-xs text-surface-600 hover:bg-surface-100 dark:hover:bg-surface-800 cursor-pointer"
+                  @click="cancelForm"
+                >Cancel</button>
+                <button
+                  type="button"
+                  :disabled="isSaving"
+                  class="rounded bg-brand-600 px-3 py-1.5 text-xs font-medium text-white hover:bg-brand-700 disabled:opacity-50 disabled:cursor-not-allowed cursor-pointer"
+                  @click="submitForm"
+                >{{ isSaving ? 'Saving…' : (formMode === 'create' ? 'Create' : 'Save') }}</button>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <footer v-if="!formMode" class="border-t border-surface-200 dark:border-surface-800 px-5 py-3">
+          <button
+            type="button"
+            class="inline-flex w-full items-center justify-center gap-1.5 rounded-md border border-dashed border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-3 py-2 text-sm font-medium text-surface-600 dark:text-surface-300 hover:border-brand-400 hover:text-brand-700 dark:hover:text-brand-300 cursor-pointer"
+            @click="openCreate"
+          >
+            <Plus class="size-4" /> Add property
+          </button>
+        </footer>
+      </aside>
+    </Transition>
+
+    <!-- Delete confirmation -->
+    <Transition name="fade">
+      <div v-if="confirmDeleteId" class="fixed inset-0 z-[60] flex items-center justify-center">
+        <div class="absolute inset-0 bg-black/50" @click="confirmDeleteId = null" />
+        <div class="relative bg-white dark:bg-surface-900 rounded-xl shadow-xl p-6 max-w-sm w-full mx-4">
+          <h3 class="text-base font-semibold text-surface-900 dark:text-surface-50 mb-2">Delete property?</h3>
+          <p class="text-sm text-surface-600 dark:text-surface-300 mb-4">
+            This deletes the property and removes it from all rows. This cannot be undone.
+          </p>
+          <div class="flex justify-end gap-2">
+            <button
+              class="rounded px-3 py-1.5 text-sm text-surface-600 hover:bg-surface-100 dark:hover:bg-surface-800 cursor-pointer"
+              :disabled="isDeleting"
+              @click="confirmDeleteId = null"
+            >Cancel</button>
+            <button
+              class="rounded bg-danger-600 px-3 py-1.5 text-sm font-medium text-white hover:bg-danger-700 disabled:opacity-50 cursor-pointer"
+              :disabled="isDeleting"
+              @click="confirmDelete"
+            >{{ isDeleting ? 'Deleting…' : 'Delete' }}</button>
+          </div>
+        </div>
+      </div>
+    </Transition>
+  </Teleport>
+</template>
+
+<style scoped>
+.fade-enter-active, .fade-leave-active { transition: opacity 0.18s ease; }
+.fade-enter-from, .fade-leave-to { opacity: 0; }
+.slide-right-enter-active, .slide-right-leave-active { transition: transform 0.22s ease; }
+.slide-right-enter-from, .slide-right-leave-to { transform: translateX(100%); }
+</style>
diff --git a/app/components/PropertyTableCell.vue b/app/components/PropertyTableCell.vue
new file mode 100644
index 00000000..5614ad79
--- /dev/null
+++ b/app/components/PropertyTableCell.vue
@@ -0,0 +1,69 @@
+<script setup lang="ts">
+import type { PropertyDefinition, PropertyEntityType, PropertyEntry } from '~~/shared/properties'
+
+/**
+ * PropertyTableCell — inline-editable property cell for list/table views.
+ *
+ * Wraps PropertyValueEditor with per-row optimistic mutations so that editing
+ * a property value in the table doesn't require a full page refresh.
+ * Click events are stopped to prevent row navigation while editing.
+ */
+
+const props = defineProps<{
+  entityType: PropertyEntityType
+  entityId: string
+  definition: PropertyDefinition
+  value: unknown
+}>()
+
+const toast = useToast()
+const { handlePreviewReadOnlyError } = usePreviewReadOnly()
+
+// Local single-entry ref for useEntityPropertyMutations
+const localEntries = ref<PropertyEntry[]>([
+  { definition: props.definition, value: props.value },
+])
+
+// Keep in sync if parent data refreshes
+watch(
+  () => props.value,
+  (next) => {
+    localEntries.value = [{ definition: props.definition, value: next }]
+  },
+)
+
+const { setValue } = useEntityPropertyMutations({
+  entityType: props.entityType,
+  entityId: () => props.entityId,
+  entries: localEntries,
+})
+
+const savingId = ref<string | null>(null)
+
+async function handleUpdate(value: unknown) {
+  savingId.value = props.definition.id
+  try {
+    await setValue(props.definition.id, value)
+  } catch (err: unknown) {
+    if (handlePreviewReadOnlyError(err)) return
+    const message = (err as { data?: { statusMessage?: string } })?.data?.statusMessage ?? 'Failed to save'
+    toast.error(message)
+  } finally {
+    savingId.value = null
+  }
+}
+
+const currentValue = computed(() => localEntries.value[0]?.value ?? null)
+</script>
+
+<template>
+  <!-- stop click so row navigation doesn't fire when editing -->
+  <div @click.stop>
+    <PropertyValueEditor
+      :definition="definition"
+      :model-value="currentValue"
+      :saving="savingId === definition.id"
+      @update="handleUpdate"
+    />
+  </div>
+</template>
diff --git a/app/components/PropertyValueDisplay.vue b/app/components/PropertyValueDisplay.vue
new file mode 100644
index 00000000..39e828ee
--- /dev/null
+++ b/app/components/PropertyValueDisplay.vue
@@ -0,0 +1,143 @@
+<script setup lang="ts">
+import {
+  AlignLeft, Calendar, CheckSquare, CircleDot, Hash, Link as LinkIcon,
+  List, Mail, Paperclip, Text as TextIcon, User,
+} from 'lucide-vue-next'
+import {
+  PROPERTY_COLOR_CLASSES,
+  type PropertyDefinition,
+  type PropertyType,
+} from '~~/shared/properties'
+
+const props = defineProps<{
+  definition: PropertyDefinition
+  value: unknown
+  /** Truncate single-line values when shown in dense places (lists, chips). */
+  compact?: boolean
+}>()
+
+const ICON_MAP: Record<PropertyType, unknown> = {
+  text: TextIcon,
+  long_text: AlignLeft,
+  number: Hash,
+  select: CircleDot,
+  multi_select: List,
+  date: Calendar,
+  checkbox: CheckSquare,
+  url: LinkIcon,
+  email: Mail,
+  person: User,
+  file: Paperclip,
+}
+
+const isEmpty = computed(() => {
+  const v = props.value
+  if (v === null || v === undefined || v === '') return true
+  if (Array.isArray(v) && v.length === 0) return true
+  return false
+})
+
+const config = computed(() => props.definition.config as { options?: { id: string; label: string; color: keyof typeof PROPERTY_COLOR_CLASSES }[]; format?: 'plain' | 'percent' | 'currency'; currency?: string } | null)
+
+const numberDisplay = computed(() => {
+  if (props.definition.type !== 'number') return ''
+  const n = Number(props.value)
+  if (!Number.isFinite(n)) return ''
+  const cfg = config.value
+  if (cfg?.format === 'percent') return `${n}%`
+  if (cfg?.format === 'currency') return `${cfg.currency ?? '$'}${n.toLocaleString()}`
+  return n.toLocaleString()
+})
+
+const selectOption = computed(() => {
+  if (props.definition.type !== 'select') return null
+  const id = props.value as string
+  return config.value?.options?.find((o) => o.id === id) ?? null
+})
+
+const multiSelectOptions = computed(() => {
+  if (props.definition.type !== 'multi_select') return []
+  const ids = (props.value as string[]) ?? []
+  return ids
+    .map((id) => config.value?.options?.find((o) => o.id === id))
+    .filter((o): o is NonNullable<typeof o> => Boolean(o))
+})
+
+const dateDisplay = computed(() => {
+  if (props.definition.type !== 'date') return ''
+  if (typeof props.value !== 'string') return ''
+  const d = new Date(`${props.value}T00:00:00`)
+  if (isNaN(d.getTime())) return props.value
+  return d.toLocaleDateString(undefined, { year: 'numeric', month: 'short', day: 'numeric' })
+})
+
+defineExpose({ icon: ICON_MAP[props.definition.type] })
+</script>
+
+<template>
+  <span class="inline-flex min-w-0 items-center gap-1.5 text-sm">
+    <span v-if="isEmpty" class="text-surface-300 dark:text-surface-600 select-none" aria-label="Empty">—</span>
+
+    <!-- text / long_text / person -->
+    <span
+      v-else-if="definition.type === 'text' || definition.type === 'long_text' || definition.type === 'person'"
+      class="text-surface-800 dark:text-surface-100"
+      :class="compact ? 'truncate' : 'whitespace-pre-wrap'"
+    >{{ value }}</span>
+
+    <!-- number -->
+    <span v-else-if="definition.type === 'number'" class="font-mono tabular-nums text-surface-800 dark:text-surface-100">
+      {{ numberDisplay }}
+    </span>
+
+    <!-- checkbox -->
+    <span v-else-if="definition.type === 'checkbox'" class="text-surface-800 dark:text-surface-100">
+      <CheckSquare v-if="value" class="size-4 text-green-600" />
+      <span v-else class="size-4 inline-block rounded border border-surface-300 dark:border-surface-700" />
+    </span>
+
+    <!-- date -->
+    <span v-else-if="definition.type === 'date'" class="text-surface-800 dark:text-surface-100">{{ dateDisplay }}</span>
+
+    <!-- url -->
+    <a
+      v-else-if="definition.type === 'url'"
+      :href="(value as string)"
+      target="_blank"
+      rel="noopener noreferrer"
+      class="text-brand-600 hover:underline truncate"
+      @click.stop
+    >{{ value }}</a>
+
+    <!-- email -->
+    <a
+      v-else-if="definition.type === 'email'"
+      :href="`mailto:${value}`"
+      class="text-brand-600 hover:underline truncate"
+      @click.stop
+    >{{ value }}</a>
+
+    <!-- select -->
+    <span
+      v-else-if="definition.type === 'select' && selectOption"
+      class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium"
+      :class="PROPERTY_COLOR_CLASSES[selectOption.color].chip"
+    >{{ selectOption.label }}</span>
+
+    <!-- multi_select -->
+    <span v-else-if="definition.type === 'multi_select'" class="flex flex-wrap items-center gap-1">
+      <span
+        v-for="opt in multiSelectOptions"
+        :key="opt.id"
+        class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium"
+        :class="PROPERTY_COLOR_CLASSES[opt.color].chip"
+      >{{ opt.label }}</span>
+    </span>
+
+    <!-- file -->
+    <span v-else-if="definition.type === 'file'" class="inline-flex items-center gap-1 text-surface-700 dark:text-surface-200">
+      <Paperclip class="size-3.5" />
+      <span class="truncate">Attached</span>
+    </span>
+  </span>
+</template>
diff --git a/app/components/PropertyValueEditor.vue b/app/components/PropertyValueEditor.vue
new file mode 100644
index 00000000..092c48d2
--- /dev/null
+++ b/app/components/PropertyValueEditor.vue
@@ -0,0 +1,326 @@
+<script setup lang="ts">
+import { Check, X } from 'lucide-vue-next'
+import {
+  PROPERTY_COLOR_CLASSES,
+  type PropertyDefinition,
+} from '~~/shared/properties'
+
+/**
+ * PropertyValueEditor — inline-editable cell for a single property value.
+ *
+ * UX:
+ *  - Renders PropertyValueDisplay when not editing (click to edit).
+ *  - Single-line types commit on Enter/blur, cancel on Escape.
+ *  - Multi-line and option pickers use a popover that closes on outside click.
+ *  - Disabled mode renders read-only display only (e.g. for question responses).
+ */
+
+const props = defineProps<{
+  definition: PropertyDefinition
+  modelValue: unknown
+  /** When true, becomes a non-clickable display. */
+  readOnly?: boolean
+  /** Visual hint that mutation is in flight. */
+  saving?: boolean
+}>()
+
+const emit = defineEmits<{
+  (e: 'update', value: unknown): void
+}>()
+
+type Cfg = {
+  options?: { id: string; label: string; color: keyof typeof PROPERTY_COLOR_CLASSES }[]
+  format?: 'plain' | 'percent' | 'currency'
+  currency?: string
+} | null
+
+const config = computed<Cfg>(() => props.definition.config as Cfg)
+
+const editing = ref(false)
+const draft = ref<unknown>(null)
+const inputEl = ref<HTMLElement | null>(null)
+const rootEl = ref<HTMLElement | null>(null)
+
+// Popover positioning (Teleported to body to escape `overflow:hidden/auto`
+// ancestors such as the table wrapper).
+const popoverStyle = ref<Record<string, string>>({})
+const POPOVER_WIDTH = 256 // matches w-64
+
+function updatePopoverPosition() {
+  if (!rootEl.value || !import.meta.client) return
+  const rect = rootEl.value.getBoundingClientRect()
+  const vw = window.innerWidth
+  const vh = window.innerHeight
+  // Prefer rendering below; flip up if not enough space
+  const estimatedHeight = 280 // max-h-64 + padding
+  const renderAbove = rect.bottom + estimatedHeight > vh && rect.top > estimatedHeight
+  // Keep within viewport horizontally
+  const left = Math.min(Math.max(8, rect.left), vw - POPOVER_WIDTH - 8)
+  if (renderAbove) {
+    // Anchor the *bottom* of the popover just above the trigger so the actual
+    // rendered height (which may be shorter than the estimate) doesn't cause
+    // the menu to float too far away.
+    popoverStyle.value = {
+      position: 'fixed',
+      bottom: `${Math.max(8, vh - rect.top + 4)}px`,
+      left: `${left}px`,
+      width: `${POPOVER_WIDTH}px`,
+      zIndex: '50',
+    }
+  } else {
+    popoverStyle.value = {
+      position: 'fixed',
+      top: `${rect.bottom + 4}px`,
+      left: `${left}px`,
+      width: `${POPOVER_WIDTH}px`,
+      zIndex: '50',
+    }
+  }
+}
+
+function startEdit() {
+  if (props.readOnly) return
+  if (editing.value) return // already open (e.g. popover types keep the display visible)
+  draft.value = cloneDraft(props.modelValue)
+  editing.value = true
+  nextTick(() => {
+    const el = inputEl.value as HTMLInputElement | HTMLTextAreaElement | null
+    el?.focus()
+    if (el && 'select' in el && typeof el.select === 'function') el.select()
+    if (props.definition.type === 'select' || props.definition.type === 'multi_select') {
+      updatePopoverPosition()
+    }
+  })
+}
+
+function cloneDraft(v: unknown): unknown {
+  if (Array.isArray(v)) return [...v]
+  return v ?? null
+}
+
+function commit(value?: unknown) {
+  const next = arguments.length > 0 ? value : draft.value
+  editing.value = false
+  // Normalize empties for clear-on-save UX
+  const cleaned =
+    next === '' || (Array.isArray(next) && next.length === 0) ? null : next
+  // Only emit if changed
+  if (JSON.stringify(cleaned ?? null) !== JSON.stringify(props.modelValue ?? null)) {
+    emit('update', cleaned)
+  }
+}
+
+function cancel() {
+  editing.value = false
+}
+
+// Outside click handling for popover-style editors
+function onDocPointerDown(e: PointerEvent) {
+  if (!editing.value || !rootEl.value) return
+  const target = e.target as Node | null
+  if (!target) return
+  if (rootEl.value.contains(target)) return
+  // Also ignore clicks inside the teleported popover (which lives outside rootEl).
+  const popover = document.querySelector('[data-property-popover="true"]')
+  if (popover && popover.contains(target)) return
+  commit()
+}
+
+function onWindowReposition() {
+  if (editing.value && (props.definition.type === 'select' || props.definition.type === 'multi_select')) {
+    updatePopoverPosition()
+  }
+}
+
+watchEffect((onCleanup) => {
+  if (editing.value && import.meta.client) {
+    document.addEventListener('pointerdown', onDocPointerDown, true)
+    window.addEventListener('scroll', onWindowReposition, true)
+    window.addEventListener('resize', onWindowReposition)
+    onCleanup(() => {
+      document.removeEventListener('pointerdown', onDocPointerDown, true)
+      window.removeEventListener('scroll', onWindowReposition, true)
+      window.removeEventListener('resize', onWindowReposition)
+    })
+  }
+})
+
+function onKey(e: KeyboardEvent) {
+  if (e.key === 'Escape') {
+    e.preventDefault()
+    cancel()
+  } else if (e.key === 'Enter' && !e.shiftKey && props.definition.type !== 'long_text') {
+    e.preventDefault()
+    commit()
+  }
+}
+
+// Multi-select toggle
+function toggleMultiSelect(optionId: string) {
+  const arr = Array.isArray(draft.value) ? [...(draft.value as string[])] : []
+  const idx = arr.indexOf(optionId)
+  if (idx >= 0) arr.splice(idx, 1)
+  else arr.push(optionId)
+  draft.value = arr
+}
+
+const isCheckboxType = computed(() => props.definition.type === 'checkbox')
+const isPopoverType = computed(
+  () => props.definition.type === 'select' || props.definition.type === 'multi_select',
+)
+</script>
+
+<template>
+  <!-- Checkbox: instant toggle, no edit mode -->
+  <div
+    v-if="isCheckboxType"
+    class="inline-flex items-center"
+  >
+    <button
+      type="button"
+      :disabled="readOnly || saving"
+      class="flex size-5 cursor-pointer items-center justify-center rounded border transition-colors disabled:cursor-not-allowed"
+      :class="modelValue
+        ? 'bg-brand-600 border-brand-600 hover:bg-brand-700 hover:border-brand-700'
+        : 'border-surface-300 dark:border-surface-600 hover:border-surface-400 dark:hover:border-surface-500'"
+      @click="emit('update', !modelValue)"
+    >
+      <Check v-if="modelValue" class="size-3.5 text-white" />
+    </button>
+  </div>
+
+  <div v-else ref="rootEl" class="relative w-full min-w-0">
+    <!-- Display mode (also stays visible while a teleported popover is open). -->
+    <button
+      v-if="!editing || isPopoverType"
+      type="button"
+      :disabled="readOnly"
+      class="group block w-full min-w-0 cursor-text rounded px-2 py-1 text-left transition-colors hover:bg-surface-100/80 dark:hover:bg-surface-800/50 disabled:cursor-default disabled:hover:bg-transparent"
+      :class="[{ 'opacity-60': saving }, editing && isPopoverType ? 'ring-2 ring-brand-500/30' : '']"
+      @click="startEdit"
+    >
+      <PropertyValueDisplay :definition="definition" :value="modelValue" />
+    </button>
+
+    <!-- Edit mode -->
+    <template v-if="editing">
+      <!-- Single-line text / url / email / person -->
+      <input
+        v-if="['text', 'url', 'email', 'person'].includes(definition.type)"
+        ref="inputEl"
+        v-model="draft as string"
+        :type="definition.type === 'email' ? 'email' : definition.type === 'url' ? 'url' : 'text'"
+        class="w-full min-w-0 rounded border border-brand-500 bg-white dark:bg-surface-900 px-2 py-1 text-sm text-surface-900 dark:text-surface-50 outline-none ring-2 ring-brand-500/20"
+        :placeholder="definition.type === 'url' ? 'https://…' : ''"
+        @keydown="onKey"
+        @blur="commit()"
+      />
+
+      <!-- Long text -->
+      <textarea
+        v-else-if="definition.type === 'long_text'"
+        ref="inputEl"
+        v-model="draft as string"
+        rows="3"
+        class="w-full min-w-0 rounded border border-brand-500 bg-white dark:bg-surface-900 px-2 py-1.5 text-sm text-surface-900 dark:text-surface-50 outline-none ring-2 ring-brand-500/20"
+        @keydown="onKey"
+        @blur="commit()"
+      />
+
+      <!-- Number -->
+      <input
+        v-else-if="definition.type === 'number'"
+        ref="inputEl"
+        :value="draft"
+        type="number"
+        step="any"
+        class="w-full min-w-0 rounded border border-brand-500 bg-white dark:bg-surface-900 px-2 py-1 text-sm tabular-nums text-surface-900 dark:text-surface-50 outline-none ring-2 ring-brand-500/20"
+        @input="(e) => { const v = (e.target as HTMLInputElement).value; draft = v === '' ? null : Number(v) }"
+        @keydown="onKey"
+        @blur="commit()"
+      />
+
+      <!-- Date -->
+      <input
+        v-else-if="definition.type === 'date'"
+        ref="inputEl"
+        v-model="draft as string"
+        type="date"
+        class="w-full min-w-0 rounded border border-brand-500 bg-white dark:bg-surface-900 px-2 py-1 text-sm text-surface-900 dark:text-surface-50 outline-none ring-2 ring-brand-500/20"
+        @keydown="onKey"
+        @blur="commit()"
+      />
+
+      <!-- Select: popover with options (teleported to body to avoid table clipping) -->
+      <Teleport v-else-if="definition.type === 'select'" to="body">
+        <div
+          data-property-popover="true"
+          :style="popoverStyle"
+          class="rounded-lg border border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 shadow-lg"
+        >
+          <div class="max-h-64 overflow-y-auto py-1">
+            <button
+              v-for="opt in (config?.options ?? [])"
+              :key="opt.id"
+              type="button"
+              class="flex w-full cursor-pointer items-center gap-2 px-3 py-1.5 text-left text-sm hover:bg-surface-100 dark:hover:bg-surface-800"
+              @click="commit(opt.id)"
+            >
+              <span class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium" :class="PROPERTY_COLOR_CLASSES[opt.color].chip">
+                {{ opt.label }}
+              </span>
+              <Check v-if="opt.id === modelValue" class="ml-auto size-3.5 text-brand-600" />
+            </button>
+            <button
+              v-if="modelValue"
+              type="button"
+              class="flex w-full cursor-pointer items-center gap-2 border-t border-surface-100 dark:border-surface-800 px-3 py-1.5 text-left text-xs text-surface-500 hover:bg-surface-100 dark:hover:bg-surface-800"
+              @click="commit(null)"
+            >
+              <X class="size-3.5" /> Clear
+            </button>
+            <div v-if="(config?.options ?? []).length === 0" class="px-3 py-2 text-xs text-surface-400">
+              No options yet — add some in the schema editor.
+            </div>
+          </div>
+        </div>
+      </Teleport>
+
+      <!-- Multi-select: popover with toggleable chips (teleported to body) -->
+      <Teleport v-else-if="definition.type === 'multi_select'" to="body">
+        <div
+          data-property-popover="true"
+          :style="popoverStyle"
+          class="rounded-lg border border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 shadow-lg"
+        >
+          <div class="max-h-64 overflow-y-auto py-1">
+            <button
+              v-for="opt in (config?.options ?? [])"
+              :key="opt.id"
+              type="button"
+              class="flex w-full cursor-pointer items-center gap-2 px-3 py-1.5 text-left text-sm hover:bg-surface-100 dark:hover:bg-surface-800"
+              @click="toggleMultiSelect(opt.id)"
+            >
+              <span class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium" :class="PROPERTY_COLOR_CLASSES[opt.color].chip">
+                {{ opt.label }}
+              </span>
+              <Check v-if="(draft as string[] | null)?.includes(opt.id)" class="ml-auto size-3.5 text-brand-600" />
+            </button>
+            <div v-if="(config?.options ?? []).length === 0" class="px-3 py-2 text-xs text-surface-400">
+              No options yet — add some in the schema editor.
+            </div>
+          </div>
+          <div class="flex items-center justify-end gap-2 border-t border-surface-100 dark:border-surface-800 px-2 py-1.5">
+            <button type="button" class="text-xs text-surface-500 hover:text-surface-700 cursor-pointer" @click="cancel">Cancel</button>
+            <button type="button" class="rounded bg-brand-600 px-2 py-1 text-xs font-medium text-white hover:bg-brand-700 cursor-pointer" @click="commit()">Done</button>
+          </div>
+        </div>
+      </Teleport>
+
+      <!-- File: not editable inline (use Documents flow) -->
+      <div v-else-if="definition.type === 'file'" class="text-xs text-surface-400 italic px-2 py-1">
+        File properties are managed via Documents.
+      </div>
+    </template>
+  </div>
+</template>
diff --git a/app/components/SavedViewsMenu.vue b/app/components/SavedViewsMenu.vue
new file mode 100644
index 00000000..2c3cd96c
--- /dev/null
+++ b/app/components/SavedViewsMenu.vue
@@ -0,0 +1,227 @@
+<script setup lang="ts" generic="T extends Record<string, unknown>">
+import { Bookmark, Star, Trash2, Plus, Check, ChevronDown } from 'lucide-vue-next'
+import type { SavedView } from '~/composables/useSavedViews'
+
+const props = defineProps<{
+  views: SavedView<T>[]
+  activeViewId: string | null
+  /** Whether current settings differ from the active view (i.e. unsaved edits). */
+  isDirty?: boolean
+}>()
+
+const emit = defineEmits<{
+  'select': [id: string | null]
+  'save': [name: string]
+  'update': [id: string]
+  'delete': [id: string]
+  'set-default': [id: string | null]
+}>()
+
+const open = ref(false)
+const rootRef = ref<HTMLElement | null>(null)
+
+const showSaveForm = ref(false)
+const newName = ref('')
+const nameInput = ref<HTMLInputElement | null>(null)
+
+const activeView = computed(() => props.views.find(v => v.id === props.activeViewId) ?? null)
+
+const buttonLabel = computed(() => {
+  if (activeView.value) return activeView.value.name
+  return 'Views'
+})
+
+function toggle() {
+  open.value = !open.value
+  if (!open.value) showSaveForm.value = false
+}
+
+function close() {
+  open.value = false
+  showSaveForm.value = false
+  newName.value = ''
+}
+
+function handleOutside(e: MouseEvent) {
+  if (rootRef.value && !rootRef.value.contains(e.target as Node)) close()
+}
+
+function onKeydown(e: KeyboardEvent) {
+  if (e.key === 'Escape' && open.value) close()
+}
+
+onMounted(() => {
+  document.addEventListener('mousedown', handleOutside)
+  document.addEventListener('keydown', onKeydown)
+})
+onUnmounted(() => {
+  document.removeEventListener('mousedown', handleOutside)
+  document.removeEventListener('keydown', onKeydown)
+})
+
+function selectView(id: string | null) {
+  emit('select', id)
+  close()
+}
+
+async function openSaveForm() {
+  showSaveForm.value = true
+  newName.value = activeView.value?.name ? `${activeView.value.name} (copy)` : `View ${props.views.length + 1}`
+  await nextTick()
+  nameInput.value?.focus()
+  nameInput.value?.select()
+}
+
+function submitSave() {
+  const name = newName.value.trim()
+  if (!name) return
+  emit('save', name)
+  close()
+}
+
+function onUpdate(id: string, e: Event) {
+  e.stopPropagation()
+  emit('update', id)
+  close()
+}
+
+function onSetDefault(id: string, isDefault: boolean | undefined, e: Event) {
+  e.stopPropagation()
+  emit('set-default', isDefault ? null : id)
+}
+
+function onDelete(id: string, e: Event) {
+  e.stopPropagation()
+  emit('delete', id)
+}
+</script>
+
+<template>
+  <div ref="rootRef" class="relative inline-block">
+    <button
+      type="button"
+      class="inline-flex items-center gap-1.5 rounded-lg border px-3 py-2 text-sm font-medium transition-colors"
+      :class="activeViewId
+        ? 'border-brand-300 bg-brand-50 text-brand-700 dark:border-brand-700 dark:bg-brand-950 dark:text-brand-300'
+        : 'border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 text-surface-600 dark:text-surface-400 hover:bg-surface-50 dark:hover:bg-surface-800'"
+      :aria-expanded="open"
+      aria-haspopup="menu"
+      @click="toggle"
+    >
+      <Bookmark class="size-4" :class="activeView?.isDefault ? 'fill-current text-amber-500' : ''" />
+      <span class="max-w-[160px] truncate">{{ buttonLabel }}</span>
+      <span
+        v-if="isDirty && activeViewId"
+        class="size-1.5 rounded-full bg-amber-500"
+        title="Unsaved changes"
+      />
+      <ChevronDown class="size-3.5 opacity-60" />
+    </button>
+
+    <!-- Dropdown -->
+    <div
+      v-if="open"
+      class="absolute left-0 top-full mt-1.5 z-30 w-72 rounded-xl border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 shadow-xl overflow-hidden"
+      role="menu"
+    >
+      <!-- "All / no view" -->
+      <button
+        type="button"
+        class="w-full flex items-center gap-2 px-3 py-2 text-sm text-left transition-colors"
+        :class="!activeViewId
+          ? 'bg-brand-50 dark:bg-brand-950 text-brand-700 dark:text-brand-300'
+          : 'text-surface-700 dark:text-surface-300 hover:bg-surface-50 dark:hover:bg-surface-800'"
+        @click="selectView(null)"
+      >
+        <Check class="size-3.5" :class="!activeViewId ? '' : 'opacity-0'" />
+        <span class="flex-1">All (no view)</span>
+      </button>
+
+      <!-- Saved views -->
+      <div v-if="views.length > 0" class="max-h-72 overflow-y-auto border-t border-surface-100 dark:border-surface-800">
+        <div
+          v-for="v in views"
+          :key="v.id"
+          class="group flex items-center gap-1 pl-3 pr-1.5 py-1.5 text-sm transition-colors"
+          :class="activeViewId === v.id
+            ? 'bg-brand-50 dark:bg-brand-950'
+            : 'hover:bg-surface-50 dark:hover:bg-surface-800'"
+        >
+          <button
+            type="button"
+            class="flex-1 flex items-center gap-2 text-left min-w-0 py-0.5"
+            :class="activeViewId === v.id ? 'text-brand-700 dark:text-brand-300' : 'text-surface-700 dark:text-surface-300'"
+            @click="selectView(v.id)"
+          >
+            <Check class="size-3.5 shrink-0" :class="activeViewId === v.id ? '' : 'opacity-0'" />
+            <Star
+              v-if="v.isDefault"
+              class="size-3.5 shrink-0 text-amber-500 fill-current"
+              title="Default view"
+            />
+            <span class="truncate flex-1">{{ v.name }}</span>
+          </button>
+
+          <!-- Save changes -->
+          <button
+            v-if="activeViewId === v.id && isDirty"
+            type="button"
+            class="rounded p-1 text-surface-400 hover:text-success-600 hover:bg-success-50 dark:hover:bg-success-950 transition-colors"
+            title="Save current changes to this view"
+            @click="(e) => onUpdate(v.id, e)"
+          >
+            <Check class="size-3.5" />
+          </button>
+          <!-- Set default -->
+          <button
+            type="button"
+            class="rounded p-1 text-surface-400 hover:bg-surface-100 dark:hover:bg-surface-800 transition-colors"
+            :class="v.isDefault ? 'text-amber-500' : 'opacity-0 group-hover:opacity-100 hover:text-amber-500'"
+            :title="v.isDefault ? 'Remove as default' : 'Set as default'"
+            @click="(e) => onSetDefault(v.id, v.isDefault, e)"
+          >
+            <Star class="size-3.5" :class="v.isDefault ? 'fill-current' : ''" />
+          </button>
+          <!-- Delete -->
+          <button
+            type="button"
+            class="rounded p-1 text-surface-400 hover:text-danger-600 hover:bg-danger-50 dark:hover:bg-danger-950 transition-colors opacity-0 group-hover:opacity-100"
+            title="Delete view"
+            @click="(e) => onDelete(v.id, e)"
+          >
+            <Trash2 class="size-3.5" />
+          </button>
+        </div>
+      </div>
+
+      <!-- Footer: save form -->
+      <div class="border-t border-surface-100 dark:border-surface-800 bg-surface-50/60 dark:bg-surface-800/40 p-2">
+        <form v-if="showSaveForm" class="flex items-center gap-1.5" @submit.prevent="submitSave">
+          <input
+            ref="nameInput"
+            v-model="newName"
+            type="text"
+            placeholder="View name"
+            maxlength="60"
+            class="flex-1 rounded-md border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-900 px-2.5 py-1.5 text-sm text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500"
+            @keydown.escape.prevent="showSaveForm = false; newName = ''"
+          />
+          <button
+            type="submit"
+            :disabled="!newName.trim()"
+            class="rounded-md bg-brand-600 px-3 py-1.5 text-sm font-medium text-white hover:bg-brand-700 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
+          >Save</button>
+        </form>
+        <button
+          v-else
+          type="button"
+          class="w-full flex items-center justify-center gap-1.5 rounded-md py-1.5 text-sm font-medium text-brand-600 dark:text-brand-400 hover:bg-brand-50 dark:hover:bg-brand-950 transition-colors"
+          @click="openSaveForm"
+        >
+          <Plus class="size-3.5" />
+          {{ activeViewId && isDirty ? 'Save as new view' : 'Save current view' }}
+        </button>
+      </div>
+    </div>
+  </div>
+</template>
diff --git a/app/composables/useApplications.ts b/app/composables/useApplications.ts
index a5658da3..3f53b207 100644
--- a/app/composables/useApplications.ts
+++ b/app/composables/useApplications.ts
@@ -1,5 +1,6 @@
 import type { Ref } from 'vue'
 import { usePreviewReadOnly } from '~/composables/usePreviewReadOnly'
+import type { PropertyFilter } from '~~/shared/properties'
 
 /**
  * Composable for managing the applications list with filtering, pagination, and mutations.
@@ -9,14 +10,19 @@ export function useApplications(options?: {
   jobId?: Ref<string | undefined> | string
   candidateId?: Ref<string | undefined> | string
   status?: Ref<string | undefined> | string
+  propertyFilters?: Ref<PropertyFilter[] | undefined> | PropertyFilter[]
 }) {
   const { handlePreviewReadOnlyError } = usePreviewReadOnly()
 
-  const query = computed(() => ({
-    ...(toValue(options?.jobId) && { jobId: toValue(options?.jobId) }),
-    ...(toValue(options?.candidateId) && { candidateId: toValue(options?.candidateId) }),
-    ...(toValue(options?.status) && { status: toValue(options?.status) }),
-  }))
+  const query = computed(() => {
+    const pf = toValue(options?.propertyFilters)
+    return {
+      ...(toValue(options?.jobId) && { jobId: toValue(options?.jobId) }),
+      ...(toValue(options?.candidateId) && { candidateId: toValue(options?.candidateId) }),
+      ...(toValue(options?.status) && { status: toValue(options?.status) }),
+      ...(pf && pf.length > 0 && { propertyFilters: JSON.stringify(pf) }),
+    }
+  })
 
   const { data, status: fetchStatus, error, refresh } = useFetch('/api/applications', {
     key: 'applications',
diff --git a/app/composables/useCandidates.ts b/app/composables/useCandidates.ts
index 36fbfc08..e2ad31b1 100644
--- a/app/composables/useCandidates.ts
+++ b/app/composables/useCandidates.ts
@@ -1,5 +1,6 @@
 import type { Ref } from 'vue'
 import { usePreviewReadOnly } from '~/composables/usePreviewReadOnly'
+import type { PropertyFilter } from '~~/shared/properties'
 
 /**
  * Composable for managing the candidates list with search, pagination, and mutations.
@@ -10,15 +11,20 @@ export function useCandidates(options?: {
   gender?: Ref<string | undefined> | string
   dobFrom?: Ref<string | undefined> | string
   dobTo?: Ref<string | undefined> | string
+  propertyFilters?: Ref<PropertyFilter[] | undefined> | PropertyFilter[]
 }) {
   const { handlePreviewReadOnlyError } = usePreviewReadOnly()
 
-  const query = computed(() => ({
-    ...(toValue(options?.search) && { search: toValue(options?.search) }),
-    ...(toValue(options?.gender) && { gender: toValue(options?.gender) }),
-    ...(toValue(options?.dobFrom) && { dobFrom: toValue(options?.dobFrom) }),
-    ...(toValue(options?.dobTo) && { dobTo: toValue(options?.dobTo) }),
-  }))
+  const query = computed(() => {
+    const pf = toValue(options?.propertyFilters)
+    return {
+      ...(toValue(options?.search) && { search: toValue(options?.search) }),
+      ...(toValue(options?.gender) && { gender: toValue(options?.gender) }),
+      ...(toValue(options?.dobFrom) && { dobFrom: toValue(options?.dobFrom) }),
+      ...(toValue(options?.dobTo) && { dobTo: toValue(options?.dobTo) }),
+      ...(pf && pf.length > 0 && { propertyFilters: JSON.stringify(pf) }),
+    }
+  })
 
   const { data, status: fetchStatus, error, refresh } = useFetch('/api/candidates', {
     key: 'candidates',
diff --git a/app/composables/useProperties.ts b/app/composables/useProperties.ts
new file mode 100644
index 00000000..eb737b5f
--- /dev/null
+++ b/app/composables/useProperties.ts
@@ -0,0 +1,160 @@
+import type { MaybeRefOrGetter, Ref } from 'vue'
+import type {
+  PropertyDefinition,
+  PropertyEntityType,
+  PropertyEntry,
+  PropertyType,
+  PropertyConfig,
+  PropertyFilter,
+} from '~~/shared/properties'
+
+/**
+ * useProperties — manages the property *schema* (definitions) for a given context.
+ *
+ * `entityType` + optional `jobId` defines the scope:
+ *   - candidate            → org-global candidate defs
+ *   - application          → org-global application defs
+ *   - application + jobId  → org-global + per-job (additive)
+ */
+export function useProperties(opts: {
+  entityType: MaybeRefOrGetter<PropertyEntityType>
+  jobId?: MaybeRefOrGetter<string | null | undefined>
+  /** When true, only fetch per-job props (used by the per-job schema editor). */
+  jobOnly?: MaybeRefOrGetter<boolean>
+}) {
+  const query = computed(() => {
+    const entityType = toValue(opts.entityType)
+    const jobId = opts.jobId ? toValue(opts.jobId) : null
+    const jobOnly = opts.jobOnly ? toValue(opts.jobOnly) : false
+    return {
+      entityType,
+      ...(jobId ? { jobId } : {}),
+      ...(jobOnly ? { jobOnly: '1' } : {}),
+    }
+  })
+
+  const key = computed(() => {
+    const q = query.value
+    return `properties-${q.entityType}-${q.jobId ?? 'org'}-${q.jobOnly ?? '0'}`
+  })
+
+  const { data, status, error, refresh } = useFetch<PropertyDefinition[]>('/api/properties', {
+    key,
+    query,
+    headers: useRequestHeaders(['cookie']),
+    default: () => [],
+  })
+
+  const definitions = computed<PropertyDefinition[]>(() => data.value ?? [])
+
+  async function createDefinition(payload: {
+    entityType: PropertyEntityType
+    type: PropertyType
+    name: string
+    description?: string | null
+    jobId?: string | null
+    config?: PropertyConfig
+  }) {
+    const created = await $fetch<PropertyDefinition>('/api/properties', {
+      method: 'POST',
+      body: payload,
+    })
+    await refresh()
+    return created
+  }
+
+  async function updateDefinition(
+    id: string,
+    payload: Partial<Pick<PropertyDefinition, 'name' | 'description' | 'config' | 'displayOrder'>>,
+  ) {
+    const updated = await $fetch<PropertyDefinition>(`/api/properties/${id}`, {
+      method: 'PATCH',
+      body: payload,
+    })
+    await refresh()
+    return updated
+  }
+
+  async function deleteDefinition(id: string) {
+    await $fetch(`/api/properties/${id}`, { method: 'DELETE' })
+    await refresh()
+  }
+
+  async function reorderDefinitions(ids: string[]) {
+    await $fetch('/api/properties/reorder', {
+      method: 'POST',
+      body: { ids },
+    })
+    await refresh()
+  }
+
+  return {
+    definitions,
+    status,
+    error,
+    refresh,
+    createDefinition,
+    updateDefinition,
+    deleteDefinition,
+    reorderDefinitions,
+  }
+}
+
+/**
+ * useEntityPropertyMutations — write helpers for setting/clearing values on
+ * a candidate or application. Returns optimistic-friendly setters.
+ */
+export function useEntityPropertyMutations(opts: {
+  entityType: PropertyEntityType
+  entityId: MaybeRefOrGetter<string>
+  /** Caller's local entries ref (for optimistic updates). */
+  entries: Ref<PropertyEntry[]>
+  /** Refresh callback after mutation completes successfully. */
+  onAfter?: () => void | Promise<void>
+}) {
+  const base = computed(
+    () => `/api/${opts.entityType === 'application' ? 'applications' : 'candidates'}/${toValue(opts.entityId)}/properties`,
+  )
+
+  async function setValue(propertyDefinitionId: string, value: unknown) {
+    // Optimistic update
+    const idx = opts.entries.value.findIndex((e) => e.definition.id === propertyDefinitionId)
+    const previous = idx >= 0 ? opts.entries.value[idx]!.value : null
+    if (idx >= 0) {
+      opts.entries.value = opts.entries.value.map((e, i) =>
+        i === idx ? { ...e, value } : e,
+      )
+    }
+
+    try {
+      const result = await $fetch<{ value: unknown }>(`${base.value}/${propertyDefinitionId}`, {
+        method: 'PUT',
+        body: { value },
+      })
+      // Reconcile with server response
+      if (idx >= 0) {
+        opts.entries.value = opts.entries.value.map((e, i) =>
+          i === idx ? { ...e, value: result.value } : e,
+        )
+      }
+      if (opts.onAfter) await opts.onAfter()
+      return result.value
+    } catch (err) {
+      // Rollback
+      if (idx >= 0) {
+        opts.entries.value = opts.entries.value.map((e, i) =>
+          i === idx ? { ...e, value: previous } : e,
+        )
+      }
+      throw err
+    }
+  }
+
+  async function clearValue(propertyDefinitionId: string) {
+    return setValue(propertyDefinitionId, null)
+  }
+
+  return { setValue, clearValue }
+}
+
+export type { PropertyDefinition, PropertyEntry, PropertyType, PropertyEntityType, PropertyFilter }
diff --git a/app/composables/useSavedViews.ts b/app/composables/useSavedViews.ts
new file mode 100644
index 00000000..d71e7cf3
--- /dev/null
+++ b/app/composables/useSavedViews.ts
@@ -0,0 +1,119 @@
+/**
+ * useSavedViews — manages a list of named, customizable filter/sort "views"
+ * persisted in localStorage, scoped per page (e.g. "candidates", "applications").
+ *
+ * Each view stores an arbitrary settings object (filters + sort + visible columns)
+ * along with a name and an optional default flag.
+ */
+
+export interface SavedView<T = Record<string, unknown>> {
+  id: string
+  name: string
+  isDefault?: boolean
+  settings: T
+}
+
+const STORAGE_PREFIX = 'reqcore:saved-views:'
+
+function genId() {
+  return Math.random().toString(36).slice(2, 10) + Date.now().toString(36)
+}
+
+export function useSavedViews<T extends Record<string, unknown>>(scope: string, defaultSettings: T) {
+  const storageKey = `${STORAGE_PREFIX}${scope}`
+  const views = ref<SavedView<T>[]>([])
+  const activeViewId = ref<string | null>(null)
+  const loaded = ref(false)
+
+  function load() {
+    if (typeof window === 'undefined') return
+    try {
+      const raw = window.localStorage.getItem(storageKey)
+      if (raw) {
+        const parsed = JSON.parse(raw) as SavedView<T>[]
+        if (Array.isArray(parsed)) views.value = parsed
+      }
+    }
+    catch {
+      // ignore corrupt data
+    }
+    loaded.value = true
+  }
+
+  function persist() {
+    if (typeof window === 'undefined') return
+    try {
+      window.localStorage.setItem(storageKey, JSON.stringify(views.value))
+    }
+    catch {
+      // ignore quota errors
+    }
+  }
+
+  function getActive(): SavedView<T> | null {
+    if (!activeViewId.value) return null
+    return views.value.find(v => v.id === activeViewId.value) ?? null
+  }
+
+  function getDefault(): SavedView<T> | null {
+    return views.value.find(v => v.isDefault) ?? null
+  }
+
+  function applyView(id: string): T | null {
+    const view = views.value.find(v => v.id === id)
+    if (!view) return null
+    activeViewId.value = id
+    return { ...defaultSettings, ...view.settings }
+  }
+
+  function saveView(name: string, settings: T, opts?: { setActive?: boolean }): SavedView<T> {
+    const trimmed = name.trim() || 'Untitled view'
+    const view: SavedView<T> = { id: genId(), name: trimmed, settings: { ...settings } }
+    views.value = [...views.value, view]
+    persist()
+    if (opts?.setActive !== false) activeViewId.value = view.id
+    return view
+  }
+
+  function updateView(id: string, patch: Partial<Pick<SavedView<T>, 'name' | 'settings'>>) {
+    views.value = views.value.map(v => v.id === id ? { ...v, ...patch } : v)
+    persist()
+  }
+
+  function deleteView(id: string) {
+    views.value = views.value.filter(v => v.id !== id)
+    if (activeViewId.value === id) activeViewId.value = null
+    persist()
+  }
+
+  function setDefault(id: string | null) {
+    views.value = views.value.map(v => ({ ...v, isDefault: v.id === id }))
+    persist()
+  }
+
+  function clearActive() {
+    activeViewId.value = null
+  }
+
+  // Auto-load on mount (client only)
+  onMounted(() => {
+    load()
+    // Apply default view if one exists and nothing is active yet
+    const def = getDefault()
+    if (def && !activeViewId.value) activeViewId.value = def.id
+  })
+
+  return {
+    views,
+    activeViewId,
+    loaded,
+    getActive,
+    getDefault,
+    applyView,
+    saveView,
+    updateView,
+    deleteView,
+    setDefault,
+    clearActive,
+  }
+}
diff --git a/app/pages/dashboard/applications/[id].vue b/app/pages/dashboard/applications/[id].vue
index c67ef569..b8f15681 100644
--- a/app/pages/dashboard/applications/[id].vue
+++ b/app/pages/dashboard/applications/[id].vue
@@ -12,7 +12,7 @@ const applicationId = route.params.id as string
 const { handlePreviewReadOnlyError } = usePreviewReadOnly()
 const toast = useToast()
 
-const { application, status: fetchStatus, error, updateApplication } = useApplication(applicationId)
+const { application, status: fetchStatus, error, refresh, updateApplication } = useApplication(applicationId)
 
 const { formatCandidateName } = useOrgSettings()
 
@@ -354,6 +354,18 @@ function formatResponseValue(value: unknown): string {
         <p v-else class="text-sm text-surface-400 italic">No notes yet.</p>
       </div>
 
+      <!-- Custom properties (Notion-style) -->
+      <div class="rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-4 mb-4">
+        <h2 class="text-sm font-semibold text-surface-700 dark:text-surface-200 mb-2 px-2">Properties</h2>
+        <PropertyBlock
+          entity-type="application"
+          :entity-id="applicationId"
+          :job-id="application.job.id"
+          :entries="(application.properties ?? []) as never"
+          @refresh="refresh()"
+        />
+      </div>
+
       <!-- Question Responses -->
       <div
         v-if="application.responses && application.responses.length > 0"
diff --git a/app/pages/dashboard/applications/index.vue b/app/pages/dashboard/applications/index.vue
index 6d5acee4..19071b0f 100644
--- a/app/pages/dashboard/applications/index.vue
+++ b/app/pages/dashboard/applications/index.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { FileText, Search, X, ChevronDown, Briefcase, Mail, Clock, ArrowUp, ArrowDown, ArrowUpDown } from 'lucide-vue-next'
+import { FileText, Search, X, Briefcase, Mail, Clock, ArrowUp, ArrowDown, ArrowUpDown, SlidersHorizontal } from 'lucide-vue-next'
 
 definePageMeta({
   layout: 'dashboard',
@@ -11,6 +11,44 @@ useSeoMeta({
   description: 'Manage applications across all jobs',
 })
 
+// ── Column visibility ─────────────────────────────────────────────────────────
+
+const COLUMNS_STORAGE_KEY = 'reqcore:columns:applications'
+
+const defaultColumnVisibility = {
+  email: true,
+  job: true,
+  status: true,
+  score: true,
+  applied: true,
+}
+
+const visibleColumns = ref<Record<string, boolean>>({ ...defaultColumnVisibility })
+
+const { definitions: propertyDefs } = useProperties({ entityType: () => 'application' })
+
+const applicationColumns = computed(() => [
+  { key: 'candidate', label: 'Candidate', required: true },
+  { key: 'email', label: 'Email' },
+  { key: 'job', label: 'Job' },
+  { key: 'status', label: 'Status' },
+  { key: 'score', label: 'Score' },
+  { key: 'applied', label: 'Applied' },
+  ...propertyDefs.value.map((d) => ({ key: `prop_${d.id}`, label: d.name })),
+])
+
+onMounted(() => {
+  try {
+    const raw = window.localStorage.getItem(COLUMNS_STORAGE_KEY)
+    if (raw) visibleColumns.value = { ...defaultColumnVisibility, ...JSON.parse(raw) }
+  } catch {}
+})
+
+watch(visibleColumns, (val) => {
+  if (typeof window === 'undefined') return
+  try { window.localStorage.setItem(COLUMNS_STORAGE_KEY, JSON.stringify(val)) } catch {}
+}, { deep: true })
+
 const route = useRoute()
 const router = useRouter()
 
@@ -54,9 +92,11 @@ watch(activeStatus, (newStatus) => {
 })
 
 const statusFilter = computed(() => activeStatus.value)
+const propertyFilters = ref<import('~~/shared/properties').PropertyFilter[]>([])
 
 const { applications, total, fetchStatus, error, refresh } = useApplications({
   status: statusFilter,
+  propertyFilters,
 })
 
 const { formatPersonName } = useOrgSettings()
@@ -64,8 +104,6 @@ const { formatPersonName } = useOrgSettings()
 // ── Job filter (client-side) ──────────────────────────────────────────────────
 
 const activeJobId = ref<string | undefined>(undefined)
-const jobDropdownOpen = ref(false)
-const jobDropdownRef = ref<HTMLElement | null>(null)
 
 const uniqueJobs = computed(() => {
   const map = new Map<string, string>()
@@ -75,14 +113,6 @@ const uniqueJobs = computed(() => {
   return Array.from(map, ([id, title]) => ({ id, title })).sort((a, b) => a.title.localeCompare(b.title))
 })
 
-function handleJobDropdownOutside(e: MouseEvent) {
-  if (jobDropdownRef.value && !jobDropdownRef.value.contains(e.target as Node)) {
-    jobDropdownOpen.value = false
-  }
-}
-onMounted(() => document.addEventListener('mousedown', handleJobDropdownOutside))
-onUnmounted(() => document.removeEventListener('mousedown', handleJobDropdownOutside))
-
 // ── Sorting ───────────────────────────────────────────────────────────────────
 
 type SortKey = 'name' | 'email' | 'job' | 'status' | 'score' | 'created'
@@ -146,7 +176,7 @@ const filteredApplications = computed(() => {
 })
 
 const hasActiveFilters = computed(() =>
-  activeStatus.value != null || activeJobId.value != null || debouncedSearch.value.length > 0,
+  activeStatus.value != null || activeJobId.value != null || debouncedSearch.value.length > 0 || propertyFilters.value.length > 0,
 )
 
 function clearAllFilters() {
@@ -154,6 +184,7 @@ function clearAllFilters() {
   activeJobId.value = undefined
   searchInput.value = ''
   debouncedSearch.value = ''
+  propertyFilters.value = []
 }
 
 // ── Helpers ───────────────────────────────────────────────────────────────────
@@ -201,6 +232,107 @@ const statusLabels: Record<Status, string> = {
   hired: 'Hired',
   rejected: 'Rejected',
 }
+
+// ── Drawer + Saved Views ──────────────────────────────────────────────────────
+
+type ApplicationsViewSettings = {
+  status?: Status
+  jobId?: string
+  sortKey: SortKey
+  sortDir: SortDir
+}
+
+const defaultSettings: ApplicationsViewSettings = {
+  status: undefined,
+  jobId: undefined,
+  sortKey: 'created',
+  sortDir: 'desc',
+}
+
+const drawerOpen = ref(false)
+
+const currentSettings = computed<ApplicationsViewSettings>(() => ({
+  status: activeStatus.value,
+  jobId: activeJobId.value,
+  sortKey: sortKey.value,
+  sortDir: sortDir.value,
+}))
+
+function applySettings(s: ApplicationsViewSettings) {
+  activeStatus.value = s.status
+  activeJobId.value = s.jobId
+  sortKey.value = s.sortKey
+  sortDir.value = s.sortDir
+}
+
+const {
+  views,
+  activeViewId,
+  applyView,
+  saveView,
+  updateView,
+  deleteView,
+  setDefault,
+  clearActive,
+} = useSavedViews<ApplicationsViewSettings>('applications', defaultSettings)
+
+// On first mount, if a default view exists, apply its settings.
+onMounted(() => {
+  nextTick(() => {
+    if (activeViewId.value) {
+      const s = applyView(activeViewId.value)
+      if (s) applySettings(s)
+    }
+  })
+})
+
+function settingsEqual(a: ApplicationsViewSettings, b: ApplicationsViewSettings) {
+  return a.status === b.status
+    && a.jobId === b.jobId
+    && a.sortKey === b.sortKey
+    && a.sortDir === b.sortDir
+}
+
+const isDirty = computed(() => {
+  const view = views.value.find(v => v.id === activeViewId.value)
+  if (!view) return false
+  return !settingsEqual(currentSettings.value, { ...defaultSettings, ...view.settings })
+})
+
+// Mark the view inactive (chip-level highlight) when the user manually edits filters.
+watch(currentSettings, () => {
+  if (!activeViewId.value) return
+  if (isDirty.value) {
+    // Keep the chip active but show the dirty marker via SavedViewsBar.
+  }
+}, { deep: true })
+
+function onSelectView(id: string | null) {
+  if (id == null) {
+    clearActive()
+    applySettings(defaultSettings)
+    return
+  }
+  const s = applyView(id)
+  if (s) applySettings(s)
+}
+
+function onSaveView(name: string) {
+  saveView(name, currentSettings.value)
+}
+
+function onUpdateView(id: string) {
+  updateView(id, { settings: currentSettings.value })
+}
+
+const drawerActiveCount = computed(() =>
+  [activeStatus.value, activeJobId.value].filter(Boolean).length + propertyFilters.value.length,
+)
+
+// ── Property value lookup helper ──────────────────────────────────────────────
+function getPropertyValue(entity: { properties?: import('~~/shared/properties').PropertyEntry[] | null }, definitionId: string): unknown {
+  return entity.properties?.find((p) => p.definition.id === definitionId)?.value ?? null
+}
 </script>
 
 <template>
@@ -215,90 +347,138 @@ const statusLabels: Record<Status, string> = {
       </div>
     </div>
 
-    <!-- Search bar -->
-    <div class="relative mb-4">
-      <Search class="absolute left-3.5 top-1/2 -translate-y-1/2 size-4 text-surface-400" />
-      <input
-        v-model="searchInput"
-        type="text"
-        placeholder="Search by candidate name, email, or job title…"
-        class="w-full rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 pl-10 pr-3 py-2.5 text-sm text-surface-900 dark:text-surface-100 placeholder:text-surface-400 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
-      />
-    </div>
-
-    <!-- Filter bar -->
-    <div class="flex flex-wrap items-center gap-2 mb-4">
-      <!-- Job dropdown filter -->
-      <div ref="jobDropdownRef" class="relative">
-        <button
-          class="inline-flex items-center gap-1.5 rounded-lg border px-3 py-1.5 text-sm transition-colors"
-          :class="activeJobId
-            ? 'border-brand-300 dark:border-brand-700 bg-brand-50 dark:bg-brand-950 text-brand-700 dark:text-brand-400'
-            : 'border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 text-surface-600 dark:text-surface-300 hover:border-surface-300 dark:hover:border-surface-700'"
-          @click="jobDropdownOpen = !jobDropdownOpen"
-        >
-          <Briefcase class="size-3.5" />
-          {{ activeJobId ? uniqueJobs.find(j => j.id === activeJobId)?.title ?? 'Job' : 'Job' }}
-          <ChevronDown class="size-3.5" />
-        </button>
-        <div
-          v-if="jobDropdownOpen"
-          class="absolute left-0 top-full mt-1 z-20 w-64 max-h-56 overflow-y-auto rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 shadow-lg py-1"
-        >
-          <button
-            class="w-full text-left px-3 py-2 text-sm hover:bg-surface-50 dark:hover:bg-surface-800 transition-colors"
-            :class="!activeJobId ? 'text-brand-600 font-medium' : 'text-surface-700 dark:text-surface-300'"
-            @click="activeJobId = undefined; jobDropdownOpen = false"
-          >
-            All jobs
-          </button>
-          <button
-            v-for="j in uniqueJobs"
-            :key="j.id"
-            class="w-full text-left px-3 py-2 text-sm hover:bg-surface-50 dark:hover:bg-surface-800 transition-colors truncate"
-            :class="activeJobId === j.id ? 'text-brand-600 font-medium' : 'text-surface-700 dark:text-surface-300'"
-            @click="activeJobId = j.id; jobDropdownOpen = false"
-          >
-            {{ j.title }}
-          </button>
-        </div>
-      </div>
-
-      <!-- Status filter tabs -->
-      <div class="flex items-center gap-1">
-        <button
-          class="rounded-full px-3 py-1.5 text-xs font-medium transition-colors"
-          :class="!activeStatus
-            ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
-            : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
-          @click="activeStatus = undefined"
-        >
-          All
-        </button>
-        <button
-          v-for="s in STATUS_OPTIONS"
-          :key="s"
-          class="rounded-full px-3 py-1.5 text-xs font-medium capitalize transition-colors"
-          :class="activeStatus === s
-            ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
-            : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
-          @click="activeStatus = activeStatus === s ? undefined : s"
-        >
-          {{ statusLabels[s] }}
-        </button>
+    <!-- Search + Views + Filters -->
+    <div class="flex items-center gap-2 mb-4">
+      <div class="relative flex-1">
+        <Search class="absolute left-3.5 top-1/2 -translate-y-1/2 size-4 text-surface-400" />
+        <input
+          v-model="searchInput"
+          type="text"
+          placeholder="Search by candidate name, email, or job title…"
+          class="w-full rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 pl-10 pr-3 py-2 text-sm text-surface-900 dark:text-surface-100 placeholder:text-surface-400 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
+        />
       </div>
-
-      <!-- Clear all -->
+      <SavedViewsMenu
+        :views="views"
+        :active-view-id="activeViewId"
+        :is-dirty="isDirty"
+        @select="onSelectView"
+        @save="onSaveView"
+        @update="onUpdateView"
+        @delete="deleteView"
+        @set-default="setDefault"
+      />
+      <ColumnsMenu
+        v-model="visibleColumns"
+        :columns="applicationColumns"
+      />
+      <button
+        type="button"
+        class="inline-flex items-center gap-1.5 rounded-lg border px-3 py-2 text-sm font-medium transition-colors"
+        :class="drawerActiveCount > 0
+          ? 'border-surface-400 bg-surface-100 text-surface-800 dark:border-surface-500 dark:bg-surface-800 dark:text-surface-200'
+          : 'border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 text-surface-600 dark:text-surface-400 hover:bg-surface-50 dark:hover:bg-surface-800'"
+        @click="drawerOpen = true"
+      >
+        <SlidersHorizontal class="size-4" />
+        Filters
+        <span
+          v-if="drawerActiveCount > 0"
+          class="inline-flex items-center justify-center min-w-[1rem] h-4 px-1 rounded-full bg-surface-700 dark:bg-surface-300 text-white dark:text-surface-900 text-[10px] font-semibold"
+        >{{ drawerActiveCount }}</span>
+      </button>
       <button
         v-if="hasActiveFilters"
-        class="inline-flex items-center gap-1 text-xs text-surface-400 hover:text-danger-600 transition-colors ml-auto"
+        class="inline-flex items-center gap-1 text-xs text-surface-400 hover:text-danger-600 transition-colors"
         @click="clearAllFilters"
       >
         <X class="size-3" />
-        Clear filters
+        Clear
       </button>
     </div>
 
+    <!-- Filter drawer -->
+    <FilterDrawer
+      v-model="drawerOpen"
+      title="Filter applications"
+      description="Customize your view, then save it for quick access."
+      :active-count="drawerActiveCount"
+      saveable
+      :default-save-name="`View ${views.length + 1}`"
+      @reset="applySettings(defaultSettings)"
+      @save-view="onSaveView"
+    >
+      <div class="space-y-6">
+        <!-- Status -->
+        <div>
+          <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Status</label>
+          <div class="flex flex-wrap gap-1.5">
+            <button
+              type="button"
+              class="rounded-full px-3 py-1.5 text-xs font-medium transition-colors"
+              :class="!activeStatus
+                ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
+                : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
+              @click="activeStatus = undefined"
+            >Any</button>
+            <button
+              v-for="s in STATUS_OPTIONS"
+              :key="s"
+              type="button"
+              class="rounded-full px-3 py-1.5 text-xs font-medium transition-colors"
+              :class="activeStatus === s
+                ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
+                : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
+              @click="activeStatus = activeStatus === s ? undefined : s"
+            >{{ statusLabels[s] }}</button>
+          </div>
+        </div>
+
+        <!-- Job -->
+        <div>
+          <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Job</label>
+          <select
+            v-model="activeJobId"
+            class="w-full rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
+          >
+            <option :value="undefined">All jobs</option>
+            <option v-for="j in uniqueJobs" :key="j.id" :value="j.id">{{ j.title }}</option>
+          </select>
+        </div>
+
+        <!-- Sort -->
+        <div>
+          <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Sort by</label>
+          <div class="flex gap-2">
+            <select
+              v-model="sortKey"
+              class="flex-1 rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
+            >
+              <option value="created">Applied date</option>
+              <option value="name">Candidate name</option>
+              <option value="email">Email</option>
+              <option value="job">Job title</option>
+              <option value="status">Status</option>
+              <option value="score">Score</option>
+            </select>
+            <select
+              v-model="sortDir"
+              class="w-32 rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
+            >
+              <option value="asc">Ascending</option>
+              <option value="desc">Descending</option>
+            </select>
+          </div>
+        </div>
+
+        <!-- Property filters -->
+        <div v-if="propertyDefs.length > 0">
+          <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Properties</label>
+          <PropertyFilterBar v-model="propertyFilters" entity-type="application" />
+        </div>
+      </div>
+    </FilterDrawer>
+
     <!-- Loading -->
     <div v-if="fetchStatus === 'pending'" class="text-center py-16 text-surface-400">
       Loading applications…
@@ -357,7 +537,7 @@ const statusLabels: Record<Status, string> = {
                   <ArrowUpDown v-else class="size-3.5 opacity-40" />
                 </button>
               </th>
-              <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden lg:table-cell">
+              <th v-if="visibleColumns.email" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden lg:table-cell">
                 <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('email')">
                   Email
                   <ArrowUp v-if="sortKey === 'email' && sortDir === 'asc'" class="size-3.5" />
@@ -365,7 +545,7 @@ const statusLabels: Record<Status, string> = {
                   <ArrowUpDown v-else class="size-3.5 opacity-40" />
                 </button>
               </th>
-              <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden md:table-cell">
+              <th v-if="visibleColumns.job" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden md:table-cell">
                 <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('job')">
                   Job
                   <ArrowUp v-if="sortKey === 'job' && sortDir === 'asc'" class="size-3.5" />
@@ -373,7 +553,7 @@ const statusLabels: Record<Status, string> = {
                   <ArrowUpDown v-else class="size-3.5 opacity-40" />
                 </button>
               </th>
-              <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
+              <th v-if="visibleColumns.status" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
                 <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('status')">
                   Status
                   <ArrowUp v-if="sortKey === 'status' && sortDir === 'asc'" class="size-3.5" />
@@ -381,7 +561,7 @@ const statusLabels: Record<Status, string> = {
                   <ArrowUpDown v-else class="size-3.5 opacity-40" />
                 </button>
               </th>
-              <th class="text-center px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden sm:table-cell">
+              <th v-if="visibleColumns.score" class="text-center px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden sm:table-cell">
                 <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('score')">
                   Score
                   <ArrowUp v-if="sortKey === 'score' && sortDir === 'asc'" class="size-3.5" />
@@ -389,7 +569,7 @@ const statusLabels: Record<Status, string> = {
                   <ArrowUpDown v-else class="size-3.5 opacity-40" />
                 </button>
               </th>
-              <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
+              <th v-if="visibleColumns.applied" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
                 <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('created')">
                   Applied
                   <ArrowUp v-if="sortKey === 'created' && sortDir === 'asc'" class="size-3.5" />
@@ -397,13 +577,18 @@ const statusLabels: Record<Status, string> = {
                   <ArrowUpDown v-else class="size-3.5 opacity-40" />
                 </button>
               </th>
+              <template v-for="d in propertyDefs" :key="d.id">
+                <th v-if="visibleColumns[`prop_${d.id}`]" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 whitespace-nowrap">
+                  {{ d.name }}
+                </th>
+              </template>
             </tr>
           </thead>
           <tbody class="divide-y divide-surface-100 dark:divide-surface-800">
             <tr
               v-for="app in filteredApplications"
               :key="app.id"
-              class="group bg-white dark:bg-surface-900 hover:bg-surface-50 dark:hover:bg-surface-800/60 transition-colors cursor-pointer"
+              class="group bg-white dark:bg-surface-900 hover:bg-surface-50 dark:hover:bg-surface-800/60 transition-colors cursor-pointer [&>td]:align-top"
               @click="$router.push($localePath(`/dashboard/applications/${app.id}`))"
             >
               <td class="px-4 py-3">
@@ -414,19 +599,19 @@ const statusLabels: Record<Status, string> = {
                   {{ formatPersonName(app.candidateFirstName, app.candidateLastName) }}
                 </NuxtLink>
               </td>
-              <td class="px-4 py-3 text-surface-500 dark:text-surface-400 hidden lg:table-cell">
+              <td v-if="visibleColumns.email" class="px-4 py-3 text-surface-500 dark:text-surface-400 hidden lg:table-cell">
                 <span class="inline-flex items-center gap-1.5">
                   <Mail class="size-3.5 shrink-0" />
                   <span class="truncate max-w-[200px]">{{ app.candidateEmail }}</span>
                 </span>
               </td>
-              <td class="px-4 py-3 text-surface-600 dark:text-surface-300 hidden md:table-cell">
+              <td v-if="visibleColumns.job" class="px-4 py-3 text-surface-600 dark:text-surface-300 hidden md:table-cell">
                 <span class="inline-flex items-center gap-1.5 truncate max-w-[200px]">
                   <Briefcase class="size-3.5 shrink-0 text-surface-400" />
                   {{ app.jobTitle }}
                 </span>
               </td>
-              <td class="px-4 py-3">
+              <td v-if="visibleColumns.status" class="px-4 py-3">
                 <span
                   class="inline-flex items-center gap-1.5 rounded-full px-2 py-0.5 text-xs font-medium capitalize whitespace-nowrap"
                   :class="statusBadgeClasses[app.status] ?? 'bg-surface-100 text-surface-600'"
@@ -435,7 +620,7 @@ const statusLabels: Record<Status, string> = {
                   {{ statusLabels[app.status as Status] ?? app.status }}
                 </span>
               </td>
-              <td class="px-4 py-3 text-center hidden sm:table-cell">
+              <td v-if="visibleColumns.score" class="px-4 py-3 text-center hidden sm:table-cell">
                 <span
                   v-if="app.score != null"
                   class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-semibold tabular-nums ring-1 ring-inset"
@@ -445,12 +630,23 @@ const statusLabels: Record<Status, string> = {
                 </span>
                 <span v-else class="text-surface-300 dark:text-surface-600">—</span>
               </td>
-              <td class="px-4 py-3 text-surface-400 whitespace-nowrap">
+              <td v-if="visibleColumns.applied" class="px-4 py-3 text-surface-400 whitespace-nowrap">
                 <TimelineDateLink :date="app.createdAt" class="inline-flex items-center gap-1.5">
                   <Clock class="size-3.5 shrink-0" />
                   {{ timeAgo(app.createdAt) }}
                 </TimelineDateLink>
               </td>
+              <!-- Property columns -->
+              <template v-for="d in propertyDefs" :key="d.id">
+                <td v-if="visibleColumns[`prop_${d.id}`]" class="px-4 py-3 text-surface-500 dark:text-surface-400 align-top">
+                  <PropertyTableCell
+                    entity-type="application"
+                    :entity-id="app.id"
+                    :definition="d"
+                    :value="getPropertyValue(app, d.id)"
+                  />
+                </td>
+              </template>
             </tr>
           </tbody>
         </table>
diff --git a/app/pages/dashboard/candidates/[id].vue b/app/pages/dashboard/candidates/[id].vue
index 08d03670..915f939f 100644
--- a/app/pages/dashboard/candidates/[id].vue
+++ b/app/pages/dashboard/candidates/[id].vue
@@ -430,6 +430,17 @@ function formatFileSize(bytes: number | null | undefined): string {
           </dl>
         </div>
 
+        <!-- Custom properties (Notion-style) -->
+        <div class="rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-4 mb-4">
+          <h2 class="text-sm font-semibold text-surface-700 dark:text-surface-200 mb-2 px-2">Properties</h2>
+          <PropertyBlock
+            entity-type="candidate"
+            :entity-id="candidateId"
+            :entries="(candidate.properties ?? []) as never"
+            @refresh="refresh()"
+          />
+        </div>
+
         <!-- Tabs -->
         <div class="border-b border-surface-200 dark:border-surface-800 mb-4">
           <div class="flex gap-1">
diff --git a/app/pages/dashboard/candidates/index.vue b/app/pages/dashboard/candidates/index.vue
index cdf42602..ec8b15b5 100644
--- a/app/pages/dashboard/candidates/index.vue
+++ b/app/pages/dashboard/candidates/index.vue
@@ -11,6 +11,44 @@ useSeoMeta({
   description: 'Manage your candidate pool',
 })
 
+// ── Column visibility ─────────────────────────────────────────────────────────
+
+const COLUMNS_STORAGE_KEY = 'reqcore:columns:candidates'
+
+const defaultColumnVisibility = {
+  email: true,
+  phone: true,
+  applications: true,
+  added: true,
+  quickNotes: true,
+}
+
+const visibleColumns = ref<Record<string, boolean>>({ ...defaultColumnVisibility })
+
+const { definitions: propertyDefs } = useProperties({ entityType: () => 'candidate' })
+
+const candidateColumns = computed(() => [
+  { key: 'name', label: 'Name', required: true },
+  { key: 'email', label: 'Email' },
+  { key: 'phone', label: 'Phone' },
+  { key: 'applications', label: 'Applications' },
+  { key: 'added', label: 'Added' },
+  { key: 'quickNotes', label: 'Quick notes' },
+  ...propertyDefs.value.map((d) => ({ key: `prop_${d.id}`, label: d.name })),
+])
+
+onMounted(() => {
+  try {
+    const raw = window.localStorage.getItem(COLUMNS_STORAGE_KEY)
+    if (raw) visibleColumns.value = { ...defaultColumnVisibility, ...JSON.parse(raw) }
+  } catch {}
+})
+
+watch(visibleColumns, (val) => {
+  if (typeof window === 'undefined') return
+  try { window.localStorage.setItem(COLUMNS_STORAGE_KEY, JSON.stringify(val)) } catch {}
+}, { deep: true })
+
 const searchInput = ref('')
 const debouncedSearch = ref<string | undefined>(undefined)
 
@@ -24,19 +62,22 @@ watch(searchInput, (val) => {
 
 // ── Filters ───────────────────────────────────────────────────────────────────
 
-const showFilters = ref(false)
+const drawerOpen = ref(false)
 const filterGender = ref<string | undefined>(undefined)
 const filterDobFrom = ref<string | undefined>(undefined)
 const filterDobTo = ref<string | undefined>(undefined)
+const propertyFilters = ref<import('~~/shared/properties').PropertyFilter[]>([])
 
 const activeFilterCount = computed(() =>
   [filterGender.value, filterDobFrom.value, filterDobTo.value].filter(Boolean).length
+  + propertyFilters.value.length
 )
 
 function clearFilters() {
   filterGender.value = undefined
   filterDobFrom.value = undefined
   filterDobTo.value = undefined
+  propertyFilters.value = []
 }
 
 const { candidates, total, fetchStatus, error, refresh } = useCandidates({
@@ -44,6 +85,7 @@ const { candidates, total, fetchStatus, error, refresh } = useCandidates({
   gender: filterGender,
   dobFrom: filterDobFrom,
   dobTo: filterDobTo,
+  propertyFilters,
 })
 
 // Org localization (name + date format)
@@ -118,6 +160,98 @@ async function saveNotes(candidateId: string) {
 function cancelEditNotes() {
   editingNotesId.value = null
 }
+
+// ── Property value lookup helper ──────────────────────────────────────────────
+// Avoids `as any` in the template and is null-safe.
+function getPropertyValue(entity: { properties?: import('~~/shared/properties').PropertyEntry[] | null }, definitionId: string): unknown {
+  return entity.properties?.find((p) => p.definition.id === definitionId)?.value ?? null
+}
+
+// ── Saved Views ──────────────────────────────────────────────────────────────────
+
+type CandidatesViewSettings = {
+  gender?: string
+  dobFrom?: string
+  dobTo?: string
+  sortKey: SortKey
+  sortDir: SortDir
+}
+
+const defaultSettings: CandidatesViewSettings = {
+  gender: undefined,
+  dobFrom: undefined,
+  dobTo: undefined,
+  sortKey: 'created',
+  sortDir: 'desc',
+}
+
+const currentSettings = computed<CandidatesViewSettings>(() => ({
+  gender: filterGender.value,
+  dobFrom: filterDobFrom.value,
+  dobTo: filterDobTo.value,
+  sortKey: sortKey.value,
+  sortDir: sortDir.value,
+}))
+
+function applySettings(s: CandidatesViewSettings) {
+  filterGender.value = s.gender
+  filterDobFrom.value = s.dobFrom
+  filterDobTo.value = s.dobTo
+  sortKey.value = s.sortKey
+  sortDir.value = s.sortDir
+}
+
+const {
+  views,
+  activeViewId,
+  applyView,
+  saveView,
+  updateView,
+  deleteView,
+  setDefault,
+  clearActive,
+} = useSavedViews<CandidatesViewSettings>('candidates', defaultSettings)
+
+onMounted(() => {
+  nextTick(() => {
+    if (activeViewId.value) {
+      const s = applyView(activeViewId.value)
+      if (s) applySettings(s)
+    }
+  })
+})
+
+function settingsEqual(a: CandidatesViewSettings, b: CandidatesViewSettings) {
+  return a.gender === b.gender
+    && a.dobFrom === b.dobFrom
+    && a.dobTo === b.dobTo
+    && a.sortKey === b.sortKey
+    && a.sortDir === b.sortDir
+}
+
+const isDirty = computed(() => {
+  const view = views.value.find(v => v.id === activeViewId.value)
+  if (!view) return false
+  return !settingsEqual(currentSettings.value, { ...defaultSettings, ...view.settings })
+})
+
+function onSelectView(id: string | null) {
+  if (id == null) {
+    clearActive()
+    applySettings(defaultSettings)
+    return
+  }
+  const s = applyView(id)
+  if (s) applySettings(s)
+}
+
+function onSaveView(name: string) {
+  saveView(name, currentSettings.value)
+}
+
+function onUpdateView(id: string) {
+  updateView(id, { settings: currentSettings.value })
+}
 </script>
 
 <template>
@@ -139,7 +273,7 @@ function cancelEditNotes() {
       </NuxtLink>
     </div>
 
-    <!-- Search + filter row -->
+    <!-- Search + Views + Filters -->
     <div class="flex items-center gap-2 mb-4">
       <div class="relative flex-1">
         <Search class="absolute left-3 top-1/2 -translate-y-1/2 size-4 text-surface-400" />
@@ -150,71 +284,126 @@ function cancelEditNotes() {
           class="w-full rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 pl-10 pr-3 py-2 text-sm text-surface-900 dark:text-surface-100 placeholder:text-surface-400 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
         />
       </div>
+      <SavedViewsMenu
+        :views="views"
+        :active-view-id="activeViewId"
+        :is-dirty="isDirty"
+        @select="onSelectView"
+        @save="onSaveView"
+        @update="onUpdateView"
+        @delete="deleteView"
+        @set-default="setDefault"
+      />
+      <ColumnsMenu
+        v-model="visibleColumns"
+        :columns="candidateColumns"
+      />
       <button
         type="button"
         class="inline-flex items-center gap-1.5 rounded-lg border px-3 py-2 text-sm font-medium transition-colors"
-        :class="showFilters || activeFilterCount > 0
-          ? 'border-brand-300 bg-brand-50 text-brand-700 dark:border-brand-700 dark:bg-brand-950 dark:text-brand-300'
+        :class="activeFilterCount > 0
+          ? 'border-surface-400 bg-surface-100 text-surface-800 dark:border-surface-500 dark:bg-surface-800 dark:text-surface-200'
           : 'border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 text-surface-600 dark:text-surface-400 hover:bg-surface-50 dark:hover:bg-surface-800'"
-        @click="showFilters = !showFilters"
+        @click="drawerOpen = true"
       >
         <SlidersHorizontal class="size-4" />
         Filters
         <span
           v-if="activeFilterCount > 0"
-          class="inline-flex items-center justify-center size-4 rounded-full bg-brand-600 text-white text-xs font-semibold"
+          class="inline-flex items-center justify-center size-4 rounded-full bg-surface-700 dark:bg-surface-300 text-white dark:text-surface-900 text-xs font-semibold"
         >{{ activeFilterCount }}</span>
       </button>
+      <button
+        v-if="activeFilterCount > 0"
+        class="inline-flex items-center gap-1 text-xs text-surface-400 hover:text-danger-600 transition-colors"
+        @click="clearFilters"
+      >
+        <X class="size-3" />
+        Clear
+      </button>
     </div>
 
-    <!-- Filter panel -->
-    <div
-      v-if="showFilters"
-      class="rounded-lg border border-surface-200 dark:border-surface-800 bg-surface-50 dark:bg-surface-800/50 p-4 mb-4 grid grid-cols-1 sm:grid-cols-3 gap-4"
+    <!-- Filter drawer -->
+    <FilterDrawer
+      v-model="drawerOpen"
+      title="Filter candidates"
+      description="Customize your view, then save it for quick access."
+      :active-count="activeFilterCount"
+      saveable
+      :default-save-name="`View ${views.length + 1}`"
+      @reset="applySettings(defaultSettings)"
+      @save-view="onSaveView"
     >
-      <!-- Gender -->
-      <div>
-        <label class="block text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Gender</label>
-        <select
-          v-model="filterGender"
-          class="w-full rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
-        >
-          <option :value="undefined">Any</option>
-          <option value="male">Male</option>
-          <option value="female">Female</option>
-          <option value="other">Other</option>
-          <option value="prefer_not_to_say">Prefer not to say</option>
-        </select>
-      </div>
-      <!-- Date of birth — from -->
-      <div>
-        <label class="block text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Date of birth — from</label>
-        <input
-          v-model="filterDobFrom"
-          type="date"
-          class="w-full rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
-        />
-      </div>
-      <!-- Date of birth — to -->
-      <div>
-        <label class="block text-xs font-medium text-surface-600 dark:text-surface-400 mb-1">Date of birth — to</label>
-        <div class="flex items-center gap-2">
-          <input
-            v-model="filterDobTo"
-            type="date"
-            class="flex-1 rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
-          />
-          <button
-            v-if="activeFilterCount > 0"
-            type="button"
-            class="text-xs text-surface-400 hover:text-danger-500 dark:hover:text-danger-400 transition-colors underline shrink-0"
-            @click="clearFilters"
+      <div class="space-y-6">
+        <!-- Gender -->
+        <div>
+          <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Gender</label>
+          <select
+            v-model="filterGender"
+            class="w-full rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
           >
-            Clear all
-          </button>
+            <option :value="undefined">Any</option>
+            <option value="male">Male</option>
+            <option value="female">Female</option>
+            <option value="other">Other</option>
+            <option value="prefer_not_to_say">Prefer not to say</option>
+          </select>
+        </div>
+
+        <!-- Date of birth range -->
+        <div>
+          <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Date of birth</label>
+          <div class="grid grid-cols-2 gap-2">
+            <div>
+              <span class="block text-[11px] text-surface-500 mb-1">From</span>
+              <input
+                v-model="filterDobFrom"
+                type="date"
+                class="w-full rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
+              />
+            </div>
+            <div>
+              <span class="block text-[11px] text-surface-500 mb-1">To</span>
+              <input
+                v-model="filterDobTo"
+                type="date"
+                class="w-full rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
+              />
+            </div>
+          </div>
+        </div>
+
+        <!-- Sort -->
+        <div>
+          <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Sort by</label>
+          <div class="flex gap-2">
+            <select
+              v-model="sortKey"
+              class="flex-1 rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
+            >
+              <option value="created">Date added</option>
+              <option value="name">Name</option>
+              <option value="email">Email</option>
+              <option value="phone">Phone</option>
+              <option value="applications">Applications</option>
+            </select>
+            <select
+              v-model="sortDir"
+              class="w-32 rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
+            >
+              <option value="asc">Ascending</option>
+              <option value="desc">Descending</option>
+            </select>
+          </div>
+        </div>
+
+        <!-- Property filters -->
+        <div v-if="propertyDefs.length > 0">
+          <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Properties</label>
+          <PropertyFilterBar v-model="propertyFilters" entity-type="candidate" />
         </div>
       </div>
-    </div>
+    </FilterDrawer>
 
     <!-- Loading state -->
     <div v-if="fetchStatus === 'pending'" class="text-center py-12 text-surface-400">
@@ -269,7 +458,7 @@ function cancelEditNotes() {
                   <ArrowUpDown v-else class="size-3.5 opacity-40" />
                 </button>
               </th>
-              <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
+              <th v-if="visibleColumns.email" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
                 <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('email')">
                   Email
                   <ArrowUp v-if="sortKey === 'email' && sortDir === 'asc'" class="size-3.5" />
@@ -277,7 +466,7 @@ function cancelEditNotes() {
                   <ArrowUpDown v-else class="size-3.5 opacity-40" />
                 </button>
               </th>
-              <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden md:table-cell">
+              <th v-if="visibleColumns.phone" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden md:table-cell">
                 <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('phone')">
                   Phone
                   <ArrowUp v-if="sortKey === 'phone' && sortDir === 'asc'" class="size-3.5" />
@@ -285,7 +474,7 @@ function cancelEditNotes() {
                   <ArrowUpDown v-else class="size-3.5 opacity-40" />
                 </button>
               </th>
-              <th class="text-center px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden sm:table-cell">
+              <th v-if="visibleColumns.applications" class="text-center px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden sm:table-cell">
                 <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('applications')">
                   Applications
                   <ArrowUp v-if="sortKey === 'applications' && sortDir === 'asc'" class="size-3.5" />
@@ -293,7 +482,7 @@ function cancelEditNotes() {
                   <ArrowUpDown v-else class="size-3.5 opacity-40" />
                 </button>
               </th>
-              <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
+              <th v-if="visibleColumns.added" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
                 <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('created')">
                   Added
                   <ArrowUp v-if="sortKey === 'created' && sortDir === 'asc'" class="size-3.5" />
@@ -301,16 +490,21 @@ function cancelEditNotes() {
                   <ArrowUpDown v-else class="size-3.5 opacity-40" />
                 </button>
               </th>
-              <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden lg:table-cell w-52">
+              <th v-if="visibleColumns.quickNotes" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden lg:table-cell w-52">
                 Quick notes
               </th>
+              <template v-for="d in propertyDefs" :key="d.id">
+                <th v-if="visibleColumns[`prop_${d.id}`]" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 whitespace-nowrap">
+                  {{ d.name }}
+                </th>
+              </template>
             </tr>
           </thead>
           <tbody class="divide-y divide-surface-100 dark:divide-surface-800">
             <tr
               v-for="c in sortedCandidates"
               :key="c.id"
-              class="group bg-white dark:bg-surface-900 hover:bg-surface-50 dark:hover:bg-surface-800/60 transition-colors cursor-pointer"
+              class="group bg-white dark:bg-surface-900 hover:bg-surface-50 dark:hover:bg-surface-800/60 transition-colors cursor-pointer [&>td]:align-top"
               @click="$router.push($localePath(`/dashboard/candidates/${c.id}`))"
             >
               <td class="px-4 py-3">
@@ -321,7 +515,7 @@ function cancelEditNotes() {
                   {{ formatCandidateName(c) }}
                 </NuxtLink>
               </td>
-              <td class="px-4 py-3 text-surface-500 dark:text-surface-400">
+              <td v-if="visibleColumns.email" class="px-4 py-3 text-surface-500 dark:text-surface-400">
                 <a
                   :href="`mailto:${c.email}`"
                   class="inline-flex items-center gap-1.5 hover:text-brand-600 dark:hover:text-brand-400 hover:underline transition-colors"
@@ -331,14 +525,14 @@ function cancelEditNotes() {
                   <span class="truncate max-w-[200px]">{{ c.email }}</span>
                 </a>
               </td>
-              <td class="px-4 py-3 text-surface-500 dark:text-surface-400 hidden md:table-cell">
+              <td v-if="visibleColumns.phone" class="px-4 py-3 text-surface-500 dark:text-surface-400 hidden md:table-cell">
                 <span v-if="c.phone" class="inline-flex items-center gap-1.5 whitespace-nowrap">
                   <Phone class="size-3.5 shrink-0" />
                   {{ c.phone }}
                 </span>
                 <span v-else class="text-surface-300 dark:text-surface-600">—</span>
               </td>
-              <td class="px-4 py-3 text-center hidden sm:table-cell">
+              <td v-if="visibleColumns.applications" class="px-4 py-3 text-center hidden sm:table-cell">
                 <span
                   v-if="c.applicationCount > 0"
                   class="inline-flex items-center justify-center rounded-full bg-brand-50 dark:bg-brand-950 px-2.5 py-0.5 text-xs font-medium text-brand-700 dark:text-brand-400 tabular-nums"
@@ -347,11 +541,11 @@ function cancelEditNotes() {
                 </span>
                 <span v-else class="text-surface-300 dark:text-surface-600">0</span>
               </td>
-              <td class="px-4 py-3 text-surface-500 dark:text-surface-400 whitespace-nowrap">
+              <td v-if="visibleColumns.added" class="px-4 py-3 text-surface-500 dark:text-surface-400 whitespace-nowrap">
                 <TimelineDateLink :date="c.createdAt">{{ formatDateTime(c.createdAt) }}</TimelineDateLink>
               </td>
-              <!-- Quick notes — inline editable -->
-              <td class="px-4 py-3 hidden lg:table-cell" @click.stop>
+              <!-- Quick notes — inline editable (must match header order) -->
+              <td v-if="visibleColumns.quickNotes" class="px-4 py-3 hidden lg:table-cell w-52 align-top" @click.stop>
                 <div v-if="editingNotesId === c.id" class="flex items-start gap-1.5">
                   <textarea
                     v-model="editingNotesValue"
@@ -390,6 +584,17 @@ function cancelEditNotes() {
                   <span v-else class="text-xs text-surface-300 dark:text-surface-600 group-hover/notes:text-surface-400 transition-colors italic">Add note…</span>
                 </button>
               </td>
+              <!-- Property columns (must come AFTER quick notes to match header order) -->
+              <template v-for="d in propertyDefs" :key="d.id">
+                <td v-if="visibleColumns[`prop_${d.id}`]" class="px-4 py-3 text-surface-500 dark:text-surface-400 align-top">
+                  <PropertyTableCell
+                    entity-type="candidate"
+                    :entity-id="c.id"
+                    :definition="d"
+                    :value="getPropertyValue(c, d.id)"
+                  />
+                </td>
+              </template>
             </tr>
           </tbody>
         </table>
diff --git a/app/pages/dashboard/jobs/index.vue b/app/pages/dashboard/jobs/index.vue
index 47399315..08f818b6 100644
--- a/app/pages/dashboard/jobs/index.vue
+++ b/app/pages/dashboard/jobs/index.vue
@@ -1,7 +1,8 @@
 <script setup lang="ts">
 import {
-  Briefcase, Bell, Plus, Kanban,
-  MapPin,
+  Briefcase, Bell, Plus, Kanban, MapPin, Search, SlidersHorizontal, X,
+  List, LayoutGrid, Table as TableIcon,
+  ArrowUp, ArrowDown, ArrowUpDown, Users, Calendar,
 } from 'lucide-vue-next'
 
 definePageMeta({
@@ -18,7 +19,7 @@ const { activeOrg } = useCurrentOrg()
 const localePath = useLocalePath()
 
 // ─────────────────────────────────────────────
-// Stage config for clickable pipeline counts
+// Stage / status / type config
 // ─────────────────────────────────────────────
 
 const stageConfig = [
@@ -34,16 +35,6 @@ function getStageCount(pipeline: any, key: string): number {
   return pipeline?.[key] ?? 0
 }
 
-// ─────────────────────────────────────────────
-// Fetch jobs with pipeline data
-// ─────────────────────────────────────────────
-
-const { jobs, total, fetchStatus, error, refresh } = useJobs()
-
-// ─────────────────────────────────────────────
-// Job status config
-// ─────────────────────────────────────────────
-
 const statusBadgeClasses: Record<string, string> = {
   draft: 'bg-surface-100 text-surface-600 dark:bg-surface-800 dark:text-surface-400',
   open: 'bg-success-50 text-success-700 dark:bg-success-950 dark:text-success-400',
@@ -58,9 +49,95 @@ const typeLabels: Record<string, string> = {
   internship: 'Internship',
 }
 
+const experienceLabels: Record<string, string> = {
+  junior: 'Junior',
+  mid: 'Mid',
+  senior: 'Senior',
+  lead: 'Lead',
+}
+
+const remoteLabels: Record<string, string> = {
+  remote: 'Remote',
+  hybrid: 'Hybrid',
+  onsite: 'On-site',
+}
+
 // ─────────────────────────────────────────────
-// Sort jobs by urgency: open jobs with new apps first,
-//   then open jobs, drafts, closed, archived
+// Fetch jobs
+// ─────────────────────────────────────────────
+
+const { jobs, total, fetchStatus, error, refresh } = useJobs()
+
+// ─────────────────────────────────────────────
+// Filters & sort & view-mode state
+// ─────────────────────────────────────────────
+
+type StatusFilter = 'open' | 'draft' | 'closed' | 'archived'
+type TypeFilter = 'full_time' | 'part_time' | 'contract' | 'internship'
+type ExperienceFilter = 'junior' | 'mid' | 'senior' | 'lead'
+type RemoteFilter = 'remote' | 'hybrid' | 'onsite'
+type ViewMode = 'list' | 'gallery' | 'table'
+type SortKey = 'priority' | 'title' | 'status' | 'type' | 'created' | 'updated' | 'newApps' | 'totalActive'
+type SortDir = 'asc' | 'desc'
+
+const search = ref('')
+const statusFilter = ref<StatusFilter[]>([])
+const typeFilter = ref<TypeFilter[]>([])
+const experienceFilter = ref<ExperienceFilter[]>([])
+const remoteFilter = ref<RemoteFilter[]>([])
+const sortKey = ref<SortKey>('priority')
+const sortDir = ref<SortDir>('desc')
+const viewMode = ref<ViewMode>('list')
+
+const statusOptions: { value: StatusFilter, label: string }[] = [
+  { value: 'open', label: 'Open' },
+  { value: 'draft', label: 'Draft' },
+  { value: 'closed', label: 'Closed' },
+  { value: 'archived', label: 'Archived' },
+]
+const typeOptions: { value: TypeFilter, label: string }[] = [
+  { value: 'full_time', label: 'Full-time' },
+  { value: 'part_time', label: 'Part-time' },
+  { value: 'contract', label: 'Contract' },
+  { value: 'internship', label: 'Internship' },
+]
+const experienceOptions: { value: ExperienceFilter, label: string }[] = [
+  { value: 'junior', label: 'Junior' },
+  { value: 'mid', label: 'Mid' },
+  { value: 'senior', label: 'Senior' },
+  { value: 'lead', label: 'Lead' },
+]
+const remoteOptions: { value: RemoteFilter, label: string }[] = [
+  { value: 'remote', label: 'Remote' },
+  { value: 'hybrid', label: 'Hybrid' },
+  { value: 'onsite', label: 'On-site' },
+]
+
+function toggleIn<T>(arr: T[], value: T): T[] {
+  return arr.includes(value) ? arr.filter(v => v !== value) : [...arr, value]
+}
+
+const drawerActiveCount = computed(() =>
+  statusFilter.value.length
+  + typeFilter.value.length
+  + experienceFilter.value.length
+  + remoteFilter.value.length,
+)
+
+const hasActiveFilters = computed(() =>
+  drawerActiveCount.value > 0 || search.value.trim().length > 0,
+)
+
+function clearAllFilters() {
+  search.value = ''
+  statusFilter.value = []
+  typeFilter.value = []
+  experienceFilter.value = []
+  remoteFilter.value = []
+}
+
+// ─────────────────────────────────────────────
+// Filter + sort
 // ─────────────────────────────────────────────
 
 const statusPriority: Record<string, number> = {
@@ -70,55 +147,280 @@ const statusPriority: Record<string, number> = {
   archived: 3,
 }
 
+function totalActive(pipeline: any) {
+  return (pipeline?.new ?? 0) + (pipeline?.screening ?? 0) + (pipeline?.interview ?? 0) + (pipeline?.offer ?? 0) + (pipeline?.hired ?? 0)
+}
+
+const filteredJobs = computed(() => {
+  const q = search.value.trim().toLowerCase()
+  return jobs.value.filter((j: any) => {
+    if (q) {
+      const hay = `${j.title ?? ''} ${j.location ?? ''} ${j.description ?? ''}`.toLowerCase()
+      if (!hay.includes(q)) return false
+    }
+    if (statusFilter.value.length && !statusFilter.value.includes(j.status)) return false
+    if (typeFilter.value.length && !typeFilter.value.includes(j.type)) return false
+    if (experienceFilter.value.length) {
+      if (!j.experienceLevel || !experienceFilter.value.includes(j.experienceLevel)) return false
+    }
+    if (remoteFilter.value.length) {
+      if (!j.remoteStatus || !remoteFilter.value.includes(j.remoteStatus)) return false
+    }
+    return true
+  })
+})
+
 const sortedJobs = computed(() => {
-  return [...jobs.value].sort((a, b) => {
-    // First: by status priority
-    const aPriority = statusPriority[a.status] ?? 9
-    const bPriority = statusPriority[b.status] ?? 9
-    if (aPriority !== bPriority) return aPriority - bPriority
-
-    // Within same status: jobs with new applications first
-    const aNew = a.pipeline?.new ?? 0
-    const bNew = b.pipeline?.new ?? 0
-    if (aNew !== bNew) return bNew - aNew
-
-    // Then by total active candidates
-    const aActive = (a.pipeline?.new ?? 0) + (a.pipeline?.screening ?? 0) + (a.pipeline?.interview ?? 0) + (a.pipeline?.offer ?? 0)
-    const bActive = (b.pipeline?.new ?? 0) + (b.pipeline?.screening ?? 0) + (b.pipeline?.interview ?? 0) + (b.pipeline?.offer ?? 0)
-    if (aActive !== bActive) return bActive - aActive
-
-    // Finally by creation date
-    return new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()
+  const dir = sortDir.value === 'asc' ? 1 : -1
+  return [...filteredJobs.value].sort((a: any, b: any) => {
+    switch (sortKey.value) {
+      case 'title':
+        return dir * String(a.title ?? '').localeCompare(String(b.title ?? ''))
+      case 'status':
+        return dir * String(a.status ?? '').localeCompare(String(b.status ?? ''))
+      case 'type':
+        return dir * String(a.type ?? '').localeCompare(String(b.type ?? ''))
+      case 'created':
+        return dir * (new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime())
+      case 'updated':
+        return dir * (new Date(a.updatedAt ?? a.createdAt).getTime() - new Date(b.updatedAt ?? b.createdAt).getTime())
+      case 'newApps':
+        return dir * ((a.pipeline?.new ?? 0) - (b.pipeline?.new ?? 0))
+      case 'totalActive':
+        return dir * (totalActive(a.pipeline) - totalActive(b.pipeline))
+      case 'priority':
+      default: {
+        // Default smart ordering: open w/ new apps first, then status priority, then new, then active, then date
+        const aPriority = statusPriority[a.status] ?? 9
+        const bPriority = statusPriority[b.status] ?? 9
+        if (aPriority !== bPriority) return aPriority - bPriority
+        const aNew = a.pipeline?.new ?? 0
+        const bNew = b.pipeline?.new ?? 0
+        if (aNew !== bNew) return bNew - aNew
+        const aActive = totalActive(a.pipeline)
+        const bActive = totalActive(b.pipeline)
+        if (aActive !== bActive) return bActive - aActive
+        return new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()
+      }
+    }
   })
 })
 
+function toggleSort(key: SortKey) {
+  if (sortKey.value === key) {
+    sortDir.value = sortDir.value === 'asc' ? 'desc' : 'asc'
+  } else {
+    sortKey.value = key
+    sortDir.value = (key === 'created' || key === 'updated' || key === 'newApps' || key === 'totalActive') ? 'desc' : 'asc'
+  }
+}
+
 // ─────────────────────────────────────────────
-// Group jobs: needs attention + others
+// "Needs attention" grouping (list view only,
+// only when using the default smart sort)
 // ─────────────────────────────────────────────
 
+const useSmartGrouping = computed(() => viewMode.value === 'list' && sortKey.value === 'priority')
+
 const jobsNeedingAttention = computed(() =>
-  sortedJobs.value.filter(j => j.status === 'open' && (j.pipeline?.new ?? 0) > 0),
+  useSmartGrouping.value
+    ? sortedJobs.value.filter((j: any) => j.status === 'open' && (j.pipeline?.new ?? 0) > 0)
+    : [],
 )
 
 const otherJobs = computed(() =>
-  sortedJobs.value.filter(j => !(j.status === 'open' && (j.pipeline?.new ?? 0) > 0)),
+  useSmartGrouping.value
+    ? sortedJobs.value.filter((j: any) => !(j.status === 'open' && (j.pipeline?.new ?? 0) > 0))
+    : sortedJobs.value,
 )
 
+const isEmpty = computed(() => jobs.value.length === 0)
+const noResults = computed(() => !isEmpty.value && filteredJobs.value.length === 0)
+
 // ─────────────────────────────────────────────
 // Helpers
 // ─────────────────────────────────────────────
 
-function totalActive(pipeline: any) {
-  return (pipeline?.new ?? 0) + (pipeline?.screening ?? 0) + (pipeline?.interview ?? 0) + (pipeline?.offer ?? 0) + (pipeline?.hired ?? 0)
+function formatDate(date: string | Date) {
+  const diff = Date.now() - new Date(date).getTime()
+  const days = Math.floor(diff / 86_400_000)
+  if (days < 1) return 'Today'
+  if (days < 7) return `${days}d ago`
+  if (days < 30) return `${Math.floor(days / 7)}w ago`
+  return new Date(date).toLocaleDateString()
 }
 
-const isEmpty = computed(() => jobs.value.length === 0)
+// ─────────────────────────────────────────────
+// Column visibility (table view)
+// ─────────────────────────────────────────────
+
+const COLUMNS_STORAGE_KEY = 'reqcore:columns:jobs'
+
+const defaultColumnVisibility = {
+  status: true,
+  type: true,
+  location: true,
+  experience: true,
+  remote: false,
+  newApps: true,
+  totalActive: true,
+  created: true,
+}
+
+const visibleColumns = ref<Record<string, boolean>>({ ...defaultColumnVisibility })
+
+const jobColumns = [
+  { key: 'title', label: 'Title', required: true },
+  { key: 'status', label: 'Status' },
+  { key: 'type', label: 'Type' },
+  { key: 'location', label: 'Location' },
+  { key: 'experience', label: 'Experience' },
+  { key: 'remote', label: 'Remote' },
+  { key: 'newApps', label: 'New apps' },
+  { key: 'totalActive', label: 'Total active' },
+  { key: 'created', label: 'Created' },
+]
+
+onMounted(() => {
+  try {
+    const raw = window.localStorage.getItem(COLUMNS_STORAGE_KEY)
+    if (raw) visibleColumns.value = { ...defaultColumnVisibility, ...JSON.parse(raw) }
+  } catch {}
+})
+
+watch(visibleColumns, (val) => {
+  try { window.localStorage.setItem(COLUMNS_STORAGE_KEY, JSON.stringify(val)) } catch {}
+}, { deep: true })
+
+// ─────────────────────────────────────────────
+// Drawer + Saved Views
+// ─────────────────────────────────────────────
+
+type JobsViewSettings = {
+  status: StatusFilter[]
+  type: TypeFilter[]
+  experience: ExperienceFilter[]
+  remote: RemoteFilter[]
+  sortKey: SortKey
+  sortDir: SortDir
+  viewMode: ViewMode
+  visibleColumns: Record<string, boolean>
+}
+
+const defaultSettings: JobsViewSettings = {
+  status: [],
+  type: [],
+  experience: [],
+  remote: [],
+  sortKey: 'priority',
+  sortDir: 'desc',
+  viewMode: 'list',
+  visibleColumns: { ...defaultColumnVisibility },
+}
+
+const drawerOpen = ref(false)
+
+const currentSettings = computed<JobsViewSettings>(() => ({
+  status: [...statusFilter.value],
+  type: [...typeFilter.value],
+  experience: [...experienceFilter.value],
+  remote: [...remoteFilter.value],
+  sortKey: sortKey.value,
+  sortDir: sortDir.value,
+  viewMode: viewMode.value,
+  visibleColumns: { ...visibleColumns.value },
+}))
+
+function applySettings(s: JobsViewSettings) {
+  statusFilter.value = [...(s.status ?? [])]
+  typeFilter.value = [...(s.type ?? [])]
+  experienceFilter.value = [...(s.experience ?? [])]
+  remoteFilter.value = [...(s.remote ?? [])]
+  sortKey.value = s.sortKey ?? 'priority'
+  sortDir.value = s.sortDir ?? 'desc'
+  viewMode.value = s.viewMode ?? 'list'
+  visibleColumns.value = { ...defaultColumnVisibility, ...(s.visibleColumns ?? {}) }
+}
+
+const {
+  views,
+  activeViewId,
+  applyView,
+  saveView,
+  updateView,
+  deleteView,
+  setDefault,
+  clearActive,
+} = useSavedViews<JobsViewSettings>('jobs', defaultSettings)
+
+onMounted(() => {
+  nextTick(() => {
+    if (activeViewId.value) {
+      const s = applyView(activeViewId.value)
+      if (s) applySettings(s)
+    }
+  })
+})
+
+function arrEqual<T>(a: T[], b: T[]) {
+  if (a.length !== b.length) return false
+  const sa = [...a].sort()
+  const sb = [...b].sort()
+  return sa.every((v, i) => v === sb[i])
+}
+
+function colsEqual(a: Record<string, boolean>, b: Record<string, boolean>) {
+  const keys = new Set([...Object.keys(a), ...Object.keys(b)])
+  for (const k of keys) if (Boolean(a[k]) !== Boolean(b[k])) return false
+  return true
+}
+
+function settingsEqual(a: JobsViewSettings, b: JobsViewSettings) {
+  return arrEqual(a.status, b.status)
+    && arrEqual(a.type, b.type)
+    && arrEqual(a.experience, b.experience)
+    && arrEqual(a.remote, b.remote)
+    && a.sortKey === b.sortKey
+    && a.sortDir === b.sortDir
+    && a.viewMode === b.viewMode
+    && colsEqual(a.visibleColumns, b.visibleColumns)
+}
+
+const isDirty = computed(() => {
+  const view = views.value.find(v => v.id === activeViewId.value)
+  if (!view) return false
+  return !settingsEqual(currentSettings.value, { ...defaultSettings, ...view.settings })
+})
+
+function onSelectView(id: string | null) {
+  if (id == null) {
+    clearActive()
+    applySettings(defaultSettings)
+    return
+  }
+  const s = applyView(id)
+  if (s) applySettings(s)
+}
+
+function onSaveView(name: string) {
+  saveView(name, currentSettings.value)
+}
+
+function onUpdateView(id: string) {
+  updateView(id, { settings: currentSettings.value })
+}
+
+const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
+  { value: 'list', label: 'List', icon: List },
+  { value: 'gallery', label: 'Gallery', icon: LayoutGrid },
+  { value: 'table', label: 'Table', icon: TableIcon },
+]
 </script>
 
 <template>
-  <div class="mx-auto max-w-4xl">
+  <div class="mx-auto max-w-6xl">
     <!-- ─── Header ─── -->
-    <div class="flex items-center justify-between mb-8">
+    <div class="flex items-center justify-between mb-6">
       <div>
         <h1 class="text-2xl font-bold text-surface-900 dark:text-surface-50">My Jobs</h1>
         <p v-if="activeOrg" class="text-sm text-surface-500 dark:text-surface-400 mt-1">
@@ -147,10 +449,6 @@ const isEmpty = computed(() => jobs.value.length === 0)
             <div class="h-5 w-16 bg-surface-200 dark:bg-surface-700 rounded-full" />
           </div>
           <div class="h-2 w-full bg-surface-200 dark:bg-surface-700 rounded mb-3" />
-          <div class="flex gap-4">
-            <div class="h-4 w-20 bg-surface-200 dark:bg-surface-700 rounded" />
-            <div class="h-4 w-20 bg-surface-200 dark:bg-surface-700 rounded" />
-          </div>
         </div>
       </div>
     </div>
@@ -164,7 +462,7 @@ const isEmpty = computed(() => jobs.value.length === 0)
       <button class="underline ml-1 cursor-pointer" @click="refresh()">Retry</button>
     </div>
 
-    <!-- ─── Empty state ─── -->
+    <!-- ─── Empty state (no jobs at all) ─── -->
     <div v-else-if="isEmpty" class="flex flex-col items-center justify-center py-20">
       <div class="rounded-2xl border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-10 text-center max-w-md">
         <Briefcase class="size-12 text-brand-400 mx-auto mb-4" />
@@ -186,54 +484,360 @@ const isEmpty = computed(() => jobs.value.length === 0)
 
     <!-- ─── Jobs content ─── -->
     <template v-else>
-      <!-- ─── Needs attention section ─── -->
-      <div v-if="jobsNeedingAttention.length > 0" class="mb-8">
-        <div class="flex items-center gap-2 mb-3 px-1">
-          <Bell class="size-4 text-warning-500" />
-          <h2 class="text-sm font-semibold text-surface-900 dark:text-surface-100">
-            Needs your attention
-          </h2>
-          <span class="text-xs text-surface-400 dark:text-surface-500">
-            {{ jobsNeedingAttention.length }} job{{ jobsNeedingAttention.length === 1 ? '' : 's' }}
-          </span>
+      <!-- Search + Views + Columns + Filters + View-mode -->
+      <div class="flex flex-wrap items-center gap-2 mb-4">
+        <div class="relative flex-1 min-w-[220px]">
+          <Search class="size-4 text-surface-400 absolute left-3 top-1/2 -translate-y-1/2 pointer-events-none" />
+          <input
+            v-model="search"
+            type="search"
+            placeholder="Search jobs by title, location, or description"
+            class="w-full rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 pl-9 pr-3 py-2 text-sm text-surface-900 dark:text-surface-100 placeholder:text-surface-400 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
+          />
         </div>
 
-        <div class="space-y-3">
-          <div
-            v-for="j in jobsNeedingAttention"
-            :key="j.id"
-            class="rounded-xl border border-warning-200 dark:border-warning-900/50 bg-white dark:bg-surface-900 overflow-hidden"
+        <SavedViewsMenu
+          :views="views"
+          :active-view-id="activeViewId"
+          :is-dirty="isDirty"
+          @select="onSelectView"
+          @save="onSaveView"
+          @update="onUpdateView"
+          @delete="deleteView"
+          @set-default="setDefault"
+        />
+
+        <ColumnsMenu
+          v-if="viewMode === 'table'"
+          v-model="visibleColumns"
+          :columns="jobColumns"
+        />
+
+        <button
+          type="button"
+          class="inline-flex items-center gap-1.5 rounded-lg border px-3 py-2 text-sm font-medium transition-colors cursor-pointer"
+          :class="drawerActiveCount > 0
+            ? 'border-surface-400 bg-surface-100 text-surface-800 dark:border-surface-500 dark:bg-surface-800 dark:text-surface-200'
+            : 'border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 text-surface-600 dark:text-surface-400 hover:bg-surface-50 dark:hover:bg-surface-800'"
+          @click="drawerOpen = true"
+        >
+          <SlidersHorizontal class="size-4" />
+          Filters
+          <span
+            v-if="drawerActiveCount > 0"
+            class="inline-flex items-center justify-center min-w-[1rem] h-4 px-1 rounded-full bg-surface-700 dark:bg-surface-300 text-white dark:text-surface-900 text-[10px] font-semibold"
+          >{{ drawerActiveCount }}</span>
+        </button>
+
+        <!-- View mode switcher -->
+        <div
+          class="inline-flex rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-0.5"
+          role="tablist"
+          aria-label="View mode"
+        >
+          <button
+            v-for="opt in viewModeOptions"
+            :key="opt.value"
+            type="button"
+            role="tab"
+            :aria-selected="viewMode === opt.value"
+            :title="`${opt.label} view`"
+            class="inline-flex items-center gap-1.5 rounded-md px-2.5 py-1.5 text-xs font-medium transition-colors cursor-pointer"
+            :class="viewMode === opt.value
+              ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
+              : 'text-surface-500 dark:text-surface-400 hover:bg-surface-100 dark:hover:bg-surface-800'"
+            @click="viewMode = opt.value"
           >
-            <!-- Card header — job info -->
-            <div class="px-5 pt-4 pb-3">
-              <div class="flex items-start justify-between mb-2">
-                <div class="min-w-0 flex-1">
-                  <div class="flex items-center gap-2.5 mb-1">
-                    <NuxtLink
-                      :to="localePath(`/dashboard/jobs/${j.id}`)"
-                      class="text-base font-semibold text-surface-900 dark:text-surface-100 hover:text-brand-600 dark:hover:text-brand-400 transition-colors truncate no-underline"
-                    >
-                      {{ j.title }}
-                    </NuxtLink>
-                    <span
-                      class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium shrink-0 capitalize"
-                      :class="statusBadgeClasses[j.status]"
-                    >
-                      {{ j.status }}
-                    </span>
-                  </div>
-                  <div class="flex items-center gap-3 text-xs text-surface-400">
-                    <span>{{ typeLabels[j.type] ?? j.type }}</span>
-                    <span v-if="j.location" class="inline-flex items-center gap-1">
-                      <MapPin class="size-3" />
-                      {{ j.location }}
-                    </span>
+            <component :is="opt.icon" class="size-3.5" />
+            <span class="hidden sm:inline">{{ opt.label }}</span>
+          </button>
+        </div>
+
+        <button
+          v-if="hasActiveFilters"
+          class="inline-flex items-center gap-1 text-xs text-surface-400 hover:text-danger-600 transition-colors cursor-pointer"
+          @click="clearAllFilters"
+        >
+          <X class="size-3" />
+          Clear
+        </button>
+      </div>
+
+      <!-- ─── Filter drawer ─── -->
+      <FilterDrawer
+        v-model="drawerOpen"
+        title="Filter jobs"
+        description="Customize your view, then save it for quick access."
+        :active-count="drawerActiveCount"
+        saveable
+        :default-save-name="`View ${views.length + 1}`"
+        @reset="applySettings(defaultSettings)"
+        @save-view="onSaveView"
+      >
+        <div class="space-y-6">
+          <!-- Status -->
+          <div>
+            <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Status</label>
+            <div class="flex flex-wrap gap-1.5">
+              <button
+                v-for="opt in statusOptions"
+                :key="opt.value"
+                type="button"
+                class="rounded-full px-3 py-1.5 text-xs font-medium transition-colors"
+                :class="statusFilter.includes(opt.value)
+                  ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
+                  : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
+                @click="statusFilter = toggleIn(statusFilter, opt.value)"
+              >{{ opt.label }}</button>
+            </div>
+          </div>
+
+          <!-- Employment type -->
+          <div>
+            <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Employment type</label>
+            <div class="flex flex-wrap gap-1.5">
+              <button
+                v-for="opt in typeOptions"
+                :key="opt.value"
+                type="button"
+                class="rounded-full px-3 py-1.5 text-xs font-medium transition-colors"
+                :class="typeFilter.includes(opt.value)
+                  ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
+                  : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
+                @click="typeFilter = toggleIn(typeFilter, opt.value)"
+              >{{ opt.label }}</button>
+            </div>
+          </div>
+
+          <!-- Experience -->
+          <div>
+            <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Experience</label>
+            <div class="flex flex-wrap gap-1.5">
+              <button
+                v-for="opt in experienceOptions"
+                :key="opt.value"
+                type="button"
+                class="rounded-full px-3 py-1.5 text-xs font-medium transition-colors"
+                :class="experienceFilter.includes(opt.value)
+                  ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
+                  : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
+                @click="experienceFilter = toggleIn(experienceFilter, opt.value)"
+              >{{ opt.label }}</button>
+            </div>
+          </div>
+
+          <!-- Work arrangement -->
+          <div>
+            <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Work arrangement</label>
+            <div class="flex flex-wrap gap-1.5">
+              <button
+                v-for="opt in remoteOptions"
+                :key="opt.value"
+                type="button"
+                class="rounded-full px-3 py-1.5 text-xs font-medium transition-colors"
+                :class="remoteFilter.includes(opt.value)
+                  ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
+                  : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
+                @click="remoteFilter = toggleIn(remoteFilter, opt.value)"
+              >{{ opt.label }}</button>
+            </div>
+          </div>
+
+          <!-- Sort -->
+          <div>
+            <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Sort by</label>
+            <div class="flex gap-2">
+              <select
+                v-model="sortKey"
+                class="flex-1 rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
+              >
+                <option value="priority">Smart (needs attention first)</option>
+                <option value="title">Title</option>
+                <option value="status">Status</option>
+                <option value="type">Employment type</option>
+                <option value="newApps">New applications</option>
+                <option value="totalActive">Total active candidates</option>
+                <option value="created">Created date</option>
+                <option value="updated">Updated date</option>
+              </select>
+              <select
+                v-model="sortDir"
+                class="w-32 rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
+              >
+                <option value="asc">Ascending</option>
+                <option value="desc">Descending</option>
+              </select>
+            </div>
+          </div>
+
+          <!-- Default view mode -->
+          <div>
+            <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Default view mode</label>
+            <div class="flex flex-wrap gap-1.5">
+              <button
+                v-for="opt in viewModeOptions"
+                :key="opt.value"
+                type="button"
+                class="inline-flex items-center gap-1.5 rounded-full px-3 py-1.5 text-xs font-medium transition-colors"
+                :class="viewMode === opt.value
+                  ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
+                  : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
+                @click="viewMode = opt.value"
+              >
+                <component :is="opt.icon" class="size-3.5" />
+                {{ opt.label }}
+              </button>
+            </div>
+            <p class="text-[11px] text-surface-400 dark:text-surface-500 mt-2">
+              Saved with this view so it opens the way you like.
+            </p>
+          </div>
+        </div>
+      </FilterDrawer>
+
+      <!-- ─── No-results state ─── -->
+      <div
+        v-if="noResults"
+        class="rounded-xl border border-dashed border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-10 text-center"
+      >
+        <Search class="size-8 text-surface-300 dark:text-surface-600 mx-auto mb-3" />
+        <p class="text-sm text-surface-600 dark:text-surface-300 mb-1">No jobs match your search</p>
+        <p class="text-xs text-surface-400 dark:text-surface-500 mb-3">Try a different keyword or clear your filters.</p>
+        <button
+          class="text-sm text-brand-600 hover:text-brand-700 font-medium transition-colors"
+          @click="clearAllFilters"
+        >
+          Clear all filters
+        </button>
+      </div>
+
+      <!-- ════════════════════════════════════════════ -->
+      <!--                 LIST VIEW                    -->
+      <!-- ════════════════════════════════════════════ -->
+      <template v-else-if="viewMode === 'list'">
+        <!-- Needs attention section -->
+        <div v-if="jobsNeedingAttention.length > 0" class="mb-8">
+          <div class="flex items-center gap-2 mb-3 px-1">
+            <Bell class="size-4 text-warning-500" />
+            <h2 class="text-sm font-semibold text-surface-900 dark:text-surface-100">
+              Needs your attention
+            </h2>
+            <span class="text-xs text-surface-400 dark:text-surface-500">
+              {{ jobsNeedingAttention.length }} job{{ jobsNeedingAttention.length === 1 ? '' : 's' }}
+            </span>
+          </div>
+
+          <div class="space-y-3">
+            <div
+              v-for="j in jobsNeedingAttention"
+              :key="j.id"
+              class="rounded-xl border border-warning-200 dark:border-warning-900/50 bg-white dark:bg-surface-900 overflow-hidden"
+            >
+              <div class="px-5 pt-4 pb-3">
+                <div class="flex items-start justify-between mb-2">
+                  <div class="min-w-0 flex-1">
+                    <div class="flex items-center gap-2.5 mb-1">
+                      <NuxtLink
+                        :to="localePath(`/dashboard/jobs/${j.id}`)"
+                        class="text-base font-semibold text-surface-900 dark:text-surface-100 hover:text-brand-600 dark:hover:text-brand-400 transition-colors truncate no-underline"
+                      >
+                        {{ j.title }}
+                      </NuxtLink>
+                      <span
+                        class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium shrink-0 capitalize"
+                        :class="statusBadgeClasses[j.status]"
+                      >
+                        {{ j.status }}
+                      </span>
+                    </div>
+                    <div class="flex items-center gap-3 text-xs text-surface-400">
+                      <span>{{ typeLabels[j.type] ?? j.type }}</span>
+                      <span v-if="j.location" class="inline-flex items-center gap-1">
+                        <MapPin class="size-3" />
+                        {{ j.location }}
+                      </span>
+                    </div>
                   </div>
                 </div>
+
+                <div class="grid grid-cols-3 sm:grid-cols-6 gap-2 mt-3">
+                  <NuxtLink
+                    v-for="stage in stageConfig"
+                    :key="stage.key"
+                    :to="localePath(`/dashboard/jobs/${j.id}?stage=${stage.key}`)"
+                    class="rounded-lg px-2 py-1.5 text-center transition-colors no-underline hover:ring-1 hover:ring-brand-300 dark:hover:ring-brand-700"
+                    :class="[stage.bgColor, getStageCount(j.pipeline, stage.key) > 0 ? 'cursor-pointer' : 'opacity-60']"
+                  >
+                    <div class="text-sm font-bold tabular-nums" :class="stage.textColor">
+                      {{ getStageCount(j.pipeline, stage.key) }}
+                    </div>
+                    <div class="text-[10px] font-medium text-surface-500 dark:text-surface-400">
+                      {{ stage.label }}
+                    </div>
+                  </NuxtLink>
+                </div>
+              </div>
+
+              <div class="flex items-center gap-2 px-5 py-3 bg-warning-50/50 dark:bg-warning-950/20 border-t border-warning-100 dark:border-warning-900/30">
+                <span class="text-xs font-medium text-warning-700 dark:text-warning-400 mr-auto">
+                  {{ j.pipeline.new }} new application{{ j.pipeline.new === 1 ? '' : 's' }} to review
+                </span>
+                <NuxtLink
+                  :to="$localePath(`/dashboard/jobs/${j.id}`)"
+                  class="inline-flex items-center gap-1.5 rounded-md bg-brand-600 px-3 py-1.5 text-xs font-medium text-white hover:bg-brand-700 transition-colors no-underline"
+                >
+                  <Kanban class="size-3" />
+                  Review in Pipeline
+                </NuxtLink>
+              </div>
+            </div>
+          </div>
+        </div>
+
+        <!-- All other jobs -->
+        <div>
+          <div v-if="jobsNeedingAttention.length > 0" class="flex items-center gap-2 mb-3 px-1">
+            <Briefcase class="size-4 text-surface-400" />
+            <h2 class="text-sm font-semibold text-surface-900 dark:text-surface-100">
+              All jobs
+            </h2>
+            <span class="text-xs text-surface-400 dark:text-surface-500">
+              {{ otherJobs.length }} job{{ otherJobs.length === 1 ? '' : 's' }}
+            </span>
+          </div>
+
+          <div class="space-y-3">
+            <div
+              v-for="j in otherJobs"
+              :key="j.id"
+              class="rounded-xl border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 px-5 py-4 hover:border-surface-300 dark:hover:border-surface-700 hover:shadow-sm transition-all"
+            >
+              <div class="flex items-center gap-2.5 mb-1">
+                <NuxtLink
+                  :to="localePath(`/dashboard/jobs/${j.id}`)"
+                  class="text-sm font-semibold text-surface-900 dark:text-surface-100 hover:text-brand-600 dark:hover:text-brand-400 transition-colors truncate no-underline"
+                >
+                  {{ j.title }}
+                </NuxtLink>
+                <span
+                  class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium shrink-0 capitalize"
+                  :class="statusBadgeClasses[j.status] ?? 'bg-surface-100 text-surface-600'"
+                >
+                  {{ j.status }}
+                </span>
+              </div>
+              <div class="flex items-center gap-3 text-xs text-surface-400 mb-3">
+                <span>{{ typeLabels[j.type] ?? j.type }}</span>
+                <span v-if="j.location" class="inline-flex items-center gap-1">
+                  <MapPin class="size-3" />
+                  {{ j.location }}
+                </span>
+                <span v-if="j.status === 'draft'" class="text-surface-400 italic">
+                  Not published yet
+                </span>
               </div>
 
-              <!-- Stage counts -->
-              <div class="grid grid-cols-3 sm:grid-cols-6 gap-2 mt-3">
+              <div class="grid grid-cols-3 sm:grid-cols-6 gap-2">
                 <NuxtLink
                   v-for="stage in stageConfig"
                   :key="stage.key"
@@ -250,92 +854,220 @@ const isEmpty = computed(() => jobs.value.length === 0)
                 </NuxtLink>
               </div>
             </div>
-
-            <!-- Action bar -->
-            <div class="flex items-center gap-2 px-5 py-3 bg-warning-50/50 dark:bg-warning-950/20 border-t border-warning-100 dark:border-warning-900/30">
-              <span class="text-xs font-medium text-warning-700 dark:text-warning-400 mr-auto">
-                {{ j.pipeline.new }} new application{{ j.pipeline.new === 1 ? '' : 's' }} to review
-              </span>
-              <NuxtLink
-                :to="$localePath(`/dashboard/jobs/${j.id}`)"
-                class="inline-flex items-center gap-1.5 rounded-md bg-brand-600 px-3 py-1.5 text-xs font-medium text-white hover:bg-brand-700 transition-colors no-underline"
-              >
-                <Kanban class="size-3" />
-                Review in Pipeline
-              </NuxtLink>
-            </div>
           </div>
         </div>
-      </div>
-
-      <!-- ─── All other jobs ─── -->
-      <div>
-        <div v-if="jobsNeedingAttention.length > 0" class="flex items-center gap-2 mb-3 px-1">
-          <Briefcase class="size-4 text-surface-400" />
-          <h2 class="text-sm font-semibold text-surface-900 dark:text-surface-100">
-            All jobs
-          </h2>
-          <span class="text-xs text-surface-400 dark:text-surface-500">
-            {{ otherJobs.length }} job{{ otherJobs.length === 1 ? '' : 's' }}
-          </span>
-        </div>
+      </template>
 
-        <div class="space-y-3">
-          <div
-            v-for="j in otherJobs"
+      <!-- ════════════════════════════════════════════ -->
+      <!--                GALLERY VIEW                  -->
+      <!-- ════════════════════════════════════════════ -->
+      <template v-else-if="viewMode === 'gallery'">
+        <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
+          <NuxtLink
+            v-for="j in sortedJobs"
             :key="j.id"
-            class="rounded-xl border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 px-5 py-4 hover:border-surface-300 dark:hover:border-surface-700 hover:shadow-sm transition-all"
+            :to="localePath(`/dashboard/jobs/${j.id}`)"
+            class="group flex flex-col rounded-xl border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 overflow-hidden hover:border-brand-300 dark:hover:border-brand-700 hover:shadow-md transition-all no-underline"
           >
-            <!-- Job info -->
-            <div class="flex items-center gap-2.5 mb-1">
-              <NuxtLink
-                :to="localePath(`/dashboard/jobs/${j.id}`)"
-                class="text-sm font-semibold text-surface-900 dark:text-surface-100 hover:text-brand-600 dark:hover:text-brand-400 transition-colors truncate no-underline"
-              >
-                {{ j.title }}
-              </NuxtLink>
+            <!-- Banner -->
+            <div
+              class="h-20 px-4 py-3 flex items-start justify-between"
+              :class="(j.pipeline?.new ?? 0) > 0
+                ? 'bg-gradient-to-br from-warning-50 to-warning-100 dark:from-warning-950/40 dark:to-warning-900/20'
+                : 'bg-gradient-to-br from-brand-50 to-brand-100/50 dark:from-brand-950/40 dark:to-brand-900/20'"
+            >
+              <Briefcase
+                class="size-5"
+                :class="(j.pipeline?.new ?? 0) > 0 ? 'text-warning-600 dark:text-warning-400' : 'text-brand-600 dark:text-brand-400'"
+              />
               <span
-                class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium shrink-0 capitalize"
+                class="inline-flex items-center rounded-full px-2 py-0.5 text-[11px] font-medium capitalize"
                 :class="statusBadgeClasses[j.status] ?? 'bg-surface-100 text-surface-600'"
               >
                 {{ j.status }}
               </span>
             </div>
-            <div class="flex items-center gap-3 text-xs text-surface-400 mb-3">
-              <span>{{ typeLabels[j.type] ?? j.type }}</span>
-              <span v-if="j.location" class="inline-flex items-center gap-1">
-                <MapPin class="size-3" />
-                {{ j.location }}
+
+            <div class="flex-1 px-4 py-3">
+              <h3 class="text-sm font-semibold text-surface-900 dark:text-surface-100 group-hover:text-brand-600 dark:group-hover:text-brand-400 transition-colors line-clamp-2 mb-1">
+                {{ j.title }}
+              </h3>
+              <div class="flex flex-wrap items-center gap-x-3 gap-y-1 text-[11px] text-surface-500 dark:text-surface-400 mb-3">
+                <span>{{ typeLabels[j.type] ?? j.type }}</span>
+                <span v-if="j.location" class="inline-flex items-center gap-1 truncate max-w-[150px]">
+                  <MapPin class="size-3 shrink-0" />
+                  <span class="truncate">{{ j.location }}</span>
+                </span>
+                <span v-if="j.experienceLevel">{{ experienceLabels[j.experienceLevel] }}</span>
+                <span v-if="j.remoteStatus">{{ remoteLabels[j.remoteStatus] }}</span>
+              </div>
+
+              <!-- Pipeline strip -->
+              <div class="grid grid-cols-6 gap-1 mb-3">
+                <div
+                  v-for="stage in stageConfig"
+                  :key="stage.key"
+                  :title="`${stage.label}: ${getStageCount(j.pipeline, stage.key)}`"
+                  class="rounded px-1 py-1 text-center"
+                  :class="[stage.bgColor, getStageCount(j.pipeline, stage.key) > 0 ? '' : 'opacity-50']"
+                >
+                  <div class="text-xs font-bold tabular-nums leading-none" :class="stage.textColor">
+                    {{ getStageCount(j.pipeline, stage.key) }}
+                  </div>
+                </div>
+              </div>
+            </div>
+
+            <div class="px-4 py-2.5 border-t border-surface-100 dark:border-surface-800 flex items-center justify-between text-[11px] text-surface-500 dark:text-surface-400">
+              <span class="inline-flex items-center gap-1">
+                <Users class="size-3" />
+                {{ totalActive(j.pipeline) }} active
               </span>
-              <span v-if="j.status === 'draft'" class="text-surface-400 italic">
-                Not published yet
+              <span class="inline-flex items-center gap-1">
+                <Calendar class="size-3" />
+                {{ formatDate(j.createdAt) }}
               </span>
             </div>
+          </NuxtLink>
+        </div>
+      </template>
 
-            <!-- Stage counts -->
-            <div class="grid grid-cols-3 sm:grid-cols-6 gap-2">
-              <NuxtLink
-                v-for="stage in stageConfig"
-                :key="stage.key"
-                :to="localePath(`/dashboard/jobs/${j.id}?stage=${stage.key}`)"
-                class="rounded-lg px-2 py-1.5 text-center transition-colors no-underline hover:ring-1 hover:ring-brand-300 dark:hover:ring-brand-700"
-                :class="[stage.bgColor, getStageCount(j.pipeline, stage.key) > 0 ? 'cursor-pointer' : 'opacity-60']"
+      <!-- ════════════════════════════════════════════ -->
+      <!--                 TABLE VIEW                   -->
+      <!-- ════════════════════════════════════════════ -->
+      <template v-else-if="viewMode === 'table'">
+        <div class="overflow-x-auto rounded-lg border border-surface-200 dark:border-surface-800">
+          <table class="w-full text-sm">
+            <thead>
+              <tr class="bg-surface-50 dark:bg-surface-800/50 border-b border-surface-200 dark:border-surface-800">
+                <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
+                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('title')">
+                    Title
+                    <ArrowUp v-if="sortKey === 'title' && sortDir === 'asc'" class="size-3.5" />
+                    <ArrowDown v-else-if="sortKey === 'title' && sortDir === 'desc'" class="size-3.5" />
+                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
+                  </button>
+                </th>
+                <th v-if="visibleColumns.status" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
+                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('status')">
+                    Status
+                    <ArrowUp v-if="sortKey === 'status' && sortDir === 'asc'" class="size-3.5" />
+                    <ArrowDown v-else-if="sortKey === 'status' && sortDir === 'desc'" class="size-3.5" />
+                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
+                  </button>
+                </th>
+                <th v-if="visibleColumns.type" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden md:table-cell">
+                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('type')">
+                    Type
+                    <ArrowUp v-if="sortKey === 'type' && sortDir === 'asc'" class="size-3.5" />
+                    <ArrowDown v-else-if="sortKey === 'type' && sortDir === 'desc'" class="size-3.5" />
+                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
+                  </button>
+                </th>
+                <th v-if="visibleColumns.location" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden lg:table-cell">
+                  Location
+                </th>
+                <th v-if="visibleColumns.experience" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden lg:table-cell">
+                  Experience
+                </th>
+                <th v-if="visibleColumns.remote" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden xl:table-cell">
+                  Remote
+                </th>
+                <th v-if="visibleColumns.newApps" class="text-center px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
+                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('newApps')">
+                    New
+                    <ArrowUp v-if="sortKey === 'newApps' && sortDir === 'asc'" class="size-3.5" />
+                    <ArrowDown v-else-if="sortKey === 'newApps' && sortDir === 'desc'" class="size-3.5" />
+                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
+                  </button>
+                </th>
+                <th v-if="visibleColumns.totalActive" class="text-center px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden sm:table-cell">
+                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('totalActive')">
+                    Active
+                    <ArrowUp v-if="sortKey === 'totalActive' && sortDir === 'asc'" class="size-3.5" />
+                    <ArrowDown v-else-if="sortKey === 'totalActive' && sortDir === 'desc'" class="size-3.5" />
+                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
+                  </button>
+                </th>
+                <th v-if="visibleColumns.created" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden md:table-cell">
+                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('created')">
+                    Created
+                    <ArrowUp v-if="sortKey === 'created' && sortDir === 'asc'" class="size-3.5" />
+                    <ArrowDown v-else-if="sortKey === 'created' && sortDir === 'desc'" class="size-3.5" />
+                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
+                  </button>
+                </th>
+              </tr>
+            </thead>
+            <tbody class="divide-y divide-surface-100 dark:divide-surface-800">
+              <tr
+                v-for="j in sortedJobs"
+                :key="j.id"
+                class="group bg-white dark:bg-surface-900 hover:bg-surface-50 dark:hover:bg-surface-800/60 transition-colors cursor-pointer"
+                @click="$router.push(localePath(`/dashboard/jobs/${j.id}`))"
               >
-                <div class="text-sm font-bold tabular-nums" :class="stage.textColor">
-                  {{ getStageCount(j.pipeline, stage.key) }}
-                </div>
-                <div class="text-[10px] font-medium text-surface-500 dark:text-surface-400">
-                  {{ stage.label }}
-                </div>
-              </NuxtLink>
-            </div>
-          </div>
+                <td class="px-4 py-3">
+                  <NuxtLink
+                    :to="localePath(`/dashboard/jobs/${j.id}`)"
+                    class="font-semibold text-surface-900 dark:text-surface-100 group-hover:text-brand-600 transition-colors no-underline"
+                    @click.stop
+                  >
+                    {{ j.title }}
+                  </NuxtLink>
+                </td>
+                <td v-if="visibleColumns.status" class="px-4 py-3">
+                  <span
+                    class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium capitalize whitespace-nowrap"
+                    :class="statusBadgeClasses[j.status] ?? 'bg-surface-100 text-surface-600'"
+                  >
+                    {{ j.status }}
+                  </span>
+                </td>
+                <td v-if="visibleColumns.type" class="px-4 py-3 text-surface-600 dark:text-surface-300 hidden md:table-cell whitespace-nowrap">
+                  {{ typeLabels[j.type] ?? j.type }}
+                </td>
+                <td v-if="visibleColumns.location" class="px-4 py-3 text-surface-500 dark:text-surface-400 hidden lg:table-cell">
+                  <span v-if="j.location" class="inline-flex items-center gap-1.5 truncate max-w-[200px]">
+                    <MapPin class="size-3.5 shrink-0" />
+                    <span class="truncate">{{ j.location }}</span>
+                  </span>
+                  <span v-else class="text-surface-300 dark:text-surface-600">—</span>
+                </td>
+                <td v-if="visibleColumns.experience" class="px-4 py-3 text-surface-600 dark:text-surface-300 hidden lg:table-cell capitalize whitespace-nowrap">
+                  {{ j.experienceLevel ? experienceLabels[j.experienceLevel] : '—' }}
+                </td>
+                <td v-if="visibleColumns.remote" class="px-4 py-3 text-surface-600 dark:text-surface-300 hidden xl:table-cell whitespace-nowrap">
+                  {{ j.remoteStatus ? remoteLabels[j.remoteStatus] : '—' }}
+                </td>
+                <td v-if="visibleColumns.newApps" class="px-4 py-3 text-center">
+                  <span
+                    v-if="(j.pipeline?.new ?? 0) > 0"
+                    class="inline-flex items-center justify-center min-w-[1.5rem] rounded-full px-2 py-0.5 text-xs font-bold bg-blue-50 text-blue-700 dark:bg-blue-950 dark:text-blue-400"
+                  >
+                    {{ j.pipeline.new }}
+                  </span>
+                  <span v-else class="text-surface-300 dark:text-surface-600">0</span>
+                </td>
+                <td v-if="visibleColumns.totalActive" class="px-4 py-3 text-center hidden sm:table-cell tabular-nums text-surface-700 dark:text-surface-300">
+                  {{ totalActive(j.pipeline) }}
+                </td>
+                <td v-if="visibleColumns.created" class="px-4 py-3 text-surface-500 dark:text-surface-400 hidden md:table-cell whitespace-nowrap">
+                  {{ formatDate(j.createdAt) }}
+                </td>
+              </tr>
+            </tbody>
+          </table>
         </div>
-      </div>
+      </template>
 
       <!-- Total count -->
-      <p class="text-xs text-surface-400 pt-4 px-1">
-        {{ total }} job{{ total === 1 ? '' : 's' }} total
+      <p v-if="!noResults" class="text-xs text-surface-400 pt-4 px-1">
+        <template v-if="hasActiveFilters">
+          Showing {{ filteredJobs.length }} of {{ total }} job{{ total === 1 ? '' : 's' }}
+        </template>
+        <template v-else>
+          {{ total }} job{{ total === 1 ? '' : 's' }} total
+        </template>
       </p>
     </template>
   </div>
diff --git a/server/api/applications/[id].get.ts b/server/api/applications/[id].get.ts
index 0ebd54d1..aa5ea2e9 100644
--- a/server/api/applications/[id].get.ts
+++ b/server/api/applications/[id].get.ts
@@ -1,6 +1,7 @@
 import { eq, and } from 'drizzle-orm'
 import { application } from '../../database/schema'
 import { applicationIdParamSchema } from '../../utils/schemas/application'
+import { loadPropertyEntriesForEntity } from '../../utils/properties'
 
 /**
  * GET /api/applications/:id
@@ -48,5 +49,12 @@ export default defineEventHandler(async (event) => {
     throw createError({ statusCode: 404, statusMessage: 'Not found' })
   }
 
-  return result
+  const properties = await loadPropertyEntriesForEntity({
+    organizationId: orgId,
+    entityType: 'application',
+    entityId: result.id,
+    jobId: result.jobId,
+  })
+
+  return { ...result, properties }
 })
diff --git a/server/api/applications/[id]/properties/[propId].put.ts b/server/api/applications/[id]/properties/[propId].put.ts
new file mode 100644
index 00000000..4fab3c6f
--- /dev/null
+++ b/server/api/applications/[id]/properties/[propId].put.ts
@@ -0,0 +1,84 @@
+import { and, eq } from 'drizzle-orm'
+import { z } from 'zod'
+import { application, propertyDefinition, propertyValue } from '../../../../database/schema'
+import {
+  setPropertyValueSchema,
+  validateValueForType,
+  type PropertyType,
+} from '../../../../utils/schemas/property'
+
+const paramsSchema = z.object({ id: z.string().min(1), propId: z.string().min(1) })
+
+/**
+ * PUT /api/applications/:id/properties/:propId
+ * Set a property value for an application. Body: { value: any }.
+ * Passing `null` or omitting `value` clears the value.
+ *
+ * Requires `application: ['update']` — same gate as editing notes/status.
+ */
+export default defineEventHandler(async (event) => {
+  const session = await requirePermission(event, { application: ['update'] })
+  const orgId = session.session.activeOrganizationId
+
+  const { id, propId } = await getValidatedRouterParams(event, paramsSchema.parse)
+  const { value } = await readValidatedBody(event, setPropertyValueSchema.parse)
+
+  // Verify entity belongs to org
+  const app = await db.query.application.findFirst({
+    where: and(eq(application.id, id), eq(application.organizationId, orgId)),
+    columns: { id: true, jobId: true },
+  })
+  if (!app) throw createError({ statusCode: 404, statusMessage: 'Application not found' })
+
+  // Verify property belongs to org and is valid in this application's context
+  const def = await db.query.propertyDefinition.findFirst({
+    where: and(
+      eq(propertyDefinition.id, propId),
+      eq(propertyDefinition.organizationId, orgId),
+    ),
+  })
+  if (!def) throw createError({ statusCode: 404, statusMessage: 'Property not found' })
+  if (def.entityType !== 'application') {
+    throw createError({ statusCode: 422, statusMessage: 'Property is not an application property' })
+  }
+  if (def.jobId && def.jobId !== app.jobId) {
+    throw createError({
+      statusCode: 422,
+      statusMessage: 'Property is scoped to a different job',
+    })
+  }
+
+  const normalized = validateValueForType(def.type as PropertyType, value, def.config)
+
+  if (normalized === null) {
+    await db
+      .delete(propertyValue)
+      .where(
+        and(
+          eq(propertyValue.organizationId, orgId),
+          eq(propertyValue.propertyDefinitionId, propId),
+          eq(propertyValue.entityId, id),
+          eq(propertyValue.entityType, 'application'),
+        ),
+      )
+    return { value: null }
+  }
+
+  // Upsert
+  const [row] = await db
+    .insert(propertyValue)
+    .values({
+      organizationId: orgId,
+      propertyDefinitionId: propId,
+      entityType: 'application',
+      entityId: id,
+      value: normalized as never,
+    })
+    .onConflictDoUpdate({
+      target: [propertyValue.propertyDefinitionId, propertyValue.entityId],
+      set: { value: normalized as never, updatedAt: new Date() },
+    })
+    .returning({ value: propertyValue.value })
+
+  return { value: row?.value ?? normalized }
+})
diff --git a/server/api/applications/index.get.ts b/server/api/applications/index.get.ts
index 57f5b45a..fd63e62d 100644
--- a/server/api/applications/index.get.ts
+++ b/server/api/applications/index.get.ts
@@ -1,11 +1,16 @@
-import { eq, and, desc, sql } from 'drizzle-orm'
+import { eq, and, desc, sql, inArray } from 'drizzle-orm'
 import { application, candidate, job } from '../../database/schema'
 import { applicationQuerySchema } from '../../utils/schemas/application'
+import {
+  entityIdsMatchingFilters,
+  loadPropertyEntriesForEntities,
+  type PropertyFilter,
+} from '../../utils/properties'
 
 /**
  * GET /api/applications
  * List applications for the current organization.
- * Filterable by jobId, candidateId, and status. Paginated.
+ * Filterable by jobId, candidateId, status, and custom property filters. Paginated.
  */
 export default defineEventHandler(async (event) => {
   const session = await requirePermission(event, { application: ['read'] })
@@ -26,6 +31,28 @@ export default defineEventHandler(async (event) => {
     conditions.push(eq(application.status, query.status))
   }
 
+  // ── Custom property filters ──
+  let propertyFilters: PropertyFilter[] = []
+  if (query.propertyFilters) {
+    try {
+      const parsed = JSON.parse(query.propertyFilters)
+      if (Array.isArray(parsed)) propertyFilters = parsed.slice(0, 20) as PropertyFilter[]
+    } catch {
+      throw createError({ statusCode: 400, statusMessage: 'Invalid propertyFilters' })
+    }
+  }
+  if (propertyFilters.length > 0) {
+    const matching = await entityIdsMatchingFilters({
+      organizationId: orgId,
+      entityType: 'application',
+      filters: propertyFilters,
+    })
+    if (!matching || matching.size === 0) {
+      return { data: [], total: 0, page: query.page, limit: query.limit }
+    }
+    conditions.push(inArray(application.id, [...matching]))
+  }
+
   const where = and(...conditions)
 
   const [data, total] = await Promise.all([
@@ -55,5 +82,23 @@ export default defineEventHandler(async (event) => {
     db.$count(application, where),
   ])
 
-  return { data, total, page: query.page, limit: query.limit }
+  // Bulk-attach properties for the current page (org-global + per-job)
+  const ids = data.map((a) => a.id)
+  const jobIds = [...new Set(data.map((a) => a.jobId))]
+  const propertyMap = await loadPropertyEntriesForEntities({
+    organizationId: orgId,
+    entityType: 'application',
+    entityIds: ids,
+    jobIds,
+  })
+  // Filter so each row only sees org-global props OR the props bound to its own job.
+  const enriched = data.map((a) => ({
+    ...a,
+    properties: (propertyMap.get(a.id) ?? []).filter(
+      (e) => e.definition.jobId === null || e.definition.jobId === a.jobId,
+    ),
+  }))
+
+  return { data: enriched, total, page: query.page, limit: query.limit }
 })
+
diff --git a/server/api/candidates/[id].get.ts b/server/api/candidates/[id].get.ts
index 2b720f1c..a6cf1a1a 100644
--- a/server/api/candidates/[id].get.ts
+++ b/server/api/candidates/[id].get.ts
@@ -1,6 +1,7 @@
 import { eq, and } from 'drizzle-orm'
 import { candidate } from '../../database/schema'
 import { candidateIdParamSchema } from '../../utils/schemas/candidate'
+import { loadPropertyEntriesForEntity } from '../../utils/properties'
 
 export default defineEventHandler(async (event) => {
   const session = await requirePermission(event, { candidate: ['read'] })
@@ -46,11 +47,19 @@ export default defineEventHandler(async (event) => {
 
   // Replace heavy parsedContent with a lightweight `parsed` boolean
   const { documents, ...rest } = result
+
+  const properties = await loadPropertyEntriesForEntity({
+    organizationId: orgId,
+    entityType: 'candidate',
+    entityId: result.id,
+  })
+
   return {
     ...rest,
     documents: documents.map(({ parsedContent, ...doc }) => ({
       ...doc,
       parsed: parsedContent != null,
     })),
+    properties,
   }
 })
diff --git a/server/api/candidates/[id]/properties/[propId].put.ts b/server/api/candidates/[id]/properties/[propId].put.ts
new file mode 100644
index 00000000..7c446f0b
--- /dev/null
+++ b/server/api/candidates/[id]/properties/[propId].put.ts
@@ -0,0 +1,72 @@
+import { and, eq } from 'drizzle-orm'
+import { z } from 'zod'
+import { candidate, propertyDefinition, propertyValue } from '../../../../database/schema'
+import {
+  setPropertyValueSchema,
+  validateValueForType,
+  type PropertyType,
+} from '../../../../utils/schemas/property'
+
+const paramsSchema = z.object({ id: z.string().min(1), propId: z.string().min(1) })
+
+/**
+ * PUT /api/candidates/:id/properties/:propId
+ * Set a property value for a candidate. Body: { value: any }. Passing null clears.
+ */
+export default defineEventHandler(async (event) => {
+  const session = await requirePermission(event, { candidate: ['update'] })
+  const orgId = session.session.activeOrganizationId
+
+  const { id, propId } = await getValidatedRouterParams(event, paramsSchema.parse)
+  const { value } = await readValidatedBody(event, setPropertyValueSchema.parse)
+
+  const cand = await db.query.candidate.findFirst({
+    where: and(eq(candidate.id, id), eq(candidate.organizationId, orgId)),
+    columns: { id: true },
+  })
+  if (!cand) throw createError({ statusCode: 404, statusMessage: 'Candidate not found' })
+
+  const def = await db.query.propertyDefinition.findFirst({
+    where: and(
+      eq(propertyDefinition.id, propId),
+      eq(propertyDefinition.organizationId, orgId),
+    ),
+  })
+  if (!def) throw createError({ statusCode: 404, statusMessage: 'Property not found' })
+  if (def.entityType !== 'candidate') {
+    throw createError({ statusCode: 422, statusMessage: 'Property is not a candidate property' })
+  }
+
+  const normalized = validateValueForType(def.type as PropertyType, value, def.config)
+
+  if (normalized === null) {
+    await db
+      .delete(propertyValue)
+      .where(
+        and(
+          eq(propertyValue.organizationId, orgId),
+          eq(propertyValue.propertyDefinitionId, propId),
+          eq(propertyValue.entityId, id),
+          eq(propertyValue.entityType, 'candidate'),
+        ),
+      )
+    return { value: null }
+  }
+
+  const [row] = await db
+    .insert(propertyValue)
+    .values({
+      organizationId: orgId,
+      propertyDefinitionId: propId,
+      entityType: 'candidate',
+      entityId: id,
+      value: normalized as never,
+    })
+    .onConflictDoUpdate({
+      target: [propertyValue.propertyDefinitionId, propertyValue.entityId],
+      set: { value: normalized as never, updatedAt: new Date() },
+    })
+    .returning({ value: propertyValue.value })
+
+  return { value: row?.value ?? normalized }
+})
diff --git a/server/api/candidates/index.get.ts b/server/api/candidates/index.get.ts
index 8223b41f..68fcdbe8 100644
--- a/server/api/candidates/index.get.ts
+++ b/server/api/candidates/index.get.ts
@@ -1,6 +1,11 @@
-import { eq, and, or, ilike, desc, sql, gte, lte } from 'drizzle-orm'
+import { eq, and, or, ilike, desc, sql, gte, lte, inArray } from 'drizzle-orm'
 import { candidate, application } from '../../database/schema'
 import { candidateQuerySchema } from '../../utils/schemas/candidate'
+import {
+  entityIdsMatchingFilters,
+  loadPropertyEntriesForEntities,
+  type PropertyFilter,
+} from '../../utils/properties'
 
 export default defineEventHandler(async (event) => {
   const session = await requirePermission(event, { candidate: ['read'] })
@@ -36,6 +41,28 @@ export default defineEventHandler(async (event) => {
     conditions.push(lte(candidate.dateOfBirth, query.dobTo))
   }
 
+  // ── Custom property filters (intersection-based) ──
+  let propertyFilters: PropertyFilter[] = []
+  if (query.propertyFilters) {
+    try {
+      const parsed = JSON.parse(query.propertyFilters)
+      if (Array.isArray(parsed)) propertyFilters = parsed.slice(0, 20) as PropertyFilter[]
+    } catch {
+      throw createError({ statusCode: 400, statusMessage: 'Invalid propertyFilters' })
+    }
+  }
+  if (propertyFilters.length > 0) {
+    const matching = await entityIdsMatchingFilters({
+      organizationId: orgId,
+      entityType: 'candidate',
+      filters: propertyFilters,
+    })
+    if (!matching || matching.size === 0) {
+      return { data: [], total: 0, page: query.page, limit: query.limit }
+    }
+    conditions.push(inArray(candidate.id, [...matching]))
+  }
+
   const where = and(...conditions)
 
   const [data, total] = await Promise.all([
@@ -64,5 +91,14 @@ export default defineEventHandler(async (event) => {
     db.$count(candidate, where),
   ])
 
-  return { data, total, page: query.page, limit: query.limit }
+  // Bulk-attach properties for the current page
+  const ids = data.map((c) => c.id)
+  const propertyMap = await loadPropertyEntriesForEntities({
+    organizationId: orgId,
+    entityType: 'candidate',
+    entityIds: ids,
+  })
+  const enriched = data.map((c) => ({ ...c, properties: propertyMap.get(c.id) ?? [] }))
+
+  return { data: enriched, total, page: query.page, limit: query.limit }
 })
diff --git a/server/api/jobs/index.get.ts b/server/api/jobs/index.get.ts
index 30adb997..7586c450 100644
--- a/server/api/jobs/index.get.ts
+++ b/server/api/jobs/index.get.ts
@@ -35,6 +35,8 @@ export default defineEventHandler(async (event) => {
         location: true,
         type: true,
         status: true,
+        experienceLevel: true,
+        remoteStatus: true,
         createdAt: true,
         updatedAt: true,
       },
diff --git a/server/api/properties/[id].delete.ts b/server/api/properties/[id].delete.ts
new file mode 100644
index 00000000..a3829f16
--- /dev/null
+++ b/server/api/properties/[id].delete.ts
@@ -0,0 +1,33 @@
+import { and, eq } from 'drizzle-orm'
+import { propertyDefinition } from '../../database/schema'
+import { propertyIdParamSchema } from '../../utils/schemas/property'
+
+/**
+ * DELETE /api/properties/:id
+ * Removes a property definition. All values cascade-delete via the FK.
+ */
+export default defineEventHandler(async (event) => {
+  const session = await requirePermission(event, { organization: ['update'] })
+  const orgId = session.session.activeOrganizationId
+
+  const { id } = await getValidatedRouterParams(event, propertyIdParamSchema.parse)
+
+  const [deleted] = await db
+    .delete(propertyDefinition)
+    .where(and(eq(propertyDefinition.id, id), eq(propertyDefinition.organizationId, orgId)))
+    .returning({ id: propertyDefinition.id })
+
+  if (!deleted) {
+    throw createError({ statusCode: 404, statusMessage: 'Property not found' })
+  }
+
+  recordActivity({
+    organizationId: orgId,
+    actorId: session.user.id,
+    action: 'deleted',
+    resourceType: 'property',
+    resourceId: id,
+  })
+
+  return { id }
+})
diff --git a/server/api/properties/[id].patch.ts b/server/api/properties/[id].patch.ts
new file mode 100644
index 00000000..a048ffd5
--- /dev/null
+++ b/server/api/properties/[id].patch.ts
@@ -0,0 +1,39 @@
+import { and, eq } from 'drizzle-orm'
+import { propertyDefinition } from '../../database/schema'
+import {
+  propertyIdParamSchema,
+  updatePropertyDefinitionSchema,
+} from '../../utils/schemas/property'
+
+/**
+ * PATCH /api/properties/:id
+ * Update a property definition (name, description, config, displayOrder).
+ * Type and entityType are immutable.
+ */
+export default defineEventHandler(async (event) => {
+  const session = await requirePermission(event, { organization: ['update'] })
+  const orgId = session.session.activeOrganizationId
+
+  const { id } = await getValidatedRouterParams(event, propertyIdParamSchema.parse)
+  const body = await readValidatedBody(event, updatePropertyDefinitionSchema.parse)
+
+  const [updated] = await db
+    .update(propertyDefinition)
+    .set({ ...body, updatedAt: new Date() })
+    .where(and(eq(propertyDefinition.id, id), eq(propertyDefinition.organizationId, orgId)))
+    .returning()
+
+  if (!updated) {
+    throw createError({ statusCode: 404, statusMessage: 'Property not found' })
+  }
+
+  recordActivity({
+    organizationId: orgId,
+    actorId: session.user.id,
+    action: 'updated',
+    resourceType: 'property',
+    resourceId: id,
+  })
+
+  return updated
+})
diff --git a/server/api/properties/index.get.ts b/server/api/properties/index.get.ts
new file mode 100644
index 00000000..fcb42d9f
--- /dev/null
+++ b/server/api/properties/index.get.ts
@@ -0,0 +1,59 @@
+import { eq, and } from 'drizzle-orm'
+import { propertyDefinition } from '../../database/schema'
+import { propertyListQuerySchema, type PropertyEntityType } from '../../utils/schemas/property'
+import { loadPropertyDefinitions } from '../../utils/properties'
+
+/**
+ * GET /api/properties
+ * Returns property definitions visible in the requested context.
+ *
+ *  - ?entityType=candidate              → org-global candidate defs
+ *  - ?entityType=application            → org-global application defs
+ *  - ?entityType=application&jobId=X    → org-global + per-job defs for X
+ *  - ?entityType=application&jobId=X&jobOnly=1 → ONLY per-job defs for X (schema editor)
+ *
+ * Reading is gated on `application: ['read']` because property definitions
+ * are pure metadata and any user with pipeline access needs to render them.
+ */
+export default defineEventHandler(async (event) => {
+  const session = await requirePermission(event, { application: ['read'] })
+  const orgId = session.session.activeOrganizationId
+
+  const query = await getValidatedQuery(event, propertyListQuerySchema.parse)
+
+  if (query.jobOnly) {
+    if (!query.jobId || query.entityType !== 'application') {
+      throw createError({
+        statusCode: 400,
+        statusMessage: 'jobOnly requires entityType=application and a jobId',
+      })
+    }
+    const rows = await db
+      .select()
+      .from(propertyDefinition)
+      .where(
+        and(
+          eq(propertyDefinition.organizationId, orgId),
+          eq(propertyDefinition.entityType, 'application'),
+          eq(propertyDefinition.jobId, query.jobId),
+        ),
+      )
+      .orderBy(propertyDefinition.displayOrder, propertyDefinition.createdAt)
+    return rows
+  }
+
+  if (!query.entityType) {
+    // Return both candidate and application org-global defs
+    const [candidateDefs, applicationDefs] = await Promise.all([
+      loadPropertyDefinitions({ organizationId: orgId, entityType: 'candidate' }),
+      loadPropertyDefinitions({ organizationId: orgId, entityType: 'application' }),
+    ])
+    return { candidate: candidateDefs, application: applicationDefs }
+  }
+
+  return loadPropertyDefinitions({
+    organizationId: orgId,
+    entityType: query.entityType as PropertyEntityType,
+    jobId: query.jobId ?? null,
+  })
+})
diff --git a/server/api/properties/index.post.ts b/server/api/properties/index.post.ts
new file mode 100644
index 00000000..bdb3f1c0
--- /dev/null
+++ b/server/api/properties/index.post.ts
@@ -0,0 +1,76 @@
+import { and, desc, eq } from 'drizzle-orm'
+import { job, propertyDefinition } from '../../database/schema'
+import { createPropertyDefinitionSchema } from '../../utils/schemas/property'
+
+/**
+ * POST /api/properties
+ * Create a new property definition.
+ *
+ * Requires `organization: ['update']` — only owners/admins can edit the schema.
+ */
+export default defineEventHandler(async (event) => {
+  const session = await requirePermission(event, { organization: ['update'] })
+  const orgId = session.session.activeOrganizationId
+
+  const body = await readValidatedBody(event, createPropertyDefinitionSchema.parse)
+
+  // Candidate properties are always org-global
+  if (body.entityType === 'candidate' && body.jobId) {
+    throw createError({
+      statusCode: 422,
+      statusMessage: 'Candidate properties cannot be scoped to a job',
+    })
+  }
+
+  // If jobId provided, verify it belongs to this org
+  if (body.jobId) {
+    const j = await db.query.job.findFirst({
+      where: and(eq(job.id, body.jobId), eq(job.organizationId, orgId)),
+      columns: { id: true },
+    })
+    if (!j) {
+      throw createError({ statusCode: 404, statusMessage: 'Job not found' })
+    }
+  }
+
+  // Compute displayOrder = max + 1 within this scope
+  const last = await db
+    .select({ displayOrder: propertyDefinition.displayOrder })
+    .from(propertyDefinition)
+    .where(
+      and(
+        eq(propertyDefinition.organizationId, orgId),
+        eq(propertyDefinition.entityType, body.entityType),
+        body.jobId
+          ? eq(propertyDefinition.jobId, body.jobId)
+          : // eslint-disable-next-line @typescript-eslint/no-explicit-any
+            (eq(propertyDefinition.jobId, null as any)),
+      ),
+    )
+    .orderBy(desc(propertyDefinition.displayOrder))
+    .limit(1)
+
+  const nextOrder = (last[0]?.displayOrder ?? -1) + 1
+
+  const [created] = await db.insert(propertyDefinition).values({
+    organizationId: orgId,
+    entityType: body.entityType,
+    type: body.type,
+    name: body.name,
+    description: body.description ?? null,
+    jobId: body.jobId ?? null,
+    config: (body.config ?? null) as Record<string, unknown> | null,
+    displayOrder: nextOrder,
+  }).returning()
+
+  recordActivity({
+    organizationId: orgId,
+    actorId: session.user.id,
+    action: 'created',
+    resourceType: 'property',
+    resourceId: created!.id,
+    metadata: { entityType: body.entityType, type: body.type, jobId: body.jobId ?? null },
+  })
+
+  return created
+})
diff --git a/server/api/properties/reorder.post.ts b/server/api/properties/reorder.post.ts
new file mode 100644
index 00000000..3434687d
--- /dev/null
+++ b/server/api/properties/reorder.post.ts
@@ -0,0 +1,47 @@
+import { and, eq, inArray } from 'drizzle-orm'
+import { propertyDefinition } from '../../database/schema'
+import { reorderPropertiesSchema } from '../../utils/schemas/property'
+
+/**
+ * POST /api/properties/reorder
+ * Body: { ids: string[] } — applied left-to-right as displayOrder=0..N.
+ * All ids must belong to the same scope (entityType + jobId) for sane results,
+ * but we don't enforce that — the client controls which list it's reordering.
+ */
+export default defineEventHandler(async (event) => {
+  const session = await requirePermission(event, { organization: ['update'] })
+  const orgId = session.session.activeOrganizationId
+
+  const { ids } = await readValidatedBody(event, reorderPropertiesSchema.parse)
+  if (ids.length === 0) return { ok: true }
+
+  // Verify all ids belong to this org before mutating
+  const owned = await db
+    .select({ id: propertyDefinition.id })
+    .from(propertyDefinition)
+    .where(
+      and(
+        eq(propertyDefinition.organizationId, orgId),
+        inArray(propertyDefinition.id, ids),
+      ),
+    )
+  if (owned.length !== ids.length) {
+    throw createError({ statusCode: 404, statusMessage: 'One or more properties not found' })
+  }
+
+  await db.transaction(async (tx) => {
+    for (let i = 0; i < ids.length; i++) {
+      await tx
+        .update(propertyDefinition)
+        .set({ displayOrder: i, updatedAt: new Date() })
+        .where(
+          and(
+            eq(propertyDefinition.id, ids[i]!),
+            eq(propertyDefinition.organizationId, orgId),
+          ),
+        )
+    }
+  })
+
+  return { ok: true }
+})
diff --git a/server/database/migrations/0028_custom_properties.sql b/server/database/migrations/0028_custom_properties.sql
new file mode 100644
index 00000000..26a008f6
--- /dev/null
+++ b/server/database/migrations/0028_custom_properties.sql
@@ -0,0 +1,42 @@
+-- Migration 0028: Custom Properties (Notion-style "database properties")
+-- Adds two tables: property_definition (schema) and property_value (per-entity values).
+-- Both are tenant-scoped via organization_id with cascade deletes.
+
+CREATE TYPE "public"."property_entity_type" AS ENUM('candidate', 'application');--> statement-breakpoint
+CREATE TYPE "public"."property_type" AS ENUM('text', 'long_text', 'number', 'select', 'multi_select', 'date', 'checkbox', 'url', 'email', 'person', 'file');--> statement-breakpoint
+CREATE TABLE "property_definition" (
+	"id" text PRIMARY KEY NOT NULL,
+	"organization_id" text NOT NULL,
+	"job_id" text,
+	"entity_type" "property_entity_type" NOT NULL,
+	"type" "property_type" NOT NULL,
+	"name" text NOT NULL,
+	"description" text,
+	"display_order" integer DEFAULT 0 NOT NULL,
+	"config" jsonb,
+	"created_at" timestamp DEFAULT now() NOT NULL,
+	"updated_at" timestamp DEFAULT now() NOT NULL
+);
+--> statement-breakpoint
+CREATE TABLE "property_value" (
+	"id" text PRIMARY KEY NOT NULL,
+	"organization_id" text NOT NULL,
+	"property_definition_id" text NOT NULL,
+	"entity_type" "property_entity_type" NOT NULL,
+	"entity_id" text NOT NULL,
+	"value" jsonb,
+	"created_at" timestamp DEFAULT now() NOT NULL,
+	"updated_at" timestamp DEFAULT now() NOT NULL
+);
+--> statement-breakpoint
+ALTER TABLE "property_definition" ADD CONSTRAINT "property_definition_organization_id_organization_id_fk" FOREIGN KEY ("organization_id") REFERENCES "public"."organization"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+ALTER TABLE "property_definition" ADD CONSTRAINT "property_definition_job_id_job_id_fk" FOREIGN KEY ("job_id") REFERENCES "public"."job"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+ALTER TABLE "property_value" ADD CONSTRAINT "property_value_organization_id_organization_id_fk" FOREIGN KEY ("organization_id") REFERENCES "public"."organization"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+ALTER TABLE "property_value" ADD CONSTRAINT "property_value_property_definition_id_property_definition_id_fk" FOREIGN KEY ("property_definition_id") REFERENCES "public"."property_definition"("id") ON DELETE cascade ON UPDATE no action;--> statement-breakpoint
+CREATE INDEX "property_definition_org_idx" ON "property_definition" USING btree ("organization_id");--> statement-breakpoint
+CREATE INDEX "property_definition_org_entity_idx" ON "property_definition" USING btree ("organization_id","entity_type");--> statement-breakpoint
+CREATE INDEX "property_definition_job_idx" ON "property_definition" USING btree ("job_id");--> statement-breakpoint
+CREATE INDEX "property_value_org_idx" ON "property_value" USING btree ("organization_id");--> statement-breakpoint
+CREATE INDEX "property_value_entity_idx" ON "property_value" USING btree ("entity_type","entity_id");--> statement-breakpoint
+CREATE INDEX "property_value_definition_idx" ON "property_value" USING btree ("property_definition_id");--> statement-breakpoint
+CREATE UNIQUE INDEX "property_value_def_entity_idx" ON "property_value" USING btree ("property_definition_id","entity_id");
diff --git a/server/database/migrations/meta/0028_snapshot.json b/server/database/migrations/meta/0028_snapshot.json
new file mode 100644
index 00000000..a943d31a
--- /dev/null
+++ b/server/database/migrations/meta/0028_snapshot.json
@@ -0,0 +1,5372 @@
+{
+  "id": "4ffd7fcb-d7e0-4e49-8211-fa5b7305aff9",
+  "prevId": "08656045-ca21-4f0a-b890-3e9408b45724",
+  "version": "7",
+  "dialect": "postgresql",
+  "tables": {
+    "public.account": {
+      "name": "account",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "user_id": {
+          "name": "user_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "account_id": {
+          "name": "account_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "provider_id": {
+          "name": "provider_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "access_token": {
+          "name": "access_token",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "refresh_token": {
+          "name": "refresh_token",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "id_token": {
+          "name": "id_token",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "access_token_expires_at": {
+          "name": "access_token_expires_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "refresh_token_expires_at": {
+          "name": "refresh_token_expires_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "scope": {
+          "name": "scope",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "password": {
+          "name": "password",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "account_user_id_idx": {
+          "name": "account_user_id_idx",
+          "columns": [
+            {
+              "expression": "user_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "account_user_id_user_id_fk": {
+          "name": "account_user_id_user_id_fk",
+          "tableFrom": "account",
+          "tableTo": "user",
+          "columnsFrom": [
+            "user_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.invitation": {
+      "name": "invitation",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "email": {
+          "name": "email",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "inviter_id": {
+          "name": "inviter_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "role": {
+          "name": "role",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "status": {
+          "name": "status",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'pending'"
+        },
+        "expires_at": {
+          "name": "expires_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "invitation_organization_id_idx": {
+          "name": "invitation_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "invitation_email_idx": {
+          "name": "invitation_email_idx",
+          "columns": [
+            {
+              "expression": "email",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "invitation_inviter_id_user_id_fk": {
+          "name": "invitation_inviter_id_user_id_fk",
+          "tableFrom": "invitation",
+          "tableTo": "user",
+          "columnsFrom": [
+            "inviter_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "invitation_organization_id_organization_id_fk": {
+          "name": "invitation_organization_id_organization_id_fk",
+          "tableFrom": "invitation",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.member": {
+      "name": "member",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "user_id": {
+          "name": "user_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "role": {
+          "name": "role",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'member'"
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "member_user_id_idx": {
+          "name": "member_user_id_idx",
+          "columns": [
+            {
+              "expression": "user_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "member_organization_id_idx": {
+          "name": "member_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "member_user_org_unique_idx": {
+          "name": "member_user_org_unique_idx",
+          "columns": [
+            {
+              "expression": "user_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": true,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "member_user_id_user_id_fk": {
+          "name": "member_user_id_user_id_fk",
+          "tableFrom": "member",
+          "tableTo": "user",
+          "columnsFrom": [
+            "user_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "member_organization_id_organization_id_fk": {
+          "name": "member_organization_id_organization_id_fk",
+          "tableFrom": "member",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.organization": {
+      "name": "organization",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "name": {
+          "name": "name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "slug": {
+          "name": "slug",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "logo": {
+          "name": "logo",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "metadata": {
+          "name": "metadata",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {
+        "organization_slug_unique": {
+          "name": "organization_slug_unique",
+          "nullsNotDistinct": false,
+          "columns": [
+            "slug"
+          ]
+        }
+      },
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.rate_limit": {
+      "name": "rate_limit",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "key": {
+          "name": "key",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "count": {
+          "name": "count",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "last_request": {
+          "name": "last_request",
+          "type": "bigint",
+          "primaryKey": false,
+          "notNull": true
+        }
+      },
+      "indexes": {
+        "rate_limit_key_idx": {
+          "name": "rate_limit_key_idx",
+          "columns": [
+            {
+              "expression": "key",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.session": {
+      "name": "session",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "user_id": {
+          "name": "user_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "token": {
+          "name": "token",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "expires_at": {
+          "name": "expires_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "ip_address": {
+          "name": "ip_address",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "user_agent": {
+          "name": "user_agent",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "active_organization_id": {
+          "name": "active_organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        }
+      },
+      "indexes": {
+        "session_user_id_idx": {
+          "name": "session_user_id_idx",
+          "columns": [
+            {
+              "expression": "user_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "session_user_id_user_id_fk": {
+          "name": "session_user_id_user_id_fk",
+          "tableFrom": "session",
+          "tableTo": "user",
+          "columnsFrom": [
+            "user_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {
+        "session_token_unique": {
+          "name": "session_token_unique",
+          "nullsNotDistinct": false,
+          "columns": [
+            "token"
+          ]
+        }
+      },
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.user": {
+      "name": "user",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "name": {
+          "name": "name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "email": {
+          "name": "email",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "email_verified": {
+          "name": "email_verified",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": false
+        },
+        "image": {
+          "name": "image",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {},
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {
+        "user_email_unique": {
+          "name": "user_email_unique",
+          "nullsNotDistinct": false,
+          "columns": [
+            "email"
+          ]
+        }
+      },
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.verification": {
+      "name": "verification",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "identifier": {
+          "name": "identifier",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "value": {
+          "name": "value",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "expires_at": {
+          "name": "expires_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "verification_identifier_idx": {
+          "name": "verification_identifier_idx",
+          "columns": [
+            {
+              "expression": "identifier",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {},
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.activity_log": {
+      "name": "activity_log",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "actor_id": {
+          "name": "actor_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "action": {
+          "name": "action",
+          "type": "activity_action",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "resource_type": {
+          "name": "resource_type",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "resource_id": {
+          "name": "resource_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "metadata": {
+          "name": "metadata",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "activity_log_organization_id_idx": {
+          "name": "activity_log_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "activity_log_actor_id_idx": {
+          "name": "activity_log_actor_id_idx",
+          "columns": [
+            {
+              "expression": "actor_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "activity_log_resource_idx": {
+          "name": "activity_log_resource_idx",
+          "columns": [
+            {
+              "expression": "resource_type",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "resource_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "activity_log_created_at_idx": {
+          "name": "activity_log_created_at_idx",
+          "columns": [
+            {
+              "expression": "created_at",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "activity_log_organization_id_organization_id_fk": {
+          "name": "activity_log_organization_id_organization_id_fk",
+          "tableFrom": "activity_log",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "activity_log_actor_id_user_id_fk": {
+          "name": "activity_log_actor_id_user_id_fk",
+          "tableFrom": "activity_log",
+          "tableTo": "user",
+          "columnsFrom": [
+            "actor_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.ai_config": {
+      "name": "ai_config",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "name": {
+          "name": "name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'Default'"
+        },
+        "provider": {
+          "name": "provider",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'openai'"
+        },
+        "model": {
+          "name": "model",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'gpt-4o-mini'"
+        },
+        "api_key_encrypted": {
+          "name": "api_key_encrypted",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "base_url": {
+          "name": "base_url",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "max_tokens": {
+          "name": "max_tokens",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "default": 4096
+        },
+        "input_price_per_1m": {
+          "name": "input_price_per_1m",
+          "type": "numeric(10, 4)",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "output_price_per_1m": {
+          "name": "output_price_per_1m",
+          "type": "numeric(10, 4)",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "is_default_chatbot": {
+          "name": "is_default_chatbot",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": false
+        },
+        "is_default_analysis": {
+          "name": "is_default_analysis",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "ai_config_organization_id_idx": {
+          "name": "ai_config_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "ai_config_default_chatbot_idx": {
+          "name": "ai_config_default_chatbot_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": true,
+          "where": "\"ai_config\".\"is_default_chatbot\" = true",
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "ai_config_default_analysis_idx": {
+          "name": "ai_config_default_analysis_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": true,
+          "where": "\"ai_config\".\"is_default_analysis\" = true",
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "ai_config_organization_id_organization_id_fk": {
+          "name": "ai_config_organization_id_organization_id_fk",
+          "tableFrom": "ai_config",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.analysis_run": {
+      "name": "analysis_run",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "application_id": {
+          "name": "application_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "status": {
+          "name": "status",
+          "type": "analysis_run_status",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'completed'"
+        },
+        "provider": {
+          "name": "provider",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "model": {
+          "name": "model",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "criteria_snapshot": {
+          "name": "criteria_snapshot",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "composite_score": {
+          "name": "composite_score",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "prompt_tokens": {
+          "name": "prompt_tokens",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "completion_tokens": {
+          "name": "completion_tokens",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "raw_response": {
+          "name": "raw_response",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "error_message": {
+          "name": "error_message",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "scored_by_id": {
+          "name": "scored_by_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "analysis_run_organization_id_idx": {
+          "name": "analysis_run_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "analysis_run_application_id_idx": {
+          "name": "analysis_run_application_id_idx",
+          "columns": [
+            {
+              "expression": "application_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "analysis_run_created_at_idx": {
+          "name": "analysis_run_created_at_idx",
+          "columns": [
+            {
+              "expression": "created_at",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "analysis_run_organization_id_organization_id_fk": {
+          "name": "analysis_run_organization_id_organization_id_fk",
+          "tableFrom": "analysis_run",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "analysis_run_application_id_application_id_fk": {
+          "name": "analysis_run_application_id_application_id_fk",
+          "tableFrom": "analysis_run",
+          "tableTo": "application",
+          "columnsFrom": [
+            "application_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "analysis_run_scored_by_id_user_id_fk": {
+          "name": "analysis_run_scored_by_id_user_id_fk",
+          "tableFrom": "analysis_run",
+          "tableTo": "user",
+          "columnsFrom": [
+            "scored_by_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.application": {
+      "name": "application",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "candidate_id": {
+          "name": "candidate_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "job_id": {
+          "name": "job_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "status": {
+          "name": "status",
+          "type": "application_status",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'new'"
+        },
+        "score": {
+          "name": "score",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "notes": {
+          "name": "notes",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "cover_letter_text": {
+          "name": "cover_letter_text",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "application_organization_id_idx": {
+          "name": "application_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "application_candidate_id_idx": {
+          "name": "application_candidate_id_idx",
+          "columns": [
+            {
+              "expression": "candidate_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "application_job_id_idx": {
+          "name": "application_job_id_idx",
+          "columns": [
+            {
+              "expression": "job_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "application_org_candidate_job_idx": {
+          "name": "application_org_candidate_job_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "candidate_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "job_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": true,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "application_organization_id_organization_id_fk": {
+          "name": "application_organization_id_organization_id_fk",
+          "tableFrom": "application",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "application_candidate_id_candidate_id_fk": {
+          "name": "application_candidate_id_candidate_id_fk",
+          "tableFrom": "application",
+          "tableTo": "candidate",
+          "columnsFrom": [
+            "candidate_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "application_job_id_job_id_fk": {
+          "name": "application_job_id_job_id_fk",
+          "tableFrom": "application",
+          "tableTo": "job",
+          "columnsFrom": [
+            "job_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.application_source": {
+      "name": "application_source",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "application_id": {
+          "name": "application_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "channel": {
+          "name": "channel",
+          "type": "source_channel",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'direct'"
+        },
+        "tracking_link_id": {
+          "name": "tracking_link_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "utm_source": {
+          "name": "utm_source",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "utm_medium": {
+          "name": "utm_medium",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "utm_campaign": {
+          "name": "utm_campaign",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "utm_term": {
+          "name": "utm_term",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "utm_content": {
+          "name": "utm_content",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "referrer_domain": {
+          "name": "referrer_domain",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "application_source_organization_id_idx": {
+          "name": "application_source_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "application_source_application_id_idx": {
+          "name": "application_source_application_id_idx",
+          "columns": [
+            {
+              "expression": "application_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "application_source_channel_idx": {
+          "name": "application_source_channel_idx",
+          "columns": [
+            {
+              "expression": "channel",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "application_source_tracking_link_id_idx": {
+          "name": "application_source_tracking_link_id_idx",
+          "columns": [
+            {
+              "expression": "tracking_link_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "application_source_application_idx": {
+          "name": "application_source_application_idx",
+          "columns": [
+            {
+              "expression": "application_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": true,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "application_source_organization_id_organization_id_fk": {
+          "name": "application_source_organization_id_organization_id_fk",
+          "tableFrom": "application_source",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "application_source_application_id_application_id_fk": {
+          "name": "application_source_application_id_application_id_fk",
+          "tableFrom": "application_source",
+          "tableTo": "application",
+          "columnsFrom": [
+            "application_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "application_source_tracking_link_id_tracking_link_id_fk": {
+          "name": "application_source_tracking_link_id_tracking_link_id_fk",
+          "tableFrom": "application_source",
+          "tableTo": "tracking_link",
+          "columnsFrom": [
+            "tracking_link_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "set null",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.calendar_integration": {
+      "name": "calendar_integration",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "user_id": {
+          "name": "user_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "provider": {
+          "name": "provider",
+          "type": "calendar_provider",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'google'"
+        },
+        "access_token_encrypted": {
+          "name": "access_token_encrypted",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "refresh_token_encrypted": {
+          "name": "refresh_token_encrypted",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "calendar_id": {
+          "name": "calendar_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'primary'"
+        },
+        "account_email": {
+          "name": "account_email",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "webhook_channel_id": {
+          "name": "webhook_channel_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "webhook_resource_id": {
+          "name": "webhook_resource_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "webhook_expiration": {
+          "name": "webhook_expiration",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "sync_token": {
+          "name": "sync_token",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "calendar_integration_user_provider_idx": {
+          "name": "calendar_integration_user_provider_idx",
+          "columns": [
+            {
+              "expression": "user_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "provider",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": true,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "calendar_integration_webhook_channel_idx": {
+          "name": "calendar_integration_webhook_channel_idx",
+          "columns": [
+            {
+              "expression": "webhook_channel_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "calendar_integration_user_id_user_id_fk": {
+          "name": "calendar_integration_user_id_user_id_fk",
+          "tableFrom": "calendar_integration",
+          "tableTo": "user",
+          "columnsFrom": [
+            "user_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.candidate": {
+      "name": "candidate",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "first_name": {
+          "name": "first_name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "last_name": {
+          "name": "last_name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "display_name": {
+          "name": "display_name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "email": {
+          "name": "email",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "phone": {
+          "name": "phone",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "gender": {
+          "name": "gender",
+          "type": "gender",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "date_of_birth": {
+          "name": "date_of_birth",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "quick_notes": {
+          "name": "quick_notes",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "candidate_organization_id_idx": {
+          "name": "candidate_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "candidate_gender_idx": {
+          "name": "candidate_gender_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "gender",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "candidate_org_email_idx": {
+          "name": "candidate_org_email_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "email",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": true,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "candidate_organization_id_organization_id_fk": {
+          "name": "candidate_organization_id_organization_id_fk",
+          "tableFrom": "candidate",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.chatbot_agent": {
+      "name": "chatbot_agent",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "user_id": {
+          "name": "user_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "name": {
+          "name": "name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "description": {
+          "name": "description",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "icon": {
+          "name": "icon",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "system_prompt": {
+          "name": "system_prompt",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "temperature": {
+          "name": "temperature",
+          "type": "numeric(3, 2)",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "is_default": {
+          "name": "is_default",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "chatbot_agent_org_user_idx": {
+          "name": "chatbot_agent_org_user_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "user_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "chatbot_agent_default_per_user_idx": {
+          "name": "chatbot_agent_default_per_user_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "user_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": true,
+          "where": "\"chatbot_agent\".\"is_default\" = true",
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "chatbot_agent_organization_id_organization_id_fk": {
+          "name": "chatbot_agent_organization_id_organization_id_fk",
+          "tableFrom": "chatbot_agent",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "chatbot_agent_user_id_user_id_fk": {
+          "name": "chatbot_agent_user_id_user_id_fk",
+          "tableFrom": "chatbot_agent",
+          "tableTo": "user",
+          "columnsFrom": [
+            "user_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.chatbot_conversation": {
+      "name": "chatbot_conversation",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "user_id": {
+          "name": "user_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "folder_id": {
+          "name": "folder_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "agent_id": {
+          "name": "agent_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "ai_config_id": {
+          "name": "ai_config_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "title": {
+          "name": "title",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'New chat'"
+        },
+        "scope": {
+          "name": "scope",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "thinking": {
+          "name": "thinking",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": false
+        },
+        "pinned": {
+          "name": "pinned",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": false
+        },
+        "last_message_preview": {
+          "name": "last_message_preview",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "last_message_at": {
+          "name": "last_message_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "chatbot_conversation_org_user_idx": {
+          "name": "chatbot_conversation_org_user_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "user_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "chatbot_conversation_folder_idx": {
+          "name": "chatbot_conversation_folder_idx",
+          "columns": [
+            {
+              "expression": "folder_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "chatbot_conversation_last_message_at_idx": {
+          "name": "chatbot_conversation_last_message_at_idx",
+          "columns": [
+            {
+              "expression": "user_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "last_message_at",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "chatbot_conversation_organization_id_organization_id_fk": {
+          "name": "chatbot_conversation_organization_id_organization_id_fk",
+          "tableFrom": "chatbot_conversation",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "chatbot_conversation_user_id_user_id_fk": {
+          "name": "chatbot_conversation_user_id_user_id_fk",
+          "tableFrom": "chatbot_conversation",
+          "tableTo": "user",
+          "columnsFrom": [
+            "user_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "chatbot_conversation_folder_id_chatbot_folder_id_fk": {
+          "name": "chatbot_conversation_folder_id_chatbot_folder_id_fk",
+          "tableFrom": "chatbot_conversation",
+          "tableTo": "chatbot_folder",
+          "columnsFrom": [
+            "folder_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "set null",
+          "onUpdate": "no action"
+        },
+        "chatbot_conversation_agent_id_chatbot_agent_id_fk": {
+          "name": "chatbot_conversation_agent_id_chatbot_agent_id_fk",
+          "tableFrom": "chatbot_conversation",
+          "tableTo": "chatbot_agent",
+          "columnsFrom": [
+            "agent_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "set null",
+          "onUpdate": "no action"
+        },
+        "chatbot_conversation_ai_config_id_ai_config_id_fk": {
+          "name": "chatbot_conversation_ai_config_id_ai_config_id_fk",
+          "tableFrom": "chatbot_conversation",
+          "tableTo": "ai_config",
+          "columnsFrom": [
+            "ai_config_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "set null",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.chatbot_folder": {
+      "name": "chatbot_folder",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "user_id": {
+          "name": "user_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "name": {
+          "name": "name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "icon": {
+          "name": "icon",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "position": {
+          "name": "position",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "default": 0
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "chatbot_folder_org_user_idx": {
+          "name": "chatbot_folder_org_user_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "user_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "chatbot_folder_organization_id_organization_id_fk": {
+          "name": "chatbot_folder_organization_id_organization_id_fk",
+          "tableFrom": "chatbot_folder",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "chatbot_folder_user_id_user_id_fk": {
+          "name": "chatbot_folder_user_id_user_id_fk",
+          "tableFrom": "chatbot_folder",
+          "tableTo": "user",
+          "columnsFrom": [
+            "user_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.chatbot_message": {
+      "name": "chatbot_message",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "conversation_id": {
+          "name": "conversation_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "user_id": {
+          "name": "user_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "role": {
+          "name": "role",
+          "type": "chatbot_message_role",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "content": {
+          "name": "content",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "''"
+        },
+        "reasoning": {
+          "name": "reasoning",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "tool_calls": {
+          "name": "tool_calls",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "sources": {
+          "name": "sources",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "attachments": {
+          "name": "attachments",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "chatbot_message_conversation_idx": {
+          "name": "chatbot_message_conversation_idx",
+          "columns": [
+            {
+              "expression": "conversation_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "created_at",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "chatbot_message_conversation_id_chatbot_conversation_id_fk": {
+          "name": "chatbot_message_conversation_id_chatbot_conversation_id_fk",
+          "tableFrom": "chatbot_message",
+          "tableTo": "chatbot_conversation",
+          "columnsFrom": [
+            "conversation_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "chatbot_message_organization_id_organization_id_fk": {
+          "name": "chatbot_message_organization_id_organization_id_fk",
+          "tableFrom": "chatbot_message",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "chatbot_message_user_id_user_id_fk": {
+          "name": "chatbot_message_user_id_user_id_fk",
+          "tableFrom": "chatbot_message",
+          "tableTo": "user",
+          "columnsFrom": [
+            "user_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.comment": {
+      "name": "comment",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "author_id": {
+          "name": "author_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "target_type": {
+          "name": "target_type",
+          "type": "comment_target",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "target_id": {
+          "name": "target_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "body": {
+          "name": "body",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "comment_organization_id_idx": {
+          "name": "comment_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "comment_target_idx": {
+          "name": "comment_target_idx",
+          "columns": [
+            {
+              "expression": "target_type",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "target_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "comment_author_id_idx": {
+          "name": "comment_author_id_idx",
+          "columns": [
+            {
+              "expression": "author_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "comment_organization_id_organization_id_fk": {
+          "name": "comment_organization_id_organization_id_fk",
+          "tableFrom": "comment",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "comment_author_id_user_id_fk": {
+          "name": "comment_author_id_user_id_fk",
+          "tableFrom": "comment",
+          "tableTo": "user",
+          "columnsFrom": [
+            "author_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.criterion_score": {
+      "name": "criterion_score",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "application_id": {
+          "name": "application_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "criterion_key": {
+          "name": "criterion_key",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "max_score": {
+          "name": "max_score",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "applicant_score": {
+          "name": "applicant_score",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "confidence": {
+          "name": "confidence",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "evidence": {
+          "name": "evidence",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "strengths": {
+          "name": "strengths",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "gaps": {
+          "name": "gaps",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "criterion_score_organization_id_idx": {
+          "name": "criterion_score_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "criterion_score_application_id_idx": {
+          "name": "criterion_score_application_id_idx",
+          "columns": [
+            {
+              "expression": "application_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "criterion_score_app_criterion_idx": {
+          "name": "criterion_score_app_criterion_idx",
+          "columns": [
+            {
+              "expression": "application_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "criterion_key",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": true,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "criterion_score_organization_id_organization_id_fk": {
+          "name": "criterion_score_organization_id_organization_id_fk",
+          "tableFrom": "criterion_score",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "criterion_score_application_id_application_id_fk": {
+          "name": "criterion_score_application_id_application_id_fk",
+          "tableFrom": "criterion_score",
+          "tableTo": "application",
+          "columnsFrom": [
+            "application_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.document": {
+      "name": "document",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "candidate_id": {
+          "name": "candidate_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "type": {
+          "name": "type",
+          "type": "document_type",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'resume'"
+        },
+        "storage_key": {
+          "name": "storage_key",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "original_filename": {
+          "name": "original_filename",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "mime_type": {
+          "name": "mime_type",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "size_bytes": {
+          "name": "size_bytes",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "parsed_content": {
+          "name": "parsed_content",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "document_organization_id_idx": {
+          "name": "document_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "document_candidate_id_idx": {
+          "name": "document_candidate_id_idx",
+          "columns": [
+            {
+              "expression": "candidate_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "document_organization_id_organization_id_fk": {
+          "name": "document_organization_id_organization_id_fk",
+          "tableFrom": "document",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "document_candidate_id_candidate_id_fk": {
+          "name": "document_candidate_id_candidate_id_fk",
+          "tableFrom": "document",
+          "tableTo": "candidate",
+          "columnsFrom": [
+            "candidate_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {
+        "document_storage_key_unique": {
+          "name": "document_storage_key_unique",
+          "nullsNotDistinct": false,
+          "columns": [
+            "storage_key"
+          ]
+        }
+      },
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.email_template": {
+      "name": "email_template",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "name": {
+          "name": "name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "subject": {
+          "name": "subject",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "body": {
+          "name": "body",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "created_by_id": {
+          "name": "created_by_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "email_template_organization_id_idx": {
+          "name": "email_template_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "email_template_created_by_id_idx": {
+          "name": "email_template_created_by_id_idx",
+          "columns": [
+            {
+              "expression": "created_by_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "email_template_organization_id_organization_id_fk": {
+          "name": "email_template_organization_id_organization_id_fk",
+          "tableFrom": "email_template",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "email_template_created_by_id_user_id_fk": {
+          "name": "email_template_created_by_id_user_id_fk",
+          "tableFrom": "email_template",
+          "tableTo": "user",
+          "columnsFrom": [
+            "created_by_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.interview": {
+      "name": "interview",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "application_id": {
+          "name": "application_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "title": {
+          "name": "title",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "type": {
+          "name": "type",
+          "type": "interview_type",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'video'"
+        },
+        "status": {
+          "name": "status",
+          "type": "interview_status",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'scheduled'"
+        },
+        "scheduled_at": {
+          "name": "scheduled_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "duration": {
+          "name": "duration",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "default": 60
+        },
+        "location": {
+          "name": "location",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "notes": {
+          "name": "notes",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "interviewers": {
+          "name": "interviewers",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_by_id": {
+          "name": "created_by_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "invitation_sent_at": {
+          "name": "invitation_sent_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "candidate_response": {
+          "name": "candidate_response",
+          "type": "candidate_response",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'pending'"
+        },
+        "candidate_responded_at": {
+          "name": "candidate_responded_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "google_calendar_event_id": {
+          "name": "google_calendar_event_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "google_calendar_event_link": {
+          "name": "google_calendar_event_link",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "timezone": {
+          "name": "timezone",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'UTC'"
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "interview_organization_id_idx": {
+          "name": "interview_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "interview_application_id_idx": {
+          "name": "interview_application_id_idx",
+          "columns": [
+            {
+              "expression": "application_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "interview_scheduled_at_idx": {
+          "name": "interview_scheduled_at_idx",
+          "columns": [
+            {
+              "expression": "scheduled_at",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "interview_status_idx": {
+          "name": "interview_status_idx",
+          "columns": [
+            {
+              "expression": "status",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "interview_created_by_id_idx": {
+          "name": "interview_created_by_id_idx",
+          "columns": [
+            {
+              "expression": "created_by_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "interview_organization_id_organization_id_fk": {
+          "name": "interview_organization_id_organization_id_fk",
+          "tableFrom": "interview",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "interview_application_id_application_id_fk": {
+          "name": "interview_application_id_application_id_fk",
+          "tableFrom": "interview",
+          "tableTo": "application",
+          "columnsFrom": [
+            "application_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "interview_created_by_id_user_id_fk": {
+          "name": "interview_created_by_id_user_id_fk",
+          "tableFrom": "interview",
+          "tableTo": "user",
+          "columnsFrom": [
+            "created_by_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.invite_link": {
+      "name": "invite_link",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "created_by_id": {
+          "name": "created_by_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "token": {
+          "name": "token",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "role": {
+          "name": "role",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'member'"
+        },
+        "max_uses": {
+          "name": "max_uses",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "use_count": {
+          "name": "use_count",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "default": 0
+        },
+        "expires_at": {
+          "name": "expires_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "revoked_at": {
+          "name": "revoked_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "invite_link_organization_id_idx": {
+          "name": "invite_link_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "invite_link_token_idx": {
+          "name": "invite_link_token_idx",
+          "columns": [
+            {
+              "expression": "token",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "invite_link_organization_id_organization_id_fk": {
+          "name": "invite_link_organization_id_organization_id_fk",
+          "tableFrom": "invite_link",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "invite_link_created_by_id_user_id_fk": {
+          "name": "invite_link_created_by_id_user_id_fk",
+          "tableFrom": "invite_link",
+          "tableTo": "user",
+          "columnsFrom": [
+            "created_by_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {
+        "invite_link_token_unique": {
+          "name": "invite_link_token_unique",
+          "nullsNotDistinct": false,
+          "columns": [
+            "token"
+          ]
+        }
+      },
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.job": {
+      "name": "job",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "title": {
+          "name": "title",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "slug": {
+          "name": "slug",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "description": {
+          "name": "description",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "location": {
+          "name": "location",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "type": {
+          "name": "type",
+          "type": "job_type",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'full_time'"
+        },
+        "status": {
+          "name": "status",
+          "type": "job_status",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'draft'"
+        },
+        "salary_min": {
+          "name": "salary_min",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "salary_max": {
+          "name": "salary_max",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "salary_currency": {
+          "name": "salary_currency",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "salary_unit": {
+          "name": "salary_unit",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "salary_negotiable": {
+          "name": "salary_negotiable",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": false
+        },
+        "remote_status": {
+          "name": "remote_status",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "valid_through": {
+          "name": "valid_through",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "experience_level": {
+          "name": "experience_level",
+          "type": "experience_level",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "require_resume": {
+          "name": "require_resume",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": false
+        },
+        "require_cover_letter": {
+          "name": "require_cover_letter",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": false
+        },
+        "auto_score_on_apply": {
+          "name": "auto_score_on_apply",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "job_organization_id_idx": {
+          "name": "job_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "job_organization_id_organization_id_fk": {
+          "name": "job_organization_id_organization_id_fk",
+          "tableFrom": "job",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {
+        "job_slug_unique": {
+          "name": "job_slug_unique",
+          "nullsNotDistinct": false,
+          "columns": [
+            "slug"
+          ]
+        }
+      },
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.job_question": {
+      "name": "job_question",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "job_id": {
+          "name": "job_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "type": {
+          "name": "type",
+          "type": "question_type",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'short_text'"
+        },
+        "label": {
+          "name": "label",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "description": {
+          "name": "description",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "required": {
+          "name": "required",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": false
+        },
+        "options": {
+          "name": "options",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "display_order": {
+          "name": "display_order",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "default": 0
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "job_question_organization_id_idx": {
+          "name": "job_question_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "job_question_job_id_idx": {
+          "name": "job_question_job_id_idx",
+          "columns": [
+            {
+              "expression": "job_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "job_question_organization_id_organization_id_fk": {
+          "name": "job_question_organization_id_organization_id_fk",
+          "tableFrom": "job_question",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "job_question_job_id_job_id_fk": {
+          "name": "job_question_job_id_job_id_fk",
+          "tableFrom": "job_question",
+          "tableTo": "job",
+          "columnsFrom": [
+            "job_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.join_request": {
+      "name": "join_request",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "user_id": {
+          "name": "user_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "message": {
+          "name": "message",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "status": {
+          "name": "status",
+          "type": "join_request_status",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'pending'"
+        },
+        "reviewed_by_id": {
+          "name": "reviewed_by_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "reviewed_at": {
+          "name": "reviewed_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "join_request_organization_id_idx": {
+          "name": "join_request_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "join_request_user_id_idx": {
+          "name": "join_request_user_id_idx",
+          "columns": [
+            {
+              "expression": "user_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "join_request_status_idx": {
+          "name": "join_request_status_idx",
+          "columns": [
+            {
+              "expression": "status",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "join_request_user_id_user_id_fk": {
+          "name": "join_request_user_id_user_id_fk",
+          "tableFrom": "join_request",
+          "tableTo": "user",
+          "columnsFrom": [
+            "user_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "join_request_organization_id_organization_id_fk": {
+          "name": "join_request_organization_id_organization_id_fk",
+          "tableFrom": "join_request",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "join_request_reviewed_by_id_user_id_fk": {
+          "name": "join_request_reviewed_by_id_user_id_fk",
+          "tableFrom": "join_request",
+          "tableTo": "user",
+          "columnsFrom": [
+            "reviewed_by_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "no action",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.org_settings": {
+      "name": "org_settings",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "name_display_format": {
+          "name": "name_display_format",
+          "type": "name_display_format",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'first_last'"
+        },
+        "date_format": {
+          "name": "date_format",
+          "type": "date_format",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'mdy'"
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "org_settings_organization_id_idx": {
+          "name": "org_settings_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": true,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "org_settings_organization_id_organization_id_fk": {
+          "name": "org_settings_organization_id_organization_id_fk",
+          "tableFrom": "org_settings",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.property_definition": {
+      "name": "property_definition",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "job_id": {
+          "name": "job_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "entity_type": {
+          "name": "entity_type",
+          "type": "property_entity_type",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "type": {
+          "name": "type",
+          "type": "property_type",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "name": {
+          "name": "name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "description": {
+          "name": "description",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "display_order": {
+          "name": "display_order",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "default": 0
+        },
+        "config": {
+          "name": "config",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "property_definition_org_idx": {
+          "name": "property_definition_org_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "property_definition_org_entity_idx": {
+          "name": "property_definition_org_entity_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "entity_type",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "property_definition_job_idx": {
+          "name": "property_definition_job_idx",
+          "columns": [
+            {
+              "expression": "job_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "property_definition_organization_id_organization_id_fk": {
+          "name": "property_definition_organization_id_organization_id_fk",
+          "tableFrom": "property_definition",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "property_definition_job_id_job_id_fk": {
+          "name": "property_definition_job_id_job_id_fk",
+          "tableFrom": "property_definition",
+          "tableTo": "job",
+          "columnsFrom": [
+            "job_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.property_value": {
+      "name": "property_value",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "property_definition_id": {
+          "name": "property_definition_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "entity_type": {
+          "name": "entity_type",
+          "type": "property_entity_type",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "entity_id": {
+          "name": "entity_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "value": {
+          "name": "value",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "property_value_org_idx": {
+          "name": "property_value_org_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "property_value_entity_idx": {
+          "name": "property_value_entity_idx",
+          "columns": [
+            {
+              "expression": "entity_type",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "entity_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "property_value_definition_idx": {
+          "name": "property_value_definition_idx",
+          "columns": [
+            {
+              "expression": "property_definition_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "property_value_def_entity_idx": {
+          "name": "property_value_def_entity_idx",
+          "columns": [
+            {
+              "expression": "property_definition_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "entity_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": true,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "property_value_organization_id_organization_id_fk": {
+          "name": "property_value_organization_id_organization_id_fk",
+          "tableFrom": "property_value",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "property_value_property_definition_id_property_definition_id_fk": {
+          "name": "property_value_property_definition_id_property_definition_id_fk",
+          "tableFrom": "property_value",
+          "tableTo": "property_definition",
+          "columnsFrom": [
+            "property_definition_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.question_response": {
+      "name": "question_response",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "application_id": {
+          "name": "application_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "question_id": {
+          "name": "question_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "value": {
+          "name": "value",
+          "type": "jsonb",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "question_response_organization_id_idx": {
+          "name": "question_response_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "question_response_application_id_idx": {
+          "name": "question_response_application_id_idx",
+          "columns": [
+            {
+              "expression": "application_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "question_response_question_id_idx": {
+          "name": "question_response_question_id_idx",
+          "columns": [
+            {
+              "expression": "question_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "question_response_organization_id_organization_id_fk": {
+          "name": "question_response_organization_id_organization_id_fk",
+          "tableFrom": "question_response",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "question_response_application_id_application_id_fk": {
+          "name": "question_response_application_id_application_id_fk",
+          "tableFrom": "question_response",
+          "tableTo": "application",
+          "columnsFrom": [
+            "application_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "question_response_question_id_job_question_id_fk": {
+          "name": "question_response_question_id_job_question_id_fk",
+          "tableFrom": "question_response",
+          "tableTo": "job_question",
+          "columnsFrom": [
+            "question_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.scoring_criterion": {
+      "name": "scoring_criterion",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "job_id": {
+          "name": "job_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "key": {
+          "name": "key",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "name": {
+          "name": "name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "description": {
+          "name": "description",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "category": {
+          "name": "category",
+          "type": "criterion_category",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'custom'"
+        },
+        "max_score": {
+          "name": "max_score",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "default": 10
+        },
+        "weight": {
+          "name": "weight",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "default": 50
+        },
+        "display_order": {
+          "name": "display_order",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "default": 0
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "scoring_criterion_organization_id_idx": {
+          "name": "scoring_criterion_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "scoring_criterion_job_id_idx": {
+          "name": "scoring_criterion_job_id_idx",
+          "columns": [
+            {
+              "expression": "job_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "scoring_criterion_job_key_idx": {
+          "name": "scoring_criterion_job_key_idx",
+          "columns": [
+            {
+              "expression": "job_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            },
+            {
+              "expression": "key",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": true,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "scoring_criterion_organization_id_organization_id_fk": {
+          "name": "scoring_criterion_organization_id_organization_id_fk",
+          "tableFrom": "scoring_criterion",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "scoring_criterion_job_id_job_id_fk": {
+          "name": "scoring_criterion_job_id_job_id_fk",
+          "tableFrom": "scoring_criterion",
+          "tableTo": "job",
+          "columnsFrom": [
+            "job_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.tracking_link": {
+      "name": "tracking_link",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "job_id": {
+          "name": "job_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "channel": {
+          "name": "channel",
+          "type": "source_channel",
+          "typeSchema": "public",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "'custom'"
+        },
+        "name": {
+          "name": "name",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "code": {
+          "name": "code",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "utm_source": {
+          "name": "utm_source",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "utm_medium": {
+          "name": "utm_medium",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "utm_campaign": {
+          "name": "utm_campaign",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "utm_term": {
+          "name": "utm_term",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "utm_content": {
+          "name": "utm_content",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "click_count": {
+          "name": "click_count",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "default": 0
+        },
+        "application_count": {
+          "name": "application_count",
+          "type": "integer",
+          "primaryKey": false,
+          "notNull": true,
+          "default": 0
+        },
+        "is_active": {
+          "name": "is_active",
+          "type": "boolean",
+          "primaryKey": false,
+          "notNull": true,
+          "default": true
+        },
+        "created_by_id": {
+          "name": "created_by_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "created_at": {
+          "name": "created_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        },
+        "updated_at": {
+          "name": "updated_at",
+          "type": "timestamp",
+          "primaryKey": false,
+          "notNull": true,
+          "default": "now()"
+        }
+      },
+      "indexes": {
+        "tracking_link_organization_id_idx": {
+          "name": "tracking_link_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "tracking_link_job_id_idx": {
+          "name": "tracking_link_job_id_idx",
+          "columns": [
+            {
+              "expression": "job_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "tracking_link_code_idx": {
+          "name": "tracking_link_code_idx",
+          "columns": [
+            {
+              "expression": "code",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "tracking_link_channel_idx": {
+          "name": "tracking_link_channel_idx",
+          "columns": [
+            {
+              "expression": "channel",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "tracking_link_organization_id_organization_id_fk": {
+          "name": "tracking_link_organization_id_organization_id_fk",
+          "tableFrom": "tracking_link",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "tracking_link_job_id_job_id_fk": {
+          "name": "tracking_link_job_id_job_id_fk",
+          "tableFrom": "tracking_link",
+          "tableTo": "job",
+          "columnsFrom": [
+            "job_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "tracking_link_created_by_id_user_id_fk": {
+          "name": "tracking_link_created_by_id_user_id_fk",
+          "tableFrom": "tracking_link",
+          "tableTo": "user",
+          "columnsFrom": [
+            "created_by_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {
+        "tracking_link_code_unique": {
+          "name": "tracking_link_code_unique",
+          "nullsNotDistinct": false,
+          "columns": [
+            "code"
+          ]
+        }
+      },
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    },
+    "public.sso_provider": {
+      "name": "sso_provider",
+      "schema": "",
+      "columns": {
+        "id": {
+          "name": "id",
+          "type": "text",
+          "primaryKey": true,
+          "notNull": true
+        },
+        "issuer": {
+          "name": "issuer",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "domain": {
+          "name": "domain",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "oidc_config": {
+          "name": "oidc_config",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "saml_config": {
+          "name": "saml_config",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        },
+        "user_id": {
+          "name": "user_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "provider_id": {
+          "name": "provider_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": true
+        },
+        "organization_id": {
+          "name": "organization_id",
+          "type": "text",
+          "primaryKey": false,
+          "notNull": false
+        }
+      },
+      "indexes": {
+        "sso_provider_domain_idx": {
+          "name": "sso_provider_domain_idx",
+          "columns": [
+            {
+              "expression": "domain",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "sso_provider_provider_id_idx": {
+          "name": "sso_provider_provider_id_idx",
+          "columns": [
+            {
+              "expression": "provider_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        },
+        "sso_provider_organization_id_idx": {
+          "name": "sso_provider_organization_id_idx",
+          "columns": [
+            {
+              "expression": "organization_id",
+              "isExpression": false,
+              "asc": true,
+              "nulls": "last"
+            }
+          ],
+          "isUnique": false,
+          "concurrently": false,
+          "method": "btree",
+          "with": {}
+        }
+      },
+      "foreignKeys": {
+        "sso_provider_user_id_user_id_fk": {
+          "name": "sso_provider_user_id_user_id_fk",
+          "tableFrom": "sso_provider",
+          "tableTo": "user",
+          "columnsFrom": [
+            "user_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        },
+        "sso_provider_organization_id_organization_id_fk": {
+          "name": "sso_provider_organization_id_organization_id_fk",
+          "tableFrom": "sso_provider",
+          "tableTo": "organization",
+          "columnsFrom": [
+            "organization_id"
+          ],
+          "columnsTo": [
+            "id"
+          ],
+          "onDelete": "cascade",
+          "onUpdate": "no action"
+        }
+      },
+      "compositePrimaryKeys": {},
+      "uniqueConstraints": {},
+      "policies": {},
+      "checkConstraints": {},
+      "isRLSEnabled": false
+    }
+  },
+  "enums": {
+    "public.activity_action": {
+      "name": "activity_action",
+      "schema": "public",
+      "values": [
+        "created",
+        "updated",
+        "deleted",
+        "status_changed",
+        "comment_added",
+        "member_invited",
+        "member_removed",
+        "member_role_changed",
+        "scored"
+      ]
+    },
+    "public.analysis_run_status": {
+      "name": "analysis_run_status",
+      "schema": "public",
+      "values": [
+        "completed",
+        "failed",
+        "partial"
+      ]
+    },
+    "public.application_status": {
+      "name": "application_status",
+      "schema": "public",
+      "values": [
+        "new",
+        "screening",
+        "interview",
+        "offer",
+        "hired",
+        "rejected"
+      ]
+    },
+    "public.calendar_provider": {
+      "name": "calendar_provider",
+      "schema": "public",
+      "values": [
+        "google"
+      ]
+    },
+    "public.candidate_response": {
+      "name": "candidate_response",
+      "schema": "public",
+      "values": [
+        "pending",
+        "accepted",
+        "declined",
+        "tentative"
+      ]
+    },
+    "public.chatbot_message_role": {
+      "name": "chatbot_message_role",
+      "schema": "public",
+      "values": [
+        "user",
+        "assistant"
+      ]
+    },
+    "public.comment_target": {
+      "name": "comment_target",
+      "schema": "public",
+      "values": [
+        "candidate",
+        "application",
+        "job"
+      ]
+    },
+    "public.criterion_category": {
+      "name": "criterion_category",
+      "schema": "public",
+      "values": [
+        "technical",
+        "experience",
+        "soft_skills",
+        "education",
+        "culture",
+        "custom"
+      ]
+    },
+    "public.date_format": {
+      "name": "date_format",
+      "schema": "public",
+      "values": [
+        "mdy",
+        "dmy",
+        "ymd"
+      ]
+    },
+    "public.document_type": {
+      "name": "document_type",
+      "schema": "public",
+      "values": [
+        "resume",
+        "cover_letter",
+        "other"
+      ]
+    },
+    "public.experience_level": {
+      "name": "experience_level",
+      "schema": "public",
+      "values": [
+        "junior",
+        "mid",
+        "senior",
+        "lead"
+      ]
+    },
+    "public.gender": {
+      "name": "gender",
+      "schema": "public",
+      "values": [
+        "male",
+        "female",
+        "other",
+        "prefer_not_to_say"
+      ]
+    },
+    "public.interview_status": {
+      "name": "interview_status",
+      "schema": "public",
+      "values": [
+        "scheduled",
+        "completed",
+        "cancelled",
+        "no_show"
+      ]
+    },
+    "public.interview_type": {
+      "name": "interview_type",
+      "schema": "public",
+      "values": [
+        "phone",
+        "video",
+        "in_person",
+        "panel",
+        "technical",
+        "take_home"
+      ]
+    },
+    "public.job_status": {
+      "name": "job_status",
+      "schema": "public",
+      "values": [
+        "draft",
+        "open",
+        "closed",
+        "archived"
+      ]
+    },
+    "public.job_type": {
+      "name": "job_type",
+      "schema": "public",
+      "values": [
+        "full_time",
+        "part_time",
+        "contract",
+        "internship"
+      ]
+    },
+    "public.join_request_status": {
+      "name": "join_request_status",
+      "schema": "public",
+      "values": [
+        "pending",
+        "approved",
+        "rejected"
+      ]
+    },
+    "public.name_display_format": {
+      "name": "name_display_format",
+      "schema": "public",
+      "values": [
+        "first_last",
+        "last_first"
+      ]
+    },
+    "public.property_entity_type": {
+      "name": "property_entity_type",
+      "schema": "public",
+      "values": [
+        "candidate",
+        "application"
+      ]
+    },
+    "public.property_type": {
+      "name": "property_type",
+      "schema": "public",
+      "values": [
+        "text",
+        "long_text",
+        "number",
+        "select",
+        "multi_select",
+        "date",
+        "checkbox",
+        "url",
+        "email",
+        "person",
+        "file"
+      ]
+    },
+    "public.question_type": {
+      "name": "question_type",
+      "schema": "public",
+      "values": [
+        "short_text",
+        "long_text",
+        "single_select",
+        "multi_select",
+        "number",
+        "date",
+        "url",
+        "checkbox",
+        "file_upload"
+      ]
+    },
+    "public.source_channel": {
+      "name": "source_channel",
+      "schema": "public",
+      "values": [
+        "linkedin",
+        "indeed",
+        "glassdoor",
+        "ziprecruiter",
+        "monster",
+        "handshake",
+        "angellist",
+        "wellfound",
+        "dice",
+        "stackoverflow",
+        "weworkremotely",
+        "remoteok",
+        "builtin",
+        "hired",
+        "lever",
+        "greenhouse_board",
+        "google_jobs",
+        "facebook",
+        "twitter",
+        "instagram",
+        "tiktok",
+        "reddit",
+        "referral",
+        "career_site",
+        "email",
+        "event",
+        "agency",
+        "direct",
+        "other",
+        "custom"
+      ]
+    }
+  },
+  "schemas": {},
+  "sequences": {},
+  "roles": {},
+  "policies": {},
+  "views": {},
+  "_meta": {
+    "columns": {},
+    "schemas": {},
+    "tables": {}
+  }
+}
\ No newline at end of file
diff --git a/server/database/migrations/meta/_journal.json b/server/database/migrations/meta/_journal.json
index 757aba45..2fec9f78 100644
--- a/server/database/migrations/meta/_journal.json
+++ b/server/database/migrations/meta/_journal.json
@@ -197,6 +197,13 @@
       "when": 1777300000000,
       "tag": "0027_chatbot_agent_default_unique",
       "breakpoints": true
+    },
+    {
+      "idx": 28,
+      "version": "7",
+      "when": 1777463601249,
+      "tag": "0028_custom_properties",
+      "breakpoints": true
     }
   ]
 }
\ No newline at end of file
diff --git a/server/database/schema/app.ts b/server/database/schema/app.ts
index 020da9b4..f450351d 100644
--- a/server/database/schema/app.ts
+++ b/server/database/schema/app.ts
@@ -27,6 +27,11 @@ export const questionTypeEnum = pgEnum('question_type', [
   'short_text', 'long_text', 'single_select', 'multi_select',
   'number', 'date', 'url', 'checkbox', 'file_upload',
 ])
+export const propertyEntityTypeEnum = pgEnum('property_entity_type', ['candidate', 'application'])
+export const propertyTypeEnum = pgEnum('property_type', [
+  'text', 'long_text', 'number', 'select', 'multi_select',
+  'date', 'checkbox', 'url', 'email', 'person', 'file',
+])
 export const genderEnum = pgEnum('gender', ['male', 'female', 'other', 'prefer_not_to_say'])
 export const experienceLevelEnum = pgEnum('experience_level', ['junior', 'mid', 'senior', 'lead'])
 export const nameDisplayFormatEnum = pgEnum('name_display_format', ['first_last', 'last_first'])
@@ -182,6 +187,69 @@ export const questionResponse = pgTable('question_response', {
   index('question_response_question_id_idx').on(t.questionId),
 ]))
 
+// ─────────────────────────────────────────────
+// Custom Properties (Notion-style "database properties")
+// ─────────────────────────────────────────────
+//
+// Two-table design:
+//   - propertyDefinition: schema. Org-global when jobId IS NULL; per-job otherwise.
+//                         entityType=candidate is always org-global (jobId must be NULL).
+//                         entityType=application can be org-global OR per-job.
+//   - propertyValue:      values, polymorphic to candidate.id or application.id.
+//
+// `value` is jsonb shaped by the property type:
+//   text/long_text/url/email/person → string
+//   number                          → number
+//   select                          → string (one option id)
+//   multi_select                    → string[] (option ids)
+//   date                            → string (ISO YYYY-MM-DD)
+//   checkbox                        → boolean
+//   file                            → { documentId: string }
+//
+// `config` jsonb:
+//   select / multi_select → { options: [{ id, label, color }] }
+//   number                → { format?: 'plain' | 'percent' | 'currency', currency?: string }
+//   others                → null
+//
+// Per-job overrides are NOT supported (additive only): per-job props are merged
+// after org-global ones, ordered by displayOrder.
+
+export const propertyDefinition = pgTable('property_definition', {
+  id: text('id').primaryKey().$defaultFn(() => crypto.randomUUID()),
+  organizationId: text('organization_id').notNull().references(() => organization.id, { onDelete: 'cascade' }),
+  /** NULL = org-global. Non-null = per-job (only valid when entityType='application'). */
+  jobId: text('job_id').references(() => job.id, { onDelete: 'cascade' }),
+  entityType: propertyEntityTypeEnum('entity_type').notNull(),
+  type: propertyTypeEnum('type').notNull(),
+  name: text('name').notNull(),
+  description: text('description'),
+  displayOrder: integer('display_order').notNull().default(0),
+  config: jsonb('config').$type<Record<string, unknown> | null>(),
+  createdAt: timestamp('created_at').notNull().defaultNow(),
+  updatedAt: timestamp('updated_at').notNull().defaultNow(),
+}, (t) => ([
+  index('property_definition_org_idx').on(t.organizationId),
+  index('property_definition_org_entity_idx').on(t.organizationId, t.entityType),
+  index('property_definition_job_idx').on(t.jobId),
+]))
+
+export const propertyValue = pgTable('property_value', {
+  id: text('id').primaryKey().$defaultFn(() => crypto.randomUUID()),
+  organizationId: text('organization_id').notNull().references(() => organization.id, { onDelete: 'cascade' }),
+  propertyDefinitionId: text('property_definition_id').notNull().references(() => propertyDefinition.id, { onDelete: 'cascade' }),
+  entityType: propertyEntityTypeEnum('entity_type').notNull(),
+  /** candidate.id when entityType='candidate', application.id when 'application' */
+  entityId: text('entity_id').notNull(),
+  value: jsonb('value'),
+  createdAt: timestamp('created_at').notNull().defaultNow(),
+  updatedAt: timestamp('updated_at').notNull().defaultNow(),
+}, (t) => ([
+  index('property_value_org_idx').on(t.organizationId),
+  index('property_value_entity_idx').on(t.entityType, t.entityId),
+  index('property_value_definition_idx').on(t.propertyDefinitionId),
+  uniqueIndex('property_value_def_entity_idx').on(t.propertyDefinitionId, t.entityId),
+]))
+
 // ─────────────────────────────────────────────
 // Organization Localization Settings
 // ─────────────────────────────────────────────
@@ -678,6 +746,17 @@ export const questionResponseRelations = relations(questionResponse, ({ one }) =
   question: one(jobQuestion, { fields: [questionResponse.questionId], references: [jobQuestion.id] }),
 }))
 
+export const propertyDefinitionRelations = relations(propertyDefinition, ({ one, many }) => ({
+  organization: one(organization, { fields: [propertyDefinition.organizationId], references: [organization.id] }),
+  job: one(job, { fields: [propertyDefinition.jobId], references: [job.id] }),
+  values: many(propertyValue),
+}))
+
+export const propertyValueRelations = relations(propertyValue, ({ one }) => ({
+  organization: one(organization, { fields: [propertyValue.organizationId], references: [organization.id] }),
+  definition: one(propertyDefinition, { fields: [propertyValue.propertyDefinitionId], references: [propertyDefinition.id] }),
+}))
+
 export const commentRelations = relations(comment, ({ one }) => ({
   organization: one(organization, { fields: [comment.organizationId], references: [organization.id] }),
   author: one(user, { fields: [comment.authorId], references: [user.id] }),
diff --git a/server/utils/properties.ts b/server/utils/properties.ts
new file mode 100644
index 00000000..a3fe56cb
--- /dev/null
+++ b/server/utils/properties.ts
@@ -0,0 +1,312 @@
+import { and, eq, inArray, isNull, or, sql } from 'drizzle-orm'
+import { propertyDefinition, propertyValue } from '../database/schema'
+import type { PropertyEntityType, PropertyType } from './schemas/property'
+
+// ─────────────────────────────────────────────
+// Property loading & attachment helpers
+// ─────────────────────────────────────────────
+
+export type PropertyDefinitionRow = {
+  id: string
+  organizationId: string
+  jobId: string | null
+  entityType: PropertyEntityType
+  type: PropertyType
+  name: string
+  description: string | null
+  displayOrder: number
+  config: Record<string, unknown> | null
+  createdAt: Date
+  updatedAt: Date
+}
+
+export type PropertyEntry = {
+  definition: PropertyDefinitionRow
+  value: unknown
+}
+
+/**
+ * Load all property definitions visible in a given context.
+ *  - Candidate context: org-global candidate definitions only.
+ *  - Application context: org-global application defs + per-job defs for jobId (additive).
+ *
+ * Ordered by (jobId NULLS FIRST, displayOrder, createdAt) so org-global props
+ * always render first.
+ */
+export async function loadPropertyDefinitions(opts: {
+  organizationId: string
+  entityType: PropertyEntityType
+  jobId?: string | null
+}): Promise<PropertyDefinitionRow[]> {
+  const { organizationId, entityType, jobId } = opts
+
+  const where =
+    entityType === 'candidate'
+      ? and(
+          eq(propertyDefinition.organizationId, organizationId),
+          eq(propertyDefinition.entityType, 'candidate'),
+          isNull(propertyDefinition.jobId),
+        )
+      : and(
+          eq(propertyDefinition.organizationId, organizationId),
+          eq(propertyDefinition.entityType, 'application'),
+          jobId
+            ? or(isNull(propertyDefinition.jobId), eq(propertyDefinition.jobId, jobId))
+            : isNull(propertyDefinition.jobId),
+        )
+
+  const rows = await db
+    .select()
+    .from(propertyDefinition)
+    .where(where)
+    .orderBy(
+      sql`${propertyDefinition.jobId} NULLS FIRST`,
+      propertyDefinition.displayOrder,
+      propertyDefinition.createdAt,
+    )
+
+  return rows as unknown as PropertyDefinitionRow[]
+}
+
+/**
+ * Load values for a single entity, returning [{ definition, value }] entries
+ * in the same order as definitions (missing values surface as `value: null`).
+ */
+export async function loadPropertyEntriesForEntity(opts: {
+  organizationId: string
+  entityType: PropertyEntityType
+  entityId: string
+  jobId?: string | null
+}): Promise<PropertyEntry[]> {
+  const definitions = await loadPropertyDefinitions(opts)
+  if (definitions.length === 0) return []
+
+  const values = await db
+    .select({
+      propertyDefinitionId: propertyValue.propertyDefinitionId,
+      value: propertyValue.value,
+    })
+    .from(propertyValue)
+    .where(
+      and(
+        eq(propertyValue.organizationId, opts.organizationId),
+        eq(propertyValue.entityType, opts.entityType),
+        eq(propertyValue.entityId, opts.entityId),
+        inArray(
+          propertyValue.propertyDefinitionId,
+          definitions.map((d) => d.id),
+        ),
+      ),
+    )
+
+  const valueMap = new Map(values.map((v) => [v.propertyDefinitionId, v.value]))
+  return definitions.map((definition) => ({
+    definition,
+    value: valueMap.get(definition.id) ?? null,
+  }))
+}
+
+/**
+ * Bulk load values for many entities. Returns a Map<entityId, PropertyEntry[]>
+ * suitable for splicing into list endpoint responses.
+ */
+export async function loadPropertyEntriesForEntities(opts: {
+  organizationId: string
+  entityType: PropertyEntityType
+  entityIds: string[]
+  /**
+   * For application list responses we may want per-job props too. The
+   * caller passes the union of jobIds; we then load all defs whose jobId
+   * is null OR in that set.
+   */
+  jobIds?: string[]
+}): Promise<Map<string, PropertyEntry[]>> {
+  const { organizationId, entityType, entityIds, jobIds } = opts
+  if (entityIds.length === 0) return new Map()
+
+  const where =
+    entityType === 'candidate'
+      ? and(
+          eq(propertyDefinition.organizationId, organizationId),
+          eq(propertyDefinition.entityType, 'candidate'),
+          isNull(propertyDefinition.jobId),
+        )
+      : and(
+          eq(propertyDefinition.organizationId, organizationId),
+          eq(propertyDefinition.entityType, 'application'),
+          jobIds && jobIds.length > 0
+            ? or(isNull(propertyDefinition.jobId), inArray(propertyDefinition.jobId, jobIds))
+            : isNull(propertyDefinition.jobId),
+        )
+
+  const definitions = (await db
+    .select()
+    .from(propertyDefinition)
+    .where(where)
+    .orderBy(
+      sql`${propertyDefinition.jobId} NULLS FIRST`,
+      propertyDefinition.displayOrder,
+      propertyDefinition.createdAt,
+    )) as unknown as PropertyDefinitionRow[]
+
+  if (definitions.length === 0) return new Map(entityIds.map((id) => [id, []]))
+
+  const defById = new Map(definitions.map((d) => [d.id, d]))
+
+  const values = await db
+    .select({
+      propertyDefinitionId: propertyValue.propertyDefinitionId,
+      entityId: propertyValue.entityId,
+      value: propertyValue.value,
+    })
+    .from(propertyValue)
+    .where(
+      and(
+        eq(propertyValue.organizationId, organizationId),
+        eq(propertyValue.entityType, entityType),
+        inArray(propertyValue.entityId, entityIds),
+        inArray(
+          propertyValue.propertyDefinitionId,
+          definitions.map((d) => d.id),
+        ),
+      ),
+    )
+
+  const map = new Map<string, PropertyEntry[]>()
+  for (const id of entityIds) map.set(id, [])
+
+  // Build a per-entity value lookup
+  const byEntity = new Map<string, Map<string, unknown>>()
+  for (const v of values) {
+    let perEntity = byEntity.get(v.entityId)
+    if (!perEntity) {
+      perEntity = new Map()
+      byEntity.set(v.entityId, perEntity)
+    }
+    perEntity.set(v.propertyDefinitionId, v.value)
+  }
+
+  for (const entityId of entityIds) {
+    const list = map.get(entityId)!
+    const perEntity = byEntity.get(entityId)
+    for (const def of definitions) {
+      // For application entities, only include defs whose jobId is null
+      // (org-global) or matches this entity's job — but we don't have jobId
+      // here; that filtering is done at the caller's layer if needed.
+      list.push({ definition: def, value: perEntity?.get(def.id) ?? null })
+    }
+  }
+
+  return map
+}
+
+/**
+ * Find the entity ids matching a set of property filters (AND across filters).
+ * Each filter is { propertyDefinitionId, op, value }.
+ *  - op='equals' for select, checkbox, text-equals, number-equals
+ *  - op='contains' for text/long_text/url/email substring match
+ *  - op='in' for multi_select (any-of)
+ *  - op='isEmpty' / 'isNotEmpty' for null checks
+ *
+ * Returns a Set<entityId>. Caller intersects with their other WHERE conditions.
+ */
+export type PropertyFilter = {
+  propertyDefinitionId: string
+  op: 'equals' | 'contains' | 'in' | 'isEmpty' | 'isNotEmpty'
+  value?: unknown
+}
+
+export async function entityIdsMatchingFilters(opts: {
+  organizationId: string
+  entityType: PropertyEntityType
+  filters: PropertyFilter[]
+}): Promise<Set<string> | null> {
+  const { organizationId, entityType, filters } = opts
+  if (filters.length === 0) return null
+
+  // Each filter narrows the candidate set; intersect.
+  let working: Set<string> | null = null
+
+  for (const f of filters) {
+    const baseWhere = and(
+      eq(propertyValue.organizationId, organizationId),
+      eq(propertyValue.entityType, entityType),
+      eq(propertyValue.propertyDefinitionId, f.propertyDefinitionId),
+    )
+
+    let matchingRows: { entityId: string }[] = []
+
+    if (f.op === 'isEmpty') {
+      // entity has no row OR row has null value — easier to find "has non-null" and invert at the end
+      matchingRows = await db
+        .select({ entityId: propertyValue.entityId })
+        .from(propertyValue)
+        .where(and(baseWhere, sql`${propertyValue.value} IS NOT NULL`))
+      const haveValue = new Set(matchingRows.map((r) => r.entityId))
+      // We don't know the universe here — caller must intersect with their primary set.
+      // Encode "isEmpty" as a marker by returning entities NOT in haveValue. We can't
+      // do that without a universe, so we mark via a sentinel: store the inverse.
+      // Simpler: return a function-of-universe via a wrapper. Instead, support it
+      // by returning special null and forcing caller to handle "isEmpty" at SQL.
+      // Simplification for v1: only support isEmpty via post-filter on attached
+      // entries (caller computes). Skip here.
+      working = working === null ? new Set() : working
+      continue
+    }
+
+    if (f.op === 'isNotEmpty') {
+      matchingRows = await db
+        .select({ entityId: propertyValue.entityId })
+        .from(propertyValue)
+        .where(and(baseWhere, sql`${propertyValue.value} IS NOT NULL`))
+    }
+    else if (f.op === 'equals') {
+      matchingRows = await db
+        .select({ entityId: propertyValue.entityId })
+        .from(propertyValue)
+        .where(and(baseWhere, sql`${propertyValue.value} = ${JSON.stringify(f.value)}::jsonb`))
+    }
+    else if (f.op === 'contains') {
+      const needle = String(f.value ?? '').toLowerCase()
+      matchingRows = await db
+        .select({ entityId: propertyValue.entityId })
+        .from(propertyValue)
+        .where(
+          and(
+            baseWhere,
+            sql`lower(${propertyValue.value}::text) LIKE ${'%' + needle.replace(/[%_\\]/g, '\\$&') + '%'}`,
+          ),
+        )
+    }
+    else if (f.op === 'in') {
+      const needles = Array.isArray(f.value) ? f.value.map(String) : []
+      if (needles.length === 0) {
+        working = new Set()
+        break
+      }
+      // Match where the jsonb value array contains any of the needles
+      matchingRows = await db
+        .select({ entityId: propertyValue.entityId })
+        .from(propertyValue)
+        .where(
+          and(
+            baseWhere,
+            sql`${propertyValue.value} ?| ${needles}::text[]`,
+          ),
+        )
+    }
+
+    const next = new Set(matchingRows.map((r) => r.entityId))
+    if (working === null) {
+      working = next
+    } else {
+      // intersect
+      const intersected = new Set<string>()
+      for (const id of working) if (next.has(id)) intersected.add(id)
+      working = intersected
+    }
+    if (working.size === 0) break
+  }
+
+  return working
+}
diff --git a/server/utils/schemas/application.ts b/server/utils/schemas/application.ts
index 6f2dbec6..fadfe269 100644
--- a/server/utils/schemas/application.ts
+++ b/server/utils/schemas/application.ts
@@ -27,6 +27,8 @@ export const applicationQuerySchema = z.object({
   jobId: z.string().min(1).optional(),
   candidateId: z.string().min(1).optional(),
   status: z.enum(['new', 'screening', 'interview', 'offer', 'hired', 'rejected']).optional(),
+  /** JSON-encoded array of { propertyDefinitionId, op, value } filters */
+  propertyFilters: z.string().optional(),
 })
 
 /** Reusable schema for `:id` route params */
diff --git a/server/utils/schemas/candidate.ts b/server/utils/schemas/candidate.ts
index 35288c67..f8ed2bbf 100644
--- a/server/utils/schemas/candidate.ts
+++ b/server/utils/schemas/candidate.ts
@@ -60,6 +60,8 @@ export const candidateQuerySchema = z.object({
   gender: z.enum(genderValues).optional(),
   dobFrom: z.string().regex(/^\d{4}-\d{2}-\d{2}$/, 'dobFrom must be YYYY-MM-DD').optional(),
   dobTo: z.string().regex(/^\d{4}-\d{2}-\d{2}$/, 'dobTo must be YYYY-MM-DD').optional(),
+  /** JSON-encoded array of { propertyDefinitionId, op, value } filters */
+  propertyFilters: z.string().optional(),
 })
 
 /** Reusable schema for `:id` route params */
diff --git a/server/utils/schemas/property.ts b/server/utils/schemas/property.ts
new file mode 100644
index 00000000..16c18743
--- /dev/null
+++ b/server/utils/schemas/property.ts
@@ -0,0 +1,169 @@
+import { z } from 'zod'
+
+// ─────────────────────────────────────────────
+// Custom Property — Zod schemas (shared)
+// ─────────────────────────────────────────────
+
+export const propertyEntityTypes = ['candidate', 'application'] as const
+export type PropertyEntityType = (typeof propertyEntityTypes)[number]
+
+export const propertyTypes = [
+  'text', 'long_text', 'number', 'select', 'multi_select',
+  'date', 'checkbox', 'url', 'email', 'person', 'file',
+] as const
+export type PropertyType = (typeof propertyTypes)[number]
+
+// ── Per-type config schemas (`propertyDefinition.config` jsonb) ──
+const selectOptionSchema = z.object({
+  id: z.string().min(1),
+  label: z.string().min(1).max(80),
+  color: z.enum([
+    'gray', 'red', 'orange', 'amber', 'yellow', 'green', 'teal',
+    'blue', 'indigo', 'violet', 'pink',
+  ]).default('gray'),
+})
+export type PropertySelectOption = z.infer<typeof selectOptionSchema>
+
+const selectConfigSchema = z.object({
+  options: z.array(selectOptionSchema).max(50),
+})
+
+const numberConfigSchema = z.object({
+  format: z.enum(['plain', 'percent', 'currency']).default('plain'),
+  currency: z.string().max(8).optional(),
+})
+
+const propertyConfigSchema = z.union([
+  selectConfigSchema,
+  numberConfigSchema,
+  z.null(),
+  z.object({}).passthrough(),
+])
+
+// ── Definition CRUD ──
+export const createPropertyDefinitionSchema = z.object({
+  entityType: z.enum(propertyEntityTypes),
+  type: z.enum(propertyTypes),
+  name: z.string().min(1, 'Name is required').max(80, 'Name too long'),
+  description: z.string().max(500).nullish(),
+  jobId: z.string().min(1).nullish(),
+  config: propertyConfigSchema.nullish(),
+})
+
+export const updatePropertyDefinitionSchema = z.object({
+  name: z.string().min(1).max(80).optional(),
+  description: z.string().max(500).nullish(),
+  config: propertyConfigSchema.nullish(),
+  displayOrder: z.number().int().min(0).optional(),
+})
+
+export const reorderPropertiesSchema = z.object({
+  ids: z.array(z.string().min(1)).max(100),
+})
+
+export const propertyListQuerySchema = z.object({
+  entityType: z.enum(propertyEntityTypes).optional(),
+  /** When supplied, returns org-global + this job's per-job props (deduped, ordered). */
+  jobId: z.string().min(1).optional(),
+  /** Set to "1" to ONLY return per-job props (used by the per-job schema editor). */
+  jobOnly: z
+    .union([z.literal('1'), z.literal('true'), z.boolean()])
+    .optional()
+    .transform((v) => v === '1' || v === 'true' || v === true),
+})
+
+export const propertyIdParamSchema = z.object({
+  id: z.string().min(1),
+})
+
+// ── Value writes ──
+//
+// We allow null to clear a value. Concrete shape validation is performed
+// against the property definition's type at the server util layer.
+export const setPropertyValueSchema = z.object({
+  value: z.unknown(),
+})
+
+// ── Value validation by property type ──
+//
+// Returns the normalized (storage-ready) value or throws a 422 createError.
+export function validateValueForType(
+  type: PropertyType,
+  rawValue: unknown,
+  config: unknown,
+): unknown {
+  if (rawValue === null || rawValue === undefined || rawValue === '') return null
+
+  const fail = (msg: string): never => {
+    throw createError({ statusCode: 422, statusMessage: msg })
+  }
+
+  switch (type) {
+    case 'text':
+    case 'long_text': {
+      if (typeof rawValue !== 'string') return fail('Value must be a string')
+      const max = type === 'long_text' ? 10_000 : 500
+      if (rawValue.length > max) return fail(`Value exceeds ${max} characters`)
+      return rawValue
+    }
+    case 'number': {
+      const n = typeof rawValue === 'number' ? rawValue : Number(rawValue)
+      if (!Number.isFinite(n)) return fail('Value must be a number')
+      return n
+    }
+    case 'checkbox': {
+      if (typeof rawValue !== 'boolean') return fail('Value must be a boolean')
+      return rawValue
+    }
+    case 'date': {
+      if (typeof rawValue !== 'string' || !/^\d{4}-\d{2}-\d{2}$/.test(rawValue)) {
+        return fail('Date must be YYYY-MM-DD')
+      }
+      return rawValue
+    }
+    case 'url': {
+      if (typeof rawValue !== 'string') return fail('Value must be a string')
+      try {
+        // eslint-disable-next-line no-new
+        new URL(rawValue)
+      } catch {
+        return fail('Invalid URL')
+      }
+      return rawValue
+    }
+    case 'email': {
+      if (typeof rawValue !== 'string' || !/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(rawValue)) {
+        return fail('Invalid email')
+      }
+      return rawValue
+    }
+    case 'person': {
+      if (typeof rawValue !== 'string') return fail('Value must be a user id')
+      return rawValue
+    }
+    case 'file': {
+      if (typeof rawValue !== 'object' || rawValue === null) return fail('Invalid file value')
+      const v = rawValue as { documentId?: unknown }
+      if (typeof v.documentId !== 'string') return fail('Invalid file value')
+      return { documentId: v.documentId }
+    }
+    case 'select': {
+      if (typeof rawValue !== 'string') return fail('Value must be an option id')
+      const opts = (config as { options?: { id: string }[] } | null)?.options ?? []
+      if (!opts.some((o) => o.id === rawValue)) return fail('Unknown option')
+      return rawValue
+    }
+    case 'multi_select': {
+      if (!Array.isArray(rawValue)) return fail('Value must be an array of option ids')
+      const opts = (config as { options?: { id: string }[] } | null)?.options ?? []
+      const ids = new Set(opts.map((o) => o.id))
+      const cleaned: string[] = []
+      for (const v of rawValue) {
+        if (typeof v !== 'string') return fail('Invalid option id')
+        if (!ids.has(v)) return fail('Unknown option')
+        if (!cleaned.includes(v)) cleaned.push(v)
+      }
+      return cleaned
+    }
+  }
+}
diff --git a/shared/properties.ts b/shared/properties.ts
new file mode 100644
index 00000000..a867d2fb
--- /dev/null
+++ b/shared/properties.ts
@@ -0,0 +1,158 @@
+// ─────────────────────────────────────────────
+// Shared types for custom properties (client + server)
+// ─────────────────────────────────────────────
+
+export const PROPERTY_ENTITY_TYPES = ['candidate', 'application'] as const
+export type PropertyEntityType = (typeof PROPERTY_ENTITY_TYPES)[number]
+
+export const PROPERTY_TYPES = [
+  'text', 'long_text', 'number', 'select', 'multi_select',
+  'date', 'checkbox', 'url', 'email', 'person', 'file',
+] as const
+export type PropertyType = (typeof PROPERTY_TYPES)[number]
+
+export const PROPERTY_OPTION_COLORS = [
+  'gray', 'red', 'orange', 'amber', 'yellow', 'green', 'teal',
+  'blue', 'indigo', 'violet', 'pink',
+] as const
+export type PropertyOptionColor = (typeof PROPERTY_OPTION_COLORS)[number]
+
+export interface PropertySelectOption {
+  id: string
+  label: string
+  color: PropertyOptionColor
+}
+
+export interface PropertySelectConfig {
+  options: PropertySelectOption[]
+}
+
+export interface PropertyNumberConfig {
+  format: 'plain' | 'percent' | 'currency'
+  currency?: string
+}
+
+export type PropertyConfig =
+  | PropertySelectConfig
+  | PropertyNumberConfig
+  | Record<string, unknown>
+  | null
+
+export interface PropertyDefinition {
+  id: string
+  organizationId: string
+  jobId: string | null
+  entityType: PropertyEntityType
+  type: PropertyType
+  name: string
+  description: string | null
+  displayOrder: number
+  config: PropertyConfig
+  createdAt: string
+  updatedAt: string
+}
+
+export interface PropertyEntry {
+  definition: PropertyDefinition
+  value: unknown
+}
+
+// ── Type-specific value shapes ──
+export type PropertyTextValue = string | null
+export type PropertyNumberValue = number | null
+export type PropertyCheckboxValue = boolean | null
+export type PropertyDateValue = string | null
+export type PropertySelectValue = string | null
+export type PropertyMultiSelectValue = string[] | null
+export type PropertyFileValue = { documentId: string } | null
+
+export type PropertyOperator =
+  | 'equals'
+  | 'contains'
+  | 'in'
+  | 'isEmpty'
+  | 'isNotEmpty'
+
+export interface PropertyFilter {
+  propertyDefinitionId: string
+  op: PropertyOperator
+  value?: unknown
+}
+
+// ── Display helpers (pure, importable from anywhere) ──
+
+export function isEmptyPropertyValue(value: unknown): boolean {
+  if (value === null || value === undefined || value === '') return true
+  if (Array.isArray(value) && value.length === 0) return true
+  return false
+}
+
+export function formatPropertyValueAsText(
+  type: PropertyType,
+  value: unknown,
+  config: PropertyConfig,
+): string {
+  if (isEmptyPropertyValue(value)) return ''
+  switch (type) {
+    case 'text':
+    case 'long_text':
+    case 'url':
+    case 'email':
+    case 'date':
+      return String(value)
+    case 'number': {
+      const n = Number(value)
+      if (!Number.isFinite(n)) return ''
+      const cfg = (config as PropertyNumberConfig | null) ?? null
+      if (cfg?.format === 'percent') return `${n}%`
+      if (cfg?.format === 'currency') return `${cfg.currency ?? '$'}${n.toLocaleString()}`
+      return n.toLocaleString()
+    }
+    case 'checkbox':
+      return value ? 'Yes' : 'No'
+    case 'select': {
+      const opts = (config as PropertySelectConfig | null)?.options ?? []
+      return opts.find((o) => o.id === value)?.label ?? ''
+    }
+    case 'multi_select': {
+      const opts = (config as PropertySelectConfig | null)?.options ?? []
+      const ids = (value as string[]) ?? []
+      return ids.map((id) => opts.find((o) => o.id === id)?.label ?? '').filter(Boolean).join(', ')
+    }
+    case 'person':
+      return String(value)
+    case 'file':
+      return (value as { documentId?: string } | null)?.documentId ?? ''
+  }
+}
+
+export const PROPERTY_TYPE_LABELS: Record<PropertyType, string> = {
+  text: 'Text',
+  long_text: 'Text (long)',
+  number: 'Number',
+  select: 'Select',
+  multi_select: 'Multi-select',
+  date: 'Date',
+  checkbox: 'Checkbox',
+  url: 'URL',
+  email: 'Email',
+  person: 'Person',
+  file: 'File',
+}
+
+export const PROPERTY_COLOR_CLASSES: Record<
+  PropertyOptionColor,
+  { chip: string; dot: string }
+> = {
+  gray: { chip: 'bg-surface-100 text-surface-700 dark:bg-surface-800 dark:text-surface-200', dot: 'bg-surface-400' },
+  red: { chip: 'bg-red-100 text-red-700 dark:bg-red-950 dark:text-red-300', dot: 'bg-red-500' },
+  orange: { chip: 'bg-orange-100 text-orange-700 dark:bg-orange-950 dark:text-orange-300', dot: 'bg-orange-500' },
+  amber: { chip: 'bg-amber-100 text-amber-700 dark:bg-amber-950 dark:text-amber-300', dot: 'bg-amber-500' },
+  yellow: { chip: 'bg-yellow-100 text-yellow-700 dark:bg-yellow-950 dark:text-yellow-300', dot: 'bg-yellow-500' },
+  green: { chip: 'bg-green-100 text-green-700 dark:bg-green-950 dark:text-green-300', dot: 'bg-green-500' },
+  teal: { chip: 'bg-teal-100 text-teal-700 dark:bg-teal-950 dark:text-teal-300', dot: 'bg-teal-500' },
+  blue: { chip: 'bg-blue-100 text-blue-700 dark:bg-blue-950 dark:text-blue-300', dot: 'bg-blue-500' },
+  indigo: { chip: 'bg-indigo-100 text-indigo-700 dark:bg-indigo-950 dark:text-indigo-300', dot: 'bg-indigo-500' },
+  violet: { chip: 'bg-violet-100 text-violet-700 dark:bg-violet-950 dark:text-violet-300', dot: 'bg-violet-500' },
+  pink: { chip: 'bg-pink-100 text-pink-700 dark:bg-pink-950 dark:text-pink-300', dot: 'bg-pink-500' },
+}

From e3d9994ecc05cc03d4086443e97497e76156bc50 Mon Sep 17 00:00:00 2001
From: JoachimLK <joachim.l.kolle.pers@gmail.com>
Date: Wed, 29 Apr 2026 16:33:11 +0200
Subject: [PATCH 2/9] fix: resolve esbuild and typecheck errors in PR
 validation

- PropertyValueEditor: replace v-model with cast (invalid esbuild assignment target) with :value + @input handlers for text/long_text/date inputs

- useSavedViews: avoid UnwrapRef widening by typing ref<T> via cast
---
 app/components/PropertyValueEditor.vue | 9 ++++++---
 app/composables/useSavedViews.ts       | 2 +-
 2 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/app/components/PropertyValueEditor.vue b/app/components/PropertyValueEditor.vue
index 092c48d2..de0121de 100644
--- a/app/components/PropertyValueEditor.vue
+++ b/app/components/PropertyValueEditor.vue
@@ -208,10 +208,11 @@ const isPopoverType = computed(
       <input
         v-if="['text', 'url', 'email', 'person'].includes(definition.type)"
         ref="inputEl"
-        v-model="draft as string"
+        :value="draft as string"
         :type="definition.type === 'email' ? 'email' : definition.type === 'url' ? 'url' : 'text'"
         class="w-full min-w-0 rounded border border-brand-500 bg-white dark:bg-surface-900 px-2 py-1 text-sm text-surface-900 dark:text-surface-50 outline-none ring-2 ring-brand-500/20"
         :placeholder="definition.type === 'url' ? 'https://…' : ''"
+        @input="(e) => { draft = (e.target as HTMLInputElement).value }"
         @keydown="onKey"
         @blur="commit()"
       />
@@ -220,9 +221,10 @@ const isPopoverType = computed(
       <textarea
         v-else-if="definition.type === 'long_text'"
         ref="inputEl"
-        v-model="draft as string"
+        :value="draft as string"
         rows="3"
         class="w-full min-w-0 rounded border border-brand-500 bg-white dark:bg-surface-900 px-2 py-1.5 text-sm text-surface-900 dark:text-surface-50 outline-none ring-2 ring-brand-500/20"
+        @input="(e) => { draft = (e.target as HTMLTextAreaElement).value }"
         @keydown="onKey"
         @blur="commit()"
       />
@@ -244,9 +246,10 @@ const isPopoverType = computed(
       <input
         v-else-if="definition.type === 'date'"
         ref="inputEl"
-        v-model="draft as string"
+        :value="draft as string"
         type="date"
         class="w-full min-w-0 rounded border border-brand-500 bg-white dark:bg-surface-900 px-2 py-1 text-sm text-surface-900 dark:text-surface-50 outline-none ring-2 ring-brand-500/20"
+        @input="(e) => { draft = (e.target as HTMLInputElement).value }"
         @keydown="onKey"
         @blur="commit()"
       />
diff --git a/app/composables/useSavedViews.ts b/app/composables/useSavedViews.ts
index d71e7cf3..2aaaa600 100644
--- a/app/composables/useSavedViews.ts
+++ b/app/composables/useSavedViews.ts
@@ -21,7 +21,7 @@ function genId() {
 
 export function useSavedViews<T extends Record<string, unknown>>(scope: string, defaultSettings: T) {
   const storageKey = `${STORAGE_PREFIX}${scope}`
-  const views = ref<SavedView<T>[]>([])
+  const views = ref([]) as Ref<SavedView<T>[]>
   const activeViewId = ref<string | null>(null)
   const loaded = ref(false)
 

From 3b9e52bd33c597346b6defeb0ab1d4c068b03feb Mon Sep 17 00:00:00 2001
From: JoachimLK <joachim.l.kolle.pers@gmail.com>
Date: Wed, 29 Apr 2026 16:51:46 +0200
Subject: [PATCH 3/9] fix: address CodeRabbit review comments on PR #166

Security:
- property URL validator restricts to http(s) schemes (block javascript:/data: XSS)

Validation/correctness:
- propertyConfigSchema drops passthrough() so malformed configs are rejected
- createPropertyDefinitionSchema superRefine rejects jobId for candidate properties
- properties POST uses isNull(jobId) instead of eq(jobId, null) so org-global displayOrder works
- properties reorder enforces single (entityType, jobId) scope across submitted ids
- applications/candidates list endpoints schema-validate propertyFilters (max 20, allow-list ops, reject isEmpty)
- entityIdsMatchingFilters rejects isEmpty operator (cannot compute complement here)
- loadPropertyEntriesForEntities supports per-entity job filtering via entityJobIds map (no cross-job leak)

UX:
- saved view settings persist propertyFilters for both applications and candidates pages
- PropertyFilterBar splits chip into adjacent buttons so the remove affordance is keyboard/SR-accessible
- replace 'as never' casts with PropertyEntry[] on application/candidate detail pages

Cleanup:
- remove unused sql import in applications/index.get.ts and unused defById in properties.ts
- update PUT route docs: pass null to clear (matches validator)
---
 app/components/PropertyFilterBar.vue          | 26 ++++++++----
 app/pages/dashboard/applications/[id].vue     |  2 +-
 app/pages/dashboard/applications/index.vue    |  5 +++
 app/pages/dashboard/candidates/[id].vue       |  2 +-
 app/pages/dashboard/candidates/index.vue      |  5 +++
 .../[id]/properties/[propId].put.ts           |  2 +-
 server/api/applications/index.get.ts          | 19 +++++----
 server/api/candidates/index.get.ts            | 10 ++++-
 server/api/properties/index.post.ts           |  5 +--
 server/api/properties/reorder.post.ts         | 24 +++++++++--
 server/utils/properties.ts                    | 40 +++++++++---------
 server/utils/schemas/property.ts              | 42 +++++++++++++++++--
 12 files changed, 130 insertions(+), 52 deletions(-)

diff --git a/app/components/PropertyFilterBar.vue b/app/components/PropertyFilterBar.vue
index 669d0681..326d456b 100644
--- a/app/components/PropertyFilterBar.vue
+++ b/app/components/PropertyFilterBar.vue
@@ -169,16 +169,26 @@ const showableDefs = computed(() => definitions.value)
       :key="`${f.propertyDefinitionId}-${idx}`"
       class="relative"
     >
-      <button
-        type="button"
-        class="inline-flex items-center gap-1.5 rounded-full border border-brand-200 dark:border-brand-800 bg-brand-50 dark:bg-brand-950/40 px-2.5 py-1 text-xs font-medium text-brand-700 dark:text-brand-200 hover:bg-brand-100 dark:hover:bg-brand-950 cursor-pointer"
-        @click="editingIdx = editingIdx === idx ? null : idx"
+      <div
+        class="inline-flex items-center rounded-full border border-brand-200 dark:border-brand-800 bg-brand-50 dark:bg-brand-950/40 text-xs font-medium text-brand-700 dark:text-brand-200 hover:bg-brand-100 dark:hover:bg-brand-950"
       >
-        <span class="max-w-[20rem] truncate">{{ summarizeFilter(f) }}</span>
-        <span class="ml-1 text-brand-500 hover:text-brand-700" @click.stop="removeFilter(idx)">
+        <button
+          type="button"
+          class="inline-flex items-center gap-1.5 pl-2.5 pr-1 py-1 cursor-pointer"
+          :aria-label="`Edit filter: ${summarizeFilter(f)}`"
+          @click="editingIdx = editingIdx === idx ? null : idx"
+        >
+          <span class="max-w-[20rem] truncate">{{ summarizeFilter(f) }}</span>
+        </button>
+        <button
+          type="button"
+          class="pr-2 pl-1 py-1 text-brand-500 hover:text-brand-700 cursor-pointer"
+          :aria-label="`Remove filter: ${summarizeFilter(f)}`"
+          @click.stop="removeFilter(idx)"
+        >
           <X class="size-3" />
-        </span>
-      </button>
+        </button>
+      </div>
 
       <!-- Edit popover -->
       <div
diff --git a/app/pages/dashboard/applications/[id].vue b/app/pages/dashboard/applications/[id].vue
index b8f15681..736fb75b 100644
--- a/app/pages/dashboard/applications/[id].vue
+++ b/app/pages/dashboard/applications/[id].vue
@@ -361,7 +361,7 @@ function formatResponseValue(value: unknown): string {
           entity-type="application"
           :entity-id="applicationId"
           :job-id="application.job.id"
-          :entries="(application.properties ?? []) as never"
+          :entries="(application.properties ?? []) as import('~~/shared/properties').PropertyEntry[]"
           @refresh="refresh()"
         />
       </div>
diff --git a/app/pages/dashboard/applications/index.vue b/app/pages/dashboard/applications/index.vue
index 19071b0f..3be42675 100644
--- a/app/pages/dashboard/applications/index.vue
+++ b/app/pages/dashboard/applications/index.vue
@@ -238,6 +238,7 @@ const statusLabels: Record<Status, string> = {
 type ApplicationsViewSettings = {
   status?: Status
   jobId?: string
+  propertyFilters: import('~~/shared/properties').PropertyFilter[]
   sortKey: SortKey
   sortDir: SortDir
 }
@@ -245,6 +246,7 @@ type ApplicationsViewSettings = {
 const defaultSettings: ApplicationsViewSettings = {
   status: undefined,
   jobId: undefined,
+  propertyFilters: [],
   sortKey: 'created',
   sortDir: 'desc',
 }
@@ -254,6 +256,7 @@ const drawerOpen = ref(false)
 const currentSettings = computed<ApplicationsViewSettings>(() => ({
   status: activeStatus.value,
   jobId: activeJobId.value,
+  propertyFilters: [...propertyFilters.value],
   sortKey: sortKey.value,
   sortDir: sortDir.value,
 }))
@@ -261,6 +264,7 @@ const currentSettings = computed<ApplicationsViewSettings>(() => ({
 function applySettings(s: ApplicationsViewSettings) {
   activeStatus.value = s.status
   activeJobId.value = s.jobId
+  propertyFilters.value = [...(s.propertyFilters ?? [])]
   sortKey.value = s.sortKey
   sortDir.value = s.sortDir
 }
@@ -291,6 +295,7 @@ function settingsEqual(a: ApplicationsViewSettings, b: ApplicationsViewSettings)
     && a.jobId === b.jobId
     && a.sortKey === b.sortKey
     && a.sortDir === b.sortDir
+    && JSON.stringify(a.propertyFilters ?? []) === JSON.stringify(b.propertyFilters ?? [])
 }
 
 const isDirty = computed(() => {
diff --git a/app/pages/dashboard/candidates/[id].vue b/app/pages/dashboard/candidates/[id].vue
index 915f939f..15f18aea 100644
--- a/app/pages/dashboard/candidates/[id].vue
+++ b/app/pages/dashboard/candidates/[id].vue
@@ -436,7 +436,7 @@ function formatFileSize(bytes: number | null | undefined): string {
           <PropertyBlock
             entity-type="candidate"
             :entity-id="candidateId"
-            :entries="(candidate.properties ?? []) as never"
+            :entries="(candidate.properties ?? []) as import('~~/shared/properties').PropertyEntry[]"
             @refresh="refresh()"
           />
         </div>
diff --git a/app/pages/dashboard/candidates/index.vue b/app/pages/dashboard/candidates/index.vue
index ec8b15b5..15310f7d 100644
--- a/app/pages/dashboard/candidates/index.vue
+++ b/app/pages/dashboard/candidates/index.vue
@@ -173,6 +173,7 @@ type CandidatesViewSettings = {
   gender?: string
   dobFrom?: string
   dobTo?: string
+  propertyFilters: import('~~/shared/properties').PropertyFilter[]
   sortKey: SortKey
   sortDir: SortDir
 }
@@ -181,6 +182,7 @@ const defaultSettings: CandidatesViewSettings = {
   gender: undefined,
   dobFrom: undefined,
   dobTo: undefined,
+  propertyFilters: [],
   sortKey: 'created',
   sortDir: 'desc',
 }
@@ -189,6 +191,7 @@ const currentSettings = computed<CandidatesViewSettings>(() => ({
   gender: filterGender.value,
   dobFrom: filterDobFrom.value,
   dobTo: filterDobTo.value,
+  propertyFilters: [...propertyFilters.value],
   sortKey: sortKey.value,
   sortDir: sortDir.value,
 }))
@@ -197,6 +200,7 @@ function applySettings(s: CandidatesViewSettings) {
   filterGender.value = s.gender
   filterDobFrom.value = s.dobFrom
   filterDobTo.value = s.dobTo
+  propertyFilters.value = [...(s.propertyFilters ?? [])]
   sortKey.value = s.sortKey
   sortDir.value = s.sortDir
 }
@@ -227,6 +231,7 @@ function settingsEqual(a: CandidatesViewSettings, b: CandidatesViewSettings) {
     && a.dobTo === b.dobTo
     && a.sortKey === b.sortKey
     && a.sortDir === b.sortDir
+    && JSON.stringify(a.propertyFilters ?? []) === JSON.stringify(b.propertyFilters ?? [])
 }
 
 const isDirty = computed(() => {
diff --git a/server/api/applications/[id]/properties/[propId].put.ts b/server/api/applications/[id]/properties/[propId].put.ts
index 4fab3c6f..46337b64 100644
--- a/server/api/applications/[id]/properties/[propId].put.ts
+++ b/server/api/applications/[id]/properties/[propId].put.ts
@@ -12,7 +12,7 @@ const paramsSchema = z.object({ id: z.string().min(1), propId: z.string().min(1)
 /**
  * PUT /api/applications/:id/properties/:propId
  * Set a property value for an application. Body: { value: any }.
- * Passing `null` or omitting `value` clears the value.
+ * Pass `null` to clear the value (the `value` key is required).
  *
  * Requires `application: ['update']` — same gate as editing notes/status.
  */
diff --git a/server/api/applications/index.get.ts b/server/api/applications/index.get.ts
index fd63e62d..594fbc89 100644
--- a/server/api/applications/index.get.ts
+++ b/server/api/applications/index.get.ts
@@ -1,6 +1,7 @@
-import { eq, and, desc, sql, inArray } from 'drizzle-orm'
+import { eq, and, desc, inArray } from 'drizzle-orm'
 import { application, candidate, job } from '../../database/schema'
 import { applicationQuerySchema } from '../../utils/schemas/application'
+import { propertyFiltersArraySchema } from '../../utils/schemas/property'
 import {
   entityIdsMatchingFilters,
   loadPropertyEntriesForEntities,
@@ -34,12 +35,17 @@ export default defineEventHandler(async (event) => {
   // ── Custom property filters ──
   let propertyFilters: PropertyFilter[] = []
   if (query.propertyFilters) {
+    let raw: unknown
     try {
-      const parsed = JSON.parse(query.propertyFilters)
-      if (Array.isArray(parsed)) propertyFilters = parsed.slice(0, 20) as PropertyFilter[]
+      raw = JSON.parse(query.propertyFilters)
     } catch {
       throw createError({ statusCode: 400, statusMessage: 'Invalid propertyFilters' })
     }
+    const result = propertyFiltersArraySchema.safeParse(raw)
+    if (!result.success) {
+      throw createError({ statusCode: 400, statusMessage: 'Invalid propertyFilters' })
+    }
+    propertyFilters = result.data as PropertyFilter[]
   }
   if (propertyFilters.length > 0) {
     const matching = await entityIdsMatchingFilters({
@@ -85,18 +91,17 @@ export default defineEventHandler(async (event) => {
   // Bulk-attach properties for the current page (org-global + per-job)
   const ids = data.map((a) => a.id)
   const jobIds = [...new Set(data.map((a) => a.jobId))]
+  const entityJobIds = new Map(data.map((a) => [a.id, a.jobId] as const))
   const propertyMap = await loadPropertyEntriesForEntities({
     organizationId: orgId,
     entityType: 'application',
     entityIds: ids,
     jobIds,
+    entityJobIds,
   })
-  // Filter so each row only sees org-global props OR the props bound to its own job.
   const enriched = data.map((a) => ({
     ...a,
-    properties: (propertyMap.get(a.id) ?? []).filter(
-      (e) => e.definition.jobId === null || e.definition.jobId === a.jobId,
-    ),
+    properties: propertyMap.get(a.id) ?? [],
   }))
 
   return { data: enriched, total, page: query.page, limit: query.limit }
diff --git a/server/api/candidates/index.get.ts b/server/api/candidates/index.get.ts
index 68fcdbe8..f8b43fda 100644
--- a/server/api/candidates/index.get.ts
+++ b/server/api/candidates/index.get.ts
@@ -1,6 +1,7 @@
 import { eq, and, or, ilike, desc, sql, gte, lte, inArray } from 'drizzle-orm'
 import { candidate, application } from '../../database/schema'
 import { candidateQuerySchema } from '../../utils/schemas/candidate'
+import { propertyFiltersArraySchema } from '../../utils/schemas/property'
 import {
   entityIdsMatchingFilters,
   loadPropertyEntriesForEntities,
@@ -44,12 +45,17 @@ export default defineEventHandler(async (event) => {
   // ── Custom property filters (intersection-based) ──
   let propertyFilters: PropertyFilter[] = []
   if (query.propertyFilters) {
+    let raw: unknown
     try {
-      const parsed = JSON.parse(query.propertyFilters)
-      if (Array.isArray(parsed)) propertyFilters = parsed.slice(0, 20) as PropertyFilter[]
+      raw = JSON.parse(query.propertyFilters)
     } catch {
       throw createError({ statusCode: 400, statusMessage: 'Invalid propertyFilters' })
     }
+    const result = propertyFiltersArraySchema.safeParse(raw)
+    if (!result.success) {
+      throw createError({ statusCode: 400, statusMessage: 'Invalid propertyFilters' })
+    }
+    propertyFilters = result.data as PropertyFilter[]
   }
   if (propertyFilters.length > 0) {
     const matching = await entityIdsMatchingFilters({
diff --git a/server/api/properties/index.post.ts b/server/api/properties/index.post.ts
index bdb3f1c0..c4af1e40 100644
--- a/server/api/properties/index.post.ts
+++ b/server/api/properties/index.post.ts
@@ -1,4 +1,4 @@
-import { and, desc, eq } from 'drizzle-orm'
+import { and, desc, eq, isNull } from 'drizzle-orm'
 import { job, propertyDefinition } from '../../database/schema'
 import { createPropertyDefinitionSchema } from '../../utils/schemas/property'
 
@@ -43,8 +43,7 @@ export default defineEventHandler(async (event) => {
         eq(propertyDefinition.entityType, body.entityType),
         body.jobId
           ? eq(propertyDefinition.jobId, body.jobId)
-          : // eslint-disable-next-line @typescript-eslint/no-explicit-any
-            (eq(propertyDefinition.jobId, null as any)),
+          : isNull(propertyDefinition.jobId),
       ),
     )
     .orderBy(desc(propertyDefinition.displayOrder))
diff --git a/server/api/properties/reorder.post.ts b/server/api/properties/reorder.post.ts
index 3434687d..7f6154cd 100644
--- a/server/api/properties/reorder.post.ts
+++ b/server/api/properties/reorder.post.ts
@@ -5,8 +5,9 @@ import { reorderPropertiesSchema } from '../../utils/schemas/property'
 /**
  * POST /api/properties/reorder
  * Body: { ids: string[] } — applied left-to-right as displayOrder=0..N.
- * All ids must belong to the same scope (entityType + jobId) for sane results,
- * but we don't enforce that — the client controls which list it's reordering.
+ * All ids must belong to the same scope (entityType + jobId); we enforce
+ * that here so partial/mixed lists can't rewrite displayOrder across
+ * unrelated definitions.
  */
 export default defineEventHandler(async (event) => {
   const session = await requirePermission(event, { organization: ['update'] })
@@ -15,9 +16,13 @@ export default defineEventHandler(async (event) => {
   const { ids } = await readValidatedBody(event, reorderPropertiesSchema.parse)
   if (ids.length === 0) return { ok: true }
 
-  // Verify all ids belong to this org before mutating
+  // Verify all ids belong to this org and share a single (entityType, jobId) scope
   const owned = await db
-    .select({ id: propertyDefinition.id })
+    .select({
+      id: propertyDefinition.id,
+      entityType: propertyDefinition.entityType,
+      jobId: propertyDefinition.jobId,
+    })
     .from(propertyDefinition)
     .where(
       and(
@@ -29,6 +34,17 @@ export default defineEventHandler(async (event) => {
     throw createError({ statusCode: 404, statusMessage: 'One or more properties not found' })
   }
 
+  const firstScope = owned[0]!
+  const sameScope = owned.every(
+    (r) => r.entityType === firstScope.entityType && r.jobId === firstScope.jobId,
+  )
+  if (!sameScope) {
+    throw createError({
+      statusCode: 400,
+      statusMessage: 'All ids must belong to the same property scope',
+    })
+  }
+
   await db.transaction(async (tx) => {
     for (let i = 0; i < ids.length; i++) {
       await tx
diff --git a/server/utils/properties.ts b/server/utils/properties.ts
index a3fe56cb..edf27f53 100644
--- a/server/utils/properties.ts
+++ b/server/utils/properties.ts
@@ -120,8 +120,14 @@ export async function loadPropertyEntriesForEntities(opts: {
    * is null OR in that set.
    */
   jobIds?: string[]
+  /**
+   * Optional per-entity job-id map. When provided, each entity only
+   * receives org-global defs plus defs scoped to that entity's own jobId,
+   * so mixed-job lists don't leak unrelated job properties across rows.
+   */
+  entityJobIds?: Map<string, string | null | undefined>
 }): Promise<Map<string, PropertyEntry[]>> {
-  const { organizationId, entityType, entityIds, jobIds } = opts
+  const { organizationId, entityType, entityIds, jobIds, entityJobIds } = opts
   if (entityIds.length === 0) return new Map()
 
   const where =
@@ -151,8 +157,6 @@ export async function loadPropertyEntriesForEntities(opts: {
 
   if (definitions.length === 0) return new Map(entityIds.map((id) => [id, []]))
 
-  const defById = new Map(definitions.map((d) => [d.id, d]))
-
   const values = await db
     .select({
       propertyDefinitionId: propertyValue.propertyDefinitionId,
@@ -189,10 +193,12 @@ export async function loadPropertyEntriesForEntities(opts: {
   for (const entityId of entityIds) {
     const list = map.get(entityId)!
     const perEntity = byEntity.get(entityId)
+    const ownJobId = entityJobIds?.get(entityId) ?? null
     for (const def of definitions) {
-      // For application entities, only include defs whose jobId is null
-      // (org-global) or matches this entity's job — but we don't have jobId
-      // here; that filtering is done at the caller's layer if needed.
+      // Each entity sees org-global defs (jobId === null) plus only the
+      // defs bound to its own jobId. When the caller doesn't pass
+      // entityJobIds, fall back to legacy behavior (include all loaded defs).
+      if (entityJobIds && def.jobId !== null && def.jobId !== ownJobId) continue
       list.push({ definition: def, value: perEntity?.get(def.id) ?? null })
     }
   }
@@ -237,21 +243,13 @@ export async function entityIdsMatchingFilters(opts: {
     let matchingRows: { entityId: string }[] = []
 
     if (f.op === 'isEmpty') {
-      // entity has no row OR row has null value — easier to find "has non-null" and invert at the end
-      matchingRows = await db
-        .select({ entityId: propertyValue.entityId })
-        .from(propertyValue)
-        .where(and(baseWhere, sql`${propertyValue.value} IS NOT NULL`))
-      const haveValue = new Set(matchingRows.map((r) => r.entityId))
-      // We don't know the universe here — caller must intersect with their primary set.
-      // Encode "isEmpty" as a marker by returning entities NOT in haveValue. We can't
-      // do that without a universe, so we mark via a sentinel: store the inverse.
-      // Simpler: return a function-of-universe via a wrapper. Instead, support it
-      // by returning special null and forcing caller to handle "isEmpty" at SQL.
-      // Simplification for v1: only support isEmpty via post-filter on attached
-      // entries (caller computes). Skip here.
-      working = working === null ? new Set() : working
-      continue
+      // Computing the complement requires a universe of entity ids that this
+      // helper doesn't have. Reject the operator at the API boundary instead
+      // of silently collapsing the match set to empty.
+      throw createError({
+        statusCode: 400,
+        statusMessage: "Filter operator 'isEmpty' is not supported in list queries",
+      })
     }
 
     if (f.op === 'isNotEmpty') {
diff --git a/server/utils/schemas/property.ts b/server/utils/schemas/property.ts
index 16c18743..c35bad3c 100644
--- a/server/utils/schemas/property.ts
+++ b/server/utils/schemas/property.ts
@@ -37,7 +37,6 @@ const propertyConfigSchema = z.union([
   selectConfigSchema,
   numberConfigSchema,
   z.null(),
-  z.object({}).passthrough(),
 ])
 
 // ── Definition CRUD ──
@@ -48,6 +47,17 @@ export const createPropertyDefinitionSchema = z.object({
   description: z.string().max(500).nullish(),
   jobId: z.string().min(1).nullish(),
   config: propertyConfigSchema.nullish(),
+}).superRefine((value, ctx) => {
+  // Candidate properties are always org-global; the loader only reads
+  // candidate definitions where jobId IS NULL, so reject job-scoped candidates
+  // at the schema boundary to prevent unreadable rows.
+  if (value.entityType === 'candidate' && value.jobId) {
+    ctx.addIssue({
+      code: z.ZodIssueCode.custom,
+      path: ['jobId'],
+      message: 'Candidate properties cannot be scoped to a job',
+    })
+  }
 })
 
 export const updatePropertyDefinitionSchema = z.object({
@@ -61,6 +71,24 @@ export const reorderPropertiesSchema = z.object({
   ids: z.array(z.string().min(1)).max(100),
 })
 
+// ── Property filter validation (query-string filters) ──
+//
+// Accepted operators correspond to those evaluated by
+// `entityIdsMatchingFilters()` in server/utils/properties.ts.
+// Note: 'isEmpty' is intentionally excluded — the helper cannot evaluate
+// the complement set without a universe of entity ids, so allowing it
+// silently collapses results to an empty match set.
+export const propertyFilterOperators = ['equals', 'contains', 'in', 'isNotEmpty'] as const
+export type PropertyFilterOperator = (typeof propertyFilterOperators)[number]
+
+export const propertyFilterSchema = z.object({
+  propertyDefinitionId: z.string().min(1),
+  op: z.enum(propertyFilterOperators),
+  value: z.unknown().optional(),
+})
+
+export const propertyFiltersArraySchema = z.array(propertyFilterSchema).max(20)
+
 export const propertyListQuerySchema = z.object({
   entityType: z.enum(propertyEntityTypes).optional(),
   /** When supplied, returns org-global + this job's per-job props (deduped, ordered). */
@@ -123,12 +151,18 @@ export function validateValueForType(
     }
     case 'url': {
       if (typeof rawValue !== 'string') return fail('Value must be a string')
+      let parsed: URL
       try {
-        // eslint-disable-next-line no-new
-        new URL(rawValue)
+        parsed = new URL(rawValue)
       } catch {
         return fail('Invalid URL')
       }
+      // Restrict to safe schemes — the URL constructor accepts javascript:
+      // and similar dangerous schemes, which would render directly into
+      // <a :href> and execute on click (rel="noopener" does not block them).
+      if (parsed.protocol !== 'http:' && parsed.protocol !== 'https:') {
+        return fail('URL must start with http:// or https://')
+      }
       return rawValue
     }
     case 'email': {
@@ -142,7 +176,7 @@ export function validateValueForType(
       return rawValue
     }
     case 'file': {
-      if (typeof rawValue !== 'object' || rawValue === null) return fail('Invalid file value')
+      if (!rawValue || typeof rawValue !== 'object') return fail('Invalid file value')
       const v = rawValue as { documentId?: unknown }
       if (typeof v.documentId !== 'string') return fail('Invalid file value')
       return { documentId: v.documentId }

From 1371e7ddfdefb09d152b3945951c5abbce068602 Mon Sep 17 00:00:00 2001
From: JoachimLK <joachim.l.kolle.pers@gmail.com>
Date: Thu, 30 Apr 2026 12:28:09 +0200
Subject: [PATCH 4/9] feat: add ApplicationDetailDrawer and
 CandidateDetailDrawer components

- Implemented ApplicationDetailDrawer.vue for displaying application details, including status transitions, notes editing, and properties.
- Implemented CandidateDetailDrawer.vue for displaying candidate details, including contact information, applications, and documents.
- Enhanced UI with improved styling and responsiveness.
- Added functionality for scheduling interviews and handling document previews.

Co-authored-by: Copilot <copilot@github.com>
---
 app/components/ApplicationDetailDrawer.vue | 450 ++++++++++
 app/components/CandidateDetailDrawer.vue   | 479 +++++++++++
 app/components/CandidateDetailSidebar.vue  |  19 +-
 app/components/PropertySchemaEditor.vue    |   6 +-
 app/components/PropertyValueEditor.vue     |   4 +-
 app/pages/dashboard/applications/index.vue |  56 +-
 app/pages/dashboard/candidates/index.vue   |  55 +-
 app/pages/dashboard/jobs/[id]/index.vue    | 108 ++-
 app/pages/dashboard/jobs/index.vue         | 944 ++++++++++-----------
 app/pages/dashboard/timeline.vue           |   2 +-
 10 files changed, 1564 insertions(+), 559 deletions(-)
 create mode 100644 app/components/ApplicationDetailDrawer.vue
 create mode 100644 app/components/CandidateDetailDrawer.vue

diff --git a/app/components/ApplicationDetailDrawer.vue b/app/components/ApplicationDetailDrawer.vue
new file mode 100644
index 00000000..27b679a4
--- /dev/null
+++ b/app/components/ApplicationDetailDrawer.vue
@@ -0,0 +1,450 @@
+<script setup lang="ts">
+import { X, ExternalLink, User, Briefcase, Calendar, Clock, Hash, FileText, MessageSquare } from 'lucide-vue-next'
+import { APPLICATION_STATUS_TRANSITIONS } from '~~/shared/status-transitions'
+import { usePreviewReadOnly } from '~/composables/usePreviewReadOnly'
+
+const props = defineProps<{
+  applicationId: string
+}>()
+
+const emit = defineEmits<{
+  close: []
+}>()
+
+const localePath = useLocalePath()
+const { handlePreviewReadOnlyError } = usePreviewReadOnly()
+const toast = useToast()
+
+const { application, status: fetchStatus, error, refresh, updateApplication } = useApplication(() => props.applicationId)
+const { formatCandidateName } = useOrgSettings()
+
+// ─── Status transitions ───────────────────────────────────────────────────────
+
+const transitionLabels: Record<string, string> = {
+  new: 'Re-open',
+  screening: 'Move to Screening',
+  interview: 'Move to Interview',
+  offer: 'Make Offer',
+  hired: 'Mark Hired',
+  rejected: 'Reject',
+}
+
+const transitionClasses: Record<string, string> = {
+  new: 'border border-surface-300 dark:border-surface-700 bg-white/80 dark:bg-surface-900 text-surface-700 dark:text-surface-300 hover:border-surface-400 dark:hover:border-surface-600 hover:bg-surface-50 dark:hover:bg-surface-800',
+  screening: 'bg-violet-600 text-white shadow-sm shadow-violet-900/20 hover:bg-violet-700',
+  interview: 'bg-amber-600 text-white shadow-sm shadow-amber-900/20 hover:bg-amber-700',
+  offer: 'bg-teal-600 text-white shadow-sm shadow-teal-900/20 hover:bg-teal-700',
+  hired: 'bg-green-700 text-white shadow-sm shadow-green-900/30 hover:bg-green-800',
+  rejected: 'bg-danger-600 text-white shadow-sm shadow-danger-900/20 hover:bg-danger-700',
+}
+
+const transitionDotClasses: Record<string, string> = {
+  new: 'bg-surface-400 dark:bg-surface-500',
+  screening: 'bg-violet-200',
+  interview: 'bg-amber-200',
+  offer: 'bg-teal-200',
+  hired: 'bg-green-100',
+  rejected: 'bg-danger-200',
+}
+
+const allowedTransitions = computed(() => {
+  if (!application.value) return []
+  return APPLICATION_STATUS_TRANSITIONS[application.value.status] ?? []
+})
+
+const isTransitioning = ref(false)
+const showInterviewSidebar = ref(false)
+
+async function handleTransition(newStatus: string) {
+  isTransitioning.value = true
+  try {
+    await updateApplication({ status: newStatus as any })
+  } catch (err: any) {
+    if (handlePreviewReadOnlyError(err)) return
+    toast.error('Failed to update status', { message: err.data?.statusMessage, statusCode: err.data?.statusCode })
+  } finally {
+    isTransitioning.value = false
+  }
+}
+
+// ─── Notes editing ────────────────────────────────────────────────────────────
+
+const isEditingNotes = ref(false)
+const notesInput = ref('')
+const isSavingNotes = ref(false)
+
+function startEditNotes() {
+  notesInput.value = application.value?.notes ?? ''
+  isEditingNotes.value = true
+}
+
+async function saveNotes() {
+  isSavingNotes.value = true
+  try {
+    await updateApplication({ notes: notesInput.value || null })
+    isEditingNotes.value = false
+  } catch (err: any) {
+    if (handlePreviewReadOnlyError(err)) return
+    toast.error('Failed to save notes', { message: err.data?.statusMessage, statusCode: err.data?.statusCode })
+  } finally {
+    isSavingNotes.value = false
+  }
+}
+
+// ─── Display helpers ──────────────────────────────────────────────────────────
+
+const statusBadgeClasses: Record<string, string> = {
+  new: 'bg-blue-50 text-blue-700 dark:bg-blue-950 dark:text-blue-400',
+  screening: 'bg-violet-50 text-violet-700 dark:bg-violet-950 dark:text-violet-400',
+  interview: 'bg-amber-50 text-amber-700 dark:bg-amber-950 dark:text-amber-400',
+  offer: 'bg-teal-50 text-teal-700 dark:bg-teal-950 dark:text-teal-400',
+  hired: 'bg-green-50 text-green-700 dark:bg-green-950 dark:text-green-400',
+  rejected: 'bg-surface-100 text-surface-500 dark:bg-surface-800 dark:text-surface-400',
+}
+
+function formatResponseValue(value: unknown): string {
+  if (Array.isArray(value)) return value.join(', ')
+  if (typeof value === 'boolean') return value ? 'Yes' : 'No'
+  return String(value ?? '—')
+}
+
+// ─── Body scroll lock + keyboard handling ─────────────────────────────────────
+
+function onKeydown(e: KeyboardEvent) {
+  if (e.key === 'Escape') emit('close')
+}
+
+onMounted(() => {
+  document.addEventListener('keydown', onKeydown)
+  document.body.style.overflow = 'hidden'
+})
+
+onUnmounted(() => {
+  document.removeEventListener('keydown', onKeydown)
+  document.body.style.overflow = ''
+})
+</script>
+
+<template>
+  <Teleport to="body">
+    <!-- Backdrop -->
+    <Transition
+      enter-active-class="transition-opacity duration-200"
+      leave-active-class="transition-opacity duration-150"
+      enter-from-class="opacity-0"
+      leave-to-class="opacity-0"
+    >
+      <div
+        class="fixed inset-0 z-[55] bg-surface-900/40"
+        @click="emit('close')"
+      />
+    </Transition>
+
+    <!-- Panel -->
+    <Transition
+      enter-active-class="transition-transform duration-300 ease-out"
+      leave-active-class="transition-transform duration-200 ease-in"
+      enter-from-class="translate-x-full"
+      leave-to-class="translate-x-full"
+    >
+      <aside
+        class="fixed inset-y-0 right-0 z-[60] w-full max-w-2xl flex flex-col bg-white dark:bg-surface-900 shadow-2xl border-l border-surface-200 dark:border-surface-800"
+        role="dialog"
+        aria-modal="true"
+        aria-label="Application detail"
+      >
+        <!-- Header -->
+        <header class="flex items-center justify-between gap-3 px-5 py-4 border-b border-surface-200 dark:border-surface-800 shrink-0">
+          <span class="text-sm font-semibold text-surface-900 dark:text-surface-100 truncate">Application Detail</span>
+          <div class="flex items-center gap-2 shrink-0">
+            <NuxtLink
+              :to="localePath(`/dashboard/applications/${applicationId}`)"
+              class="inline-flex items-center gap-1.5 rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-1.5 text-sm font-medium text-surface-700 dark:text-surface-300 hover:bg-surface-50 dark:hover:bg-surface-800 transition-colors"
+            >
+              <ExternalLink class="size-3.5" />
+              Open full page
+            </NuxtLink>
+            <button
+              class="rounded-lg p-1.5 text-surface-500 hover:text-surface-700 dark:hover:text-surface-200 hover:bg-surface-100 dark:hover:bg-surface-800 transition-colors"
+              @click="emit('close')"
+            >
+              <X class="size-4" />
+            </button>
+          </div>
+        </header>
+
+        <!-- Scrollable body -->
+        <div class="flex-1 overflow-y-auto p-5 space-y-4">
+          <!-- Loading -->
+          <div v-if="fetchStatus === 'pending'" class="text-center py-12 text-surface-400">
+            Loading application…
+          </div>
+
+          <!-- Error -->
+          <div
+            v-else-if="error"
+            class="rounded-lg border border-danger-200 bg-danger-50 p-4 text-sm text-danger-700"
+          >
+            {{ error.statusCode === 404 ? 'Application not found.' : 'Failed to load application.' }}
+          </div>
+
+          <template v-else-if="application">
+            <!-- Header card -->
+            <div class="rounded-xl border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-5">
+              <p class="mb-2 text-xs font-medium uppercase tracking-wide text-surface-500 dark:text-surface-400">
+                Application Overview
+              </p>
+              <div class="mb-2 flex flex-wrap items-center gap-2 text-surface-400">
+                <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-50 truncate">
+                  {{ formatCandidateName(application.candidate) }}
+                </h2>
+                <span class="text-surface-400">→</span>
+                <NuxtLink
+                  :to="localePath(`/dashboard/jobs/${application.job.id}`)"
+                  class="text-xl text-brand-600 hover:text-brand-700 dark:text-brand-400 dark:hover:text-brand-300 truncate transition-colors"
+                >
+                  {{ application.job.title }}
+                </NuxtLink>
+              </div>
+              <div class="flex flex-wrap items-center gap-3">
+                <span
+                  class="inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium"
+                  :class="statusBadgeClasses[application.status] ?? 'bg-surface-100 text-surface-600'"
+                >
+                  {{ application.status }}
+                </span>
+                <TimelineDateLink :date="application.createdAt" class="text-sm text-surface-500 dark:text-surface-400">
+                  Applied {{ new Date(application.createdAt).toLocaleDateString() }}
+                </TimelineDateLink>
+              </div>
+            </div>
+
+            <!-- Quick actions -->
+            <div class="rounded-xl border border-surface-200 dark:border-surface-800 bg-white/80 dark:bg-surface-900/70 p-3">
+              <div class="flex flex-wrap items-center gap-2">
+                <span class="inline-flex items-center rounded-full bg-surface-100 dark:bg-surface-800 px-2.5 py-1 text-xs font-medium text-surface-600 dark:text-surface-400">Quick actions</span>
+                <button
+                  v-for="nextStatus in allowedTransitions"
+                  :key="nextStatus"
+                  :disabled="isTransitioning"
+                  class="inline-flex cursor-pointer items-center rounded-full px-3.5 py-1.5 text-sm font-medium transition-all duration-150 focus:outline-none focus:ring-2 focus:ring-brand-500/40 disabled:cursor-not-allowed disabled:opacity-50"
+                  :class="transitionClasses[nextStatus] ?? 'border border-surface-300 dark:border-surface-700 bg-white/80 dark:bg-surface-900 text-surface-700 dark:text-surface-300 hover:border-surface-400 dark:hover:border-surface-600 hover:bg-surface-50 dark:hover:bg-surface-800'"
+                  @click="handleTransition(nextStatus)"
+                >
+                  <span
+                    class="mr-2 inline-flex size-1.5 rounded-full"
+                    :class="transitionDotClasses[nextStatus] ?? 'bg-surface-400 dark:bg-surface-500'"
+                  />
+                  {{ transitionLabels[nextStatus] ?? nextStatus }}
+                </button>
+                <button
+                  class="inline-flex cursor-pointer items-center gap-1.5 rounded-full border border-surface-300 dark:border-surface-700 bg-white/80 dark:bg-surface-900 px-3.5 py-1.5 text-sm font-medium text-surface-700 dark:text-surface-300 hover:border-brand-400 dark:hover:border-brand-600 hover:bg-brand-50 dark:hover:bg-brand-950/30 hover:text-brand-700 dark:hover:text-brand-300 transition-all duration-150 focus:outline-none focus:ring-2 focus:ring-brand-500/40"
+                  @click="showInterviewSidebar = true"
+                >
+                  <Calendar class="size-3.5" />
+                  Schedule Interview
+                </button>
+              </div>
+            </div>
+
+            <!-- Candidate & Job cards -->
+            <div class="grid gap-4 sm:grid-cols-2">
+              <!-- Candidate info -->
+              <div class="rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-5">
+                <div class="flex items-center gap-2 mb-3">
+                  <User class="size-4 text-surface-500 dark:text-surface-400" />
+                  <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-200">Candidate</h3>
+                </div>
+                <dl class="grid grid-cols-1 gap-3 text-sm">
+                  <div>
+                    <dt class="text-surface-400">Name</dt>
+                    <dd class="text-surface-700 dark:text-surface-200 font-medium">
+                      <NuxtLink
+                        :to="localePath(`/dashboard/candidates/${application.candidate.id}`)"
+                        class="text-brand-600 hover:text-brand-700 dark:text-brand-400 dark:hover:text-brand-300 transition-colors"
+                      >
+                        {{ formatCandidateName(application.candidate) }}
+                      </NuxtLink>
+                    </dd>
+                  </div>
+                  <div>
+                    <dt class="text-surface-400">Email</dt>
+                    <dd class="text-surface-700 dark:text-surface-200 font-medium">
+                      <a
+                        :href="`mailto:${application.candidate.email}`"
+                        target="_blank"
+                        class="hover:text-brand-600 dark:hover:text-brand-400 hover:underline cursor-pointer transition-colors"
+                      >{{ application.candidate.email }}</a>
+                    </dd>
+                  </div>
+                  <div v-if="application.candidate.phone">
+                    <dt class="text-surface-400">Phone</dt>
+                    <dd class="text-surface-700 dark:text-surface-200 font-medium">{{ application.candidate.phone }}</dd>
+                  </div>
+                </dl>
+              </div>
+
+              <!-- Job info -->
+              <div class="rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-5">
+                <div class="flex items-center gap-2 mb-3">
+                  <Briefcase class="size-4 text-surface-500 dark:text-surface-400" />
+                  <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-200">Job</h3>
+                </div>
+                <dl class="grid grid-cols-1 gap-3 text-sm">
+                  <div>
+                    <dt class="text-surface-400">Title</dt>
+                    <dd class="text-surface-700 dark:text-surface-200 font-medium">
+                      <NuxtLink
+                        :to="localePath(`/dashboard/jobs/${application.job.id}`)"
+                        class="text-brand-600 hover:text-brand-700 dark:text-brand-400 dark:hover:text-brand-300 transition-colors"
+                      >
+                        {{ application.job.title }}
+                      </NuxtLink>
+                    </dd>
+                  </div>
+                  <div>
+                    <dt class="text-surface-400">Job Status</dt>
+                    <dd class="text-surface-700 dark:text-surface-200 font-medium capitalize">{{ application.job.status }}</dd>
+                  </div>
+                </dl>
+              </div>
+            </div>
+
+            <!-- Application details -->
+            <div class="rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-5">
+              <div class="flex items-center gap-2 mb-3">
+                <Hash class="size-4 text-surface-500 dark:text-surface-400" />
+                <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-200">Details</h3>
+              </div>
+              <dl class="grid grid-cols-2 gap-3 text-sm">
+                <div>
+                  <dt class="text-surface-400">Score</dt>
+                  <dd class="text-surface-700 dark:text-surface-200 font-medium">{{ application.score ?? '—' }}</dd>
+                </div>
+                <div>
+                  <dt class="text-surface-400">Status</dt>
+                  <dd class="text-surface-700 dark:text-surface-200 font-medium capitalize">{{ application.status }}</dd>
+                </div>
+                <div>
+                  <dt class="text-surface-400 inline-flex items-center gap-1">
+                    <Calendar class="size-3.5" />
+                    Applied
+                  </dt>
+                  <dd class="text-surface-700 dark:text-surface-200 font-medium">
+                    <TimelineDateLink :date="application.createdAt">{{ new Date(application.createdAt).toLocaleDateString() }}</TimelineDateLink>
+                  </dd>
+                </div>
+                <div>
+                  <dt class="text-surface-400 inline-flex items-center gap-1">
+                    <Clock class="size-3.5" />
+                    Updated
+                  </dt>
+                  <dd class="text-surface-700 dark:text-surface-200 font-medium">
+                    <TimelineDateLink :date="application.updatedAt">{{ new Date(application.updatedAt).toLocaleDateString() }}</TimelineDateLink>
+                  </dd>
+                </div>
+              </dl>
+            </div>
+
+            <!-- Notes -->
+            <div class="rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-5">
+              <div class="flex items-center justify-between mb-3">
+                <div class="flex items-center gap-2">
+                  <MessageSquare class="size-4 text-surface-500 dark:text-surface-400" />
+                  <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-200">Notes</h3>
+                </div>
+                <button
+                  v-if="!isEditingNotes"
+                  class="cursor-pointer text-xs text-brand-600 hover:text-brand-700 dark:text-brand-400 dark:hover:text-brand-300 font-medium transition-colors"
+                  @click="startEditNotes"
+                >
+                  {{ application.notes ? 'Edit' : 'Add Notes' }}
+                </button>
+              </div>
+
+              <div v-if="isEditingNotes">
+                <textarea
+                  v-model="notesInput"
+                  rows="4"
+                  placeholder="Add notes about this application…"
+                  class="w-full rounded-lg border border-surface-300 dark:border-surface-700 bg-white dark:bg-surface-800 px-3 py-2 text-sm text-surface-900 dark:text-surface-100 placeholder:text-surface-400 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
+                />
+                <div class="flex items-center gap-2 mt-2">
+                  <button
+                    :disabled="isSavingNotes"
+                    class="cursor-pointer rounded-lg bg-brand-600 px-3 py-1.5 text-sm font-medium text-white hover:bg-brand-700 disabled:opacity-50 disabled:cursor-not-allowed transition-colors"
+                    @click="saveNotes"
+                  >
+                    {{ isSavingNotes ? 'Saving…' : 'Save' }}
+                  </button>
+                  <button
+                    class="cursor-pointer rounded-lg border border-surface-300 dark:border-surface-600 px-3 py-1.5 text-sm font-medium text-surface-700 dark:text-surface-300 hover:bg-surface-50 dark:hover:bg-surface-800 transition-colors"
+                    @click="isEditingNotes = false"
+                  >
+                    Cancel
+                  </button>
+                </div>
+              </div>
+              <p
+                v-else-if="application.notes"
+                class="text-sm text-surface-600 dark:text-surface-300 whitespace-pre-wrap"
+              >
+                {{ application.notes }}
+              </p>
+              <p v-else class="text-sm text-surface-400 italic">No notes yet.</p>
+            </div>
+
+            <!-- Properties -->
+            <div class="rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-4">
+              <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-200 mb-2 px-2">Properties</h3>
+              <PropertyBlock
+                entity-type="application"
+                :entity-id="applicationId"
+                :job-id="application.job.id"
+                :entries="(application.properties ?? []) as import('~~/shared/properties').PropertyEntry[]"
+                @refresh="refresh()"
+              />
+            </div>
+
+            <!-- Question Responses -->
+            <div
+              v-if="application.responses && application.responses.length > 0"
+              class="rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-5"
+            >
+              <div class="flex items-center gap-2 mb-3">
+                <FileText class="size-4 text-surface-500 dark:text-surface-400" />
+                <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-200">
+                  Application Responses ({{ application.responses.length }})
+                </h3>
+              </div>
+              <div class="space-y-3">
+                <div
+                  v-for="response in application.responses"
+                  :key="response.id"
+                  class="border-b border-surface-100 dark:border-surface-800 pb-3 last:border-0 last:pb-0"
+                >
+                  <dt class="text-xs font-medium text-surface-500 dark:text-surface-400 mb-0.5">
+                    {{ response.question?.label ?? 'Unknown question' }}
+                  </dt>
+                  <dd class="text-sm text-surface-700 dark:text-surface-200">
+                    {{ formatResponseValue(response.value) }}
+                  </dd>
+                </div>
+              </div>
+            </div>
+          </template>
+        </div>
+      </aside>
+    </Transition>
+
+    <!-- Nested interview scheduling sidebar -->
+    <InterviewScheduleSidebar
+      v-if="showInterviewSidebar && application"
+      :application-id="applicationId"
+      :candidate-name="`${application.candidate.firstName} ${application.candidate.lastName}`"
+      :job-title="application.job.title"
+      @close="showInterviewSidebar = false"
+      @scheduled="showInterviewSidebar = false"
+    />
+  </Teleport>
+</template>
diff --git a/app/components/CandidateDetailDrawer.vue b/app/components/CandidateDetailDrawer.vue
new file mode 100644
index 00000000..9e05f20a
--- /dev/null
+++ b/app/components/CandidateDetailDrawer.vue
@@ -0,0 +1,479 @@
+<script setup lang="ts">
+import { X, ExternalLink, Mail, Phone, Calendar, Clock, Briefcase, FileText, Plus, Download, Eye, AlertTriangle } from 'lucide-vue-next'
+import { usePreviewReadOnly } from '~/composables/usePreviewReadOnly'
+
+const props = defineProps<{
+  candidateId: string
+}>()
+
+const emit = defineEmits<{
+  close: []
+}>()
+
+const localePath = useLocalePath()
+const { handlePreviewReadOnlyError } = usePreviewReadOnly()
+const toast = useToast()
+
+const { candidate, status: fetchStatus, error, refresh } = useCandidate(() => props.candidateId)
+const { formatCandidateName, formatDate } = useOrgSettings()
+
+// ─── Tabs ─────────────────────────────────────────────────────────────────────
+
+const activeTab = ref<'applications' | 'documents'>('applications')
+
+// ─── Apply to job modal ───────────────────────────────────────────────────────
+
+const showApplyModal = ref(false)
+
+function handleApplied() {
+  showApplyModal.value = false
+  refresh()
+}
+
+// ─── Interview scheduling ─────────────────────────────────────────────────────
+
+const showInterviewSidebar = ref(false)
+const interviewTargetApp = ref<{ id: string; jobTitle: string } | null>(null)
+
+function openScheduleInterview(app: { id: string; job: { title: string } }) {
+  interviewTargetApp.value = { id: app.id, jobTitle: app.job.title }
+  showInterviewSidebar.value = true
+}
+
+// ─── Documents ────────────────────────────────────────────────────────────────
+
+const { downloadDocument, getPreviewUrl } = useDocuments()
+
+// Preview state
+const showPreview = ref(false)
+const previewUrl = ref<string | null>(null)
+const previewFilename = ref('')
+const previewMimeType = ref('')
+const previewDocId = ref<string | null>(null)
+
+const isPdfPreview = computed(() => previewMimeType.value === 'application/pdf')
+
+async function handlePreview(docId: string, mimeType?: string) {
+  if (mimeType && mimeType !== 'application/pdf') {
+    await handleDownload(docId)
+    return
+  }
+  showPreview.value = true
+  previewDocId.value = docId
+  const doc = candidate.value?.documents?.find((d: any) => d.id === docId)
+  previewFilename.value = doc?.originalFilename ?? 'Document'
+  previewMimeType.value = doc?.mimeType ?? 'application/pdf'
+  previewUrl.value = getPreviewUrl(docId)
+}
+
+function closePreview() {
+  showPreview.value = false
+  previewUrl.value = null
+  previewFilename.value = ''
+  previewMimeType.value = ''
+  previewDocId.value = null
+}
+
+async function handleDownload(docId: string) {
+  try {
+    await downloadDocument(docId)
+  } catch {
+    toast.error('Failed to download document')
+  }
+}
+
+// ─── Display helpers ──────────────────────────────────────────────────────────
+
+const applicationStatusClasses: Record<string, string> = {
+  new: 'bg-blue-50 text-blue-700 dark:bg-blue-950 dark:text-blue-400',
+  screening: 'bg-violet-50 text-violet-700 dark:bg-violet-950 dark:text-violet-400',
+  interview: 'bg-amber-50 text-amber-700 dark:bg-amber-950 dark:text-amber-400',
+  offer: 'bg-teal-50 text-teal-700 dark:bg-teal-950 dark:text-teal-400',
+  hired: 'bg-green-50 text-green-700 dark:bg-green-950 dark:text-green-400',
+  rejected: 'bg-surface-100 text-surface-500 dark:bg-surface-800 dark:text-surface-400',
+}
+
+const genderLabels: Record<string, string> = {
+  male: 'Male',
+  female: 'Female',
+  other: 'Other',
+  prefer_not_to_say: 'Prefer not to say',
+}
+
+const documentTypeLabels: Record<string, string> = {
+  resume: 'Resume',
+  cover_letter: 'Cover Letter',
+  other: 'Other',
+}
+
+function formatFileSize(bytes: number | null | undefined): string {
+  if (!bytes) return '—'
+  if (bytes < 1024) return `${bytes} B`
+  if (bytes < 1024 * 1024) return `${(bytes / 1024).toFixed(1)} KB`
+  return `${(bytes / (1024 * 1024)).toFixed(1)} MB`
+}
+
+// ─── Body scroll lock + keyboard handling ─────────────────────────────────────
+
+function onKeydown(e: KeyboardEvent) {
+  if (e.key === 'Escape') emit('close')
+}
+
+onMounted(() => {
+  document.addEventListener('keydown', onKeydown)
+  document.body.style.overflow = 'hidden'
+})
+
+onUnmounted(() => {
+  document.removeEventListener('keydown', onKeydown)
+  document.body.style.overflow = ''
+})
+</script>
+
+<template>
+  <Teleport to="body">
+    <!-- Backdrop -->
+    <Transition
+      enter-active-class="transition-opacity duration-200"
+      leave-active-class="transition-opacity duration-150"
+      enter-from-class="opacity-0"
+      leave-to-class="opacity-0"
+    >
+      <div
+        class="fixed inset-0 z-[55] bg-surface-900/40"
+        @click="emit('close')"
+      />
+    </Transition>
+
+    <!-- Panel -->
+    <Transition
+      enter-active-class="transition-transform duration-300 ease-out"
+      leave-active-class="transition-transform duration-200 ease-in"
+      enter-from-class="translate-x-full"
+      leave-to-class="translate-x-full"
+    >
+      <aside
+        class="fixed inset-y-0 right-0 z-[60] w-full max-w-2xl flex flex-col bg-white dark:bg-surface-900 shadow-2xl border-l border-surface-200 dark:border-surface-800"
+        role="dialog"
+        aria-modal="true"
+        aria-label="Candidate detail"
+      >
+        <!-- Header -->
+        <header class="flex items-center justify-between gap-3 px-5 py-4 border-b border-surface-200 dark:border-surface-800 shrink-0">
+          <span class="text-sm font-semibold text-surface-900 dark:text-surface-100 truncate">Candidate Detail</span>
+          <div class="flex items-center gap-2 shrink-0">
+            <NuxtLink
+              :to="localePath(`/dashboard/candidates/${candidateId}`)"
+              class="inline-flex items-center gap-1.5 rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-1.5 text-sm font-medium text-surface-700 dark:text-surface-300 hover:bg-surface-50 dark:hover:bg-surface-800 transition-colors"
+            >
+              <ExternalLink class="size-3.5" />
+              Open full page
+            </NuxtLink>
+            <button
+              class="rounded-lg p-1.5 text-surface-500 hover:text-surface-700 dark:hover:text-surface-200 hover:bg-surface-100 dark:hover:bg-surface-800 transition-colors"
+              @click="emit('close')"
+            >
+              <X class="size-4" />
+            </button>
+          </div>
+        </header>
+
+        <!-- Scrollable body -->
+        <div class="flex-1 overflow-y-auto p-5 space-y-4">
+          <!-- Loading -->
+          <div v-if="fetchStatus === 'pending'" class="text-center py-12 text-surface-400">
+            Loading candidate…
+          </div>
+
+          <!-- Error -->
+          <div
+            v-else-if="error"
+            class="rounded-lg border border-danger-200 bg-danger-50 p-4 text-sm text-danger-700"
+          >
+            {{ error.statusCode === 404 ? 'Candidate not found.' : 'Failed to load candidate.' }}
+          </div>
+
+          <template v-else-if="candidate">
+            <!-- Header -->
+            <div class="min-w-0">
+              <h2 class="text-2xl font-bold text-surface-900 dark:text-surface-50 truncate mb-1">
+                {{ formatCandidateName(candidate) }}
+              </h2>
+              <div class="flex flex-col sm:flex-row sm:items-center gap-1 sm:gap-4 text-sm text-surface-500">
+                <a
+                  :href="`mailto:${candidate.email}`"
+                  target="_blank"
+                  class="inline-flex items-center gap-1 hover:text-brand-600 dark:hover:text-brand-400 hover:underline cursor-pointer transition-colors"
+                >
+                  <Mail class="size-3.5" />
+                  {{ candidate.email }}
+                </a>
+                <span v-if="candidate.phone" class="inline-flex items-center gap-1">
+                  <Phone class="size-3.5" />
+                  {{ candidate.phone }}
+                </span>
+              </div>
+            </div>
+
+            <!-- Contact details -->
+            <div class="rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-5">
+              <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-200 mb-3">Details</h3>
+              <dl class="grid grid-cols-1 sm:grid-cols-2 gap-3 text-sm">
+                <div>
+                  <dt class="text-surface-400">Email</dt>
+                  <dd class="text-surface-700 dark:text-surface-200 font-medium">
+                    <a
+                      :href="`mailto:${candidate.email}`"
+                      target="_blank"
+                      class="hover:text-brand-600 dark:hover:text-brand-400 hover:underline cursor-pointer transition-colors"
+                    >{{ candidate.email }}</a>
+                  </dd>
+                </div>
+                <div>
+                  <dt class="text-surface-400">Phone</dt>
+                  <dd class="text-surface-700 dark:text-surface-200 font-medium">{{ candidate.phone || '—' }}</dd>
+                </div>
+                <div v-if="candidate.gender">
+                  <dt class="text-surface-400">Gender</dt>
+                  <dd class="text-surface-700 dark:text-surface-200 font-medium">
+                    {{ genderLabels[candidate.gender] ?? candidate.gender }}
+                  </dd>
+                </div>
+                <div v-if="candidate.dateOfBirth">
+                  <dt class="text-surface-400">Date of Birth</dt>
+                  <dd class="text-surface-700 dark:text-surface-200 font-medium">
+                    {{ formatDate(candidate.dateOfBirth) }}
+                  </dd>
+                </div>
+                <div v-if="candidate.displayName">
+                  <dt class="text-surface-400">Display Name</dt>
+                  <dd class="text-surface-700 dark:text-surface-200 font-medium">{{ candidate.displayName }}</dd>
+                </div>
+                <div>
+                  <dt class="text-surface-400 inline-flex items-center gap-1">
+                    <Calendar class="size-3.5" />
+                    Created
+                  </dt>
+                  <dd class="text-surface-700 dark:text-surface-200 font-medium">
+                    <TimelineDateLink :date="candidate.createdAt">{{ new Date(candidate.createdAt).toLocaleDateString() }}</TimelineDateLink>
+                  </dd>
+                </div>
+                <div>
+                  <dt class="text-surface-400 inline-flex items-center gap-1">
+                    <Clock class="size-3.5" />
+                    Updated
+                  </dt>
+                  <dd class="text-surface-700 dark:text-surface-200 font-medium">
+                    <TimelineDateLink :date="candidate.updatedAt">{{ new Date(candidate.updatedAt).toLocaleDateString() }}</TimelineDateLink>
+                  </dd>
+                </div>
+              </dl>
+            </div>
+
+            <!-- Properties -->
+            <div class="rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-4">
+              <h3 class="text-sm font-semibold text-surface-700 dark:text-surface-200 mb-2 px-2">Properties</h3>
+              <PropertyBlock
+                entity-type="candidate"
+                :entity-id="candidateId"
+                :entries="(candidate.properties ?? []) as import('~~/shared/properties').PropertyEntry[]"
+                @refresh="refresh()"
+              />
+            </div>
+
+            <!-- Tabs -->
+            <div class="border-b border-surface-200 dark:border-surface-800">
+              <div class="flex gap-1">
+                <button
+                  class="cursor-pointer px-3 py-2 text-sm font-medium transition-colors border-b-2 -mb-px"
+                  :class="activeTab === 'applications'
+                    ? 'border-brand-600 text-brand-600'
+                    : 'border-transparent text-surface-500 hover:text-surface-700 hover:border-surface-300 dark:hover:text-surface-300'"
+                  @click="activeTab = 'applications'"
+                >
+                  Applications ({{ candidate.applications?.length ?? 0 }})
+                </button>
+                <button
+                  class="cursor-pointer px-3 py-2 text-sm font-medium transition-colors border-b-2 -mb-px"
+                  :class="activeTab === 'documents'
+                    ? 'border-brand-600 text-brand-600'
+                    : 'border-transparent text-surface-500 hover:text-surface-700 hover:border-surface-300 dark:hover:text-surface-300'"
+                  @click="activeTab = 'documents'"
+                >
+                  Documents ({{ candidate.documents?.length ?? 0 }})
+                </button>
+              </div>
+            </div>
+
+            <!-- Applications tab -->
+            <div v-if="activeTab === 'applications'">
+              <div class="flex justify-end mb-3">
+                <button
+                  class="inline-flex items-center gap-1.5 rounded-lg border border-surface-300 dark:border-surface-600 px-3 py-1.5 text-sm font-medium text-surface-700 dark:text-surface-300 hover:bg-surface-50 dark:hover:bg-surface-800 transition-colors"
+                  @click="showApplyModal = true"
+                >
+                  <Plus class="size-3.5" />
+                  Apply to Job
+                </button>
+              </div>
+
+              <div
+                v-if="!candidate.applications?.length"
+                class="rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-8 text-center"
+              >
+                <Briefcase class="size-8 text-surface-300 dark:text-surface-600 mx-auto mb-2" />
+                <p class="text-sm text-surface-500 dark:text-surface-400">No applications yet.</p>
+              </div>
+
+              <div v-else class="space-y-2">
+                <div
+                  v-for="app in candidate.applications"
+                  :key="app.id"
+                  class="flex flex-col sm:flex-row sm:items-center sm:justify-between rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 px-4 py-3 hover:border-surface-300 dark:hover:border-surface-700 hover:shadow-sm transition-all group gap-2"
+                >
+                  <NuxtLink
+                    :to="localePath(`/dashboard/applications/${app.id}`)"
+                    class="min-w-0 flex-1 block"
+                  >
+                    <h4 class="text-sm font-semibold text-surface-900 dark:text-surface-100 group-hover:text-brand-600 transition-colors truncate">
+                      {{ app.job.title }}
+                    </h4>
+                    <span class="text-xs text-surface-400">
+                      Applied <TimelineDateLink :date="app.createdAt">{{ new Date(app.createdAt).toLocaleDateString() }}</TimelineDateLink>
+                    </span>
+                  </NuxtLink>
+                  <div class="flex items-center gap-2 shrink-0 sm:ml-3">
+                    <button
+                      class="inline-flex items-center gap-1 rounded-lg border border-surface-200 dark:border-surface-700 px-2 py-1 text-xs font-medium text-surface-600 dark:text-surface-400 hover:border-brand-400 dark:hover:border-brand-600 hover:bg-brand-50 dark:hover:bg-brand-950/30 hover:text-brand-700 dark:hover:text-brand-300 transition-all cursor-pointer"
+                      title="Schedule Interview"
+                      @click="openScheduleInterview(app)"
+                    >
+                      <Calendar class="size-3" />
+                      Schedule
+                    </button>
+                    <span
+                      class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium shrink-0"
+                      :class="applicationStatusClasses[app.status] ?? 'bg-surface-100 text-surface-600'"
+                    >
+                      {{ app.status }}
+                    </span>
+                  </div>
+                </div>
+              </div>
+            </div>
+
+            <!-- Documents tab -->
+            <div v-if="activeTab === 'documents'">
+              <!-- Inline PDF preview -->
+              <template v-if="showPreview">
+                <div class="flex items-center justify-between mb-3">
+                  <button
+                    class="inline-flex items-center gap-1.5 text-sm font-medium text-surface-600 dark:text-surface-300 hover:text-brand-600 dark:hover:text-brand-400 transition-colors"
+                    @click="closePreview"
+                  >
+                    ← Back to documents
+                  </button>
+                  <div class="flex items-center gap-1">
+                    <button
+                      v-if="previewDocId"
+                      class="rounded-lg p-1.5 text-surface-400 hover:text-brand-600 hover:bg-surface-100 dark:hover:bg-surface-800 transition-colors"
+                      title="Download"
+                      @click="handleDownload(previewDocId!)"
+                    >
+                      <Download class="size-4" />
+                    </button>
+                  </div>
+                </div>
+
+                <div v-if="previewFilename" class="flex items-center gap-2 mb-3">
+                  <FileText class="size-4 text-surface-400 shrink-0" />
+                  <span class="text-sm font-medium text-surface-700 dark:text-surface-200 truncate">
+                    {{ previewFilename }}
+                  </span>
+                </div>
+
+                <iframe
+                  v-if="previewUrl && isPdfPreview"
+                  :src="previewUrl"
+                  class="w-full rounded-lg border border-surface-200 dark:border-surface-800"
+                  style="height: 60vh;"
+                  title="Document preview"
+                />
+              </template>
+
+              <!-- Document list -->
+              <template v-else>
+                <div
+                  v-if="!candidate.documents?.length"
+                  class="rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-8 text-center"
+                >
+                  <FileText class="size-8 text-surface-300 dark:text-surface-600 mx-auto mb-2" />
+                  <p class="text-sm text-surface-500 dark:text-surface-400">No documents yet.</p>
+                </div>
+
+                <div v-else class="space-y-2">
+                  <div
+                    v-for="doc in candidate.documents"
+                    :key="doc.id"
+                    class="group flex items-center justify-between rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 px-4 py-3 transition-colors"
+                    :class="doc.mimeType === 'application/pdf' ? 'cursor-pointer hover:border-brand-300 dark:hover:border-brand-700 hover:bg-brand-50/50 dark:hover:bg-brand-950/30' : ''"
+                    @click="doc.mimeType === 'application/pdf' ? handlePreview(doc.id, doc.mimeType) : undefined"
+                  >
+                    <div class="flex items-center gap-3 min-w-0">
+                      <FileText class="size-4 shrink-0" :class="doc.mimeType === 'application/pdf' ? 'text-danger-500 dark:text-danger-400' : 'text-surface-400'" />
+                      <div class="min-w-0">
+                        <p class="text-sm font-medium text-surface-700 dark:text-surface-200 truncate">
+                          {{ doc.originalFilename }}
+                        </p>
+                        <span class="text-xs text-surface-400">
+                          {{ documentTypeLabels[doc.type] ?? doc.type }}
+                          · <TimelineDateLink :date="doc.createdAt">{{ new Date(doc.createdAt).toLocaleDateString() }}</TimelineDateLink>
+                          <template v-if="doc.mimeType === 'application/pdf'"> · <span class="text-brand-500 dark:text-brand-400">Click to preview</span></template>
+                        </span>
+                      </div>
+                    </div>
+                    <div class="flex items-center gap-1 shrink-0" @click.stop>
+                      <button
+                        v-if="doc.mimeType === 'application/pdf'"
+                        class="rounded-lg p-1.5 text-surface-400 hover:text-brand-600 hover:bg-surface-100 dark:hover:bg-surface-800 transition-colors"
+                        title="Preview PDF"
+                        @click="handlePreview(doc.id, doc.mimeType)"
+                      >
+                        <Eye class="size-4" />
+                      </button>
+                      <button
+                        class="rounded-lg p-1.5 text-surface-400 hover:text-brand-600 hover:bg-surface-100 dark:hover:bg-surface-800 transition-colors"
+                        title="Download"
+                        @click="handleDownload(doc.id)"
+                      >
+                        <Download class="size-4" />
+                      </button>
+                    </div>
+                  </div>
+                </div>
+              </template>
+            </div>
+          </template>
+        </div>
+      </aside>
+    </Transition>
+
+    <!-- Apply to Job Modal -->
+    <ApplyToJobModal
+      v-if="showApplyModal && candidate"
+      :candidate-id="candidateId"
+      @close="showApplyModal = false"
+      @created="handleApplied"
+    />
+
+    <!-- Interview Schedule Sidebar -->
+    <InterviewScheduleSidebar
+      v-if="showInterviewSidebar && interviewTargetApp && candidate"
+      :application-id="interviewTargetApp.id"
+      :candidate-name="`${candidate.firstName} ${candidate.lastName}`"
+      :job-title="interviewTargetApp.jobTitle"
+      @close="showInterviewSidebar = false"
+      @scheduled="showInterviewSidebar = false"
+    />
+  </Teleport>
+</template>
diff --git a/app/components/CandidateDetailSidebar.vue b/app/components/CandidateDetailSidebar.vue
index d97d82d5..3dc92827 100644
--- a/app/components/CandidateDetailSidebar.vue
+++ b/app/components/CandidateDetailSidebar.vue
@@ -1061,21 +1061,22 @@ function formatInterviewDate(dateStr: string) {
             </div>
 
             <!-- Timeline list -->
-            <div v-else class="relative">
-              <!-- Vertical line -->
-              <div class="absolute left-[11px] top-2 bottom-2 w-px bg-surface-200 dark:bg-surface-700" />
-
+            <div v-else>
               <div
-                v-for="item in timelineItems"
+                v-for="(item, index) in timelineItems"
                 :key="item.id"
-                class="relative flex gap-3 py-2.5 group"
+                class="flex gap-3 py-2 group"
               >
-                <!-- Dot -->
-                <div class="relative z-10 mt-1 shrink-0">
+                <!-- Dot + connector -->
+                <div class="flex flex-col items-center shrink-0 mt-[3px]">
                   <div
-                    class="size-[9px] rounded-full ring-2 ring-white dark:ring-surface-900"
+                    class="size-[9px] rounded-full ring-2 ring-white dark:ring-surface-950 shrink-0"
                     :class="getTimelineActionColor(item.action)"
                   />
+                  <div
+                    v-if="index < timelineItems.length - 1"
+                    class="w-px flex-1 min-h-[14px] bg-surface-200 dark:bg-surface-700 mt-1"
+                  />
                 </div>
 
                 <!-- Content -->
diff --git a/app/components/PropertySchemaEditor.vue b/app/components/PropertySchemaEditor.vue
index b42fa295..0aa900f6 100644
--- a/app/components/PropertySchemaEditor.vue
+++ b/app/components/PropertySchemaEditor.vue
@@ -199,12 +199,12 @@ const overlayTitle = computed(() => {
 <template>
   <Teleport to="body">
     <Transition name="fade">
-      <div v-if="open" class="fixed inset-0 z-50 bg-black/40" @click="emit('close')" />
+      <div v-if="open" class="fixed inset-0 z-[65] bg-black/40" @click="emit('close')" />
     </Transition>
     <Transition name="slide-right">
       <aside
         v-if="open"
-        class="fixed right-0 top-0 z-50 flex h-full w-full max-w-md flex-col border-l border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 shadow-2xl"
+        class="fixed right-0 top-0 z-[70] flex h-full w-full max-w-md flex-col border-l border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 shadow-2xl"
       >
         <header class="flex items-center justify-between border-b border-surface-200 dark:border-surface-800 px-5 py-4">
           <div class="min-w-0">
@@ -383,7 +383,7 @@ const overlayTitle = computed(() => {
 
     <!-- Delete confirmation -->
     <Transition name="fade">
-      <div v-if="confirmDeleteId" class="fixed inset-0 z-[60] flex items-center justify-center">
+      <div v-if="confirmDeleteId" class="fixed inset-0 z-[80] flex items-center justify-center">
         <div class="absolute inset-0 bg-black/50" @click="confirmDeleteId = null" />
         <div class="relative bg-white dark:bg-surface-900 rounded-xl shadow-xl p-6 max-w-sm w-full mx-4">
           <h3 class="text-base font-semibold text-surface-900 dark:text-surface-50 mb-2">Delete property?</h3>
diff --git a/app/components/PropertyValueEditor.vue b/app/components/PropertyValueEditor.vue
index de0121de..970d1eda 100644
--- a/app/components/PropertyValueEditor.vue
+++ b/app/components/PropertyValueEditor.vue
@@ -65,7 +65,7 @@ function updatePopoverPosition() {
       bottom: `${Math.max(8, vh - rect.top + 4)}px`,
       left: `${left}px`,
       width: `${POPOVER_WIDTH}px`,
-      zIndex: '50',
+      zIndex: '70',
     }
   } else {
     popoverStyle.value = {
@@ -73,7 +73,7 @@ function updatePopoverPosition() {
       top: `${rect.bottom + 4}px`,
       left: `${left}px`,
       width: `${POPOVER_WIDTH}px`,
-      zIndex: '50',
+      zIndex: '70',
     }
   }
 }
diff --git a/app/pages/dashboard/applications/index.vue b/app/pages/dashboard/applications/index.vue
index 3be42675..e638aa64 100644
--- a/app/pages/dashboard/applications/index.vue
+++ b/app/pages/dashboard/applications/index.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { FileText, Search, X, Briefcase, Mail, Clock, ArrowUp, ArrowDown, ArrowUpDown, SlidersHorizontal } from 'lucide-vue-next'
+import { FileText, Search, X, Briefcase, Mail, Clock, ArrowUp, ArrowDown, ArrowUpDown, SlidersHorizontal, Maximize2, Minimize2 } from 'lucide-vue-next'
 
 definePageMeta({
   layout: 'dashboard',
@@ -252,7 +252,7 @@ const defaultSettings: ApplicationsViewSettings = {
 }
 
 const drawerOpen = ref(false)
-
+const isFullscreen = ref(false)
 const currentSettings = computed<ApplicationsViewSettings>(() => ({
   status: activeStatus.value,
   jobId: activeJobId.value,
@@ -338,6 +338,9 @@ const drawerActiveCount = computed(() =>
 function getPropertyValue(entity: { properties?: import('~~/shared/properties').PropertyEntry[] | null }, definitionId: string): unknown {
   return entity.properties?.find((p) => p.definition.id === definitionId)?.value ?? null
 }
+
+// ── Application detail drawer ─────────────────────────────────────────────────
+const selectedApplicationId = ref<string | null>(null)
 </script>
 
 <template>
@@ -400,6 +403,15 @@ function getPropertyValue(entity: { properties?: import('~~/shared/properties').
         <X class="size-3" />
         Clear
       </button>
+      <button
+        type="button"
+        class="inline-flex items-center gap-1.5 rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 px-2.5 py-2 text-surface-500 dark:text-surface-400 hover:bg-surface-50 dark:hover:bg-surface-800 hover:text-surface-700 dark:hover:text-surface-200 transition-colors"
+        :title="isFullscreen ? 'Exit fullscreen' : 'Fullscreen table'"
+        @click="isFullscreen = !isFullscreen"
+      >
+        <Maximize2 v-if="!isFullscreen" class="size-4" />
+        <Minimize2 v-else class="size-4" />
+      </button>
     </div>
 
     <!-- Filter drawer -->
@@ -530,7 +542,24 @@ function getPropertyValue(entity: { properties?: import('~~/shared/properties').
 
     <!-- Application table -->
     <div v-else>
-      <div class="overflow-x-auto rounded-lg border border-surface-200 dark:border-surface-800">
+      <Teleport to="body" :disabled="!isFullscreen">
+        <div :class="isFullscreen ? 'fixed inset-0 z-50 bg-white dark:bg-surface-950 flex flex-col' : ''">
+          <!-- Fullscreen header -->
+          <div v-if="isFullscreen" class="flex items-center justify-between px-4 py-3 border-b border-surface-200 dark:border-surface-800 shrink-0 bg-white dark:bg-surface-950">
+            <span class="text-sm font-semibold text-surface-900 dark:text-surface-100">
+              Applications — {{ filteredApplications.length }} result{{ filteredApplications.length === 1 ? '' : 's' }}
+            </span>
+            <button
+              type="button"
+              class="inline-flex items-center gap-1.5 rounded-lg border border-surface-200 dark:border-surface-800 px-2.5 py-1.5 text-sm text-surface-500 dark:text-surface-400 hover:bg-surface-50 dark:hover:bg-surface-800 hover:text-surface-700 dark:hover:text-surface-200 transition-colors"
+              @click="isFullscreen = false"
+            >
+              <Minimize2 class="size-4" />
+              Exit fullscreen
+            </button>
+          </div>
+          <div :class="isFullscreen ? 'flex-1 overflow-auto p-4' : ''">
+            <div class="overflow-x-auto rounded-lg border border-surface-200 dark:border-surface-800">
         <table class="w-full text-sm">
           <thead>
             <tr class="bg-surface-50 dark:bg-surface-800/50 border-b border-surface-200 dark:border-surface-800">
@@ -594,15 +623,16 @@ function getPropertyValue(entity: { properties?: import('~~/shared/properties').
               v-for="app in filteredApplications"
               :key="app.id"
               class="group bg-white dark:bg-surface-900 hover:bg-surface-50 dark:hover:bg-surface-800/60 transition-colors cursor-pointer [&>td]:align-top"
-              @click="$router.push($localePath(`/dashboard/applications/${app.id}`))"
+              @click="selectedApplicationId = app.id"
             >
               <td class="px-4 py-3">
-                <NuxtLink
-                  :to="$localePath(`/dashboard/applications/${app.id}`)"
-                  class="font-semibold text-surface-900 dark:text-surface-100 group-hover:text-brand-600 transition-colors whitespace-nowrap"
+                <button
+                  type="button"
+                  class="font-semibold text-surface-900 dark:text-surface-100 group-hover:text-brand-600 transition-colors whitespace-nowrap text-left"
+                  @click.stop="selectedApplicationId = app.id"
                 >
                   {{ formatPersonName(app.candidateFirstName, app.candidateLastName) }}
-                </NuxtLink>
+                </button>
               </td>
               <td v-if="visibleColumns.email" class="px-4 py-3 text-surface-500 dark:text-surface-400 hidden lg:table-cell">
                 <span class="inline-flex items-center gap-1.5">
@@ -661,6 +691,16 @@ function getPropertyValue(entity: { properties?: import('~~/shared/properties').
       <p class="text-xs text-surface-400 pt-3">
         Showing {{ filteredApplications.length }} of {{ total }} application{{ total === 1 ? '' : 's' }}
       </p>
+          </div>
+        </div>
+      </Teleport>
     </div>
   </div>
+
+  <!-- Application detail drawer -->
+  <ApplicationDetailDrawer
+    v-if="selectedApplicationId"
+    :application-id="selectedApplicationId"
+    @close="selectedApplicationId = null"
+  />
 </template>
diff --git a/app/pages/dashboard/candidates/index.vue b/app/pages/dashboard/candidates/index.vue
index 15310f7d..13536abd 100644
--- a/app/pages/dashboard/candidates/index.vue
+++ b/app/pages/dashboard/candidates/index.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { Users, Plus, Search, Mail, Phone, ArrowUp, ArrowDown, ArrowUpDown, SlidersHorizontal, X, StickyNote } from 'lucide-vue-next'
+import { Users, Plus, Search, Mail, Phone, ArrowUp, ArrowDown, ArrowUpDown, SlidersHorizontal, X, StickyNote, Maximize2, Minimize2 } from 'lucide-vue-next'
 
 definePageMeta({
   layout: 'dashboard',
@@ -63,6 +63,7 @@ watch(searchInput, (val) => {
 // ── Filters ───────────────────────────────────────────────────────────────────
 
 const drawerOpen = ref(false)
+const isFullscreen = ref(false)
 const filterGender = ref<string | undefined>(undefined)
 const filterDobFrom = ref<string | undefined>(undefined)
 const filterDobTo = ref<string | undefined>(undefined)
@@ -257,6 +258,9 @@ function onSaveView(name: string) {
 function onUpdateView(id: string) {
   updateView(id, { settings: currentSettings.value })
 }
+
+// ── Candidate detail drawer ───────────────────────────────────────────────────
+const selectedCandidateId = ref<string | null>(null)
 </script>
 
 <template>
@@ -326,6 +330,15 @@ function onUpdateView(id: string) {
         <X class="size-3" />
         Clear
       </button>
+      <button
+        type="button"
+        class="inline-flex items-center gap-1.5 rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 px-2.5 py-2 text-surface-500 dark:text-surface-400 hover:bg-surface-50 dark:hover:bg-surface-800 hover:text-surface-700 dark:hover:text-surface-200 transition-colors"
+        :title="isFullscreen ? 'Exit fullscreen' : 'Fullscreen table'"
+        @click="isFullscreen = !isFullscreen"
+      >
+        <Maximize2 v-if="!isFullscreen" class="size-4" />
+        <Minimize2 v-else class="size-4" />
+      </button>
     </div>
 
     <!-- Filter drawer -->
@@ -451,7 +464,24 @@ function onUpdateView(id: string) {
 
     <!-- Candidate table -->
     <div v-else>
-      <div class="overflow-x-auto rounded-lg border border-surface-200 dark:border-surface-800">
+      <Teleport to="body" :disabled="!isFullscreen">
+        <div :class="isFullscreen ? 'fixed inset-0 z-50 bg-white dark:bg-surface-950 flex flex-col' : ''">
+          <!-- Fullscreen header -->
+          <div v-if="isFullscreen" class="flex items-center justify-between px-4 py-3 border-b border-surface-200 dark:border-surface-800 shrink-0 bg-white dark:bg-surface-950">
+            <span class="text-sm font-semibold text-surface-900 dark:text-surface-100">
+              Candidates — {{ sortedCandidates.length }} result{{ sortedCandidates.length === 1 ? '' : 's' }}
+            </span>
+            <button
+              type="button"
+              class="inline-flex items-center gap-1.5 rounded-lg border border-surface-200 dark:border-surface-800 px-2.5 py-1.5 text-sm text-surface-500 dark:text-surface-400 hover:bg-surface-50 dark:hover:bg-surface-800 hover:text-surface-700 dark:hover:text-surface-200 transition-colors"
+              @click="isFullscreen = false"
+            >
+              <Minimize2 class="size-4" />
+              Exit fullscreen
+            </button>
+          </div>
+          <div :class="isFullscreen ? 'flex-1 overflow-auto p-4' : ''">
+            <div class="overflow-x-auto rounded-lg border border-surface-200 dark:border-surface-800">
         <table class="w-full text-sm">
           <thead>
             <tr class="bg-surface-50 dark:bg-surface-800/50 border-b border-surface-200 dark:border-surface-800">
@@ -510,15 +540,16 @@ function onUpdateView(id: string) {
               v-for="c in sortedCandidates"
               :key="c.id"
               class="group bg-white dark:bg-surface-900 hover:bg-surface-50 dark:hover:bg-surface-800/60 transition-colors cursor-pointer [&>td]:align-top"
-              @click="$router.push($localePath(`/dashboard/candidates/${c.id}`))"
+              @click="selectedCandidateId = c.id"
             >
               <td class="px-4 py-3">
-                <NuxtLink
-                  :to="$localePath(`/dashboard/candidates/${c.id}`)"
-                  class="font-semibold text-surface-900 dark:text-surface-100 group-hover:text-brand-600 transition-colors whitespace-nowrap"
+                <button
+                  type="button"
+                  class="font-semibold text-surface-900 dark:text-surface-100 group-hover:text-brand-600 transition-colors whitespace-nowrap text-left"
+                  @click.stop="selectedCandidateId = c.id"
                 >
                   {{ formatCandidateName(c) }}
-                </NuxtLink>
+                </button>
               </td>
               <td v-if="visibleColumns.email" class="px-4 py-3 text-surface-500 dark:text-surface-400">
                 <a
@@ -609,6 +640,16 @@ function onUpdateView(id: string) {
       <p class="text-xs text-surface-400 pt-3">
         {{ total }} candidate{{ total === 1 ? '' : 's' }} total
       </p>
+          </div>
+        </div>
+      </Teleport>
     </div>
   </div>
+
+  <!-- Candidate detail drawer -->
+  <CandidateDetailDrawer
+    v-if="selectedCandidateId"
+    :candidate-id="selectedCandidateId"
+    @close="selectedCandidateId = null"
+  />
 </template>
diff --git a/app/pages/dashboard/jobs/[id]/index.vue b/app/pages/dashboard/jobs/[id]/index.vue
index 0c7edc90..4fd60d04 100644
--- a/app/pages/dashboard/jobs/[id]/index.vue
+++ b/app/pages/dashboard/jobs/[id]/index.vue
@@ -5,8 +5,9 @@ import {
   Pencil, Trash2, Globe, ChevronDown, X,
   Video, Building2, Code2, UsersRound, Save, Check, MapPin, Users, Plus,
   CheckCircle2, XCircle, AlertTriangle, ArrowUpDown, ListFilter,
-  Maximize2, Minimize2, Brain, Loader2, History,
+  Maximize2, Minimize2, Brain, Loader2, History, SlidersHorizontal,
 } from 'lucide-vue-next'
+import type { PropertyEntry, PropertyFilter } from '~~/shared/properties'
 import { usePreviewReadOnly } from '~/composables/usePreviewReadOnly'
 import { APPLICATION_STATUS_TRANSITIONS, INTERVIEW_STATUS_TRANSITIONS } from '~~/shared/status-transitions'
 
@@ -73,20 +74,23 @@ type InterviewFilter = 'all' | 'has-interview' | 'no-interview'
 const sortBy = ref<SortOption>('score-desc')
 const scoreFilter = ref<ScoreFilter>('all')
 const interviewFilter = ref<InterviewFilter>('all')
+const propertyFilters = ref<PropertyFilter[]>([])
 const showSortPanel = ref(false)
 const showFilterPanel = ref(false)
 
-const hasActiveFilters = computed(() => scoreFilter.value !== 'all' || interviewFilter.value !== 'all')
+const hasActiveFilters = computed(() => scoreFilter.value !== 'all' || interviewFilter.value !== 'all' || propertyFilters.value.length > 0)
 const activeFilterCount = computed(() => {
   let count = 0
   if (scoreFilter.value !== 'all') count++
   if (interviewFilter.value !== 'all') count++
+  count += propertyFilters.value.length
   return count
 })
 
 function clearFilters() {
   scoreFilter.value = 'all'
   interviewFilter.value = 'all'
+  propertyFilters.value = []
 }
 
 const sortOptions: { value: SortOption; label: string }[] = [
@@ -162,7 +166,26 @@ const filteredApplications = computed(() => {
     })
   }
 
-  // Sorting
+  // Property filters
+  if (propertyFilters.value.length > 0) {
+    result = result.filter((app) => {
+      const props = (app as any).properties as PropertyEntry[] | undefined ?? []
+      return propertyFilters.value.every((pf) => {
+        const entry = props.find((e) => e.definition.id === pf.propertyDefinitionId)
+        const val = entry?.value ?? null
+        switch (pf.op) {
+          case 'isEmpty': return val === null || val === '' || (Array.isArray(val) && val.length === 0)
+          case 'isNotEmpty': return val !== null && val !== '' && !(Array.isArray(val) && val.length === 0)
+          case 'equals': return String(val ?? '') === String(pf.value ?? '')
+          case 'contains': return String(val ?? '').toLowerCase().includes(String(pf.value ?? '').toLowerCase())
+          case 'in': return Array.isArray(pf.value) && Array.isArray(val)
+            ? (pf.value as string[]).some((v) => (val as string[]).includes(v))
+            : Array.isArray(pf.value) && (pf.value as string[]).includes(String(val ?? ''))
+          default: return true
+        }
+      })
+    })
+  }
   return [...result].sort((a, b) => {
     switch (sortBy.value) {
       case 'date-desc':
@@ -228,6 +251,7 @@ watch(focusedApplications, () => {
 watch(focusStatus, () => {
   currentIndex.value = 0
   searchTerm.value = ''
+  propertyFilters.value = []
   closePanels()
 })
 
@@ -244,7 +268,7 @@ watch(currentIndex, () => {
 const currentSummary = computed(() => filteredApplications.value[currentIndex.value] ?? null)
 
 // Detail tab for center panel
-type DetailTab = 'overview' | 'interviews' | 'documents' | 'responses' | 'ai-analysis' | 'timeline'
+type DetailTab = 'overview' | 'interviews' | 'documents' | 'responses' | 'ai-analysis' | 'timeline' | 'properties'
 const detailTab = ref<DetailTab>('overview')
 
 // Overview section visibility toggles
@@ -253,6 +277,7 @@ const overviewSections = reactive({
   interviews: true,
   documents: true,
   responses: true,
+  properties: true,
 })
 const showOverviewDropdown = ref(false)
 const overviewDropdownRef = ref<HTMLElement | null>(null)
@@ -278,6 +303,7 @@ const showSection = computed(() => ({
   interviews: detailTab.value === 'overview' ? overviewSections.interviews : detailTab.value === 'interviews',
   documents: detailTab.value === 'overview' ? overviewSections.documents : detailTab.value === 'documents',
   responses: detailTab.value === 'overview' ? overviewSections.responses : detailTab.value === 'responses',
+  properties: detailTab.value === 'overview' ? overviewSections.properties : detailTab.value === 'properties',
   timeline: detailTab.value === 'timeline',
 }))
 
@@ -413,6 +439,7 @@ type SwipeApplicationDetail = {
     documents: SwipeDocument[]
   }
   responses: SwipeResponse[]
+  properties: PropertyEntry[]
 }
 
 const currentApplicationId = ref('')
@@ -1339,6 +1366,16 @@ function closeDocPreview() {
                   </div>
                 </div>
 
+                <!-- Property filters -->
+                <div>
+                  <p class="text-[10px] font-semibold uppercase tracking-wider text-surface-400 dark:text-surface-500 mb-1.5">Properties</p>
+                  <PropertyFilterBar
+                    v-model="propertyFilters"
+                    entity-type="application"
+                    :job-id="jobId"
+                  />
+                </div>
+
                 <!-- Clear filters -->
                 <button
                   v-if="hasActiveFilters"
@@ -1634,6 +1671,10 @@ function closeDocPreview() {
                         <input v-model="overviewSections.responses" type="checkbox" class="size-3.5 rounded border-surface-300 text-brand-600 focus:ring-brand-500 dark:border-surface-600 dark:bg-surface-800" />
                         Responses
                       </label>
+                      <label class="flex items-center gap-2.5 px-3.5 py-2 text-sm text-surface-700 dark:text-surface-300 hover:bg-surface-50 dark:hover:bg-surface-800/80 cursor-pointer select-none transition-colors">
+                        <input v-model="overviewSections.properties" type="checkbox" class="size-3.5 rounded border-surface-300 text-brand-600 focus:ring-brand-500 dark:border-surface-600 dark:bg-surface-800" />
+                        Properties
+                      </label>
                     </div>
                   </Transition>
                 </div>
@@ -1701,6 +1742,16 @@ function closeDocPreview() {
                   <History class="size-3.5" />
                   Timeline
                 </button>
+                <button
+                  class="cursor-pointer px-3.5 py-2.5 text-sm font-medium transition-all duration-150 border-b-2 -mb-px flex items-center gap-1.5"
+                  :class="detailTab === 'properties'
+                    ? 'border-brand-600 text-brand-700 dark:border-brand-400 dark:text-brand-300'
+                    : 'border-transparent text-surface-500 hover:text-surface-700 hover:border-surface-300 dark:text-surface-400 dark:hover:text-surface-300 dark:hover:border-surface-600'"
+                  @click="detailTab = 'properties'"
+                >
+                  <SlidersHorizontal class="size-3.5" />
+                  Properties
+                </button>
               </div>
             </div>
 
@@ -2166,8 +2217,7 @@ function closeDocPreview() {
                 <h2 class="text-sm font-semibold text-surface-800 dark:text-surface-200 flex items-center gap-2 mb-3">
                   <MessageSquare class="size-4 text-surface-400 dark:text-surface-500" />
                   Responses
-                </h2>
-                <template v-if="resolvedCurrentApplication?.responses?.length">
+                </h2>                <template v-if="resolvedCurrentApplication?.responses?.length">
                   <div class="space-y-3">
                     <div
                       v-for="response in resolvedCurrentApplication.responses"
@@ -2192,6 +2242,25 @@ function closeDocPreview() {
                 </div>
               </div>
 
+              <!-- PROPERTIES SECTION -->
+              <div v-if="showSection.properties && resolvedCurrentApplication" class="max-w-4xl mx-auto" :class="detailTab === 'overview' ? 'mt-10' : ''">
+                <div class="rounded-xl border border-surface-200/80 bg-white p-5 shadow-sm shadow-surface-900/[0.03] dark:border-surface-800/60 dark:bg-surface-900 dark:shadow-none">
+                  <div class="flex items-center gap-2.5 mb-4">
+                    <div class="flex size-7 items-center justify-center rounded-lg bg-brand-50 dark:bg-brand-950/40">
+                      <SlidersHorizontal class="size-3.5 text-brand-600 dark:text-brand-400" />
+                    </div>
+                    <h3 class="text-sm font-semibold text-surface-800 dark:text-surface-200">Properties</h3>
+                  </div>
+                  <PropertyBlock
+                    entity-type="application"
+                    :entity-id="resolvedCurrentApplication.id"
+                    :job-id="jobId"
+                    :entries="resolvedCurrentApplication.properties ?? []"
+                    @refresh="executeDetailFetch()"
+                  />
+                </div>
+              </div>
+
               <!-- TIMELINE SECTION -->
               <div v-if="showSection.timeline" class="space-y-3 max-w-4xl mx-auto">
                 <h2 class="text-sm font-semibold text-surface-800 dark:text-surface-200 flex items-center gap-2 mb-3">
@@ -2233,20 +2302,22 @@ function closeDocPreview() {
                 </div>
 
                 <!-- Timeline list -->
-                <div v-else class="relative">
-                  <!-- Vertical timeline line -->
-                  <div class="absolute left-3 top-0 bottom-0 w-px bg-surface-200 dark:bg-surface-800" />
-
-                  <div class="space-y-0.5">
-                    <div
-                      v-for="item in timelineItems"
-                      :key="item.id"
-                      class="group relative flex items-start gap-3 py-2 px-1 transition-colors duration-150 hover:bg-surface-50 dark:hover:bg-surface-800/40 rounded-lg"
-                    >
-                      <!-- Action icon -->
-                      <div class="relative z-10 flex items-center justify-center size-6 rounded shrink-0" :class="getTimelineActionStyle(item.action).bg">
+                <div v-else>
+                  <div
+                    v-for="(item, index) in timelineItems"
+                    :key="item.id"
+                    class="group flex items-start gap-3 py-1.5 px-1 transition-colors duration-150 hover:bg-surface-50 dark:hover:bg-surface-800/40 rounded-lg"
+                  >
+                    <!-- Left column: icon + connector -->
+                    <div class="flex flex-col items-center shrink-0">
+                      <div class="flex items-center justify-center size-6 rounded shrink-0" :class="getTimelineActionStyle(item.action).bg">
                         <component :is="getTimelineActionStyle(item.action).icon" class="size-3" :class="getTimelineActionStyle(item.action).color" />
                       </div>
+                      <div
+                        v-if="index < timelineItems.length - 1"
+                        class="w-px flex-1 min-h-[10px] bg-surface-200 dark:bg-surface-800 mt-0.5"
+                      />
+                    </div>
 
                       <!-- Content -->
                       <div class="min-w-0 flex-1">
@@ -2276,7 +2347,6 @@ function closeDocPreview() {
                     </div>
                   </div>
                 </div>
-              </div>
 
               </template>
             </div>
diff --git a/app/pages/dashboard/jobs/index.vue b/app/pages/dashboard/jobs/index.vue
index 08f818b6..97ce254d 100644
--- a/app/pages/dashboard/jobs/index.vue
+++ b/app/pages/dashboard/jobs/index.vue
@@ -1,8 +1,8 @@
 <script setup lang="ts">
 import {
-  Briefcase, Bell, Plus, Kanban, MapPin, Search, SlidersHorizontal, X,
-  List, LayoutGrid, Table as TableIcon,
-  ArrowUp, ArrowDown, ArrowUpDown, Users, Calendar,
+  Briefcase, Bell, Plus, Kanban,
+  MapPin, Search, SlidersHorizontal, X,
+  LayoutGrid, List, Table2, ArrowUp, ArrowDown, ArrowUpDown,
 } from 'lucide-vue-next'
 
 definePageMeta({
@@ -19,7 +19,7 @@ const { activeOrg } = useCurrentOrg()
 const localePath = useLocalePath()
 
 // ─────────────────────────────────────────────
-// Stage / status / type config
+// Stage config for clickable pipeline counts
 // ─────────────────────────────────────────────
 
 const stageConfig = [
@@ -35,6 +35,16 @@ function getStageCount(pipeline: any, key: string): number {
   return pipeline?.[key] ?? 0
 }
 
+// ─────────────────────────────────────────────
+// Fetch jobs with pipeline data
+// ─────────────────────────────────────────────
+
+const { jobs, total, fetchStatus, error, refresh } = useJobs()
+
+// ─────────────────────────────────────────────
+// Job status config
+// ─────────────────────────────────────────────
+
 const statusBadgeClasses: Record<string, string> = {
   draft: 'bg-surface-100 text-surface-600 dark:bg-surface-800 dark:text-surface-400',
   open: 'bg-success-50 text-success-700 dark:bg-success-950 dark:text-success-400',
@@ -49,45 +59,28 @@ const typeLabels: Record<string, string> = {
   internship: 'Internship',
 }
 
-const experienceLabels: Record<string, string> = {
-  junior: 'Junior',
-  mid: 'Mid',
-  senior: 'Senior',
-  lead: 'Lead',
-}
-
-const remoteLabels: Record<string, string> = {
-  remote: 'Remote',
-  hybrid: 'Hybrid',
-  onsite: 'On-site',
-}
-
 // ─────────────────────────────────────────────
-// Fetch jobs
+// View mode (gallery | table)
 // ─────────────────────────────────────────────
 
-const { jobs, total, fetchStatus, error, refresh } = useJobs()
+type ViewMode = 'gallery' | 'list' | 'table'
 
 // ─────────────────────────────────────────────
-// Filters & sort & view-mode state
+// Search + filters
 // ─────────────────────────────────────────────
 
+const search = ref('')
+const drawerOpen = ref(false)
+
 type StatusFilter = 'open' | 'draft' | 'closed' | 'archived'
 type TypeFilter = 'full_time' | 'part_time' | 'contract' | 'internship'
 type ExperienceFilter = 'junior' | 'mid' | 'senior' | 'lead'
 type RemoteFilter = 'remote' | 'hybrid' | 'onsite'
-type ViewMode = 'list' | 'gallery' | 'table'
-type SortKey = 'priority' | 'title' | 'status' | 'type' | 'created' | 'updated' | 'newApps' | 'totalActive'
-type SortDir = 'asc' | 'desc'
 
-const search = ref('')
 const statusFilter = ref<StatusFilter[]>([])
 const typeFilter = ref<TypeFilter[]>([])
 const experienceFilter = ref<ExperienceFilter[]>([])
 const remoteFilter = ref<RemoteFilter[]>([])
-const sortKey = ref<SortKey>('priority')
-const sortDir = ref<SortDir>('desc')
-const viewMode = ref<ViewMode>('list')
 
 const statusOptions: { value: StatusFilter, label: string }[] = [
   { value: 'open', label: 'Open' },
@@ -117,40 +110,25 @@ function toggleIn<T>(arr: T[], value: T): T[] {
   return arr.includes(value) ? arr.filter(v => v !== value) : [...arr, value]
 }
 
-const drawerActiveCount = computed(() =>
+function toggleStatus(v: StatusFilter) { statusFilter.value = toggleIn(statusFilter.value, v) }
+function toggleType(v: TypeFilter) { typeFilter.value = toggleIn(typeFilter.value, v) }
+function toggleExperience(v: ExperienceFilter) { experienceFilter.value = toggleIn(experienceFilter.value, v) }
+function toggleRemote(v: RemoteFilter) { remoteFilter.value = toggleIn(remoteFilter.value, v) }
+
+const activeFilterCount = computed(() =>
   statusFilter.value.length
   + typeFilter.value.length
   + experienceFilter.value.length
   + remoteFilter.value.length,
 )
 
-const hasActiveFilters = computed(() =>
-  drawerActiveCount.value > 0 || search.value.trim().length > 0,
-)
-
-function clearAllFilters() {
-  search.value = ''
+function clearFilters() {
   statusFilter.value = []
   typeFilter.value = []
   experienceFilter.value = []
   remoteFilter.value = []
 }
 
-// ─────────────────────────────────────────────
-// Filter + sort
-// ─────────────────────────────────────────────
-
-const statusPriority: Record<string, number> = {
-  open: 0,
-  draft: 1,
-  closed: 2,
-  archived: 3,
-}
-
-function totalActive(pipeline: any) {
-  return (pipeline?.new ?? 0) + (pipeline?.screening ?? 0) + (pipeline?.interview ?? 0) + (pipeline?.offer ?? 0) + (pipeline?.hired ?? 0)
-}
-
 const filteredJobs = computed(() => {
   const q = search.value.trim().toLowerCase()
   return jobs.value.filter((j: any) => {
@@ -170,176 +148,133 @@ const filteredJobs = computed(() => {
   })
 })
 
-const sortedJobs = computed(() => {
-  const dir = sortDir.value === 'asc' ? 1 : -1
-  return [...filteredJobs.value].sort((a: any, b: any) => {
-    switch (sortKey.value) {
-      case 'title':
-        return dir * String(a.title ?? '').localeCompare(String(b.title ?? ''))
-      case 'status':
-        return dir * String(a.status ?? '').localeCompare(String(b.status ?? ''))
-      case 'type':
-        return dir * String(a.type ?? '').localeCompare(String(b.type ?? ''))
-      case 'created':
-        return dir * (new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime())
-      case 'updated':
-        return dir * (new Date(a.updatedAt ?? a.createdAt).getTime() - new Date(b.updatedAt ?? b.createdAt).getTime())
-      case 'newApps':
-        return dir * ((a.pipeline?.new ?? 0) - (b.pipeline?.new ?? 0))
-      case 'totalActive':
-        return dir * (totalActive(a.pipeline) - totalActive(b.pipeline))
-      case 'priority':
-      default: {
-        // Default smart ordering: open w/ new apps first, then status priority, then new, then active, then date
-        const aPriority = statusPriority[a.status] ?? 9
-        const bPriority = statusPriority[b.status] ?? 9
-        if (aPriority !== bPriority) return aPriority - bPriority
-        const aNew = a.pipeline?.new ?? 0
-        const bNew = b.pipeline?.new ?? 0
-        if (aNew !== bNew) return bNew - aNew
-        const aActive = totalActive(a.pipeline)
-        const bActive = totalActive(b.pipeline)
-        if (aActive !== bActive) return bActive - aActive
-        return new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()
-      }
-    }
-  })
-})
+// ─────────────────────────────────────────────
+// Table sort
+// ─────────────────────────────────────────────
+
+type SortKey = 'title' | 'status' | 'type' | 'location' | 'new' | 'active' | 'created'
+type SortDir = 'asc' | 'desc'
+
+const sortKey = ref<SortKey>('created')
+const sortDir = ref<SortDir>('desc')
 
 function toggleSort(key: SortKey) {
   if (sortKey.value === key) {
     sortDir.value = sortDir.value === 'asc' ? 'desc' : 'asc'
-  } else {
+  }
+  else {
     sortKey.value = key
-    sortDir.value = (key === 'created' || key === 'updated' || key === 'newApps' || key === 'totalActive') ? 'desc' : 'asc'
+    sortDir.value = key === 'created' || key === 'new' || key === 'active' ? 'desc' : 'asc'
   }
 }
 
 // ─────────────────────────────────────────────
-// "Needs attention" grouping (list view only,
-// only when using the default smart sort)
+// Sort jobs by urgency (gallery) or column (table)
 // ─────────────────────────────────────────────
 
-const useSmartGrouping = computed(() => viewMode.value === 'list' && sortKey.value === 'priority')
-
-const jobsNeedingAttention = computed(() =>
-  useSmartGrouping.value
-    ? sortedJobs.value.filter((j: any) => j.status === 'open' && (j.pipeline?.new ?? 0) > 0)
-    : [],
-)
-
-const otherJobs = computed(() =>
-  useSmartGrouping.value
-    ? sortedJobs.value.filter((j: any) => !(j.status === 'open' && (j.pipeline?.new ?? 0) > 0))
-    : sortedJobs.value,
-)
+const statusPriority: Record<string, number> = {
+  open: 0,
+  draft: 1,
+  closed: 2,
+  archived: 3,
+}
 
-const isEmpty = computed(() => jobs.value.length === 0)
-const noResults = computed(() => !isEmpty.value && filteredJobs.value.length === 0)
+function totalActive(pipeline: any) {
+  return (pipeline?.new ?? 0) + (pipeline?.screening ?? 0) + (pipeline?.interview ?? 0) + (pipeline?.offer ?? 0) + (pipeline?.hired ?? 0)
+}
 
-// ─────────────────────────────────────────────
-// Helpers
-// ─────────────────────────────────────────────
+const sortedJobs = computed(() => {
+  const list = [...filteredJobs.value]
+  if (sortKey.value !== 'created' || sortDir.value !== 'desc') {
+    // Table-style sort
+    const dir = sortDir.value === 'asc' ? 1 : -1
+    list.sort((a, b) => {
+      switch (sortKey.value) {
+        case 'title': return dir * (a.title ?? '').localeCompare(b.title ?? '')
+        case 'status': return dir * (statusPriority[a.status] ?? 9) - dir * (statusPriority[b.status] ?? 9)
+        case 'type': return dir * (a.type ?? '').localeCompare(b.type ?? '')
+        case 'location': return dir * (a.location ?? '').localeCompare(b.location ?? '')
+        case 'new': return dir * ((a.pipeline?.new ?? 0) - (b.pipeline?.new ?? 0))
+        case 'active': return dir * (totalActive(a.pipeline) - totalActive(b.pipeline))
+        case 'created': return dir * (new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime())
+        default: return 0
+      }
+    })
+    return list
+  }
 
-function formatDate(date: string | Date) {
-  const diff = Date.now() - new Date(date).getTime()
-  const days = Math.floor(diff / 86_400_000)
-  if (days < 1) return 'Today'
-  if (days < 7) return `${days}d ago`
-  if (days < 30) return `${Math.floor(days / 7)}w ago`
-  return new Date(date).toLocaleDateString()
-}
+  // Default gallery urgency sort
+  list.sort((a, b) => {
+    const aPriority = statusPriority[a.status] ?? 9
+    const bPriority = statusPriority[b.status] ?? 9
+    if (aPriority !== bPriority) return aPriority - bPriority
+    const aNew = a.pipeline?.new ?? 0
+    const bNew = b.pipeline?.new ?? 0
+    if (aNew !== bNew) return bNew - aNew
+    const aActive = totalActive(a.pipeline)
+    const bActive = totalActive(b.pipeline)
+    if (aActive !== bActive) return bActive - aActive
+    return new Date(b.createdAt).getTime() - new Date(a.createdAt).getTime()
+  })
+  return list
+})
 
 // ─────────────────────────────────────────────
-// Column visibility (table view)
+// Group jobs: needs attention + others (gallery only)
 // ─────────────────────────────────────────────
 
-const COLUMNS_STORAGE_KEY = 'reqcore:columns:jobs'
-
-const defaultColumnVisibility = {
-  status: true,
-  type: true,
-  location: true,
-  experience: true,
-  remote: false,
-  newApps: true,
-  totalActive: true,
-  created: true,
-}
-
-const visibleColumns = ref<Record<string, boolean>>({ ...defaultColumnVisibility })
-
-const jobColumns = [
-  { key: 'title', label: 'Title', required: true },
-  { key: 'status', label: 'Status' },
-  { key: 'type', label: 'Type' },
-  { key: 'location', label: 'Location' },
-  { key: 'experience', label: 'Experience' },
-  { key: 'remote', label: 'Remote' },
-  { key: 'newApps', label: 'New apps' },
-  { key: 'totalActive', label: 'Total active' },
-  { key: 'created', label: 'Created' },
-]
-
-onMounted(() => {
-  try {
-    const raw = window.localStorage.getItem(COLUMNS_STORAGE_KEY)
-    if (raw) visibleColumns.value = { ...defaultColumnVisibility, ...JSON.parse(raw) }
-  } catch {}
-})
+const jobsNeedingAttention = computed(() =>
+  sortedJobs.value.filter(j => j.status === 'open' && (j.pipeline?.new ?? 0) > 0),
+)
 
-watch(visibleColumns, (val) => {
-  try { window.localStorage.setItem(COLUMNS_STORAGE_KEY, JSON.stringify(val)) } catch {}
-}, { deep: true })
+const otherJobs = computed(() =>
+  sortedJobs.value.filter(j => !(j.status === 'open' && (j.pipeline?.new ?? 0) > 0)),
+)
 
 // ─────────────────────────────────────────────
-// Drawer + Saved Views
+// Saved views
 // ─────────────────────────────────────────────
 
 type JobsViewSettings = {
-  status: StatusFilter[]
-  type: TypeFilter[]
-  experience: ExperienceFilter[]
-  remote: RemoteFilter[]
+  statusFilter: StatusFilter[]
+  typeFilter: TypeFilter[]
+  experienceFilter: ExperienceFilter[]
+  remoteFilter: RemoteFilter[]
+  viewMode: ViewMode
   sortKey: SortKey
   sortDir: SortDir
-  viewMode: ViewMode
-  visibleColumns: Record<string, boolean>
 }
 
 const defaultSettings: JobsViewSettings = {
-  status: [],
-  type: [],
-  experience: [],
-  remote: [],
-  sortKey: 'priority',
+  statusFilter: [],
+  typeFilter: [],
+  experienceFilter: [],
+  remoteFilter: [],
+  viewMode: 'gallery',
+  sortKey: 'created',
   sortDir: 'desc',
-  viewMode: 'list',
-  visibleColumns: { ...defaultColumnVisibility },
 }
 
-const drawerOpen = ref(false)
+const viewMode = ref<ViewMode>('gallery')
 
 const currentSettings = computed<JobsViewSettings>(() => ({
-  status: [...statusFilter.value],
-  type: [...typeFilter.value],
-  experience: [...experienceFilter.value],
-  remote: [...remoteFilter.value],
+  statusFilter: [...statusFilter.value],
+  typeFilter: [...typeFilter.value],
+  experienceFilter: [...experienceFilter.value],
+  remoteFilter: [...remoteFilter.value],
+  viewMode: viewMode.value,
   sortKey: sortKey.value,
   sortDir: sortDir.value,
-  viewMode: viewMode.value,
-  visibleColumns: { ...visibleColumns.value },
 }))
 
 function applySettings(s: JobsViewSettings) {
-  statusFilter.value = [...(s.status ?? [])]
-  typeFilter.value = [...(s.type ?? [])]
-  experienceFilter.value = [...(s.experience ?? [])]
-  remoteFilter.value = [...(s.remote ?? [])]
-  sortKey.value = s.sortKey ?? 'priority'
+  statusFilter.value = [...(s.statusFilter ?? [])]
+  typeFilter.value = [...(s.typeFilter ?? [])]
+  experienceFilter.value = [...(s.experienceFilter ?? [])]
+  remoteFilter.value = [...(s.remoteFilter ?? [])]
+  viewMode.value = s.viewMode ?? 'gallery'
+  sortKey.value = s.sortKey ?? 'created'
   sortDir.value = s.sortDir ?? 'desc'
-  viewMode.value = s.viewMode ?? 'list'
-  visibleColumns.value = { ...defaultColumnVisibility, ...(s.visibleColumns ?? {}) }
 }
 
 const {
@@ -362,28 +297,14 @@ onMounted(() => {
   })
 })
 
-function arrEqual<T>(a: T[], b: T[]) {
-  if (a.length !== b.length) return false
-  const sa = [...a].sort()
-  const sb = [...b].sort()
-  return sa.every((v, i) => v === sb[i])
-}
-
-function colsEqual(a: Record<string, boolean>, b: Record<string, boolean>) {
-  const keys = new Set([...Object.keys(a), ...Object.keys(b)])
-  for (const k of keys) if (Boolean(a[k]) !== Boolean(b[k])) return false
-  return true
-}
-
 function settingsEqual(a: JobsViewSettings, b: JobsViewSettings) {
-  return arrEqual(a.status, b.status)
-    && arrEqual(a.type, b.type)
-    && arrEqual(a.experience, b.experience)
-    && arrEqual(a.remote, b.remote)
+  return a.viewMode === b.viewMode
     && a.sortKey === b.sortKey
     && a.sortDir === b.sortDir
-    && a.viewMode === b.viewMode
-    && colsEqual(a.visibleColumns, b.visibleColumns)
+    && JSON.stringify(a.statusFilter ?? []) === JSON.stringify(b.statusFilter ?? [])
+    && JSON.stringify(a.typeFilter ?? []) === JSON.stringify(b.typeFilter ?? [])
+    && JSON.stringify(a.experienceFilter ?? []) === JSON.stringify(b.experienceFilter ?? [])
+    && JSON.stringify(a.remoteFilter ?? []) === JSON.stringify(b.remoteFilter ?? [])
 }
 
 const isDirty = computed(() => {
@@ -410,11 +331,12 @@ function onUpdateView(id: string) {
   updateView(id, { settings: currentSettings.value })
 }
 
-const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
-  { value: 'list', label: 'List', icon: List },
-  { value: 'gallery', label: 'Gallery', icon: LayoutGrid },
-  { value: 'table', label: 'Table', icon: TableIcon },
-]
+// ─────────────────────────────────────────────
+// Helpers
+// ─────────────────────────────────────────────
+
+const isEmpty = computed(() => jobs.value.length === 0)
+const noResults = computed(() => !isEmpty.value && filteredJobs.value.length === 0)
 </script>
 
 <template>
@@ -449,6 +371,10 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
             <div class="h-5 w-16 bg-surface-200 dark:bg-surface-700 rounded-full" />
           </div>
           <div class="h-2 w-full bg-surface-200 dark:bg-surface-700 rounded mb-3" />
+          <div class="flex gap-4">
+            <div class="h-4 w-20 bg-surface-200 dark:bg-surface-700 rounded" />
+            <div class="h-4 w-20 bg-surface-200 dark:bg-surface-700 rounded" />
+          </div>
         </div>
       </div>
     </div>
@@ -462,7 +388,7 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
       <button class="underline ml-1 cursor-pointer" @click="refresh()">Retry</button>
     </div>
 
-    <!-- ─── Empty state (no jobs at all) ─── -->
+    <!-- ─── Empty state ─── -->
     <div v-else-if="isEmpty" class="flex flex-col items-center justify-center py-20">
       <div class="rounded-2xl border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-10 text-center max-w-md">
         <Briefcase class="size-12 text-brand-400 mx-auto mb-4" />
@@ -484,9 +410,9 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
 
     <!-- ─── Jobs content ─── -->
     <template v-else>
-      <!-- Search + Views + Columns + Filters + View-mode -->
-      <div class="flex flex-wrap items-center gap-2 mb-4">
-        <div class="relative flex-1 min-w-[220px]">
+      <!-- ─── Toolbar: Search + Views + Filters + View Toggle ─── -->
+      <div class="flex items-center gap-2 mb-4">
+        <div class="relative flex-1">
           <Search class="size-4 text-surface-400 absolute left-3 top-1/2 -translate-y-1/2 pointer-events-none" />
           <input
             v-model="search"
@@ -496,6 +422,7 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
           />
         </div>
 
+        <!-- Saved views menu -->
         <SavedViewsMenu
           :views="views"
           :active-view-id="activeViewId"
@@ -507,16 +434,48 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
           @set-default="setDefault"
         />
 
-        <ColumnsMenu
-          v-if="viewMode === 'table'"
-          v-model="visibleColumns"
-          :columns="jobColumns"
-        />
+        <!-- View mode toggle -->
+        <div class="inline-flex rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 overflow-hidden">
+          <button
+            type="button"
+            class="inline-flex items-center gap-1.5 px-3 py-2 text-sm font-medium transition-colors"
+            :class="viewMode === 'gallery'
+              ? 'bg-surface-100 dark:bg-surface-800 text-surface-900 dark:text-surface-100'
+              : 'text-surface-500 dark:text-surface-400 hover:bg-surface-50 dark:hover:bg-surface-800'"
+            title="Gallery view"
+            @click="viewMode = 'gallery'"
+          >
+            <LayoutGrid class="size-4" />
+          </button>
+          <button
+            type="button"
+            class="inline-flex items-center gap-1.5 px-3 py-2 text-sm font-medium transition-colors border-l border-surface-200 dark:border-surface-800"
+            :class="viewMode === 'list'
+              ? 'bg-surface-100 dark:bg-surface-800 text-surface-900 dark:text-surface-100'
+              : 'text-surface-500 dark:text-surface-400 hover:bg-surface-50 dark:hover:bg-surface-800'"
+            title="List view"
+            @click="viewMode = 'list'"
+          >
+            <List class="size-4" />
+          </button>
+          <button
+            type="button"
+            class="inline-flex items-center gap-1.5 px-3 py-2 text-sm font-medium transition-colors border-l border-surface-200 dark:border-surface-800"
+            :class="viewMode === 'table'
+              ? 'bg-surface-100 dark:bg-surface-800 text-surface-900 dark:text-surface-100'
+              : 'text-surface-500 dark:text-surface-400 hover:bg-surface-50 dark:hover:bg-surface-800'"
+            title="Table view"
+            @click="viewMode = 'table'"
+          >
+            <Table2 class="size-4" />
+          </button>
+        </div>
 
+        <!-- Filters button -->
         <button
           type="button"
           class="inline-flex items-center gap-1.5 rounded-lg border px-3 py-2 text-sm font-medium transition-colors cursor-pointer"
-          :class="drawerActiveCount > 0
+          :class="activeFilterCount > 0
             ? 'border-surface-400 bg-surface-100 text-surface-800 dark:border-surface-500 dark:bg-surface-800 dark:text-surface-200'
             : 'border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 text-surface-600 dark:text-surface-400 hover:bg-surface-50 dark:hover:bg-surface-800'"
           @click="drawerOpen = true"
@@ -524,51 +483,28 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
           <SlidersHorizontal class="size-4" />
           Filters
           <span
-            v-if="drawerActiveCount > 0"
-            class="inline-flex items-center justify-center min-w-[1rem] h-4 px-1 rounded-full bg-surface-700 dark:bg-surface-300 text-white dark:text-surface-900 text-[10px] font-semibold"
-          >{{ drawerActiveCount }}</span>
+            v-if="activeFilterCount > 0"
+            class="inline-flex items-center justify-center size-4 rounded-full bg-surface-700 dark:bg-surface-300 text-white dark:text-surface-900 text-xs font-semibold"
+          >{{ activeFilterCount }}</span>
         </button>
 
-        <!-- View mode switcher -->
-        <div
-          class="inline-flex rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 p-0.5"
-          role="tablist"
-          aria-label="View mode"
-        >
-          <button
-            v-for="opt in viewModeOptions"
-            :key="opt.value"
-            type="button"
-            role="tab"
-            :aria-selected="viewMode === opt.value"
-            :title="`${opt.label} view`"
-            class="inline-flex items-center gap-1.5 rounded-md px-2.5 py-1.5 text-xs font-medium transition-colors cursor-pointer"
-            :class="viewMode === opt.value
-              ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
-              : 'text-surface-500 dark:text-surface-400 hover:bg-surface-100 dark:hover:bg-surface-800'"
-            @click="viewMode = opt.value"
-          >
-            <component :is="opt.icon" class="size-3.5" />
-            <span class="hidden sm:inline">{{ opt.label }}</span>
-          </button>
-        </div>
-
+        <!-- Clear filters -->
         <button
-          v-if="hasActiveFilters"
-          class="inline-flex items-center gap-1 text-xs text-surface-400 hover:text-danger-600 transition-colors cursor-pointer"
-          @click="clearAllFilters"
+          v-if="activeFilterCount > 0"
+          class="inline-flex items-center gap-1 text-xs text-surface-400 hover:text-danger-600 transition-colors"
+          @click="clearFilters"
         >
           <X class="size-3" />
           Clear
         </button>
       </div>
 
-      <!-- ─── Filter drawer ─── -->
+      <!-- ─── Filter Drawer ─── -->
       <FilterDrawer
         v-model="drawerOpen"
         title="Filter jobs"
         description="Customize your view, then save it for quick access."
-        :active-count="drawerActiveCount"
+        :active-count="activeFilterCount"
         saveable
         :default-save-name="`View ${views.length + 1}`"
         @reset="applySettings(defaultSettings)"
@@ -583,12 +519,14 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
                 v-for="opt in statusOptions"
                 :key="opt.value"
                 type="button"
-                class="rounded-full px-3 py-1.5 text-xs font-medium transition-colors"
+                class="rounded-full px-2.5 py-1 text-xs font-medium border transition-colors cursor-pointer"
                 :class="statusFilter.includes(opt.value)
-                  ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
-                  : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
-                @click="statusFilter = toggleIn(statusFilter, opt.value)"
-              >{{ opt.label }}</button>
+                  ? 'border-brand-300 bg-brand-100 text-brand-700 dark:border-brand-700 dark:bg-brand-950/60 dark:text-brand-300'
+                  : 'border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 text-surface-600 dark:text-surface-400 hover:bg-surface-100 dark:hover:bg-surface-800'"
+                @click="toggleStatus(opt.value)"
+              >
+                {{ opt.label }}
+              </button>
             </div>
           </div>
 
@@ -600,29 +538,33 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
                 v-for="opt in typeOptions"
                 :key="opt.value"
                 type="button"
-                class="rounded-full px-3 py-1.5 text-xs font-medium transition-colors"
+                class="rounded-full px-2.5 py-1 text-xs font-medium border transition-colors cursor-pointer"
                 :class="typeFilter.includes(opt.value)
-                  ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
-                  : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
-                @click="typeFilter = toggleIn(typeFilter, opt.value)"
-              >{{ opt.label }}</button>
+                  ? 'border-brand-300 bg-brand-100 text-brand-700 dark:border-brand-700 dark:bg-brand-950/60 dark:text-brand-300'
+                  : 'border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 text-surface-600 dark:text-surface-400 hover:bg-surface-100 dark:hover:bg-surface-800'"
+                @click="toggleType(opt.value)"
+              >
+                {{ opt.label }}
+              </button>
             </div>
           </div>
 
-          <!-- Experience -->
+          <!-- Experience level -->
           <div>
-            <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Experience</label>
+            <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Experience level</label>
             <div class="flex flex-wrap gap-1.5">
               <button
                 v-for="opt in experienceOptions"
                 :key="opt.value"
                 type="button"
-                class="rounded-full px-3 py-1.5 text-xs font-medium transition-colors"
+                class="rounded-full px-2.5 py-1 text-xs font-medium border transition-colors cursor-pointer"
                 :class="experienceFilter.includes(opt.value)
-                  ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
-                  : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
-                @click="experienceFilter = toggleIn(experienceFilter, opt.value)"
-              >{{ opt.label }}</button>
+                  ? 'border-brand-300 bg-brand-100 text-brand-700 dark:border-brand-700 dark:bg-brand-950/60 dark:text-brand-300'
+                  : 'border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 text-surface-600 dark:text-surface-400 hover:bg-surface-100 dark:hover:bg-surface-800'"
+                @click="toggleExperience(opt.value)"
+              >
+                {{ opt.label }}
+              </button>
             </div>
           </div>
 
@@ -634,12 +576,14 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
                 v-for="opt in remoteOptions"
                 :key="opt.value"
                 type="button"
-                class="rounded-full px-3 py-1.5 text-xs font-medium transition-colors"
+                class="rounded-full px-2.5 py-1 text-xs font-medium border transition-colors cursor-pointer"
                 :class="remoteFilter.includes(opt.value)
-                  ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
-                  : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
-                @click="remoteFilter = toggleIn(remoteFilter, opt.value)"
-              >{{ opt.label }}</button>
+                  ? 'border-brand-300 bg-brand-100 text-brand-700 dark:border-brand-700 dark:bg-brand-950/60 dark:text-brand-300'
+                  : 'border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 text-surface-600 dark:text-surface-400 hover:bg-surface-100 dark:hover:bg-surface-800'"
+                @click="toggleRemote(opt.value)"
+              >
+                {{ opt.label }}
+              </button>
             </div>
           </div>
 
@@ -651,14 +595,13 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
                 v-model="sortKey"
                 class="flex-1 rounded-lg border border-surface-300 dark:border-surface-700 px-3 py-2 text-sm bg-white dark:bg-surface-900 text-surface-900 dark:text-surface-100 focus:outline-none focus:ring-2 focus:ring-brand-500 focus:border-brand-500 transition-colors"
               >
-                <option value="priority">Smart (needs attention first)</option>
+                <option value="created">Date created</option>
                 <option value="title">Title</option>
                 <option value="status">Status</option>
                 <option value="type">Employment type</option>
-                <option value="newApps">New applications</option>
-                <option value="totalActive">Total active candidates</option>
-                <option value="created">Created date</option>
-                <option value="updated">Updated date</option>
+                <option value="location">Location</option>
+                <option value="new">New applicants</option>
+                <option value="active">Active candidates</option>
               </select>
               <select
                 v-model="sortDir"
@@ -669,29 +612,6 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
               </select>
             </div>
           </div>
-
-          <!-- Default view mode -->
-          <div>
-            <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Default view mode</label>
-            <div class="flex flex-wrap gap-1.5">
-              <button
-                v-for="opt in viewModeOptions"
-                :key="opt.value"
-                type="button"
-                class="inline-flex items-center gap-1.5 rounded-full px-3 py-1.5 text-xs font-medium transition-colors"
-                :class="viewMode === opt.value
-                  ? 'bg-surface-900 text-white dark:bg-surface-100 dark:text-surface-900'
-                  : 'bg-surface-100 dark:bg-surface-800 text-surface-500 dark:text-surface-400 hover:bg-surface-200 dark:hover:bg-surface-700'"
-                @click="viewMode = opt.value"
-              >
-                <component :is="opt.icon" class="size-3.5" />
-                {{ opt.label }}
-              </button>
-            </div>
-            <p class="text-[11px] text-surface-400 dark:text-surface-500 mt-2">
-              Saved with this view so it opens the way you like.
-            </p>
-          </div>
         </div>
       </FilterDrawer>
 
@@ -702,20 +622,221 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
       >
         <Search class="size-8 text-surface-300 dark:text-surface-600 mx-auto mb-3" />
         <p class="text-sm text-surface-600 dark:text-surface-300 mb-1">No jobs match your search</p>
-        <p class="text-xs text-surface-400 dark:text-surface-500 mb-3">Try a different keyword or clear your filters.</p>
-        <button
-          class="text-sm text-brand-600 hover:text-brand-700 font-medium transition-colors"
-          @click="clearAllFilters"
-        >
-          Clear all filters
-        </button>
+        <p class="text-xs text-surface-400 dark:text-surface-500">Try a different keyword or clear your filters.</p>
       </div>
 
-      <!-- ════════════════════════════════════════════ -->
-      <!--                 LIST VIEW                    -->
-      <!-- ════════════════════════════════════════════ -->
+      <!-- ═══════════════════════════════════
+           TABLE VIEW
+      ════════════════════════════════════ -->
+      <template v-else-if="viewMode === 'table'">
+        <div class="overflow-x-auto rounded-lg border border-surface-200 dark:border-surface-800">
+          <table class="w-full text-sm">
+            <thead>
+              <tr class="bg-surface-50 dark:bg-surface-800/50 border-b border-surface-200 dark:border-surface-800">
+                <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
+                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('title')">
+                    Title
+                    <ArrowUp v-if="sortKey === 'title' && sortDir === 'asc'" class="size-3.5" />
+                    <ArrowDown v-else-if="sortKey === 'title' && sortDir === 'desc'" class="size-3.5" />
+                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
+                  </button>
+                </th>
+                <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
+                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('status')">
+                    Status
+                    <ArrowUp v-if="sortKey === 'status' && sortDir === 'asc'" class="size-3.5" />
+                    <ArrowDown v-else-if="sortKey === 'status' && sortDir === 'desc'" class="size-3.5" />
+                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
+                  </button>
+                </th>
+                <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden sm:table-cell">
+                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('type')">
+                    Type
+                    <ArrowUp v-if="sortKey === 'type' && sortDir === 'asc'" class="size-3.5" />
+                    <ArrowDown v-else-if="sortKey === 'type' && sortDir === 'desc'" class="size-3.5" />
+                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
+                  </button>
+                </th>
+                <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden md:table-cell">
+                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('location')">
+                    Location
+                    <ArrowUp v-if="sortKey === 'location' && sortDir === 'asc'" class="size-3.5" />
+                    <ArrowDown v-else-if="sortKey === 'location' && sortDir === 'desc'" class="size-3.5" />
+                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
+                  </button>
+                </th>
+                <th class="text-center px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
+                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('new')">
+                    New
+                    <ArrowUp v-if="sortKey === 'new' && sortDir === 'asc'" class="size-3.5" />
+                    <ArrowDown v-else-if="sortKey === 'new' && sortDir === 'desc'" class="size-3.5" />
+                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
+                  </button>
+                </th>
+                <th class="text-center px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden sm:table-cell">
+                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('active')">
+                    Active
+                    <ArrowUp v-if="sortKey === 'active' && sortDir === 'asc'" class="size-3.5" />
+                    <ArrowDown v-else-if="sortKey === 'active' && sortDir === 'desc'" class="size-3.5" />
+                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
+                  </button>
+                </th>
+                <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden lg:table-cell">
+                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('created')">
+                    Created
+                    <ArrowUp v-if="sortKey === 'created' && sortDir === 'asc'" class="size-3.5" />
+                    <ArrowDown v-else-if="sortKey === 'created' && sortDir === 'desc'" class="size-3.5" />
+                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
+                  </button>
+                </th>
+              </tr>
+            </thead>
+            <tbody class="divide-y divide-surface-100 dark:divide-surface-800">
+              <tr
+                v-for="j in sortedJobs"
+                :key="j.id"
+                class="group bg-white dark:bg-surface-900 hover:bg-surface-50 dark:hover:bg-surface-800/60 transition-colors cursor-pointer"
+                @click="$router.push(localePath(`/dashboard/jobs/${j.id}`))"
+              >
+                <td class="px-4 py-3">
+                  <div class="flex items-center gap-2">
+                    <NuxtLink
+                      :to="localePath(`/dashboard/jobs/${j.id}`)"
+                      class="font-semibold text-surface-900 dark:text-surface-100 group-hover:text-brand-600 transition-colors truncate max-w-[200px] no-underline"
+                      @click.stop
+                    >
+                      {{ j.title }}
+                    </NuxtLink>
+                    <span
+                      v-if="(j.pipeline?.new ?? 0) > 0"
+                      class="inline-flex items-center justify-center rounded-full bg-warning-100 dark:bg-warning-900/40 text-warning-700 dark:text-warning-400 text-[10px] font-bold px-1.5 py-0.5 shrink-0"
+                    >
+                      {{ j.pipeline.new }} new
+                    </span>
+                  </div>
+                </td>
+                <td class="px-4 py-3">
+                  <span
+                    class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium capitalize"
+                    :class="statusBadgeClasses[j.status] ?? 'bg-surface-100 text-surface-600'"
+                  >
+                    {{ j.status }}
+                  </span>
+                </td>
+                <td class="px-4 py-3 text-surface-500 dark:text-surface-400 hidden sm:table-cell whitespace-nowrap">
+                  {{ typeLabels[j.type] ?? j.type }}
+                </td>
+                <td class="px-4 py-3 text-surface-500 dark:text-surface-400 hidden md:table-cell">
+                  <span v-if="j.location" class="inline-flex items-center gap-1">
+                    <MapPin class="size-3 shrink-0" />
+                    {{ j.location }}
+                  </span>
+                  <span v-else class="text-surface-300 dark:text-surface-600">—</span>
+                </td>
+                <td class="px-4 py-3 text-center">
+                  <span
+                    v-if="(j.pipeline?.new ?? 0) > 0"
+                    class="inline-flex items-center justify-center rounded-full bg-blue-50 dark:bg-blue-950 px-2.5 py-0.5 text-xs font-medium text-blue-700 dark:text-blue-400 tabular-nums"
+                  >
+                    {{ j.pipeline.new }}
+                  </span>
+                  <span v-else class="text-surface-300 dark:text-surface-600">0</span>
+                </td>
+                <td class="px-4 py-3 text-center hidden sm:table-cell">
+                  <span
+                    v-if="totalActive(j.pipeline) > 0"
+                    class="inline-flex items-center justify-center rounded-full bg-brand-50 dark:bg-brand-950 px-2.5 py-0.5 text-xs font-medium text-brand-700 dark:text-brand-400 tabular-nums"
+                  >
+                    {{ totalActive(j.pipeline) }}
+                  </span>
+                  <span v-else class="text-surface-300 dark:text-surface-600">0</span>
+                </td>
+                <td class="px-4 py-3 text-surface-500 dark:text-surface-400 whitespace-nowrap hidden lg:table-cell">
+                  {{ new Date(j.createdAt).toLocaleDateString() }}
+                </td>
+              </tr>
+            </tbody>
+          </table>
+        </div>
+      </template>
+
+      <!-- ═══════════════════════════════════
+           GALLERY VIEW (grid)
+      ════════════════════════════════════ -->
+      <template v-else-if="viewMode === 'gallery'">
+        <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
+          <NuxtLink
+            v-for="j in sortedJobs"
+            :key="j.id"
+            :to="localePath(`/dashboard/jobs/${j.id}`)"
+            class="group rounded-xl border bg-white dark:bg-surface-900 p-4 flex flex-col gap-3 hover:shadow-md transition-all no-underline"
+            :class="(j.pipeline?.new ?? 0) > 0
+              ? 'border-warning-200 dark:border-warning-900/60 hover:border-warning-300 dark:hover:border-warning-800'
+              : 'border-surface-200 dark:border-surface-800 hover:border-surface-300 dark:hover:border-surface-700'"
+          >
+            <!-- Card header: title + status -->
+            <div class="flex items-start justify-between gap-2">
+              <span class="font-semibold text-sm text-surface-900 dark:text-surface-100 group-hover:text-brand-600 dark:group-hover:text-brand-400 transition-colors line-clamp-2 leading-snug">
+                {{ j.title }}
+              </span>
+              <span
+                class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium shrink-0 capitalize mt-0.5"
+                :class="statusBadgeClasses[j.status] ?? 'bg-surface-100 text-surface-600'"
+              >
+                {{ j.status }}
+              </span>
+            </div>
+
+            <!-- Meta: type + location -->
+            <div class="flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-surface-400 dark:text-surface-500">
+              <span>{{ typeLabels[j.type] ?? j.type }}</span>
+              <span v-if="j.location" class="inline-flex items-center gap-1">
+                <MapPin class="size-3 shrink-0" />
+                {{ j.location }}
+              </span>
+            </div>
+
+            <!-- Pipeline mini-stats -->
+            <div class="grid grid-cols-3 gap-1.5 mt-auto">
+              <NuxtLink
+                v-for="stage in stageConfig"
+                :key="stage.key"
+                :to="localePath(`/dashboard/jobs/${j.id}?stage=${stage.key}`)"
+                class="rounded-lg px-1.5 py-1 text-center transition-colors no-underline hover:ring-1 hover:ring-brand-300 dark:hover:ring-brand-700"
+                :class="[stage.bgColor, getStageCount(j.pipeline, stage.key) > 0 ? 'cursor-pointer' : 'opacity-50']"
+                @click.stop
+              >
+                <div class="text-xs font-bold tabular-nums" :class="stage.textColor">
+                  {{ getStageCount(j.pipeline, stage.key) }}
+                </div>
+                <div class="text-[9px] font-medium text-surface-500 dark:text-surface-400 leading-tight">
+                  {{ stage.label }}
+                </div>
+              </NuxtLink>
+            </div>
+
+            <!-- Attention bar -->
+            <div
+              v-if="(j.pipeline?.new ?? 0) > 0"
+              class="flex items-center justify-between gap-2 -mx-4 -mb-4 px-4 py-2 rounded-b-xl bg-warning-50/60 dark:bg-warning-950/30 border-t border-warning-100 dark:border-warning-900/30"
+            >
+              <span class="text-xs font-medium text-warning-700 dark:text-warning-400">
+                {{ j.pipeline.new }} new application{{ j.pipeline.new === 1 ? '' : 's' }}
+              </span>
+              <span class="inline-flex items-center gap-1 text-xs text-brand-600 dark:text-brand-400 font-medium">
+                <Kanban class="size-3" />
+                Review
+              </span>
+            </div>
+          </NuxtLink>
+        </div>
+      </template>
+
+      <!-- ═══════════════════════════════════
+           LIST VIEW
+      ════════════════════════════════════ -->
       <template v-else-if="viewMode === 'list'">
-        <!-- Needs attention section -->
+        <!-- ─── Needs attention section ─── -->
         <div v-if="jobsNeedingAttention.length > 0" class="mb-8">
           <div class="flex items-center gap-2 mb-3 px-1">
             <Bell class="size-4 text-warning-500" />
@@ -733,6 +854,7 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
               :key="j.id"
               class="rounded-xl border border-warning-200 dark:border-warning-900/50 bg-white dark:bg-surface-900 overflow-hidden"
             >
+              <!-- Card header — job info -->
               <div class="px-5 pt-4 pb-3">
                 <div class="flex items-start justify-between mb-2">
                   <div class="min-w-0 flex-1">
@@ -760,6 +882,7 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
                   </div>
                 </div>
 
+                <!-- Stage counts -->
                 <div class="grid grid-cols-3 sm:grid-cols-6 gap-2 mt-3">
                   <NuxtLink
                     v-for="stage in stageConfig"
@@ -778,6 +901,7 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
                 </div>
               </div>
 
+              <!-- Action bar -->
               <div class="flex items-center gap-2 px-5 py-3 bg-warning-50/50 dark:bg-warning-950/20 border-t border-warning-100 dark:border-warning-900/30">
                 <span class="text-xs font-medium text-warning-700 dark:text-warning-400 mr-auto">
                   {{ j.pipeline.new }} new application{{ j.pipeline.new === 1 ? '' : 's' }} to review
@@ -794,7 +918,7 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
           </div>
         </div>
 
-        <!-- All other jobs -->
+        <!-- ─── All other jobs ─── -->
         <div>
           <div v-if="jobsNeedingAttention.length > 0" class="flex items-center gap-2 mb-3 px-1">
             <Briefcase class="size-4 text-surface-400" />
@@ -812,6 +936,7 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
               :key="j.id"
               class="rounded-xl border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 px-5 py-4 hover:border-surface-300 dark:hover:border-surface-700 hover:shadow-sm transition-all"
             >
+              <!-- Job info -->
               <div class="flex items-center gap-2.5 mb-1">
                 <NuxtLink
                   :to="localePath(`/dashboard/jobs/${j.id}`)"
@@ -837,6 +962,7 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
                 </span>
               </div>
 
+              <!-- Stage counts -->
               <div class="grid grid-cols-3 sm:grid-cols-6 gap-2">
                 <NuxtLink
                   v-for="stage in stageConfig"
@@ -858,211 +984,9 @@ const viewModeOptions: { value: ViewMode, label: string, icon: any }[] = [
         </div>
       </template>
 
-      <!-- ════════════════════════════════════════════ -->
-      <!--                GALLERY VIEW                  -->
-      <!-- ════════════════════════════════════════════ -->
-      <template v-else-if="viewMode === 'gallery'">
-        <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
-          <NuxtLink
-            v-for="j in sortedJobs"
-            :key="j.id"
-            :to="localePath(`/dashboard/jobs/${j.id}`)"
-            class="group flex flex-col rounded-xl border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900 overflow-hidden hover:border-brand-300 dark:hover:border-brand-700 hover:shadow-md transition-all no-underline"
-          >
-            <!-- Banner -->
-            <div
-              class="h-20 px-4 py-3 flex items-start justify-between"
-              :class="(j.pipeline?.new ?? 0) > 0
-                ? 'bg-gradient-to-br from-warning-50 to-warning-100 dark:from-warning-950/40 dark:to-warning-900/20'
-                : 'bg-gradient-to-br from-brand-50 to-brand-100/50 dark:from-brand-950/40 dark:to-brand-900/20'"
-            >
-              <Briefcase
-                class="size-5"
-                :class="(j.pipeline?.new ?? 0) > 0 ? 'text-warning-600 dark:text-warning-400' : 'text-brand-600 dark:text-brand-400'"
-              />
-              <span
-                class="inline-flex items-center rounded-full px-2 py-0.5 text-[11px] font-medium capitalize"
-                :class="statusBadgeClasses[j.status] ?? 'bg-surface-100 text-surface-600'"
-              >
-                {{ j.status }}
-              </span>
-            </div>
-
-            <div class="flex-1 px-4 py-3">
-              <h3 class="text-sm font-semibold text-surface-900 dark:text-surface-100 group-hover:text-brand-600 dark:group-hover:text-brand-400 transition-colors line-clamp-2 mb-1">
-                {{ j.title }}
-              </h3>
-              <div class="flex flex-wrap items-center gap-x-3 gap-y-1 text-[11px] text-surface-500 dark:text-surface-400 mb-3">
-                <span>{{ typeLabels[j.type] ?? j.type }}</span>
-                <span v-if="j.location" class="inline-flex items-center gap-1 truncate max-w-[150px]">
-                  <MapPin class="size-3 shrink-0" />
-                  <span class="truncate">{{ j.location }}</span>
-                </span>
-                <span v-if="j.experienceLevel">{{ experienceLabels[j.experienceLevel] }}</span>
-                <span v-if="j.remoteStatus">{{ remoteLabels[j.remoteStatus] }}</span>
-              </div>
-
-              <!-- Pipeline strip -->
-              <div class="grid grid-cols-6 gap-1 mb-3">
-                <div
-                  v-for="stage in stageConfig"
-                  :key="stage.key"
-                  :title="`${stage.label}: ${getStageCount(j.pipeline, stage.key)}`"
-                  class="rounded px-1 py-1 text-center"
-                  :class="[stage.bgColor, getStageCount(j.pipeline, stage.key) > 0 ? '' : 'opacity-50']"
-                >
-                  <div class="text-xs font-bold tabular-nums leading-none" :class="stage.textColor">
-                    {{ getStageCount(j.pipeline, stage.key) }}
-                  </div>
-                </div>
-              </div>
-            </div>
-
-            <div class="px-4 py-2.5 border-t border-surface-100 dark:border-surface-800 flex items-center justify-between text-[11px] text-surface-500 dark:text-surface-400">
-              <span class="inline-flex items-center gap-1">
-                <Users class="size-3" />
-                {{ totalActive(j.pipeline) }} active
-              </span>
-              <span class="inline-flex items-center gap-1">
-                <Calendar class="size-3" />
-                {{ formatDate(j.createdAt) }}
-              </span>
-            </div>
-          </NuxtLink>
-        </div>
-      </template>
-
-      <!-- ════════════════════════════════════════════ -->
-      <!--                 TABLE VIEW                   -->
-      <!-- ════════════════════════════════════════════ -->
-      <template v-else-if="viewMode === 'table'">
-        <div class="overflow-x-auto rounded-lg border border-surface-200 dark:border-surface-800">
-          <table class="w-full text-sm">
-            <thead>
-              <tr class="bg-surface-50 dark:bg-surface-800/50 border-b border-surface-200 dark:border-surface-800">
-                <th class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
-                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('title')">
-                    Title
-                    <ArrowUp v-if="sortKey === 'title' && sortDir === 'asc'" class="size-3.5" />
-                    <ArrowDown v-else-if="sortKey === 'title' && sortDir === 'desc'" class="size-3.5" />
-                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
-                  </button>
-                </th>
-                <th v-if="visibleColumns.status" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
-                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('status')">
-                    Status
-                    <ArrowUp v-if="sortKey === 'status' && sortDir === 'asc'" class="size-3.5" />
-                    <ArrowDown v-else-if="sortKey === 'status' && sortDir === 'desc'" class="size-3.5" />
-                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
-                  </button>
-                </th>
-                <th v-if="visibleColumns.type" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden md:table-cell">
-                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('type')">
-                    Type
-                    <ArrowUp v-if="sortKey === 'type' && sortDir === 'asc'" class="size-3.5" />
-                    <ArrowDown v-else-if="sortKey === 'type' && sortDir === 'desc'" class="size-3.5" />
-                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
-                  </button>
-                </th>
-                <th v-if="visibleColumns.location" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden lg:table-cell">
-                  Location
-                </th>
-                <th v-if="visibleColumns.experience" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden lg:table-cell">
-                  Experience
-                </th>
-                <th v-if="visibleColumns.remote" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden xl:table-cell">
-                  Remote
-                </th>
-                <th v-if="visibleColumns.newApps" class="text-center px-4 py-3 font-medium text-surface-500 dark:text-surface-400">
-                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('newApps')">
-                    New
-                    <ArrowUp v-if="sortKey === 'newApps' && sortDir === 'asc'" class="size-3.5" />
-                    <ArrowDown v-else-if="sortKey === 'newApps' && sortDir === 'desc'" class="size-3.5" />
-                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
-                  </button>
-                </th>
-                <th v-if="visibleColumns.totalActive" class="text-center px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden sm:table-cell">
-                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('totalActive')">
-                    Active
-                    <ArrowUp v-if="sortKey === 'totalActive' && sortDir === 'asc'" class="size-3.5" />
-                    <ArrowDown v-else-if="sortKey === 'totalActive' && sortDir === 'desc'" class="size-3.5" />
-                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
-                  </button>
-                </th>
-                <th v-if="visibleColumns.created" class="text-left px-4 py-3 font-medium text-surface-500 dark:text-surface-400 hidden md:table-cell">
-                  <button class="inline-flex items-center gap-1 hover:text-surface-900 dark:hover:text-surface-100 transition-colors" @click="toggleSort('created')">
-                    Created
-                    <ArrowUp v-if="sortKey === 'created' && sortDir === 'asc'" class="size-3.5" />
-                    <ArrowDown v-else-if="sortKey === 'created' && sortDir === 'desc'" class="size-3.5" />
-                    <ArrowUpDown v-else class="size-3.5 opacity-40" />
-                  </button>
-                </th>
-              </tr>
-            </thead>
-            <tbody class="divide-y divide-surface-100 dark:divide-surface-800">
-              <tr
-                v-for="j in sortedJobs"
-                :key="j.id"
-                class="group bg-white dark:bg-surface-900 hover:bg-surface-50 dark:hover:bg-surface-800/60 transition-colors cursor-pointer"
-                @click="$router.push(localePath(`/dashboard/jobs/${j.id}`))"
-              >
-                <td class="px-4 py-3">
-                  <NuxtLink
-                    :to="localePath(`/dashboard/jobs/${j.id}`)"
-                    class="font-semibold text-surface-900 dark:text-surface-100 group-hover:text-brand-600 transition-colors no-underline"
-                    @click.stop
-                  >
-                    {{ j.title }}
-                  </NuxtLink>
-                </td>
-                <td v-if="visibleColumns.status" class="px-4 py-3">
-                  <span
-                    class="inline-flex items-center rounded-full px-2 py-0.5 text-xs font-medium capitalize whitespace-nowrap"
-                    :class="statusBadgeClasses[j.status] ?? 'bg-surface-100 text-surface-600'"
-                  >
-                    {{ j.status }}
-                  </span>
-                </td>
-                <td v-if="visibleColumns.type" class="px-4 py-3 text-surface-600 dark:text-surface-300 hidden md:table-cell whitespace-nowrap">
-                  {{ typeLabels[j.type] ?? j.type }}
-                </td>
-                <td v-if="visibleColumns.location" class="px-4 py-3 text-surface-500 dark:text-surface-400 hidden lg:table-cell">
-                  <span v-if="j.location" class="inline-flex items-center gap-1.5 truncate max-w-[200px]">
-                    <MapPin class="size-3.5 shrink-0" />
-                    <span class="truncate">{{ j.location }}</span>
-                  </span>
-                  <span v-else class="text-surface-300 dark:text-surface-600">—</span>
-                </td>
-                <td v-if="visibleColumns.experience" class="px-4 py-3 text-surface-600 dark:text-surface-300 hidden lg:table-cell capitalize whitespace-nowrap">
-                  {{ j.experienceLevel ? experienceLabels[j.experienceLevel] : '—' }}
-                </td>
-                <td v-if="visibleColumns.remote" class="px-4 py-3 text-surface-600 dark:text-surface-300 hidden xl:table-cell whitespace-nowrap">
-                  {{ j.remoteStatus ? remoteLabels[j.remoteStatus] : '—' }}
-                </td>
-                <td v-if="visibleColumns.newApps" class="px-4 py-3 text-center">
-                  <span
-                    v-if="(j.pipeline?.new ?? 0) > 0"
-                    class="inline-flex items-center justify-center min-w-[1.5rem] rounded-full px-2 py-0.5 text-xs font-bold bg-blue-50 text-blue-700 dark:bg-blue-950 dark:text-blue-400"
-                  >
-                    {{ j.pipeline.new }}
-                  </span>
-                  <span v-else class="text-surface-300 dark:text-surface-600">0</span>
-                </td>
-                <td v-if="visibleColumns.totalActive" class="px-4 py-3 text-center hidden sm:table-cell tabular-nums text-surface-700 dark:text-surface-300">
-                  {{ totalActive(j.pipeline) }}
-                </td>
-                <td v-if="visibleColumns.created" class="px-4 py-3 text-surface-500 dark:text-surface-400 hidden md:table-cell whitespace-nowrap">
-                  {{ formatDate(j.createdAt) }}
-                </td>
-              </tr>
-            </tbody>
-          </table>
-        </div>
-      </template>
-
       <!-- Total count -->
       <p v-if="!noResults" class="text-xs text-surface-400 pt-4 px-1">
-        <template v-if="hasActiveFilters">
+        <template v-if="search || activeFilterCount > 0">
           Showing {{ filteredJobs.length }} of {{ total }} job{{ total === 1 ? '' : 's' }}
         </template>
         <template v-else>
diff --git a/app/pages/dashboard/timeline.vue b/app/pages/dashboard/timeline.vue
index 5649876e..3bbaf3fc 100644
--- a/app/pages/dashboard/timeline.vue
+++ b/app/pages/dashboard/timeline.vue
@@ -589,7 +589,7 @@ function getEventDescription(item: TimelineItem): string {
 
           <!-- Events for this day, grouped by purpose -->
           <div class="ml-3.5 pl-5 space-y-3 mt-1">
-            <div v-for="section in group.sections" :key="section.jobId ?? section.type" class="rounded-lg border border-surface-150 dark:border-surface-800 bg-white dark:bg-surface-900/60 overflow-hidden">
+            <div v-for="section in group.sections" :key="section.jobId ?? section.type" class="rounded-lg border border-surface-200 dark:border-surface-800 bg-white dark:bg-surface-900/60 overflow-hidden">
               <!-- Section header (collapsible) -->
               <button
                 class="flex items-center gap-2 px-3 py-2 w-full border-b border-surface-100 dark:border-surface-800 bg-surface-50/50 dark:bg-surface-800/40 cursor-pointer hover:bg-surface-100/60 dark:hover:bg-surface-800/60 transition-colors"

From 349ec6a76f2bec70a0b1410e1c8fdd990fa28600 Mon Sep 17 00:00:00 2001
From: JoachimLK <joachim.l.kolle.pers@gmail.com>
Date: Thu, 30 Apr 2026 12:40:19 +0200
Subject: [PATCH 5/9] feat: enhance property management with new color
 variables and update component interactions

---
 app/assets/css/main.css                | 42 ++++++++++++++++++++++++++
 app/components/JobSubNavActions.vue    |  4 +--
 app/components/PropertyBlock.vue       |  4 +--
 app/components/PropertyValueEditor.vue | 11 ++++---
 4 files changed, 53 insertions(+), 8 deletions(-)

diff --git a/app/assets/css/main.css b/app/assets/css/main.css
index d75417e6..503b918c 100644
--- a/app/assets/css/main.css
+++ b/app/assets/css/main.css
@@ -121,6 +121,48 @@
   --color-info-800: oklch(44.3% 0.110 241);
   --color-info-900: oklch(39.1% 0.090 241);
   --color-info-950: oklch(18.0% 0.035 243);
+
+  /* ── Red ─────────────────────────────────────────────────
+     True red — used for property option chips. */
+  --color-red-50:  oklch(97.5% 0.010 25);
+  --color-red-100: oklch(94.0% 0.033 25);
+  --color-red-200: oklch(88.5% 0.070 25);
+  --color-red-300: oklch(80.5% 0.125 25);
+  --color-red-400: oklch(71.0% 0.192 26);
+  --color-red-500: oklch(62.5% 0.238 26);
+  --color-red-600: oklch(54.5% 0.240 26);
+  --color-red-700: oklch(46.5% 0.208 25);
+  --color-red-800: oklch(40.5% 0.172 23);
+  --color-red-900: oklch(35.5% 0.138 20);
+  --color-red-950: oklch(19.0% 0.058 20);
+
+  /* ── Orange ───────────────────────────────────────────────
+     True orange — used for property option chips. */
+  --color-orange-50:  oklch(98.0% 0.015 57);
+  --color-orange-100: oklch(95.0% 0.045 55);
+  --color-orange-200: oklch(90.0% 0.095 54);
+  --color-orange-300: oklch(83.0% 0.155 52);
+  --color-orange-400: oklch(75.5% 0.200 49);
+  --color-orange-500: oklch(70.0% 0.200 47);
+  --color-orange-600: oklch(62.0% 0.190 45);
+  --color-orange-700: oklch(53.0% 0.165 43);
+  --color-orange-800: oklch(46.0% 0.133 41);
+  --color-orange-900: oklch(40.0% 0.103 39);
+  --color-orange-950: oklch(19.0% 0.042 38);
+
+  /* ── Yellow ───────────────────────────────────────────────
+     True yellow — used for property option chips. */
+  --color-yellow-50:  oklch(98.5% 0.020 102);
+  --color-yellow-100: oklch(96.5% 0.062 100);
+  --color-yellow-200: oklch(93.0% 0.122 97);
+  --color-yellow-300: oklch(88.0% 0.175 92);
+  --color-yellow-400: oklch(83.0% 0.200 85);
+  --color-yellow-500: oklch(78.0% 0.197 75);
+  --color-yellow-600: oklch(68.0% 0.185 60);
+  --color-yellow-700: oklch(58.0% 0.168 50);
+  --color-yellow-800: oklch(49.5% 0.138 46);
+  --color-yellow-900: oklch(43.0% 0.108 44);
+  --color-yellow-950: oklch(19.0% 0.046 42);
 }
 
 /* ── Base reset & defaults ──────────────────────────────── */
diff --git a/app/components/JobSubNavActions.vue b/app/components/JobSubNavActions.vue
index bf65ac1b..45ab8faf 100644
--- a/app/components/JobSubNavActions.vue
+++ b/app/components/JobSubNavActions.vue
@@ -272,14 +272,14 @@ function openPropertyEditor(scope: 'org' | 'job') {
                 @click="openPropertyEditor('job')"
               >
                 <Settings2 class="size-3.5 text-surface-400" />
-                Manage Job Properties
+                Manage job-specific properties
               </button>
               <button
                 class="flex w-full cursor-pointer items-center gap-2.5 px-3.5 py-2 text-sm text-surface-700 dark:text-surface-300 hover:bg-surface-50 dark:hover:bg-surface-800/80 transition-colors"
                 @click="openPropertyEditor('org')"
               >
                 <Settings2 class="size-3.5 text-surface-400" />
-                Manage Application Properties
+                Manage org-wide application properties
               </button>
               <template v-if="secondaryJobTransitions.length > 0">
                 <div class="border-t border-surface-100 dark:border-surface-800 my-1.5 mx-2" />
diff --git a/app/components/PropertyBlock.vue b/app/components/PropertyBlock.vue
index 6d5e5135..af6e639e 100644
--- a/app/components/PropertyBlock.vue
+++ b/app/components/PropertyBlock.vue
@@ -150,7 +150,7 @@ function openEditor(scope: 'org' | 'job') {
         class="inline-flex items-center gap-1 rounded px-2 py-1 text-xs text-surface-500 hover:text-surface-800 dark:hover:text-surface-100 hover:bg-surface-100 dark:hover:bg-surface-800 cursor-pointer"
         @click="openEditor('org')"
       >
-        <Plus class="size-3.5" /> Add property
+        <Plus class="size-3.5" /> Add org-wide property
       </button>
       <button
         v-if="jobId && entityType === 'application'"
@@ -158,7 +158,7 @@ function openEditor(scope: 'org' | 'job') {
         class="inline-flex items-center gap-1 rounded px-2 py-1 text-xs text-surface-500 hover:text-surface-800 dark:hover:text-surface-100 hover:bg-surface-100 dark:hover:bg-surface-800 cursor-pointer"
         @click="openEditor('job')"
       >
-        <Settings2 class="size-3.5" /> Manage job properties
+        <Settings2 class="size-3.5" /> Manage job-specific properties
       </button>
     </div>
 
diff --git a/app/components/PropertyValueEditor.vue b/app/components/PropertyValueEditor.vue
index 970d1eda..8cbce2ba 100644
--- a/app/components/PropertyValueEditor.vue
+++ b/app/components/PropertyValueEditor.vue
@@ -178,11 +178,14 @@ const isPopoverType = computed(
   >
     <button
       type="button"
-      :disabled="readOnly || saving"
+      :disabled="readOnly"
       class="flex size-5 cursor-pointer items-center justify-center rounded border transition-colors disabled:cursor-not-allowed"
-      :class="modelValue
-        ? 'bg-brand-600 border-brand-600 hover:bg-brand-700 hover:border-brand-700'
-        : 'border-surface-300 dark:border-surface-600 hover:border-surface-400 dark:hover:border-surface-500'"
+      :class="[
+        modelValue
+          ? 'bg-brand-600 border-brand-600 hover:bg-brand-700 hover:border-brand-700'
+          : 'border-surface-300 dark:border-surface-600 hover:border-surface-400 dark:hover:border-surface-500',
+        saving ? 'pointer-events-none opacity-60' : ''
+      ]"
       @click="emit('update', !modelValue)"
     >
       <Check v-if="modelValue" class="size-3.5 text-white" />

From c827d56f358dc18f0864444dc9ae051629f38d99 Mon Sep 17 00:00:00 2001
From: JoachimLK <joachim.l.kolle.pers@gmail.com>
Date: Thu, 30 Apr 2026 12:50:57 +0200
Subject: [PATCH 6/9] feat: update color classes for property options to
 enhance visual consistency

Co-authored-by: Copilot <copilot@github.com>
---
 app/assets/css/main.css | 43 ++---------------------------------------
 shared/properties.ts    |  8 ++++----
 2 files changed, 6 insertions(+), 45 deletions(-)

diff --git a/app/assets/css/main.css b/app/assets/css/main.css
index 503b918c..99d619f2 100644
--- a/app/assets/css/main.css
+++ b/app/assets/css/main.css
@@ -1,5 +1,6 @@
 @import "tailwindcss";
 @plugin "@tailwindcss/typography";
+@source "../../../shared/properties.ts";
 
 /* ─────────────────────────────────────────────────────────
    Reqcore — Design System
@@ -122,47 +123,7 @@
   --color-info-900: oklch(39.1% 0.090 241);
   --color-info-950: oklch(18.0% 0.035 243);
 
-  /* ── Red ─────────────────────────────────────────────────
-     True red — used for property option chips. */
-  --color-red-50:  oklch(97.5% 0.010 25);
-  --color-red-100: oklch(94.0% 0.033 25);
-  --color-red-200: oklch(88.5% 0.070 25);
-  --color-red-300: oklch(80.5% 0.125 25);
-  --color-red-400: oklch(71.0% 0.192 26);
-  --color-red-500: oklch(62.5% 0.238 26);
-  --color-red-600: oklch(54.5% 0.240 26);
-  --color-red-700: oklch(46.5% 0.208 25);
-  --color-red-800: oklch(40.5% 0.172 23);
-  --color-red-900: oklch(35.5% 0.138 20);
-  --color-red-950: oklch(19.0% 0.058 20);
-
-  /* ── Orange ───────────────────────────────────────────────
-     True orange — used for property option chips. */
-  --color-orange-50:  oklch(98.0% 0.015 57);
-  --color-orange-100: oklch(95.0% 0.045 55);
-  --color-orange-200: oklch(90.0% 0.095 54);
-  --color-orange-300: oklch(83.0% 0.155 52);
-  --color-orange-400: oklch(75.5% 0.200 49);
-  --color-orange-500: oklch(70.0% 0.200 47);
-  --color-orange-600: oklch(62.0% 0.190 45);
-  --color-orange-700: oklch(53.0% 0.165 43);
-  --color-orange-800: oklch(46.0% 0.133 41);
-  --color-orange-900: oklch(40.0% 0.103 39);
-  --color-orange-950: oklch(19.0% 0.042 38);
-
-  /* ── Yellow ───────────────────────────────────────────────
-     True yellow — used for property option chips. */
-  --color-yellow-50:  oklch(98.5% 0.020 102);
-  --color-yellow-100: oklch(96.5% 0.062 100);
-  --color-yellow-200: oklch(93.0% 0.122 97);
-  --color-yellow-300: oklch(88.0% 0.175 92);
-  --color-yellow-400: oklch(83.0% 0.200 85);
-  --color-yellow-500: oklch(78.0% 0.197 75);
-  --color-yellow-600: oklch(68.0% 0.185 60);
-  --color-yellow-700: oklch(58.0% 0.168 50);
-  --color-yellow-800: oklch(49.5% 0.138 46);
-  --color-yellow-900: oklch(43.0% 0.108 44);
-  --color-yellow-950: oklch(19.0% 0.046 42);
+
 }
 
 /* ── Base reset & defaults ──────────────────────────────── */
diff --git a/shared/properties.ts b/shared/properties.ts
index a867d2fb..83e368e9 100644
--- a/shared/properties.ts
+++ b/shared/properties.ts
@@ -145,10 +145,10 @@ export const PROPERTY_COLOR_CLASSES: Record<
   { chip: string; dot: string }
 > = {
   gray: { chip: 'bg-surface-100 text-surface-700 dark:bg-surface-800 dark:text-surface-200', dot: 'bg-surface-400' },
-  red: { chip: 'bg-red-100 text-red-700 dark:bg-red-950 dark:text-red-300', dot: 'bg-red-500' },
-  orange: { chip: 'bg-orange-100 text-orange-700 dark:bg-orange-950 dark:text-orange-300', dot: 'bg-orange-500' },
-  amber: { chip: 'bg-amber-100 text-amber-700 dark:bg-amber-950 dark:text-amber-300', dot: 'bg-amber-500' },
-  yellow: { chip: 'bg-yellow-100 text-yellow-700 dark:bg-yellow-950 dark:text-yellow-300', dot: 'bg-yellow-500' },
+  red: { chip: 'bg-rose-100 text-rose-700 dark:bg-rose-500/20 dark:text-rose-300', dot: 'bg-rose-500' },
+  orange: { chip: 'bg-orange-100 text-orange-700 dark:bg-orange-500/20 dark:text-orange-300', dot: 'bg-orange-500' },
+  amber: { chip: 'bg-amber-100 text-amber-700 dark:bg-amber-500/20 dark:text-amber-300', dot: 'bg-amber-500' },
+  yellow: { chip: 'bg-yellow-100 text-yellow-800 dark:bg-yellow-500/20 dark:text-yellow-300', dot: 'bg-yellow-400' },
   green: { chip: 'bg-green-100 text-green-700 dark:bg-green-950 dark:text-green-300', dot: 'bg-green-500' },
   teal: { chip: 'bg-teal-100 text-teal-700 dark:bg-teal-950 dark:text-teal-300', dot: 'bg-teal-500' },
   blue: { chip: 'bg-blue-100 text-blue-700 dark:bg-blue-950 dark:text-blue-300', dot: 'bg-blue-500' },

From cd7524e4b7d716dc4c732ee88ca60d4c66c91c7e Mon Sep 17 00:00:00 2001
From: JoachimLK <joachim.l.kolle.pers@gmail.com>
Date: Thu, 30 Apr 2026 13:26:16 +0200
Subject: [PATCH 7/9] feat: enhance PropertyFilterBar and PropertySchemaEditor
 with improved element references and state management

Co-authored-by: Copilot <copilot@github.com>
---
 app/components/PropertyFilterBar.vue    |  2 +-
 app/components/PropertySchemaEditor.vue |  9 ++++++++-
 app/components/PropertyValueEditor.vue  |  1 +
 app/pages/dashboard/jobs/[id]/index.vue | 13 ++++++++++++-
 4 files changed, 22 insertions(+), 3 deletions(-)

diff --git a/app/components/PropertyFilterBar.vue b/app/components/PropertyFilterBar.vue
index 326d456b..d1ccfd2f 100644
--- a/app/components/PropertyFilterBar.vue
+++ b/app/components/PropertyFilterBar.vue
@@ -193,7 +193,7 @@ const showableDefs = computed(() => definitions.value)
       <!-- Edit popover -->
       <div
         v-if="editingIdx === idx"
-        ref="editEl"
+        :ref="(el) => { if (editingIdx === idx) editEl.value = el as HTMLElement | null }"
         class="absolute left-0 top-full z-30 mt-1 w-80 max-w-[calc(100vw-2rem)] rounded-lg border border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 p-3 shadow-lg"
       >
         <template v-if="definitionMap.get(f.propertyDefinitionId) as PropertyDefinition">
diff --git a/app/components/PropertySchemaEditor.vue b/app/components/PropertySchemaEditor.vue
index 0aa900f6..6ef98075 100644
--- a/app/components/PropertySchemaEditor.vue
+++ b/app/components/PropertySchemaEditor.vue
@@ -40,7 +40,14 @@ const {
 })
 
 watch(() => props.open, (isOpen) => {
-  if (isOpen) refresh()
+  if (isOpen) {
+    refresh()
+    return
+  }
+  formMode.value = null
+  editingId.value = null
+  formError.value = null
+  confirmDeleteId.value = null
 })
 
 // ─── Form state for create / edit ───
diff --git a/app/components/PropertyValueEditor.vue b/app/components/PropertyValueEditor.vue
index 8cbce2ba..b0cd00b5 100644
--- a/app/components/PropertyValueEditor.vue
+++ b/app/components/PropertyValueEditor.vue
@@ -99,6 +99,7 @@ function cloneDraft(v: unknown): unknown {
 }
 
 function commit(value?: unknown) {
+  if (!editing.value) return
   const next = arguments.length > 0 ? value : draft.value
   editing.value = false
   // Normalize empties for clear-on-save UX
diff --git a/app/pages/dashboard/jobs/[id]/index.vue b/app/pages/dashboard/jobs/[id]/index.vue
index 4fd60d04..cef728c5 100644
--- a/app/pages/dashboard/jobs/[id]/index.vue
+++ b/app/pages/dashboard/jobs/[id]/index.vue
@@ -248,6 +248,17 @@ watch(focusedApplications, () => {
   }
 }, { immediate: true })
 
+// Also clamp when property/score/interview filters change and shrink filteredApplications
+watch(filteredApplications, (apps) => {
+  if (apps.length === 0) {
+    currentIndex.value = 0
+    return
+  }
+  if (currentIndex.value >= apps.length) {
+    currentIndex.value = apps.length - 1
+  }
+})
+
 watch(focusStatus, () => {
   currentIndex.value = 0
   searchTerm.value = ''
@@ -2256,7 +2267,7 @@ function closeDocPreview() {
                     :entity-id="resolvedCurrentApplication.id"
                     :job-id="jobId"
                     :entries="resolvedCurrentApplication.properties ?? []"
-                    @refresh="executeDetailFetch()"
+                    @refresh="executeDetailFetch(); refreshApps()"
                   />
                 </div>
               </div>

From 486d0e148b7a10ba36d59931c776a26ea6b1ee77 Mon Sep 17 00:00:00 2001
From: JoachimLK <joachim.l.kolle.pers@gmail.com>
Date: Thu, 30 Apr 2026 14:03:06 +0200
Subject: [PATCH 8/9] feat: improve edit element reference handling in
 PropertyFilterBar

---
 app/components/PropertyFilterBar.vue | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/app/components/PropertyFilterBar.vue b/app/components/PropertyFilterBar.vue
index d1ccfd2f..a1e1401a 100644
--- a/app/components/PropertyFilterBar.vue
+++ b/app/components/PropertyFilterBar.vue
@@ -127,6 +127,9 @@ function clearAll() {
 
 const editingIdx = ref<number | null>(null)
 const editEl = ref<HTMLElement | null>(null)
+function setEditElRef(el: Element | ComponentPublicInstance | null, filterIdx: number) {
+  if (editingIdx.value === filterIdx) editEl.value = el as HTMLElement | null
+}
 function closeEditOnOutside(e: PointerEvent) {
   if (editingIdx.value === null || !editEl.value) return
   if (!editEl.value.contains(e.target as Node)) editingIdx.value = null
@@ -193,7 +196,7 @@ const showableDefs = computed(() => definitions.value)
       <!-- Edit popover -->
       <div
         v-if="editingIdx === idx"
-        :ref="(el) => { if (editingIdx === idx) editEl.value = el as HTMLElement | null }"
+        :ref="(el) => setEditElRef(el, idx)"
         class="absolute left-0 top-full z-30 mt-1 w-80 max-w-[calc(100vw-2rem)] rounded-lg border border-surface-200 dark:border-surface-700 bg-white dark:bg-surface-900 p-3 shadow-lg"
       >
         <template v-if="definitionMap.get(f.propertyDefinitionId) as PropertyDefinition">

From a5237a54448cc5f6de88e2509d44ee3701e96975 Mon Sep 17 00:00:00 2001
From: JoachimLK <joachim.l.kolle.pers@gmail.com>
Date: Thu, 30 Apr 2026 14:18:58 +0200
Subject: [PATCH 9/9] feat: add column visibility management to Applications
 and Candidates views

Co-authored-by: Copilot <copilot@github.com>
---
 app/pages/dashboard/applications/index.vue | 28 +++++++++++++++++++++-
 app/pages/dashboard/candidates/index.vue   | 28 +++++++++++++++++++++-
 2 files changed, 54 insertions(+), 2 deletions(-)

diff --git a/app/pages/dashboard/applications/index.vue b/app/pages/dashboard/applications/index.vue
index e638aa64..dd003ff9 100644
--- a/app/pages/dashboard/applications/index.vue
+++ b/app/pages/dashboard/applications/index.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { FileText, Search, X, Briefcase, Mail, Clock, ArrowUp, ArrowDown, ArrowUpDown, SlidersHorizontal, Maximize2, Minimize2 } from 'lucide-vue-next'
+import { FileText, Search, X, Briefcase, Mail, Clock, ArrowUp, ArrowDown, ArrowUpDown, SlidersHorizontal, Maximize2, Minimize2, Check } from 'lucide-vue-next'
 
 definePageMeta({
   layout: 'dashboard',
@@ -241,6 +241,7 @@ type ApplicationsViewSettings = {
   propertyFilters: import('~~/shared/properties').PropertyFilter[]
   sortKey: SortKey
   sortDir: SortDir
+  visibleColumns?: Record<string, boolean>
 }
 
 const defaultSettings: ApplicationsViewSettings = {
@@ -249,6 +250,7 @@ const defaultSettings: ApplicationsViewSettings = {
   propertyFilters: [],
   sortKey: 'created',
   sortDir: 'desc',
+  visibleColumns: undefined,
 }
 
 const drawerOpen = ref(false)
@@ -259,6 +261,7 @@ const currentSettings = computed<ApplicationsViewSettings>(() => ({
   propertyFilters: [...propertyFilters.value],
   sortKey: sortKey.value,
   sortDir: sortDir.value,
+  visibleColumns: { ...visibleColumns.value },
 }))
 
 function applySettings(s: ApplicationsViewSettings) {
@@ -267,6 +270,7 @@ function applySettings(s: ApplicationsViewSettings) {
   propertyFilters.value = [...(s.propertyFilters ?? [])]
   sortKey.value = s.sortKey
   sortDir.value = s.sortDir
+  if (s.visibleColumns) visibleColumns.value = { ...defaultColumnVisibility, ...s.visibleColumns }
 }
 
 const {
@@ -296,6 +300,7 @@ function settingsEqual(a: ApplicationsViewSettings, b: ApplicationsViewSettings)
     && a.sortKey === b.sortKey
     && a.sortDir === b.sortDir
     && JSON.stringify(a.propertyFilters ?? []) === JSON.stringify(b.propertyFilters ?? [])
+    && JSON.stringify(a.visibleColumns ?? {}) === JSON.stringify(b.visibleColumns ?? {})
 }
 
 const isDirty = computed(() => {
@@ -493,6 +498,27 @@ const selectedApplicationId = ref<string | null>(null)
           <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Properties</label>
           <PropertyFilterBar v-model="propertyFilters" entity-type="application" />
         </div>
+
+        <!-- Columns -->
+        <div>
+          <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Columns</label>
+          <div class="space-y-1.5">
+            <label
+              v-for="col in applicationColumns.filter(c => !c.required)"
+              :key="col.key"
+              class="flex items-center gap-2.5 cursor-pointer select-none group"
+            >
+              <span
+                class="flex size-4 shrink-0 items-center justify-center rounded border transition-colors"
+                :class="visibleColumns[col.key] ? 'bg-brand-600 border-brand-600 text-white' : 'border-surface-300 dark:border-surface-600'"
+                @click="visibleColumns = { ...visibleColumns, [col.key]: !visibleColumns[col.key] }"
+              >
+                <Check v-if="visibleColumns[col.key]" class="size-3" />
+              </span>
+              <span class="text-sm text-surface-700 dark:text-surface-300 group-hover:text-surface-900 dark:group-hover:text-surface-100 transition-colors">{{ col.label }}</span>
+            </label>
+          </div>
+        </div>
       </div>
     </FilterDrawer>
 
diff --git a/app/pages/dashboard/candidates/index.vue b/app/pages/dashboard/candidates/index.vue
index 13536abd..b4ad0dd4 100644
--- a/app/pages/dashboard/candidates/index.vue
+++ b/app/pages/dashboard/candidates/index.vue
@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { Users, Plus, Search, Mail, Phone, ArrowUp, ArrowDown, ArrowUpDown, SlidersHorizontal, X, StickyNote, Maximize2, Minimize2 } from 'lucide-vue-next'
+import { Users, Plus, Search, Mail, Phone, ArrowUp, ArrowDown, ArrowUpDown, SlidersHorizontal, X, StickyNote, Maximize2, Minimize2, Check } from 'lucide-vue-next'
 
 definePageMeta({
   layout: 'dashboard',
@@ -177,6 +177,7 @@ type CandidatesViewSettings = {
   propertyFilters: import('~~/shared/properties').PropertyFilter[]
   sortKey: SortKey
   sortDir: SortDir
+  visibleColumns?: Record<string, boolean>
 }
 
 const defaultSettings: CandidatesViewSettings = {
@@ -186,6 +187,7 @@ const defaultSettings: CandidatesViewSettings = {
   propertyFilters: [],
   sortKey: 'created',
   sortDir: 'desc',
+  visibleColumns: undefined,
 }
 
 const currentSettings = computed<CandidatesViewSettings>(() => ({
@@ -195,6 +197,7 @@ const currentSettings = computed<CandidatesViewSettings>(() => ({
   propertyFilters: [...propertyFilters.value],
   sortKey: sortKey.value,
   sortDir: sortDir.value,
+  visibleColumns: { ...visibleColumns.value },
 }))
 
 function applySettings(s: CandidatesViewSettings) {
@@ -204,6 +207,7 @@ function applySettings(s: CandidatesViewSettings) {
   propertyFilters.value = [...(s.propertyFilters ?? [])]
   sortKey.value = s.sortKey
   sortDir.value = s.sortDir
+  if (s.visibleColumns) visibleColumns.value = { ...defaultColumnVisibility, ...s.visibleColumns }
 }
 
 const {
@@ -233,6 +237,7 @@ function settingsEqual(a: CandidatesViewSettings, b: CandidatesViewSettings) {
     && a.sortKey === b.sortKey
     && a.sortDir === b.sortDir
     && JSON.stringify(a.propertyFilters ?? []) === JSON.stringify(b.propertyFilters ?? [])
+    && JSON.stringify(a.visibleColumns ?? {}) === JSON.stringify(b.visibleColumns ?? {})
 }
 
 const isDirty = computed(() => {
@@ -420,6 +425,27 @@ const selectedCandidateId = ref<string | null>(null)
           <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Properties</label>
           <PropertyFilterBar v-model="propertyFilters" entity-type="candidate" />
         </div>
+
+        <!-- Columns -->
+        <div>
+          <label class="block text-xs font-semibold uppercase tracking-wide text-surface-500 dark:text-surface-400 mb-2">Columns</label>
+          <div class="space-y-1.5">
+            <label
+              v-for="col in candidateColumns.filter(c => !c.required)"
+              :key="col.key"
+              class="flex items-center gap-2.5 cursor-pointer select-none group"
+            >
+              <span
+                class="flex size-4 shrink-0 items-center justify-center rounded border transition-colors"
+                :class="visibleColumns[col.key] ? 'bg-brand-600 border-brand-600 text-white' : 'border-surface-300 dark:border-surface-600'"
+                @click="visibleColumns = { ...visibleColumns, [col.key]: !visibleColumns[col.key] }"
+              >
+                <Check v-if="visibleColumns[col.key]" class="size-3" />
+              </span>
+              <span class="text-sm text-surface-700 dark:text-surface-300 group-hover:text-surface-900 dark:group-hover:text-surface-100 transition-colors">{{ col.label }}</span>
+            </label>
+          </div>
+        </div>
       </div>
     </FilterDrawer>