From f2d3f5ccd9262ff4b694f35bfd88ff409917eec5 Mon Sep 17 00:00:00 2001
From: Nnaji Benjamin <60315147+Benjtalkshow@users.noreply.github.com>
Date: Thu, 14 May 2026 17:14:24 +0100
Subject: [PATCH 1/4] fix(submissions): improve link validation UX, banner
 display, and error toasts (#547)

- Reconcile frontend link types with backend enum (github, demo, video, document, presentation, other)
- Allow up to 5 "other" links per submission with smart type-picking on Add Link and duplicate guards on type change
- Add 500-character cap and live counter on the optional Introduction field
- Pass banner through initialData on submission edit so the saved banner displays
- Add banner field to ParticipantSubmission so the type compiles
- Set mock-fill participation type from myTeam to avoid INDIVIDUAL submissions while on a team
- Switch submission error toasts to title + description with 8s duration so backend messages are readable
- Update SubmissionLinksTab icon mapping for the new link types
---
 .../hackathons/[slug]/submit/page.tsx         |  1 +
 .../hackathons/submissions/SubmissionForm.tsx | 87 ++++++++++++++++---
 .../SubmissionLinksTab.tsx                    | 20 ++++-
 hooks/hackathon/use-submission.ts             | 15 +++-
 lib/api/hackathons.ts                         |  1 +
 5 files changed, 109 insertions(+), 15 deletions(-)

diff --git a/app/(landing)/hackathons/[slug]/submit/page.tsx b/app/(landing)/hackathons/[slug]/submit/page.tsx
index af22d975..05e12538 100644
--- a/app/(landing)/hackathons/[slug]/submit/page.tsx
+++ b/app/(landing)/hackathons/[slug]/submit/page.tsx
@@ -156,6 +156,7 @@ export default function SubmitProjectPage({
                       category: mySubmission.category,
                       description: mySubmission.description,
                       logo: mySubmission.logo,
+                      banner: mySubmission.banner,
                       videoUrl: mySubmission.videoUrl,
                       introduction: mySubmission.introduction,
                       links: mySubmission.links,
diff --git a/components/hackathons/submissions/SubmissionForm.tsx b/components/hackathons/submissions/SubmissionForm.tsx
index 6f1eeed8..001f8def 100644
--- a/components/hackathons/submissions/SubmissionForm.tsx
+++ b/components/hackathons/submissions/SubmissionForm.tsx
@@ -92,7 +92,10 @@ const baseSubmissionSchema = z.object({
   videoUrl: z
     .union([z.string().url('Please enter a valid URL'), z.literal('')])
     .optional(),
-  introduction: z.string().optional(),
+  introduction: z
+    .string()
+    .max(500, 'Introduction cannot exceed 500 characters')
+    .optional(),
   links: z.array(
     z.object({
       type: z.string(),
@@ -155,12 +158,18 @@ const INITIAL_STEPS: Step[] = [
 const LINK_TYPES = [
   { value: 'github', label: 'GitHub' },
   { value: 'demo', label: 'Demo' },
-  { value: 'website', label: 'Website' },
-  { value: 'documentation', label: 'Documentation' },
+  { value: 'video', label: 'Video' },
+  { value: 'document', label: 'Document' },
+  { value: 'presentation', label: 'Presentation' },
   { value: 'other', label: 'Other' },
 ];
 
-const OTHER_LINK_TYPES = ['demo', 'website', 'documentation', 'other'];
+const OTHER_LINK_TYPES = ['demo', 'video', 'document', 'presentation', 'other'];
+
+const MAX_OTHER_LINKS = 5;
+const FIXED_LINK_TYPES = LINK_TYPES.map(t => t.value).filter(
+  v => v !== 'other'
+);
 
 const isValidUrl = (url: string | undefined): boolean => {
   if (!url || String(url).trim() === '') return false;
@@ -517,6 +526,9 @@ const SubmissionFormContent: React.FC<SubmissionFormContentProps> = ({
   };
 
   const handleFillMockData = () => {
+    const participationType: 'INDIVIDUAL' | 'TEAM' = myTeam
+      ? 'TEAM'
+      : 'INDIVIDUAL';
     const mockData = {
       projectName: 'AI-Powered Task Manager',
       category: categoryOptions[0],
@@ -529,7 +541,7 @@ const SubmissionFormContent: React.FC<SubmissionFormContentProps> = ({
         { type: 'github', url: 'https://github.com/example/ai-task-manager' },
         { type: 'demo', url: 'https://demo.example.com/ai-task-manager' },
       ],
-      participationType: 'INDIVIDUAL' as const,
+      participationType,
     };
 
     form.reset(mockData);
@@ -539,7 +551,27 @@ const SubmissionFormContent: React.FC<SubmissionFormContentProps> = ({
 
   const handleAddLink = () => {
     const currentLinks = form.getValues('links') || [];
-    form.setValue('links', [...currentLinks, { type: 'github', url: '' }], {
+    const usedFixedTypes = new Set(
+      currentLinks.map(l => l.type).filter(t => t !== 'other')
+    );
+    const otherCount = currentLinks.filter(l => l.type === 'other').length;
+
+    const firstUnusedFixed = FIXED_LINK_TYPES.find(t => !usedFixedTypes.has(t));
+
+    let nextType: string;
+    if (firstUnusedFixed) {
+      nextType = firstUnusedFixed;
+    } else if (otherCount < MAX_OTHER_LINKS) {
+      nextType = 'other';
+    } else {
+      toast.error('Cannot add another link', {
+        description: `All fixed link types are used and you have reached the limit of ${MAX_OTHER_LINKS} "Other" links.`,
+        duration: 6000,
+      });
+      return;
+    }
+
+    form.setValue('links', [...currentLinks, { type: nextType, url: '' }], {
       shouldValidate: false,
     });
   };
@@ -582,6 +614,33 @@ const SubmissionFormContent: React.FC<SubmissionFormContentProps> = ({
     value: string
   ) => {
     const currentLinks = form.getValues('links') || [];
+
+    if (field === 'type') {
+      if (value !== 'other') {
+        const isDuplicate = currentLinks.some(
+          (l, i) => i !== index && l.type === value
+        );
+        if (isDuplicate) {
+          toast.error('Duplicate link type', {
+            description: `"${value}" is already used. Each link type can be used at most once. Choose "Other" for additional links.`,
+            duration: 6000,
+          });
+          return;
+        }
+      } else {
+        const otherCount = currentLinks.filter(
+          (l, i) => i !== index && l.type === 'other'
+        ).length;
+        if (otherCount >= MAX_OTHER_LINKS) {
+          toast.error('Too many "Other" links', {
+            description: `You can include at most ${MAX_OTHER_LINKS} "Other" links per submission.`,
+            duration: 6000,
+          });
+          return;
+        }
+      }
+    }
+
     const updatedLinks = [...currentLinks];
     updatedLinks[index] = { ...updatedLinks[index], [field]: value };
     form.setValue('links', updatedLinks, { shouldValidate: true });
@@ -643,7 +702,7 @@ const SubmissionFormContent: React.FC<SubmissionFormContentProps> = ({
       if (requireOtherLinks && !hasValidOtherLink) {
         form.setError('links', {
           message:
-            'At least one additional link (Demo, Website, Documentation, or Other) is required for this hackathon.',
+            'At least one additional link (Demo, Video, Document, Presentation, or Other) is required for this hackathon.',
         });
         return;
       }
@@ -792,7 +851,7 @@ const SubmissionFormContent: React.FC<SubmissionFormContentProps> = ({
       if (requireOtherLinks && !hasValidOtherLink) {
         form.setError('links', {
           message:
-            'At least one additional link (Demo, Website, Documentation, or Other) is required for this hackathon.',
+            'At least one additional link (Demo, Video, Document, Presentation, or Other) is required for this hackathon.',
         });
         setCurrentStep(2);
         updateStepState(2, 'active');
@@ -1346,12 +1405,13 @@ const SubmissionFormContent: React.FC<SubmissionFormContentProps> = ({
                   <FormControl>
                     <Textarea
                       placeholder='Tell us more about your project...'
+                      maxLength={500}
                       className='min-h-[100px] border-gray-700 bg-gray-800/50 text-white placeholder:text-gray-500'
                       {...field}
                     />
                   </FormControl>
                   <FormDescription className='text-gray-400'>
-                    Optional: Additional information about your project
+                    Optional. {field.value?.length || 0} / 500 characters max
                   </FormDescription>
                   <FormMessage />
                 </FormItem>
@@ -1386,12 +1446,17 @@ const SubmissionFormContent: React.FC<SubmissionFormContentProps> = ({
                     {(requireGithub || requireOtherLinks) && (
                       <FormDescription className='text-gray-400'>
                         {requireGithub && requireOtherLinks
-                          ? 'GitHub repository link and at least one additional link (Demo, Website, Documentation, or Other) are required for this hackathon.'
+                          ? 'GitHub repository link and at least one additional link (Demo, Video, Document, Presentation, or Other) are required for this hackathon.'
                           : requireGithub
                             ? 'GitHub repository link is required for this hackathon.'
-                            : 'At least one additional link (Demo, Website, Documentation, or Other) is required for this hackathon.'}
+                            : 'At least one additional link (Demo, Video, Document, Presentation, or Other) is required for this hackathon.'}
                       </FormDescription>
                     )}
+                    <FormDescription className='text-gray-400'>
+                      Each link type can be used at most once. For additional
+                      links, choose &quot;Other&quot; (up to {MAX_OTHER_LINKS}{' '}
+                      allowed).
+                    </FormDescription>
                     {formLinks.length === 0 ? (
                       <p className='text-sm text-gray-400'>
                         No links added. Click "Add Link" to add project links.
diff --git a/components/organization/cards/ReviewSubmissionModal/SubmissionLinksTab.tsx b/components/organization/cards/ReviewSubmissionModal/SubmissionLinksTab.tsx
index d2ad19ae..f7cd4aa0 100644
--- a/components/organization/cards/ReviewSubmissionModal/SubmissionLinksTab.tsx
+++ b/components/organization/cards/ReviewSubmissionModal/SubmissionLinksTab.tsx
@@ -1,7 +1,17 @@
 'use client';
 
 import React from 'react';
-import { ArrowUpRight, Github, Twitter, Globe, Link2 } from 'lucide-react';
+import {
+  ArrowUpRight,
+  Github,
+  Twitter,
+  Globe,
+  Link2,
+  Video,
+  FileText,
+  Presentation,
+  Play,
+} from 'lucide-react';
 import { ScrollArea } from '@/components/ui/scroll-area';
 import { motion } from 'motion/react';
 
@@ -15,6 +25,14 @@ const getIcon = (type: string) => {
       return <Github className='h-5 w-5' />;
     case 'twitter':
       return <Twitter className='h-5 w-5' />;
+    case 'demo':
+      return <Play className='h-5 w-5' />;
+    case 'video':
+      return <Video className='h-5 w-5' />;
+    case 'document':
+      return <FileText className='h-5 w-5' />;
+    case 'presentation':
+      return <Presentation className='h-5 w-5' />;
     case 'website':
       return <Globe className='h-5 w-5' />;
     default:
diff --git a/hooks/hackathon/use-submission.ts b/hooks/hackathon/use-submission.ts
index 87182df1..9014d6ec 100644
--- a/hooks/hackathon/use-submission.ts
+++ b/hooks/hackathon/use-submission.ts
@@ -134,7 +134,10 @@ export function useSubmission({
           'Failed to create submission'
         );
         setError(errorMessage);
-        toast.error(errorMessage);
+        toast.error('Submission failed', {
+          description: errorMessage,
+          duration: 8000,
+        });
         reportError(err, {
           context: 'hackathon-createSubmission',
           hackathonSlugOrId,
@@ -180,7 +183,10 @@ export function useSubmission({
           'Failed to update submission'
         );
         setError(errorMessage);
-        toast.error(errorMessage);
+        toast.error('Update failed', {
+          description: errorMessage,
+          duration: 8000,
+        });
         reportError(err, {
           context: 'hackathon-updateSubmission',
           submissionId,
@@ -214,7 +220,10 @@ export function useSubmission({
           'Failed to delete submission'
         );
         setError(errorMessage);
-        toast.error(errorMessage);
+        toast.error('Delete failed', {
+          description: errorMessage,
+          duration: 8000,
+        });
         throw err;
       } finally {
         setIsSubmitting(false);
diff --git a/lib/api/hackathons.ts b/lib/api/hackathons.ts
index 63cc1125..7aef31cb 100644
--- a/lib/api/hackathons.ts
+++ b/lib/api/hackathons.ts
@@ -702,6 +702,7 @@ export interface ParticipantSubmission {
   category: string;
   description: string;
   logo?: string;
+  banner?: string;
   videoUrl?: string;
   introduction?: string;
   links?: Array<{ type: string; url: string }>;

From 503ec0eadf442cc51476f894ae96deb5d435d493 Mon Sep 17 00:00:00 2001
From: Nnaji Benjamin <60315147+Benjtalkshow@users.noreply.github.com>
Date: Thu, 14 May 2026 23:35:55 +0100
Subject: [PATCH 2/4] fix(submissions): correct logo cropping and remove
 duplicate category badge on submission card (#549)

- Logo overlay on banner uses object-contain so wordmark logos are not cropped
- Render the category badge once instead of twice on the explore submissions card
---
 .../tabs/contents/submissions/SubmissionCard.tsx      | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/app/(landing)/hackathons/[slug]/components/tabs/contents/submissions/SubmissionCard.tsx b/app/(landing)/hackathons/[slug]/components/tabs/contents/submissions/SubmissionCard.tsx
index cb549fbe..c1a65ecf 100644
--- a/app/(landing)/hackathons/[slug]/components/tabs/contents/submissions/SubmissionCard.tsx
+++ b/app/(landing)/hackathons/[slug]/components/tabs/contents/submissions/SubmissionCard.tsx
@@ -113,7 +113,7 @@ const SubmissionCard = ({ submission }: SubmissionCardProps) => {
           <img
             src={logo}
             alt={`${projectName} logo`}
-            className='absolute bottom-3 left-3 h-12 w-12 rounded-lg border-2 border-[#0D0E10] bg-[#0D0E10] object-cover shadow-lg'
+            className='absolute bottom-3 left-3 h-12 w-12 rounded-lg border-2 border-[#0D0E10] bg-[#0D0E10] object-contain shadow-lg'
           />
         )}
       </div>
@@ -130,12 +130,9 @@ const SubmissionCard = ({ submission }: SubmissionCardProps) => {
 
           {/* Tags/Categories */}
           <div className='flex flex-wrap gap-2 pt-2'>
-            <span className='text-primary rounded-md bg-[#232B20]/50 px-2.5 py-1 text-[10px] font-bold tracking-wider uppercase'>
-              {category}
-            </span>
-            {submission.category && (
-              <span className='rounded-md bg-white/5 px-2.5 py-1 text-[10px] font-bold tracking-wider text-gray-400 uppercase'>
-                {submission.category}
+            {category && (
+              <span className='text-primary rounded-md bg-[#232B20]/50 px-2.5 py-1 text-[10px] font-bold tracking-wider uppercase'>
+                {category}
               </span>
             )}
           </div>

From 810bae33b65355e967d7f124bb5477754888907a Mon Sep 17 00:00:00 2001
From: Nnaji Benjamin <60315147+Benjtalkshow@users.noreply.github.com>
Date: Fri, 15 May 2026 03:24:44 +0100
Subject: [PATCH 3/4] feat(blog): add Boundless x Trustless Work hackathon post
 and fit cover images (#551)

- Add content/blog/boundless-launches-first-hackathon-campaign.mdx for the May 13 hackathon launch announcement.
- BlogCard and BlogPostDetails cover images use object-contain so the full banner is visible (previously object-cover cropped wider banners).
- Update SHARE icons on the blog details page from the old brand color #99FF2D to the current brand primary #2eedaa.
---
 components/landing-page/blog/BlogCard.tsx     |   2 +-
 .../landing-page/blog/BlogPostDetails.tsx     |  10 +-
 ...less-launches-first-hackathon-campaign.mdx | 161 ++++++++++++++++++
 3 files changed, 167 insertions(+), 6 deletions(-)
 create mode 100644 content/blog/boundless-launches-first-hackathon-campaign.mdx

diff --git a/components/landing-page/blog/BlogCard.tsx b/components/landing-page/blog/BlogCard.tsx
index 9570d2ca..ebd44dcc 100644
--- a/components/landing-page/blog/BlogCard.tsx
+++ b/components/landing-page/blog/BlogCard.tsx
@@ -24,7 +24,7 @@ const BlogCard = ({ post, onCardClick }: BlogCardProps) => {
             src={post.coverImage}
             alt={post.title}
             fill
-            className='object-cover transition-transform duration-500 group-hover:scale-105'
+            className='object-contain transition-transform duration-500 group-hover:scale-105'
             sizes='(max-width: 768px) 100vw, (max-width: 1200px) 50vw, 33vw'
           />
           {/* Gradient Overlay */}
diff --git a/components/landing-page/blog/BlogPostDetails.tsx b/components/landing-page/blog/BlogPostDetails.tsx
index 43a7fc1c..fe07c03a 100644
--- a/components/landing-page/blog/BlogPostDetails.tsx
+++ b/components/landing-page/blog/BlogPostDetails.tsx
@@ -140,7 +140,7 @@ const BlogPostDetails: React.FC<BlogPostDetailsProps> = ({
                   src={post.coverImage}
                   alt={post.title}
                   fill
-                  className='rounded-lg object-cover'
+                  className='rounded-lg object-contain'
                   priority
                   sizes='(max-width: 768px) 100vw, (max-width: 1200px) 80vw, 70vw'
                 />
@@ -191,7 +191,7 @@ const BlogPostDetails: React.FC<BlogPostDetailsProps> = ({
                   >
                     <path
                       d='M1.5 16.5L7.79032 10.2097M16.5 1.5L10.2097 7.79032M10.2097 7.79032L5.66667 1.5H1.5L7.79032 10.2097M10.2097 7.79032L16.5 16.5H12.3333L7.79032 10.2097'
-                      stroke='#99FF2D'
+                      stroke='#2eedaa'
                       strokeWidth='1.5'
                       strokeLinecap='round'
                       strokeLinejoin='round'
@@ -215,7 +215,7 @@ const BlogPostDetails: React.FC<BlogPostDetailsProps> = ({
                     >
                       <path
                         d='M6.68359 6.56555C6.3753 6.56555 6.08615 6.65168 5.83398 6.80286C5.86071 6.73663 5.8898 6.67102 5.91797 6.60461L6.68359 6.48743M6.68359 6.56555V6.48743M6.68359 6.56555L6.83008 6.57336C6.84126 6.53557 6.85246 6.49776 6.86426 6.46008L6.68359 6.48743M6.68359 6.56555V6.48743M13.3291 6.56555L13.5156 6.57629C13.75 6.60287 13.9698 6.68028 14.168 6.79602C14.1413 6.72999 14.1158 6.66346 14.0879 6.59778L13.3291 6.48352M13.3291 6.56555V6.48352M13.3291 6.56555V6.48352M13.3291 6.56555C13.2818 6.56555 13.2348 6.56939 13.1885 6.57336C13.1772 6.53503 13.1672 6.49633 13.1553 6.45813L13.3291 6.48352'
-                        stroke='#99FF2D'
+                        stroke='#2eedaa'
                         strokeWidth='10'
                       />
                     </svg>
@@ -235,7 +235,7 @@ const BlogPostDetails: React.FC<BlogPostDetailsProps> = ({
                   >
                     <path
                       d='M9.98721 11.8403L12.6883 14.9113C13.6891 16.0491 14.1895 16.618 14.7133 16.4795C15.2371 16.341 15.4167 15.5923 15.7759 14.0949L17.7684 5.78825C18.3217 3.48194 18.5983 2.32878 17.9834 1.76C17.3685 1.19122 16.3027 1.61437 14.1711 2.46068L4.28165 6.38707C2.57679 7.06395 1.72436 7.40239 1.67024 7.98403C1.6647 8.04353 1.66461 8.10344 1.66996 8.16295C1.7223 8.74477 2.57369 9.08605 4.27647 9.7686C5.048 10.0779 5.43377 10.2325 5.71035 10.5286C5.74145 10.5619 5.77135 10.5964 5.8 10.632C6.05484 10.9486 6.16359 11.3642 6.38109 12.1954L6.78812 13.7508C6.99977 14.5596 7.10559 14.964 7.38275 15.0191C7.65991 15.0743 7.90122 14.7389 8.38384 14.0683L9.98721 11.8403ZM9.98721 11.8403L9.72237 11.5642C9.42097 11.2501 9.27026 11.0931 9.27026 10.8979C9.27026 10.7027 9.42097 10.5457 9.72237 10.2315L12.6998 7.12841'
-                      stroke='#99FF2D'
+                      stroke='#2eedaa'
                       strokeWidth='1.5'
                       strokeLinecap='round'
                       strokeLinejoin='round'
@@ -259,7 +259,7 @@ const BlogPostDetails: React.FC<BlogPostDetailsProps> = ({
                     >
                       <path
                         d='M7.49935 14.1666H5.83268C3.5315 14.1666 1.66602 12.3012 1.66602 9.99998C1.66602 7.69879 3.5315 5.83331 5.83268 5.83331H7.49935M12.4993 14.1666H14.166C16.4672 14.1666 18.3327 12.3012 18.3327 9.99998C18.3327 7.69879 16.4672 5.83331 14.166 5.83331H12.4993M5.83268 9.99998L14.166 9.99998'
-                        stroke='#99FF2D'
+                        stroke='#2eedaa'
                         strokeWidth='1.4'
                         strokeLinecap='round'
                         strokeLinejoin='round'
diff --git a/content/blog/boundless-launches-first-hackathon-campaign.mdx b/content/blog/boundless-launches-first-hackathon-campaign.mdx
new file mode 100644
index 00000000..4e17d99b
--- /dev/null
+++ b/content/blog/boundless-launches-first-hackathon-campaign.mdx
@@ -0,0 +1,161 @@
+---
+title: 'Boundless Launches Its First Hackathon Campaign'
+excerpt: 'Boundless x Trustless Work, our first-ever hackathon, runs from May 13 to May 16, 2026. Four days of building escrow-powered products on Stellar, with workshops, mentorship, a $1,400 prize pool, and a physical finale in Nsukka, Nigeria.'
+coverImage: 'https://res.cloudinary.com/danuy5rqb/image/upload/v1778798556/Image_2_sueerh.png'
+publishedAt: '2026-05-13'
+author:
+  name: 'Boundless Team'
+  image: ''
+categories: ['Hackathon', 'Web3', 'Stellar']
+tags:
+  [
+    'hackathon',
+    'trustless-work',
+    'stellar',
+    'web3',
+    'defi',
+    'escrow',
+    'builders',
+  ]
+readingTime: 5
+isFeatured: true
+seoTitle: 'Boundless Launches Its First Hackathon: Boundless x Trustless Work'
+seoDescription: 'The Boundless x Trustless Work Hackathon kicks off May 13 to May 16, 2026. Build escrow-powered Web3 products on Stellar with the Trustless Work Starter Kit. $1,400 prize pool, workshops, and a physical finale in Nsukka, Nigeria.'
+---
+
+# Boundless Launches Its First Hackathon Campaign
+
+Boundless is officially launching its first-ever hackathon today, **May 13th, 2026**.
+
+In collaboration with **[Trustless Work](https://www.trustlesswork.com/)**, we are bringing together builders, creatives, developers, and thinkers for a multi-day hybrid event focused on brainstorming and building ideas that will revolutionize Web3 and DeFi.
+
+The Boundless x [Trustless Work](https://www.trustlesswork.com/) Hackathon is designed to encourage experimentation, collaboration, and real-world problem-solving. Participants will have the opportunity to ideate and build projects on the **Stellar** ecosystem.
+
+---
+
+## Why Boundless
+
+The next wave of the internet is being built in Web3.
+
+Every day, new ideas emerge across payments, coordination, finance, and digital ownership. But for many builders, the gap between ideation and execution still remains difficult to cross.
+
+At Boundless, our mission is to help bridge that gap.
+
+We believe the next generation of Web3 products should be built on systems that prioritize **transparency, verification, efficiency, and seamless global collaboration** from the start.
+
+The Boundless x [Trustless Work](https://www.trustlesswork.com/) Hackathon is designed to help developers explore what that future could look like in practice.
+
+---
+
+## Build Faster with the [Trustless Work](https://www.trustlesswork.com/) Starter Kit
+
+The focus of this hack is to encourage innovative thinking and unique real-world problem-solving techniques. That is why we are partnering with **[Trustless Work](https://www.trustlesswork.com/)**, so teams can focus on:
+
+- Product design
+- Workflow architecture
+- User experience
+- Integrations
+- Application-level innovation
+
+[Trustless Work](https://www.trustlesswork.com/) allows teams to implement escrow systems from start to finish in a very short time. This is also why we have limited use cases to products that require escrow as the core infrastructure.
+
+To help participants move quickly from ideation to implementation, developers will have access to the **[Trustless Work Builder Starter Kit](https://www.trustlesswork.com/)**.
+
+The hackathon will also include workshops, mentorship sessions, and technical support from the team at [Trustless Work](https://www.trustlesswork.com/) to help participants navigate implementation challenges and refine their projects.
+
+---
+
+## Event Details
+
+The hackathon is a **hybrid event** taking place from **May 13th to May 16th**. The first three days will be held virtually, while the final day will be a physical event.
+
+Here is the breakdown of what to expect each day:
+
+- **May 13:** Welcome Ceremony, Onboarding, and Team Selection
+- **May 14:** Build Day Two
+- **May 15:** Build Day Three
+- **May 16:** Project Demos, Judging, and Awards
+
+Activities throughout the hackathon will include:
+
+- Workshops
+- Office hours
+
+The physical event will include:
+
+- Project showcases
+- Technical presentations
+- Judging sessions
+- Winner announcements
+- Award presentations
+
+**Other Details**
+
+- **Venue:** Block Hive, Nsukka, Enugu State, Nigeria
+- **Registration Deadline:** May 15th
+
+---
+
+## Prize Pool
+
+The Boundless x [Trustless Work](https://www.trustlesswork.com/) Hackathon will reward outstanding technical execution, product thinking, and real-world usability across categories signifying our judging criteria.
+
+**Main Winners**
+
+- 1st Place: **$500**
+- 2nd Place: **$300**
+- 3rd Place: **$200**
+
+**Special Awards**
+
+- Best UI/UX Design: **$100**
+- Best Real-World Use Case: **$100**
+- Best Technical Implementation: **$100**
+- Most Innovative Idea: **$100**
+- Best Use of [Trustless Work](https://www.trustlesswork.com/): **$100**
+
+---
+
+## Who Can Participate?
+
+The hackathon is open to **developers, designers, product builders**, and anyone interested in building internet-native coordination systems.
+
+Participants may hack alone or form teams of **2 to 5 members** across the participant scope. Participants do not need to arrive with a fully developed idea.
+
+---
+
+## What Should You Build?
+
+Participants are expected to build a focused product using [Trustless Work](https://www.trustlesswork.com/) primitives. The goal is not to build another generic escrow platform, but to create specific applications that solve real problems.
+
+Some possible directions include:
+
+- Freelance and milestone-based work platforms
+- Marketplace and e-commerce escrow systems
+- Grant distribution and bounty management tools
+- Crowdfunding and pre-order infrastructure
+- Rental agreements and security deposit flows
+- P2P stablecoin exchange applications
+- Trade finance coordination tools
+- AI agent payment and workflow systems
+
+Participants will also have flexible integration options depending on their preferred workflow. Teams can move quickly with low-code tooling, build with prebuilt components, or work directly with **SDKs and APIs** for more advanced customization and deeper product control.
+
+---
+
+## Join Us
+
+To build with us, register your intent: **[Register for the Hackathon](https://www.boundlessfi.xyz/hackathons/boundless-trustless-work-hackathon)**.
+
+Join our community to stay in the loop:
+
+- **[Discord](https://discord.gg/fP8chNpX)**
+- **[X (formerly Twitter)](https://x.com/boundless_fi)**
+
+---
+
+## Starter Pack
+
+- Explore the **[Trustless Work Starter Kit](https://www.trustlesswork.com/)**
+
+Build the future with Boundless.

From b34926a7fd7541fb4e86f5860b058afbb09d8702 Mon Sep 17 00:00:00 2001
From: Collins Ikechukwu <collinschristroa@gmail.com>
Date: Fri, 15 May 2026 07:39:26 +0100
Subject: [PATCH 4/4] feat(judge): dedicated judge portal, organizer
 invitations, completeness gate UX (#550)

* feat: implement judge portal with submission evaluation, invitations, and score calculation workflows

* feat: add countdown banner, support read-only score sliders, and integrate submission disqualification into grading modal

---------

Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 .../components/header/ActionButtons.tsx       |  20 +-
 .../hackathons/[hackathonId]/judging/page.tsx | 435 +++++++----
 .../[hackathonId]/participants/page.tsx       |   5 +-
 app/auth/check-email/page.tsx                 |  18 +
 app/auth/verify-email/page.tsx                |  18 +-
 app/globals.css                               |  49 ++
 app/judge/[hackathonId]/page.tsx              | 254 +++++++
 app/judge/[hackathonId]/results/page.tsx      | 206 ++++++
 .../submissions/[submissionId]/page.tsx       | 676 ++++++++++++++++++
 app/judge/[hackathonId]/submissions/page.tsx  | 401 +++++++++++
 app/judge/invitations/[token]/page.tsx        | 264 +++++++
 app/judge/invitations/page.tsx                | 104 +++
 app/judge/layout.tsx                          |  14 +
 app/judge/page.tsx                            | 255 +++++++
 components/auth/SignupForm.tsx                |  23 +-
 components/judge/CountdownBanner.tsx          |  92 +++
 components/judge/DeadlineBadge.tsx            |  61 ++
 components/judge/HackathonBanner.tsx          |  72 ++
 components/judge/JudgePortalShell.tsx         |  97 +++
 components/judge/KeyboardShortcuts.tsx        |  99 +++
 components/judge/ProgressRing.tsx             |  86 +++
 components/judge/ScoreSlider.tsx              | 170 +++++
 components/judge/utils.ts                     |  92 +++
 .../GradeSubmissionModal/ScoringSection.tsx   |  14 +-
 .../GradeSubmissionModal/TotalScoreCard.tsx   |   2 +-
 .../cards/GradeSubmissionModal/index.tsx      |  60 +-
 .../useScoreCalculation.ts                    |  54 +-
 .../GradeSubmissionModal/useScoreForm.ts      |   4 +-
 .../useSubmissionScores.ts                    |   2 +-
 components/organization/cards/Participant.tsx |   3 +-
 .../hackathons/judging/InviteJudgeDialog.tsx  | 175 +++++
 .../judging/OrganizerJudgesPanel.tsx          | 419 +++++++++++
 hooks/judge/use-judge-queries.ts              | 236 ++++++
 hooks/judge/use-organizer-invitations.ts      | 126 ++++
 lib/api/hackathons.ts                         |   7 +-
 lib/api/hackathons/judging.ts                 |  45 +-
 lib/api/judge.ts                              | 408 +++++++++++
 lib/utils/hackathon-form-transforms.ts        |   3 +
 types/hackathon/core.ts                       |   4 +-
 39 files changed, 4879 insertions(+), 194 deletions(-)
 create mode 100644 app/judge/[hackathonId]/page.tsx
 create mode 100644 app/judge/[hackathonId]/results/page.tsx
 create mode 100644 app/judge/[hackathonId]/submissions/[submissionId]/page.tsx
 create mode 100644 app/judge/[hackathonId]/submissions/page.tsx
 create mode 100644 app/judge/invitations/[token]/page.tsx
 create mode 100644 app/judge/invitations/page.tsx
 create mode 100644 app/judge/layout.tsx
 create mode 100644 app/judge/page.tsx
 create mode 100644 components/judge/CountdownBanner.tsx
 create mode 100644 components/judge/DeadlineBadge.tsx
 create mode 100644 components/judge/HackathonBanner.tsx
 create mode 100644 components/judge/JudgePortalShell.tsx
 create mode 100644 components/judge/KeyboardShortcuts.tsx
 create mode 100644 components/judge/ProgressRing.tsx
 create mode 100644 components/judge/ScoreSlider.tsx
 create mode 100644 components/judge/utils.ts
 create mode 100644 components/organization/hackathons/judging/InviteJudgeDialog.tsx
 create mode 100644 components/organization/hackathons/judging/OrganizerJudgesPanel.tsx
 create mode 100644 hooks/judge/use-judge-queries.ts
 create mode 100644 hooks/judge/use-organizer-invitations.ts
 create mode 100644 lib/api/judge.ts

diff --git a/app/(landing)/hackathons/[slug]/components/header/ActionButtons.tsx b/app/(landing)/hackathons/[slug]/components/header/ActionButtons.tsx
index 236d204a..bb64c87f 100644
--- a/app/(landing)/hackathons/[slug]/components/header/ActionButtons.tsx
+++ b/app/(landing)/hackathons/[slug]/components/header/ActionButtons.tsx
@@ -43,6 +43,18 @@ const ActionButtons = () => {
       )
     : false;
 
+  // Server-derived role for the current viewer. Organizers and assigned
+  // judges cannot join their own hackathon; surfacing the role lets us
+  // show the right copy instead of a broken join button.
+  const viewerRole = (hackathon as any)?.viewerRole as
+    | 'organizer'
+    | 'judge'
+    | 'participant'
+    | 'guest'
+    | undefined;
+  const hasConflictingRole =
+    viewerRole === 'organizer' || viewerRole === 'judge';
+
   const handleJoin = withAuth(async () => {
     try {
       await joinMutation.mutateAsync();
@@ -86,7 +98,13 @@ const ActionButtons = () => {
 
   return (
     <div className='flex w-full flex-col gap-3 md:w-auto md:flex-row md:items-center'>
-      {!isParticipant ? (
+      {hasConflictingRole ? (
+        <div className='flex h-12 w-full items-center justify-center rounded-xl border border-white/10 bg-white/5 px-8 text-sm font-medium text-gray-300 md:w-auto'>
+          {viewerRole === 'organizer'
+            ? 'You are managing this hackathon'
+            : 'You are judging this hackathon'}
+        </div>
+      ) : !isParticipant ? (
         <BoundlessButton
           className='s d bg-primary hover:bg-primary/90 h-12 w-full rounded-xl px-8 font-bold text-black disabled:bg-white/5 disabled:text-white/20 md:w-auto'
           icon={!isRegistrationClosed && <IconUserPlus size={20} />}
diff --git a/app/(landing)/organizations/[id]/hackathons/[hackathonId]/judging/page.tsx b/app/(landing)/organizations/[id]/hackathons/[hackathonId]/judging/page.tsx
index 8898ae80..a14da04e 100644
--- a/app/(landing)/organizations/[id]/hackathons/[hackathonId]/judging/page.tsx
+++ b/app/(landing)/organizations/[id]/hackathons/[hackathonId]/judging/page.tsx
@@ -14,10 +14,12 @@ import {
   getJudgingResults,
   getJudgingWinners,
   publishJudgingResults,
+  getJudgingCompleteness,
   type JudgingCriterion,
   type JudgingSubmission,
   type JudgingResult,
   type AggregatedJudgingResults,
+  type JudgingCompletenessPreview,
 } from '@/lib/api/hackathons/judging';
 import { getSubmissionDetails } from '@/lib/api/hackathons/participants';
 import { getOrganizationMembers } from '@/lib/api/organization';
@@ -51,6 +53,7 @@ import { reportError, reportMessage } from '@/lib/error-reporting';
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
 import { JudgingCriteriaList } from '@/components/organization/hackathons/judging/JudgingCriteriaList';
 import JudgingResultsTable from '@/components/organization/hackathons/judging/JudgingResultsTable';
+import { OrganizerJudgesPanel } from '@/components/organization/hackathons/judging/OrganizerJudgesPanel';
 import { Input } from '@/components/ui/input';
 import {
   AlertDialog,
@@ -122,6 +125,10 @@ export default function JudgingPage() {
   const CACHE_TIMEOUT = 30000; // 30 seconds
 
   const [isPublishDialogOpen, setIsPublishDialogOpen] = useState(false);
+  const [completeness, setCompleteness] =
+    useState<JudgingCompletenessPreview | null>(null);
+  const [completenessLoading, setCompletenessLoading] = useState(false);
+  const [acceptPartial, setAcceptPartial] = useState(false);
   const [judgeToRemove, setJudgeToRemove] = useState<string | null>(null);
 
   const canManageJudges =
@@ -465,21 +472,52 @@ export default function JudgingPage() {
   const handlePublishResults = async () => {
     setIsPublishing(true);
     try {
-      const res = await publishJudgingResults(organizationId, hackathonId);
+      const res = await publishJudgingResults(organizationId, hackathonId, {
+        acceptPartial,
+      });
       if (res.success) {
         toast.success('Results published successfully!');
+        setIsPublishDialogOpen(false);
+        setAcceptPartial(false);
         fetchResults(true);
         fetchWinners(true);
       } else {
         toast.error(res.message || 'Failed to publish results');
       }
     } catch (error: any) {
-      toast.error(error.message || 'Failed to publish results');
+      toast.error(error?.message || 'Failed to publish results');
     } finally {
       setIsPublishing(false);
     }
   };
 
+  // Pull the completeness snapshot every time the dialog opens so the
+  // organizer sees fresh numbers (a judge may have submitted scores
+  // since the page loaded).
+  useEffect(() => {
+    if (!isPublishDialogOpen) {
+      setAcceptPartial(false);
+      return;
+    }
+    let cancelled = false;
+    setCompletenessLoading(true);
+    getJudgingCompleteness(organizationId, hackathonId)
+      .then(res => {
+        if (cancelled) return;
+        if (res.success && res.data) setCompleteness(res.data);
+      })
+      .catch(() => {
+        // Non-fatal: the dialog still works, organizer just won't see
+        // the incompleteness summary.
+      })
+      .finally(() => {
+        if (!cancelled) setCompletenessLoading(false);
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, [isPublishDialogOpen, organizationId, hackathonId]);
+
   // Use pre-calculated statistics from the API if available, otherwise fallback to local calculation
   const gradedCount = judgingSummary
     ? judgingSummary.submissionsScoredCount
@@ -756,169 +794,185 @@ export default function JudgingPage() {
             </TabsContent>
 
             <TabsContent value='judges' className='mt-6'>
-              <div className='grid grid-cols-1 gap-8 lg:grid-cols-2'>
-                {/* Current Judges List */}
-                <div className='bg-background/8 h-fit rounded-lg border border-gray-900 p-6'>
-                  <h3 className='mb-4 flex items-center gap-2 text-lg font-medium'>
-                    Current Judges
-                    {isRefreshingJudges && (
-                      <Loader2 className='h-4 w-4 animate-spin text-gray-500' />
-                    )}
-                  </h3>
-                  <div className='space-y-4'>
-                    {currentJudges.length === 0 ? (
-                      <EmptyState
-                        title='No Judges Assigned'
-                        description='No judges assigned yet.'
-                        type='compact'
-                        className='py-8'
-                      />
-                    ) : (
-                      currentJudges.map((judge: any, index: number) => (
-                        <div
-                          key={judge.id}
-                          className='flex items-center justify-between rounded-md border border-white/10 bg-white/5 p-3'
-                        >
-                          <div className='flex items-center gap-3'>
-                            <div className='h-8 w-8 overflow-hidden rounded-full bg-gray-800'>
-                              {judge.image ? (
-                                <img
-                                  src={judge.image}
-                                  alt=''
-                                  className='h-full w-full object-cover'
-                                />
-                              ) : (
-                                <div className='flex h-full w-full items-center justify-center text-xs font-bold text-gray-500'>
-                                  {judge.name?.[0] || '?'}
-                                </div>
-                              )}
-                            </div>
-                            <div>
-                              <p className='text-sm font-medium'>
-                                {judge.name}
-                              </p>
-                              <p className='text-xs text-gray-500'>
-                                Judge {index + 1}
-                              </p>
-                            </div>
-                          </div>
-                          {canManageJudges && (
-                            <Button
-                              variant='ghost'
-                              size='sm'
-                              className='text-red-400 hover:bg-red-400/10 hover:text-red-300'
-                              onClick={() =>
-                                setJudgeToRemove(judge.userId || judge.id)
-                              }
-                            >
-                              Remove
-                            </Button>
-                          )}
-                        </div>
-                      ))
-                    )}
-                  </div>
-                </div>
-
-                {/* Org Members List - Only visible to admin/owner */}
-                {canManageJudges && (
+              <OrganizerJudgesPanel
+                organizationId={organizationId}
+                hackathonId={hackathonId}
+                currentJudges={currentJudges}
+                isRefreshingJudges={isRefreshingJudges}
+                canManage={canManageJudges}
+                onRemoveJudge={userId => setJudgeToRemove(userId)}
+                onJudgesChanged={fetchJudges}
+              />
+              {/* Legacy org-members picker — superseded by email invitations.
+                  Kept hidden behind a flag so we can re-surface it if a
+                  power-user organizer asks for the direct-add path. */}
+              {false && (
+                <div className='grid grid-cols-1 gap-8 lg:grid-cols-2'>
+                  {/* Current Judges List */}
                   <div className='bg-background/8 h-fit rounded-lg border border-gray-900 p-6'>
-                    <div className='flex flex-col gap-4'>
-                      <h3 className='text-lg font-medium'>
-                        Add from Organization Members
-                      </h3>
-                      <div className='relative'>
-                        <Search className='absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 text-gray-500' />
-                        <Input
-                          placeholder='Search members by name or email...'
-                          className='focus:ring-primary border-gray-900 bg-black pl-10 text-sm'
-                          value={memberSearchTerm}
-                          onChange={(e: React.ChangeEvent<HTMLInputElement>) =>
-                            setMemberSearchTerm(e.target.value)
-                          }
+                    <h3 className='mb-4 flex items-center gap-2 text-lg font-medium'>
+                      Current Judges
+                      {isRefreshingJudges && (
+                        <Loader2 className='h-4 w-4 animate-spin text-gray-500' />
+                      )}
+                    </h3>
+                    <div className='space-y-4'>
+                      {currentJudges.length === 0 ? (
+                        <EmptyState
+                          title='No Judges Assigned'
+                          description='No judges assigned yet.'
+                          type='compact'
+                          className='py-8'
                         />
-                      </div>
-                      <p className='text-xs text-gray-500'>
-                        Select members from your organization to assign them as
-                        judges.
-                      </p>
-                    </div>
-                    <div className='custom-scrollbar mt-6 max-h-[400px] space-y-3 overflow-y-auto pr-2'>
-                      {orgMembers
-                        .filter(m => {
-                          const search = memberSearchTerm.toLowerCase();
-                          return (
-                            m.name?.toLowerCase().includes(search) ||
-                            m.email?.toLowerCase().includes(search) ||
-                            m.username?.toLowerCase().includes(search)
-                          );
-                        })
-                        .map((member: any) => {
-                          const isAlreadyJudge = currentJudges.some(
-                            j => j.id === member.id || j.userId === member.id
-                          );
-                          return (
-                            <div
-                              key={member.id}
-                              className='flex items-center justify-between rounded-md border border-white/5 bg-white/5 p-3 transition-colors hover:bg-white/10'
-                            >
-                              <div className='flex items-center gap-3'>
-                                <div className='h-8 w-8 overflow-hidden rounded-full bg-gray-800'>
-                                  {member.image ? (
-                                    <img
-                                      src={member.image}
-                                      alt=''
-                                      className='h-full w-full object-cover'
-                                    />
-                                  ) : (
-                                    <div className='flex h-full w-full items-center justify-center text-xs font-bold text-gray-500'>
-                                      {member.name?.[0] ||
-                                        member.username?.[0] ||
-                                        '?'}
-                                    </div>
-                                  )}
-                                </div>
-                                <div>
-                                  <p className='text-sm font-medium'>
-                                    {member.name || member.username}
-                                  </p>
-                                  <p className='text-xs text-gray-500'>
-                                    {member.email}
-                                  </p>
-                                </div>
+                      ) : (
+                        currentJudges.map((judge: any, index: number) => (
+                          <div
+                            key={judge.id}
+                            className='flex items-center justify-between rounded-md border border-white/10 bg-white/5 p-3'
+                          >
+                            <div className='flex items-center gap-3'>
+                              <div className='h-8 w-8 overflow-hidden rounded-full bg-gray-800'>
+                                {judge.image ? (
+                                  <img
+                                    src={judge.image}
+                                    alt=''
+                                    className='h-full w-full object-cover'
+                                  />
+                                ) : (
+                                  <div className='flex h-full w-full items-center justify-center text-xs font-bold text-gray-500'>
+                                    {judge.name?.[0] || '?'}
+                                  </div>
+                                )}
+                              </div>
+                              <div>
+                                <p className='text-sm font-medium'>
+                                  {judge.name}
+                                </p>
+                                <p className='text-xs text-gray-500'>
+                                  Judge {index + 1}
+                                </p>
                               </div>
+                            </div>
+                            {canManageJudges && (
                               <Button
+                                variant='ghost'
                                 size='sm'
-                                variant={isAlreadyJudge ? 'outline' : 'default'}
-                                className={
-                                  isAlreadyJudge
-                                    ? 'cursor-not-allowed border-gray-800 opacity-50'
-                                    : ''
-                                }
-                                disabled={isAddingJudge || isAlreadyJudge}
+                                className='text-red-400 hover:bg-red-400/10 hover:text-red-300'
                                 onClick={() =>
-                                  handleAddJudge(member.id, member.email)
+                                  setJudgeToRemove(judge.userId || judge.id)
                                 }
                               >
-                                {isAlreadyJudge
-                                  ? 'Already Judge'
-                                  : 'Add as Judge'}
+                                Remove
                               </Button>
-                            </div>
-                          );
-                        })}
-                      {orgMembers.length === 0 && !isRefreshingJudges && (
-                        <EmptyState
-                          title='No Members Found'
-                          description='No organization members found.'
-                          type='compact'
-                          className='py-8'
-                        />
+                            )}
+                          </div>
+                        ))
                       )}
                     </div>
                   </div>
-                )}
-              </div>
+
+                  {/* Org Members List - Only visible to admin/owner */}
+                  {canManageJudges && (
+                    <div className='bg-background/8 h-fit rounded-lg border border-gray-900 p-6'>
+                      <div className='flex flex-col gap-4'>
+                        <h3 className='text-lg font-medium'>
+                          Add from Organization Members
+                        </h3>
+                        <div className='relative'>
+                          <Search className='absolute top-1/2 left-3 h-4 w-4 -translate-y-1/2 text-gray-500' />
+                          <Input
+                            placeholder='Search members by name or email...'
+                            className='focus:ring-primary border-gray-900 bg-black pl-10 text-sm'
+                            value={memberSearchTerm}
+                            onChange={(
+                              e: React.ChangeEvent<HTMLInputElement>
+                            ) => setMemberSearchTerm(e.target.value)}
+                          />
+                        </div>
+                        <p className='text-xs text-gray-500'>
+                          Select members from your organization to assign them
+                          as judges.
+                        </p>
+                      </div>
+                      <div className='custom-scrollbar mt-6 max-h-[400px] space-y-3 overflow-y-auto pr-2'>
+                        {orgMembers
+                          .filter(m => {
+                            const search = memberSearchTerm.toLowerCase();
+                            return (
+                              m.name?.toLowerCase().includes(search) ||
+                              m.email?.toLowerCase().includes(search) ||
+                              m.username?.toLowerCase().includes(search)
+                            );
+                          })
+                          .map((member: any) => {
+                            const isAlreadyJudge = currentJudges.some(
+                              j => j.id === member.id || j.userId === member.id
+                            );
+                            return (
+                              <div
+                                key={member.id}
+                                className='flex items-center justify-between rounded-md border border-white/5 bg-white/5 p-3 transition-colors hover:bg-white/10'
+                              >
+                                <div className='flex items-center gap-3'>
+                                  <div className='h-8 w-8 overflow-hidden rounded-full bg-gray-800'>
+                                    {member.image ? (
+                                      <img
+                                        src={member.image}
+                                        alt=''
+                                        className='h-full w-full object-cover'
+                                      />
+                                    ) : (
+                                      <div className='flex h-full w-full items-center justify-center text-xs font-bold text-gray-500'>
+                                        {member.name?.[0] ||
+                                          member.username?.[0] ||
+                                          '?'}
+                                      </div>
+                                    )}
+                                  </div>
+                                  <div>
+                                    <p className='text-sm font-medium'>
+                                      {member.name || member.username}
+                                    </p>
+                                    <p className='text-xs text-gray-500'>
+                                      {member.email}
+                                    </p>
+                                  </div>
+                                </div>
+                                <Button
+                                  size='sm'
+                                  variant={
+                                    isAlreadyJudge ? 'outline' : 'default'
+                                  }
+                                  className={
+                                    isAlreadyJudge
+                                      ? 'cursor-not-allowed border-gray-800 opacity-50'
+                                      : ''
+                                  }
+                                  disabled={isAddingJudge || isAlreadyJudge}
+                                  onClick={() =>
+                                    handleAddJudge(member.id, member.email)
+                                  }
+                                >
+                                  {isAlreadyJudge
+                                    ? 'Already Judge'
+                                    : 'Add as Judge'}
+                                </Button>
+                              </div>
+                            );
+                          })}
+                        {orgMembers.length === 0 && !isRefreshingJudges && (
+                          <EmptyState
+                            title='No Members Found'
+                            description='No organization members found.'
+                            type='compact'
+                            className='py-8'
+                          />
+                        )}
+                      </div>
+                    </div>
+                  )}
+                </div>
+              )}
             </TabsContent>
 
             <TabsContent value='results' className='mt-6'>
@@ -1051,7 +1105,7 @@ export default function JudgingPage() {
           open={isPublishDialogOpen}
           onOpenChange={setIsPublishDialogOpen}
         >
-          <AlertDialogContent className='border-gray-900 bg-zinc-950 text-white'>
+          <AlertDialogContent className='border-white/5 bg-[#101010] text-white'>
             <AlertDialogHeader>
               <AlertDialogTitle>Publish Judging Results?</AlertDialogTitle>
               <AlertDialogDescription className='text-gray-400'>
@@ -1059,15 +1113,82 @@ export default function JudgingPage() {
                 action is irreversible.
               </AlertDialogDescription>
             </AlertDialogHeader>
+
+            {completenessLoading && (
+              <p className='text-xs text-gray-500'>
+                Checking judging progress…
+              </p>
+            )}
+
+            {completeness && completeness.complete && (
+              <p className='rounded-md border border-emerald-800/40 bg-emerald-900/20 p-3 text-xs text-emerald-200'>
+                All {completeness.expectedJudgeCount} active judges have scored
+                every shortlisted submission.
+              </p>
+            )}
+
+            {completeness && !completeness.complete && (
+              <div className='space-y-3'>
+                <div className='rounded-md border border-amber-800/40 bg-amber-950/30 p-3 text-xs text-amber-200'>
+                  <p className='font-medium'>Judging is incomplete.</p>
+                  <p className='mt-1'>
+                    {completeness.incompleteSubmissionCount} of{' '}
+                    {completeness.totalShortlisted} shortlisted submissions are
+                    missing scores from one or more active judges.
+                  </p>
+                </div>
+                {completeness.incompleteJudges.length > 0 && (
+                  <div className='rounded-md border border-white/10 bg-black/40 p-3 text-xs text-gray-300'>
+                    <p className='mb-1.5 text-[10px] tracking-wider text-gray-500 uppercase'>
+                      Judges with outstanding work
+                    </p>
+                    <ul className='space-y-1'>
+                      {completeness.incompleteJudges.map(j => (
+                        <li key={j.id} className='flex justify-between'>
+                          <span>{j.name}</span>
+                          <span className='text-gray-500'>
+                            {j.missingCount} left
+                          </span>
+                        </li>
+                      ))}
+                    </ul>
+                  </div>
+                )}
+                <label className='flex cursor-pointer items-start gap-2 rounded-md border border-amber-800/40 bg-amber-950/20 p-3 text-xs text-amber-200'>
+                  <input
+                    type='checkbox'
+                    checked={acceptPartial}
+                    onChange={e => setAcceptPartial(e.target.checked)}
+                    className='accent-primary mt-0.5 h-3.5 w-3.5'
+                  />
+                  <span>
+                    I understand the results will be published with incomplete
+                    judging.
+                  </span>
+                </label>
+              </div>
+            )}
+
             <AlertDialogFooter>
-              <AlertDialogCancel className='border-gray-800 bg-zinc-900 text-gray-300 hover:bg-zinc-800 hover:text-white'>
+              <AlertDialogCancel className='border-white/10 bg-transparent text-gray-300 hover:bg-white/5'>
                 Cancel
               </AlertDialogCancel>
               <AlertDialogAction
                 onClick={handlePublishResults}
-                className='bg-primary text-primary-foreground hover:bg-primary/90'
+                disabled={
+                  isPublishing ||
+                  completenessLoading ||
+                  Boolean(
+                    completeness && !completeness.complete && !acceptPartial
+                  )
+                }
+                className='bg-primary text-primary-foreground hover:bg-primary/90 disabled:opacity-50'
               >
-                Yes, Publish Results
+                {isPublishing
+                  ? 'Publishing…'
+                  : completeness && !completeness.complete && acceptPartial
+                    ? 'Publish anyway'
+                    : 'Publish results'}
               </AlertDialogAction>
             </AlertDialogFooter>
           </AlertDialogContent>
diff --git a/app/(landing)/organizations/[id]/hackathons/[hackathonId]/participants/page.tsx b/app/(landing)/organizations/[id]/hackathons/[hackathonId]/participants/page.tsx
index 3423f4af..956b972f 100644
--- a/app/(landing)/organizations/[id]/hackathons/[hackathonId]/participants/page.tsx
+++ b/app/(landing)/organizations/[id]/hackathons/[hackathonId]/participants/page.tsx
@@ -88,7 +88,7 @@ const ParticipantsPage: React.FC = () => {
   const [isReviewModalOpen, setIsReviewModalOpen] = useState(false);
   const [isJudgeModalOpen, setIsJudgeModalOpen] = useState(false);
   const [criteria, setCriteria] = useState<
-    Array<{ title: string; weight: number; description?: string }>
+    Array<{ id: string; title: string; weight: number; description?: string }>
   >([]);
   const [isLoadingCriteria, setIsLoadingCriteria] = useState(false);
 
@@ -194,6 +194,9 @@ const ParticipantsPage: React.FC = () => {
       if (response.success) {
         setCriteria(
           response.data?.judgingCriteria?.map(criterion => ({
+            // Persisted criteria always have an id (server enforces it).
+            // Fall back to name only for resilience against historic data.
+            id: criterion.id ?? criterion.name ?? '',
             title: criterion.name || '',
             weight: criterion.weight || 0,
             description: criterion.description || '',
diff --git a/app/auth/check-email/page.tsx b/app/auth/check-email/page.tsx
index c0e33b7e..c692c4bc 100644
--- a/app/auth/check-email/page.tsx
+++ b/app/auth/check-email/page.tsx
@@ -3,11 +3,29 @@
 import { MailIcon } from 'lucide-react';
 import Link from 'next/link';
 import { useSearchParams } from 'next/navigation';
+import { useEffect } from 'react';
 import { BoundlessButton } from '@/components/buttons';
 
+const POST_VERIFY_KEY = 'boundless:postVerifyCallbackUrl';
+
 const CheckEmail = () => {
   const searchParams = useSearchParams();
   const email = searchParams.get('email');
+  const callbackUrl = searchParams.get('callbackUrl');
+
+  // The verification email link Better Auth sends does not preserve query
+  // params, so stash the desired post-verify destination here. The
+  // /auth/verify-email page reads this back after the token is consumed.
+  useEffect(() => {
+    if (typeof window === 'undefined') return;
+    if (callbackUrl && callbackUrl.startsWith('/')) {
+      try {
+        window.localStorage.setItem(POST_VERIFY_KEY, callbackUrl);
+      } catch {
+        // ignore quota / private mode errors
+      }
+    }
+  }, [callbackUrl]);
 
   return (
     <div className='flex min-h-screen items-center justify-center p-4'>
diff --git a/app/auth/verify-email/page.tsx b/app/auth/verify-email/page.tsx
index b9ec42de..1603a53b 100644
--- a/app/auth/verify-email/page.tsx
+++ b/app/auth/verify-email/page.tsx
@@ -5,6 +5,8 @@ import { useRouter, useSearchParams } from 'next/navigation';
 import { useEffect } from 'react';
 import { toast } from 'sonner';
 
+const POST_VERIFY_KEY = 'boundless:postVerifyCallbackUrl';
+
 const VerifyEmail = () => {
   const router = useRouter();
   const searchParams = useSearchParams();
@@ -16,7 +18,21 @@ const VerifyEmail = () => {
       fetchOptions: {
         onSuccess: () => {
           toast.success('Email verified successfully');
-          router.push('/');
+          // Honor a post-verify destination stashed by the signup flow
+          // (e.g. a judge invitation page). Same-origin paths only.
+          let target = '/';
+          if (typeof window !== 'undefined') {
+            try {
+              const stashed = window.localStorage.getItem(POST_VERIFY_KEY);
+              if (stashed && stashed.startsWith('/')) {
+                target = stashed;
+              }
+              window.localStorage.removeItem(POST_VERIFY_KEY);
+            } catch {
+              // ignore storage errors
+            }
+          }
+          router.push(target);
         },
         onError: () => {
           toast.error('Failed to verify email');
diff --git a/app/globals.css b/app/globals.css
index f76a1125..0c8bb09a 100644
--- a/app/globals.css
+++ b/app/globals.css
@@ -618,3 +618,52 @@ input:-webkit-autofill:active {
   -webkit-text-fill-color: white !important; /* Optional: Customize text color */
   transition: background-color 5000s ease-in-out 0s; /* Optional: Smooth transition */
 }
+
+/* Judge portal: score slider */
+.judge-slider {
+  appearance: none;
+  -webkit-appearance: none;
+  width: 100%;
+  height: 6px;
+  background: linear-gradient(
+    to right,
+    #2eedaa 0%,
+    #2eedaa var(--judge-slider-pct, 0%),
+    rgba(255, 255, 255, 0.08) var(--judge-slider-pct, 0%),
+    rgba(255, 255, 255, 0.08) 100%
+  );
+  border-radius: 9999px;
+  outline: none;
+  cursor: pointer;
+}
+.judge-slider::-webkit-slider-thumb {
+  -webkit-appearance: none;
+  appearance: none;
+  width: 18px;
+  height: 18px;
+  border-radius: 9999px;
+  background: #2eedaa;
+  border: 2px solid #030303;
+  box-shadow:
+    0 0 0 1px rgba(46, 237, 170, 0.4),
+    0 2px 6px rgba(0, 0, 0, 0.6);
+  transition: transform 120ms ease;
+}
+.judge-slider:active::-webkit-slider-thumb,
+.judge-slider:focus-visible::-webkit-slider-thumb {
+  transform: scale(1.1);
+}
+.judge-slider::-moz-range-thumb {
+  width: 18px;
+  height: 18px;
+  border-radius: 9999px;
+  background: #2eedaa;
+  border: 2px solid #030303;
+  box-shadow:
+    0 0 0 1px rgba(46, 237, 170, 0.4),
+    0 2px 6px rgba(0, 0, 0, 0.6);
+}
+.judge-slider::-moz-range-track {
+  background: transparent;
+  height: 6px;
+}
diff --git a/app/judge/[hackathonId]/page.tsx b/app/judge/[hackathonId]/page.tsx
new file mode 100644
index 00000000..acd93580
--- /dev/null
+++ b/app/judge/[hackathonId]/page.tsx
@@ -0,0 +1,254 @@
+'use client';
+
+import Link from 'next/link';
+import { useParams, useRouter } from 'next/navigation';
+import {
+  ArrowRight,
+  ClipboardList,
+  Loader2,
+  Sparkles,
+  Trophy,
+} from 'lucide-react';
+import { AuthGuard } from '@/components/auth/AuthGuard';
+import { Button } from '@/components/ui/button';
+import { ProgressRing } from '@/components/judge/ProgressRing';
+import { DeadlineBadge } from '@/components/judge/DeadlineBadge';
+import { HackathonBanner } from '@/components/judge/HackathonBanner';
+import { CountdownBanner } from '@/components/judge/CountdownBanner';
+import { useJudgeHackathon } from '@/hooks/judge/use-judge-queries';
+import type { JudgingCriterion } from '@/lib/api/hackathons/judging';
+import { cn } from '@/lib/utils';
+
+export default function JudgeHackathonPage() {
+  return (
+    <AuthGuard redirectTo='/auth?mode=signin'>
+      <JudgeHackathon />
+    </AuthGuard>
+  );
+}
+
+function JudgeHackathon() {
+  const params = useParams<{ hackathonId: string }>();
+  const router = useRouter();
+  const hackathonId = params?.hackathonId ?? '';
+
+  const { data, isPending, isError, error } = useJudgeHackathon(hackathonId);
+  const firstUnscoredId = data?.firstUnscoredSubmissionId ?? null;
+
+  if (isPending) return <Skeleton />;
+  if (isError || !data) {
+    return (
+      <p className='text-sm text-red-400'>
+        {error instanceof Error
+          ? error.message
+          : 'You are not assigned to this hackathon, or it could not be loaded.'}
+      </p>
+    );
+  }
+
+  const remaining = Math.max(0, data.totalSubmissions - data.myScoredCount);
+  const criteria = (data.judgingCriteria ?? []) as JudgingCriterion[];
+  const isDone = data.totalSubmissions > 0 && remaining === 0;
+  const allScored = data.totalSubmissions > 0 && remaining === 0;
+
+  return (
+    <div className='space-y-6'>
+      <div>
+        <Link
+          href='/judge'
+          className='text-xs text-gray-500 hover:text-gray-300'
+        >
+          ← All assignments
+        </Link>
+      </div>
+
+      <HackathonBanner banner={data.banner} name={data.name}>
+        <div className='flex flex-wrap items-end justify-between gap-3'>
+          <div>
+            {data.organization?.name && (
+              <p className='text-[11px] tracking-wider text-white/70 uppercase'>
+                {data.organization.name}
+              </p>
+            )}
+            <h1 className='mt-1 text-2xl font-semibold tracking-tight text-white sm:text-3xl'>
+              {data.name}
+            </h1>
+            {data.tagline && (
+              <p className='mt-1 max-w-xl text-sm text-white/70'>
+                {data.tagline}
+              </p>
+            )}
+          </div>
+          <div className='flex flex-wrap gap-2'>
+            {data.resultsPublished ? (
+              <span className='inline-flex items-center gap-1 rounded-md border border-amber-700/40 bg-amber-900/40 px-2 py-0.5 text-[11px] font-medium text-amber-200'>
+                <Trophy className='h-3 w-3' />
+                Results published
+              </span>
+            ) : data.status === 'JUDGING' ? (
+              <span className='border-primary/40 bg-primary/15 text-primary inline-flex items-center gap-1 rounded-md border px-2 py-0.5 text-[11px] font-medium'>
+                <Sparkles className='h-3 w-3' />
+                Judging open
+              </span>
+            ) : (
+              <span className='inline-flex items-center rounded-md border border-white/10 bg-white/5 px-2 py-0.5 text-[11px] font-medium text-gray-300'>
+                {data.status.toLowerCase()}
+              </span>
+            )}
+            <DeadlineBadge deadline={data.judgingEnd} prefix='Ends' />
+          </div>
+        </div>
+      </HackathonBanner>
+
+      {/* Live countdown — only renders when within 48h. After deadline,
+          renders a "closed" state. */}
+      <CountdownBanner
+        deadline={data.judgingEnd}
+        hint={
+          data.totalSubmissions > 0
+            ? `${remaining} left in your queue`
+            : undefined
+        }
+        closedLabel='Judging is closed'
+      />
+
+      {/* Progress + primary CTA */}
+      <div className='grid gap-4 md:grid-cols-[auto_1fr]'>
+        <div className='rounded-2xl border border-white/5 bg-[#101010] p-6'>
+          <ProgressRing
+            value={data.myScoredCount}
+            total={data.totalSubmissions}
+            sublabel='Your progress'
+            done={isDone}
+          />
+        </div>
+        <div
+          className={cn(
+            'flex flex-col justify-between gap-4 rounded-2xl border bg-[#101010] p-6',
+            allScored
+              ? 'border-emerald-800/30'
+              : firstUnscoredId
+                ? 'border-primary/20'
+                : 'border-white/5'
+          )}
+        >
+          <div>
+            <p className='text-[10px] tracking-wider text-gray-500 uppercase'>
+              Next up
+            </p>
+            <h2 className='mt-1 text-lg font-semibold text-white'>
+              {allScored
+                ? 'You have scored every submission'
+                : firstUnscoredId
+                  ? `Continue scoring`
+                  : data.totalSubmissions === 0
+                    ? 'Nothing shortlisted yet'
+                    : 'All scored. Awaiting more.'}
+            </h2>
+            <p className='mt-1 text-sm text-gray-500'>
+              {allScored
+                ? 'When the organizer publishes results, you will see the final ranking here.'
+                : firstUnscoredId
+                  ? `${remaining} submission${remaining === 1 ? '' : 's'} left in your queue.`
+                  : data.totalSubmissions === 0
+                    ? 'The organizer has not shortlisted any submissions for judging.'
+                    : 'You are caught up. Check back later.'}
+            </p>
+          </div>
+          <div className='flex flex-wrap gap-2'>
+            {firstUnscoredId ? (
+              <Button
+                onClick={() =>
+                  router.push(
+                    `/judge/${hackathonId}/submissions/${firstUnscoredId}`
+                  )
+                }
+                className='bg-primary hover:bg-primary/90 text-primary-foreground'
+              >
+                Continue scoring
+                <ArrowRight className='ml-2 h-4 w-4' />
+              </Button>
+            ) : null}
+            <Link
+              href={`/judge/${hackathonId}/submissions`}
+              className='inline-flex items-center gap-2 rounded-md border border-white/10 bg-transparent px-3 py-2 text-sm text-gray-200 hover:bg-white/5'
+            >
+              <ClipboardList className='h-4 w-4' />
+              {allScored ? 'Review my scores' : 'See full queue'}
+            </Link>
+            {data.resultsPublished && (
+              <Link
+                href={`/judge/${hackathonId}/results`}
+                className='inline-flex items-center gap-2 rounded-md border border-amber-700/40 bg-amber-900/20 px-3 py-2 text-sm text-amber-200 hover:bg-amber-900/30'
+              >
+                <Trophy className='h-4 w-4' />
+                See final results
+              </Link>
+            )}
+          </div>
+        </div>
+      </div>
+
+      {/* Rubric */}
+      <section>
+        <div className='mb-3 flex items-center justify-between'>
+          <h2 className='text-sm font-medium tracking-wide text-gray-300 uppercase'>
+            Rubric
+          </h2>
+          <span className='text-xs text-gray-500'>
+            {criteria.length} criteri{criteria.length === 1 ? 'on' : 'a'} ·
+            score 0–10
+          </span>
+        </div>
+        {criteria.length === 0 ? (
+          <p className='rounded-2xl border border-white/5 bg-[#101010] p-5 text-sm text-gray-500'>
+            The organizer has not published a rubric yet. Once they do, you can
+            start scoring.
+          </p>
+        ) : (
+          <ul className='grid gap-3 sm:grid-cols-2'>
+            {criteria.map(c => (
+              <li
+                key={c.id}
+                className='rounded-2xl border border-white/5 bg-[#101010] p-4'
+              >
+                <div className='flex items-start justify-between gap-3'>
+                  <p className='font-medium text-white'>{c.title || c.name}</p>
+                  <span className='shrink-0 rounded border border-white/10 bg-white/5 px-1.5 py-0.5 text-[10px] text-gray-400'>
+                    {c.weight}%
+                  </span>
+                </div>
+                {c.description && (
+                  <p className='mt-2 text-xs leading-relaxed text-gray-500'>
+                    {c.description}
+                  </p>
+                )}
+                <div className='mt-3 h-1.5 overflow-hidden rounded-full bg-white/5'>
+                  <div
+                    className='bg-primary/70 h-full rounded-full'
+                    style={{ width: `${Math.min(100, c.weight ?? 0)}%` }}
+                  />
+                </div>
+              </li>
+            ))}
+          </ul>
+        )}
+      </section>
+    </div>
+  );
+}
+
+function Skeleton() {
+  return (
+    <div className='space-y-6'>
+      <div className='h-40 animate-pulse rounded-2xl bg-white/5 sm:h-52' />
+      <div className='grid gap-4 md:grid-cols-[auto_1fr]'>
+        <div className='h-44 w-44 animate-pulse rounded-2xl bg-white/5' />
+        <div className='h-44 animate-pulse rounded-2xl bg-white/5' />
+      </div>
+      <div className='flex items-center gap-2 text-gray-600'>
+        <Loader2 className='h-4 w-4 animate-spin' /> Loading hackathon…
+      </div>
+    </div>
+  );
+}
diff --git a/app/judge/[hackathonId]/results/page.tsx b/app/judge/[hackathonId]/results/page.tsx
new file mode 100644
index 00000000..8574ab89
--- /dev/null
+++ b/app/judge/[hackathonId]/results/page.tsx
@@ -0,0 +1,206 @@
+'use client';
+
+import Link from 'next/link';
+import { useParams } from 'next/navigation';
+import { Trophy } from 'lucide-react';
+import { AuthGuard } from '@/components/auth/AuthGuard';
+import { useJudgeResults } from '@/hooks/judge/use-judge-queries';
+import { formatJudgeDate } from '@/components/judge/utils';
+import type { JudgeResultItem } from '@/lib/api/judge';
+import { cn } from '@/lib/utils';
+
+export default function JudgeResultsPage() {
+  return (
+    <AuthGuard redirectTo='/auth?mode=signin'>
+      <ResultsPage />
+    </AuthGuard>
+  );
+}
+
+function ResultsPage() {
+  const params = useParams<{ hackathonId: string }>();
+  const hackathonId = params?.hackathonId ?? '';
+  const { data, isPending, isError, error } = useJudgeResults(hackathonId);
+
+  if (isPending) {
+    return (
+      <div className='space-y-4'>
+        <div className='h-8 w-48 animate-pulse rounded bg-white/5' />
+        <div className='h-40 animate-pulse rounded-2xl bg-white/5' />
+        <div className='h-72 animate-pulse rounded-2xl bg-white/5' />
+      </div>
+    );
+  }
+  if (isError || !data) {
+    return (
+      <p className='text-sm text-red-400'>
+        {error instanceof Error
+          ? error.message
+          : 'Could not load results for this hackathon.'}
+      </p>
+    );
+  }
+
+  const ranked = [...data.results].sort((a, b) => {
+    const ra = a.rank ?? a.computedRank ?? 9999;
+    const rb = b.rank ?? b.computedRank ?? 9999;
+    return ra - rb;
+  });
+  const top3 = ranked.slice(0, 3);
+  const rest = ranked.slice(3);
+
+  return (
+    <div className='space-y-6'>
+      <header>
+        <Link
+          href={`/judge/${hackathonId}`}
+          className='text-xs text-gray-500 hover:text-gray-300'
+        >
+          ← Hackathon overview
+        </Link>
+        <div className='mt-2 flex items-center gap-3'>
+          <span className='inline-flex h-9 w-9 items-center justify-center rounded-lg border border-amber-700/40 bg-amber-900/30 text-amber-300'>
+            <Trophy className='h-4 w-4' />
+          </span>
+          <div>
+            <h1 className='text-2xl font-semibold tracking-tight'>
+              Final results
+            </h1>
+            <p className='text-xs text-gray-500'>
+              {data.resultsPublished
+                ? `Published ${data.resultsPublishedAt ? formatJudgeDate(data.resultsPublishedAt) : ''}`
+                : 'Not yet published.'}
+            </p>
+          </div>
+        </div>
+      </header>
+
+      {!data.resultsPublished ? (
+        <div className='rounded-2xl border border-dashed border-white/10 bg-[#0c0c0c] p-12 text-center'>
+          <Trophy className='mx-auto h-7 w-7 text-gray-700' />
+          <p className='mt-3 text-base font-medium text-white'>
+            Results not published yet
+          </p>
+          <p className='mx-auto mt-1 max-w-md text-sm text-gray-500'>
+            Once the organizer publishes the final ranking, you can see it here.
+            Peer scores stay hidden until then.
+          </p>
+        </div>
+      ) : ranked.length === 0 ? (
+        <p className='text-sm text-gray-500'>No ranked submissions.</p>
+      ) : (
+        <>
+          {/* Podium for the top three */}
+          {top3.length > 0 && (
+            <section className='grid gap-3 sm:grid-cols-3'>
+              {top3.map(r => (
+                <PodiumCard key={r.submissionId} item={r} />
+              ))}
+            </section>
+          )}
+
+          {/* Rest of the leaderboard */}
+          {rest.length > 0 && (
+            <section>
+              <h2 className='mb-2 text-xs font-medium tracking-wider text-gray-500 uppercase'>
+                Leaderboard
+              </h2>
+              <ol className='divide-y divide-white/5 overflow-hidden rounded-2xl border border-white/5 bg-[#101010]'>
+                {rest.map(r => {
+                  const rank = r.rank ?? r.computedRank ?? null;
+                  return (
+                    <li
+                      key={r.submissionId}
+                      className='flex items-center justify-between gap-3 px-4 py-3'
+                    >
+                      <div className='flex min-w-0 items-center gap-3'>
+                        <span className='w-7 shrink-0 text-right text-sm font-medium text-gray-500 tabular-nums'>
+                          {rank ? `#${rank}` : '—'}
+                        </span>
+                        <p className='truncate text-sm font-medium text-white'>
+                          {r.projectName}
+                        </p>
+                      </div>
+                      <div className='shrink-0 text-right'>
+                        <p className='text-sm font-semibold text-white tabular-nums'>
+                          {r.averageScore.toFixed(2)}
+                        </p>
+                        {r.prize && (
+                          <p className='text-[10px] tracking-wider text-amber-300/70 uppercase'>
+                            {r.prize}
+                          </p>
+                        )}
+                      </div>
+                    </li>
+                  );
+                })}
+              </ol>
+            </section>
+          )}
+        </>
+      )}
+    </div>
+  );
+}
+
+function PodiumCard({ item }: { item: JudgeResultItem }) {
+  const rank = item.rank ?? item.computedRank ?? 0;
+  const tone =
+    rank === 1
+      ? {
+          border: 'border-amber-700/50',
+          bg: 'bg-gradient-to-b from-amber-900/40 via-[#101010] to-[#101010]',
+          ring: 'text-amber-300',
+          label: '1st place',
+        }
+      : rank === 2
+        ? {
+            border: 'border-zinc-500/40',
+            bg: 'bg-gradient-to-b from-zinc-700/30 via-[#101010] to-[#101010]',
+            ring: 'text-zinc-200',
+            label: '2nd place',
+          }
+        : {
+            border: 'border-orange-800/40',
+            bg: 'bg-gradient-to-b from-orange-900/30 via-[#101010] to-[#101010]',
+            ring: 'text-orange-300',
+            label: '3rd place',
+          };
+
+  return (
+    <div
+      className={cn(
+        'flex flex-col items-center rounded-2xl border p-5 text-center',
+        tone.border,
+        tone.bg
+      )}
+    >
+      <span className={cn('text-[10px] tracking-wider uppercase', tone.ring)}>
+        {tone.label}
+      </span>
+      <span
+        className={cn(
+          'mt-1 flex h-12 w-12 items-center justify-center rounded-full border bg-black/30 text-lg font-bold tabular-nums',
+          tone.border,
+          tone.ring
+        )}
+      >
+        #{rank}
+      </span>
+      <h3 className='mt-3 line-clamp-2 text-sm font-semibold text-white'>
+        {item.projectName}
+      </h3>
+      <p className='mt-2 text-2xl font-semibold text-white tabular-nums'>
+        {item.averageScore.toFixed(2)}
+      </p>
+      <p className='text-[10px] tracking-wider text-gray-500 uppercase'>
+        avg score
+      </p>
+      {item.prize && (
+        <span className='mt-3 inline-flex items-center gap-1 rounded-md border border-amber-700/40 bg-amber-900/30 px-2 py-0.5 text-[11px] text-amber-200'>
+          <Trophy className='h-3 w-3' /> {item.prize}
+        </span>
+      )}
+    </div>
+  );
+}
diff --git a/app/judge/[hackathonId]/submissions/[submissionId]/page.tsx b/app/judge/[hackathonId]/submissions/[submissionId]/page.tsx
new file mode 100644
index 00000000..c6e48bb9
--- /dev/null
+++ b/app/judge/[hackathonId]/submissions/[submissionId]/page.tsx
@@ -0,0 +1,676 @@
+'use client';
+
+import Link from 'next/link';
+import { useParams, useRouter } from 'next/navigation';
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import {
+  ArrowLeft,
+  ArrowRight,
+  CheckCircle2,
+  ExternalLink,
+  Loader2,
+  PlayCircle,
+} from 'lucide-react';
+import { AuthGuard } from '@/components/auth/AuthGuard';
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
+import { Button } from '@/components/ui/button';
+import { ScoreSlider } from '@/components/judge/ScoreSlider';
+import {
+  KeyboardShortcuts,
+  ShortcutDef,
+} from '@/components/judge/KeyboardShortcuts';
+import {
+  useJudgeHackathon,
+  useJudgeQueueNeighbors,
+  useJudgeSubmission,
+  useSubmitJudgeScore,
+} from '@/hooks/judge/use-judge-queries';
+import { CountdownBanner } from '@/components/judge/CountdownBanner';
+import { getCountdown } from '@/components/judge/utils';
+import type {
+  CriterionScoreRequest,
+  JudgingCriterion,
+} from '@/lib/api/hackathons/judging';
+import { cn } from '@/lib/utils';
+
+export default function JudgeScoringPage() {
+  return (
+    <AuthGuard redirectTo='/auth?mode=signin'>
+      <ScorePage />
+    </AuthGuard>
+  );
+}
+
+const SHORTCUTS: ShortcutDef[] = [
+  { keys: ['Tab'], description: 'Advance to next criterion' },
+  { keys: ['⇧', 'Tab'], description: 'Previous criterion' },
+  { keys: ['1', '–', '9'], description: 'Set focused criterion (0-10)' },
+  { keys: ['⌘', '↵'], description: 'Submit score and continue' },
+  { keys: ['J'], description: 'Skip to next submission' },
+  { keys: ['K'], description: 'Previous submission' },
+  { keys: ['Esc'], description: 'Back to queue' },
+  { keys: ['?'], description: 'Show this panel' },
+];
+
+function getCriterionKey(c: JudgingCriterion) {
+  // Server guarantees a non-empty unique id on every persisted
+  // criterion (Sprint 2 #7). Use it directly; never fall back to name
+  // or title — that fallback silently merges criteria with the same
+  // human-readable label.
+  return c.id;
+}
+
+function ScorePage() {
+  const params = useParams<{ hackathonId: string; submissionId: string }>();
+  const router = useRouter();
+  const hackathonId = params?.hackathonId ?? '';
+  const submissionId = params?.submissionId ?? '';
+
+  const { data, isPending, isError } = useJudgeSubmission(
+    hackathonId,
+    submissionId
+  );
+  // Pull the hackathon overview for the deadline. Same query is on the
+  // overview page, so when the judge navigates here from there this is
+  // a cache hit.
+  const { data: hackathonOverview } = useJudgeHackathon(hackathonId);
+  const judgingClosed = (() => {
+    if (!hackathonOverview?.judgingEnd) return false;
+    return getCountdown(hackathonOverview.judgingEnd).isPast;
+  })();
+  // Cursor-style lookup so we never fetch the full queue. Powers the
+  // "X of N" counter, J/K navigation, and auto-advance.
+  const { data: neighbors } = useJudgeQueueNeighbors(hackathonId, submissionId);
+
+  const criteria = data?.criteria ?? [];
+  const existingScores = data?.myScore?.criteriaScores ?? [];
+
+  // ---- form state ----
+  const [scores, setScores] = useState<Record<string, number | ''>>({});
+  const [comments, setComments] = useState<Record<string, string>>({});
+  const [overall, setOverall] = useState('');
+  const [focused, setFocused] = useState<string | null>(null);
+  const [errors, setErrors] = useState<Record<string, string | null>>({});
+  const [autoAdvance, setAutoAdvance] = useState(true);
+  const [activeTab, setActiveTab] = useState<'overview' | 'demo' | 'links'>(
+    'overview'
+  );
+
+  const initialScores = useMemo(() => {
+    const out: Record<string, number | ''> = {};
+    for (const c of criteria) {
+      const key = getCriterionKey(c);
+      const existing = existingScores.find(
+        s => s.criterionId === getCriterionKey(c)
+      );
+      out[key] = existing ? existing.score : '';
+    }
+    return out;
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [criteria.length, submissionId, existingScores.length]);
+
+  const initialComments = useMemo(() => {
+    const out: Record<string, string> = {};
+    for (const c of criteria) {
+      const key = getCriterionKey(c);
+      const existing = existingScores.find(
+        s => s.criterionId === getCriterionKey(c)
+      );
+      out[key] = existing?.comment ?? '';
+    }
+    return out;
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [criteria.length, submissionId, existingScores.length]);
+
+  useEffect(() => {
+    setScores(initialScores);
+    setComments(initialComments);
+    setOverall(data?.myScore?.comment ?? '');
+    setErrors({});
+    setFocused(criteria[0] ? getCriterionKey(criteria[0]) : null);
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [submissionId, initialScores, initialComments]);
+
+  // ---- derived: queue position + weighted total ----
+  const totalInQueue = neighbors?.total ?? 0;
+  const scoredInQueue = neighbors?.scoredCount ?? 0;
+  const positionLabel =
+    neighbors?.position != null
+      ? `${neighbors.position} of ${totalInQueue}`
+      : null;
+  const nextUnscoredId = neighbors?.nextUnscored?.submissionId ?? null;
+  const prevId = neighbors?.prev?.submissionId ?? null;
+  const nextId = neighbors?.next?.submissionId ?? null;
+
+  const weightedRunningTotal = useMemo(() => {
+    if (criteria.length === 0) return null;
+    let weightSum = 0;
+    let scoreSum = 0;
+    for (const c of criteria) {
+      const key = getCriterionKey(c);
+      const s = scores[key];
+      const w = typeof c.weight === 'number' ? c.weight : 0;
+      weightSum += w;
+      if (typeof s === 'number') scoreSum += s * (w / 100);
+    }
+    if (weightSum === 0) return null;
+    return Math.round(scoreSum * 10) / 10;
+  }, [scores, criteria]);
+
+  const filledCount = useMemo(
+    () =>
+      criteria.filter(c => typeof scores[getCriterionKey(c)] === 'number')
+        .length,
+    [scores, criteria]
+  );
+
+  // ---- handlers ----
+  const handleScoreChange = useCallback((key: string, value: number | '') => {
+    if (value === '') {
+      setScores(p => ({ ...p, [key]: '' }));
+    } else {
+      const clamped = Math.min(10, Math.max(0, value));
+      setScores(p => ({ ...p, [key]: clamped }));
+    }
+    setErrors(p => (p[key] ? { ...p, [key]: null } : p));
+  }, []);
+
+  const advanceFocus = useCallback(() => {
+    if (!focused) {
+      if (criteria[0]) setFocused(getCriterionKey(criteria[0]));
+      return;
+    }
+    const idx = criteria.findIndex(c => getCriterionKey(c) === focused);
+    if (idx < criteria.length - 1) {
+      setFocused(getCriterionKey(criteria[idx + 1]));
+    } else {
+      setFocused(null);
+    }
+  }, [criteria, focused]);
+
+  const submit = useSubmitJudgeScore(hackathonId);
+
+  const submitOrError = useCallback(() => {
+    const newErrors: Record<string, string | null> = {};
+    let valid = true;
+    for (const c of criteria) {
+      const key = getCriterionKey(c);
+      if (typeof scores[key] !== 'number') {
+        newErrors[key] = 'Score required';
+        valid = false;
+      }
+    }
+    setErrors(newErrors);
+    if (!valid) return;
+
+    const criteriaScores: CriterionScoreRequest[] = criteria.map(c => {
+      const key = getCriterionKey(c);
+      return {
+        criterionId: c.id,
+        score: scores[key] as number,
+        comment: comments[key] || undefined,
+      };
+    });
+
+    submit.mutate(
+      {
+        submissionId,
+        payload: { criteriaScores, comment: overall || undefined },
+      },
+      {
+        onSuccess: () => {
+          if (autoAdvance && nextUnscoredId) {
+            router.push(`/judge/${hackathonId}/submissions/${nextUnscoredId}`);
+          } else if (!nextUnscoredId) {
+            router.push(`/judge/${hackathonId}`);
+          }
+        },
+      }
+    );
+  }, [
+    criteria,
+    scores,
+    comments,
+    overall,
+    submit,
+    submissionId,
+    autoAdvance,
+    nextUnscoredId,
+    router,
+    hackathonId,
+  ]);
+
+  // Global key handler: J/K to navigate, Esc to leave, Cmd+Enter to submit
+  useEffect(() => {
+    const onKey = (e: KeyboardEvent) => {
+      const target = e.target as HTMLElement | null;
+      const inField =
+        target &&
+        (target.tagName === 'INPUT' ||
+          target.tagName === 'TEXTAREA' ||
+          target.isContentEditable);
+
+      if ((e.metaKey || e.ctrlKey) && e.key === 'Enter') {
+        e.preventDefault();
+        submitOrError();
+        return;
+      }
+      if (inField) return;
+      if (e.key === 'Escape') {
+        router.push(`/judge/${hackathonId}/submissions`);
+      } else if (e.key === 'j' || e.key === 'J') {
+        if (nextId) router.push(`/judge/${hackathonId}/submissions/${nextId}`);
+      } else if (e.key === 'k' || e.key === 'K') {
+        if (prevId) router.push(`/judge/${hackathonId}/submissions/${prevId}`);
+      }
+    };
+    window.addEventListener('keydown', onKey);
+    return () => window.removeEventListener('keydown', onKey);
+  }, [router, hackathonId, nextId, prevId, submitOrError]);
+
+  if (isPending) return <SkeletonScoringPage />;
+  if (isError || !data) return <UnavailableState hackathonId={hackathonId} />;
+
+  // Once judging closes, the page becomes read-only. Existing scores
+  // are still visible (organizer can override on the org side); the
+  // form is disabled.
+  const readOnly = judgingClosed;
+
+  const { submission, participant, myScore } = data;
+  const videoUrl = submission.videoUrl;
+  const links = submission.links ?? [];
+  const tabs: Array<{
+    id: 'overview' | 'demo' | 'links';
+    label: string;
+    count?: number;
+  }> = [{ id: 'overview', label: 'Overview' }];
+  if (videoUrl) tabs.push({ id: 'demo', label: 'Demo' });
+  if (links.length > 0)
+    tabs.push({ id: 'links', label: 'Links', count: links.length });
+
+  return (
+    <div className='space-y-5'>
+      {/* Top context bar */}
+      <div className='flex flex-wrap items-center justify-between gap-3'>
+        <Link
+          href={`/judge/${hackathonId}/submissions`}
+          className='inline-flex items-center gap-1.5 text-xs text-gray-500 hover:text-gray-300'
+        >
+          <ArrowLeft className='h-3.5 w-3.5' /> Back to queue
+        </Link>
+        <div className='flex items-center gap-2'>
+          {positionLabel && (
+            <span className='text-xs text-gray-500'>
+              Submission{' '}
+              <span className='font-medium text-gray-300'>{positionLabel}</span>
+            </span>
+          )}
+          <KeyboardShortcuts shortcuts={SHORTCUTS} />
+        </div>
+      </div>
+
+      {/* Bulk progress strip */}
+      {totalInQueue > 0 && (
+        <QueueProgress
+          total={totalInQueue}
+          scored={scoredInQueue}
+          position={neighbors?.position ?? null}
+        />
+      )}
+
+      {/* Countdown / closed state. Hidden when judging is comfortably
+          in the future. Switches to a "Judging is closed" banner once
+          past the deadline. */}
+      <CountdownBanner
+        deadline={hackathonOverview?.judgingEnd}
+        hint='You can still see your scores, but new ratings are disabled.'
+      />
+
+      <div className='grid gap-5 lg:grid-cols-[1.1fr_1fr]'>
+        {/* Left column: context */}
+        <section className='space-y-5'>
+          <div className='rounded-2xl border border-white/5 bg-[#101010] p-6'>
+            <div className='flex items-start gap-4'>
+              <Avatar className='h-10 w-10 border border-white/10'>
+                <AvatarImage
+                  src={participant.user.image}
+                  alt={participant.user.name}
+                />
+                <AvatarFallback className='bg-white/5 text-xs'>
+                  {(participant.user.name ?? '?').slice(0, 2).toUpperCase()}
+                </AvatarFallback>
+              </Avatar>
+              <div className='min-w-0 flex-1'>
+                <h1 className='truncate text-xl font-semibold tracking-tight text-white'>
+                  {submission.projectName}
+                </h1>
+                <p className='mt-0.5 truncate text-sm text-gray-500'>
+                  {participant.teamName
+                    ? `Team · ${participant.teamName}`
+                    : participant.user.name}
+                  {submission.category && (
+                    <>
+                      <span className='mx-2 text-gray-700'>·</span>
+                      <span className='text-gray-400'>
+                        {submission.category}
+                      </span>
+                    </>
+                  )}
+                </p>
+              </div>
+              {myScore && (
+                <div className='shrink-0 rounded-md border border-emerald-700/40 bg-emerald-900/20 px-2 py-1 text-right'>
+                  <p className='text-[10px] tracking-wider text-emerald-400/70 uppercase'>
+                    Your score
+                  </p>
+                  <p className='text-base font-semibold text-emerald-300'>
+                    {myScore.totalScore.toFixed(1)}
+                  </p>
+                </div>
+              )}
+            </div>
+
+            {/* Tabs */}
+            <div className='mt-5 flex items-center gap-1 border-b border-white/5'>
+              {tabs.map(t => (
+                <button
+                  key={t.id}
+                  type='button'
+                  onClick={() => setActiveTab(t.id)}
+                  className={cn(
+                    'relative -mb-px px-3 py-2 text-xs font-medium transition-colors',
+                    activeTab === t.id
+                      ? 'text-white'
+                      : 'text-gray-500 hover:text-gray-300'
+                  )}
+                >
+                  {t.label}
+                  {typeof t.count === 'number' && (
+                    <span className='ml-1 text-gray-600'>{t.count}</span>
+                  )}
+                  {activeTab === t.id && (
+                    <span className='bg-primary absolute inset-x-0 -bottom-px h-px' />
+                  )}
+                </button>
+              ))}
+            </div>
+
+            <div className='mt-4'>
+              {activeTab === 'overview' && (
+                <>
+                  {submission.introduction && (
+                    <p className='mb-3 text-sm text-gray-300'>
+                      {submission.introduction}
+                    </p>
+                  )}
+                  {submission.description ? (
+                    <div className='prose prose-invert max-w-none text-sm leading-relaxed text-gray-300'>
+                      <p className='whitespace-pre-wrap'>
+                        {submission.description}
+                      </p>
+                    </div>
+                  ) : (
+                    <p className='text-sm text-gray-600'>
+                      No description provided.
+                    </p>
+                  )}
+                </>
+              )}
+              {activeTab === 'demo' && videoUrl && (
+                <a
+                  href={videoUrl}
+                  target='_blank'
+                  rel='noopener noreferrer'
+                  className='group flex items-center gap-3 rounded-xl border border-white/5 bg-black/30 p-4 transition-colors hover:border-white/10'
+                >
+                  <span className='bg-primary/15 text-primary flex h-10 w-10 items-center justify-center rounded-lg'>
+                    <PlayCircle className='h-5 w-5' />
+                  </span>
+                  <span className='min-w-0 flex-1'>
+                    <p className='text-sm font-medium text-white'>Watch demo</p>
+                    <p className='truncate text-xs text-gray-500'>{videoUrl}</p>
+                  </span>
+                  <ExternalLink className='h-4 w-4 text-gray-600 group-hover:text-gray-300' />
+                </a>
+              )}
+              {activeTab === 'links' && (
+                <ul className='space-y-2'>
+                  {links.map((l, i) => (
+                    <li key={`${l.url}-${i}`}>
+                      <a
+                        href={l.url}
+                        target='_blank'
+                        rel='noopener noreferrer'
+                        className='group flex items-center justify-between gap-3 rounded-lg border border-white/5 bg-black/30 px-3 py-2 hover:border-white/10'
+                      >
+                        <span className='min-w-0 flex-1 truncate text-sm text-gray-200'>
+                          {l.type ? (
+                            <span className='mr-2 text-xs text-gray-500'>
+                              {l.type}
+                            </span>
+                          ) : null}
+                          {l.url}
+                        </span>
+                        <ExternalLink className='h-3.5 w-3.5 shrink-0 text-gray-600 group-hover:text-gray-300' />
+                      </a>
+                    </li>
+                  ))}
+                </ul>
+              )}
+            </div>
+          </div>
+        </section>
+
+        {/* Right column: scoring */}
+        <aside className='space-y-4 lg:sticky lg:top-20 lg:self-start'>
+          <div className='rounded-2xl border border-white/5 bg-[#0c0c0c] p-5'>
+            <div className='mb-4 flex items-center justify-between'>
+              <div>
+                <p className='text-[10px] tracking-wider text-gray-500 uppercase'>
+                  Score
+                </p>
+                <p className='text-2xl font-semibold text-white tabular-nums'>
+                  {weightedRunningTotal !== null ? (
+                    weightedRunningTotal.toFixed(1)
+                  ) : (
+                    <span className='text-gray-700'>—</span>
+                  )}
+                  <span className='text-sm text-gray-600'>/10</span>
+                </p>
+              </div>
+              <div className='text-right'>
+                <p className='text-[10px] tracking-wider text-gray-500 uppercase'>
+                  Filled
+                </p>
+                <p className='text-sm text-gray-300'>
+                  <span className='font-semibold text-white'>
+                    {filledCount}
+                  </span>
+                  <span className='text-gray-600'> / {criteria.length}</span>
+                </p>
+              </div>
+            </div>
+
+            {criteria.length === 0 ? (
+              <p className='rounded-lg border border-white/5 bg-black/30 p-3 text-sm text-gray-500'>
+                The organizer has not published a rubric yet.
+              </p>
+            ) : (
+              <div className='space-y-3'>
+                {criteria.map(c => {
+                  const key = getCriterionKey(c);
+                  return (
+                    <ScoreSlider
+                      key={key}
+                      label={c.title || c.name || 'Criterion'}
+                      weight={c.weight}
+                      description={c.description}
+                      value={scores[key] ?? ''}
+                      onChange={v => handleScoreChange(key, v)}
+                      isFocused={focused === key}
+                      onFocus={() => setFocused(key)}
+                      onBlur={() => {
+                        if (focused === key) setFocused(null);
+                      }}
+                      onAdvance={advanceFocus}
+                      onSubmitWithEnter={submitOrError}
+                      comment={comments[key] ?? ''}
+                      onCommentChange={v =>
+                        setComments(p => ({ ...p, [key]: v }))
+                      }
+                      error={errors[key] ?? null}
+                      inputId={`score-${key}`}
+                      disabled={readOnly}
+                    />
+                  );
+                })}
+              </div>
+            )}
+
+            <div className='mt-4'>
+              <label
+                htmlFor='overall-comment'
+                className='mb-1.5 block text-[10px] tracking-wider text-gray-500 uppercase'
+              >
+                Overall feedback (optional)
+              </label>
+              <textarea
+                id='overall-comment'
+                value={overall}
+                onChange={e => setOverall(e.target.value)}
+                rows={3}
+                placeholder='Final notes for the organizers'
+                className='focus:border-primary/40 focus:ring-primary/30 w-full resize-none rounded-lg border border-white/5 bg-black/40 p-3 text-sm text-gray-200 placeholder:text-gray-700 focus:ring-1 focus:outline-none'
+              />
+            </div>
+
+            <div className='mt-5 flex items-center justify-between gap-3'>
+              <label className='inline-flex cursor-pointer items-center gap-2 text-xs text-gray-500'>
+                <input
+                  type='checkbox'
+                  checked={autoAdvance}
+                  onChange={e => setAutoAdvance(e.target.checked)}
+                  className='accent-primary h-3.5 w-3.5'
+                />
+                Auto-advance after submit
+              </label>
+              <span className='text-[10px] text-gray-700'>
+                <kbd className='rounded border border-white/10 bg-black/40 px-1 font-mono'>
+                  ⌘
+                </kbd>{' '}
+                <kbd className='rounded border border-white/10 bg-black/40 px-1 font-mono'>
+                  ↵
+                </kbd>
+              </span>
+            </div>
+
+            <Button
+              onClick={submitOrError}
+              disabled={submit.isPending || criteria.length === 0 || readOnly}
+              className='bg-primary hover:bg-primary/90 text-primary-foreground mt-3 h-11 w-full text-sm font-semibold disabled:opacity-50'
+              title={readOnly ? 'Judging is closed' : undefined}
+            >
+              {readOnly ? (
+                'Judging closed'
+              ) : submit.isPending ? (
+                <>
+                  <Loader2 className='mr-2 h-4 w-4 animate-spin' />
+                  {myScore ? 'Updating…' : 'Submitting…'}
+                </>
+              ) : nextUnscoredId && autoAdvance ? (
+                <>
+                  {myScore ? 'Update' : 'Submit'} &amp; next
+                  <ArrowRight className='ml-2 h-4 w-4' />
+                </>
+              ) : myScore ? (
+                'Update score'
+              ) : (
+                'Submit score'
+              )}
+            </Button>
+
+            {!nextUnscoredId && filledCount === criteria.length && (
+              <p className='mt-3 flex items-center gap-1.5 text-xs text-emerald-400'>
+                <CheckCircle2 className='h-3.5 w-3.5' />
+                Last unscored submission in your queue.
+              </p>
+            )}
+          </div>
+        </aside>
+      </div>
+    </div>
+  );
+}
+
+function QueueProgress({
+  total,
+  scored,
+  position,
+}: {
+  total: number;
+  scored: number;
+  position: number | null;
+}) {
+  const scoredPct = total > 0 ? (scored / total) * 100 : 0;
+  const positionPct =
+    position != null && total > 0 ? ((position - 0.5) / total) * 100 : null;
+  return (
+    <div className='rounded-xl border border-white/5 bg-[#0c0c0c] p-3'>
+      <div className='relative h-1.5 overflow-hidden rounded-full bg-white/5'>
+        <div
+          className='absolute inset-y-0 left-0 rounded-full bg-emerald-500/40 transition-[width] duration-700 ease-out'
+          style={{ width: `${scoredPct}%` }}
+        />
+        {positionPct != null && (
+          <div
+            className='bg-primary absolute top-1/2 h-3 w-[3px] -translate-x-1/2 -translate-y-1/2 rounded-full shadow-[0_0_10px_rgba(46,237,170,0.6)]'
+            style={{ left: `${positionPct}%` }}
+          />
+        )}
+      </div>
+      <p className='mt-2 flex items-center justify-between text-[11px] text-gray-500'>
+        <span>
+          <span className='font-medium text-gray-300'>{scored}</span>
+          <span className='text-gray-600'> / {total} scored</span>
+        </span>
+        {position != null && (
+          <span className='text-gray-600'>
+            You are at{' '}
+            <span className='text-primary font-medium'>#{position}</span>
+          </span>
+        )}
+      </p>
+    </div>
+  );
+}
+
+function SkeletonScoringPage() {
+  return (
+    <div className='space-y-5'>
+      <div className='h-4 w-24 animate-pulse rounded bg-white/5' />
+      <div className='h-2 animate-pulse rounded bg-white/5' />
+      <div className='grid gap-5 lg:grid-cols-[1.1fr_1fr]'>
+        <div className='h-72 animate-pulse rounded-2xl bg-white/5' />
+        <div className='h-[28rem] animate-pulse rounded-2xl bg-white/5' />
+      </div>
+    </div>
+  );
+}
+
+function UnavailableState({ hackathonId }: { hackathonId: string }) {
+  return (
+    <div className='mx-auto max-w-md rounded-2xl border border-white/5 bg-[#101010] p-8 text-center'>
+      <h2 className='text-lg font-semibold'>Submission unavailable</h2>
+      <p className='mt-2 text-sm text-gray-500'>
+        It may have been removed from the shortlist, or you are no longer
+        assigned to score this hackathon.
+      </p>
+      <Link
+        href={`/judge/${hackathonId}/submissions`}
+        className='text-primary mt-4 inline-block text-sm hover:underline'
+      >
+        Back to queue →
+      </Link>
+    </div>
+  );
+}
diff --git a/app/judge/[hackathonId]/submissions/page.tsx b/app/judge/[hackathonId]/submissions/page.tsx
new file mode 100644
index 00000000..dcc3ebfb
--- /dev/null
+++ b/app/judge/[hackathonId]/submissions/page.tsx
@@ -0,0 +1,401 @@
+'use client';
+
+import Link from 'next/link';
+import { useParams, useRouter } from 'next/navigation';
+import { useEffect, useMemo, useState } from 'react';
+import {
+  CheckCircle2,
+  ChevronLeft,
+  ChevronRight,
+  Circle,
+  Search,
+} from 'lucide-react';
+import { AuthGuard } from '@/components/auth/AuthGuard';
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
+import { useJudgeSubmissions } from '@/hooks/judge/use-judge-queries';
+import type { JudgingSubmission } from '@/lib/api/hackathons/judging';
+import { cn } from '@/lib/utils';
+
+type Filter = 'unscored' | 'scored' | 'all';
+const PAGE_SIZE = 50;
+
+export default function JudgeSubmissionsPage() {
+  return (
+    <AuthGuard redirectTo='/auth?mode=signin'>
+      <SubmissionsList />
+    </AuthGuard>
+  );
+}
+
+function SubmissionsList() {
+  const params = useParams<{ hackathonId: string }>();
+  const router = useRouter();
+  const hackathonId = params?.hackathonId ?? '';
+
+  const [filter, setFilter] = useState<Filter>('all');
+  const [search, setSearch] = useState('');
+  const [searchInput, setSearchInput] = useState('');
+  const [page, setPage] = useState(1);
+
+  const { data, isPending, isError, isFetching } = useJudgeSubmissions(
+    hackathonId,
+    {
+      page,
+      limit: PAGE_SIZE,
+      search: search || undefined,
+    }
+  );
+
+  const submissions = data?.submissions ?? [];
+  const total = data?.pagination.total ?? 0;
+  const totalPages = data?.pagination.totalPages ?? 1;
+  // Server-derived: accurate across pages, not derived from the current
+  // window. Falls back to in-page count when older responses are cached.
+  const scoredCount =
+    data?.scoredCount ?? (submissions.filter(s => s.myScore).length || 0);
+
+  const visible = useMemo(() => {
+    if (filter === 'unscored') return submissions.filter(s => !s.myScore);
+    if (filter === 'scored') return submissions.filter(s => s.myScore);
+    return submissions;
+  }, [submissions, filter]);
+
+  const [focusIdx, setFocusIdx] = useState(0);
+  useEffect(() => {
+    if (visible.length === 0) {
+      setFocusIdx(0);
+      return;
+    }
+    setFocusIdx(i => Math.min(Math.max(0, i), visible.length - 1));
+  }, [visible.length]);
+
+  useEffect(() => {
+    const onKey = (e: KeyboardEvent) => {
+      const target = e.target as HTMLElement | null;
+      if (
+        target &&
+        (target.tagName === 'INPUT' ||
+          target.tagName === 'TEXTAREA' ||
+          target.isContentEditable)
+      )
+        return;
+      if (e.key === 'j' || e.key === 'J' || e.key === 'ArrowDown') {
+        e.preventDefault();
+        setFocusIdx(i => Math.min(visible.length - 1, i + 1));
+      } else if (e.key === 'k' || e.key === 'K' || e.key === 'ArrowUp') {
+        e.preventDefault();
+        setFocusIdx(i => Math.max(0, i - 1));
+      } else if (e.key === 'Enter') {
+        const s = visible[focusIdx];
+        if (s) {
+          router.push(`/judge/${hackathonId}/submissions/${s.submission.id}`);
+        }
+      }
+    };
+    window.addEventListener('keydown', onKey);
+    return () => window.removeEventListener('keydown', onKey);
+  }, [visible, focusIdx, router, hackathonId]);
+
+  return (
+    <div className='space-y-5'>
+      <header>
+        <Link
+          href={`/judge/${hackathonId}`}
+          className='text-xs text-gray-500 hover:text-gray-300'
+        >
+          ← Hackathon overview
+        </Link>
+        <h1 className='mt-2 text-2xl font-semibold tracking-tight'>
+          Submissions
+        </h1>
+      </header>
+
+      {/* Progress strip — accurate even across pages */}
+      <div className='rounded-2xl border border-white/5 bg-[#101010] p-4'>
+        <div className='flex items-center justify-between text-xs text-gray-500'>
+          <span>
+            <span className='font-medium text-white'>{scoredCount}</span>
+            <span className='text-gray-600'> / {total} scored</span>
+          </span>
+          <span>{Math.max(0, total - scoredCount)} remaining</span>
+        </div>
+        <div className='mt-2 h-1.5 overflow-hidden rounded-full bg-white/5'>
+          <div
+            className='bg-primary h-full rounded-full transition-[width] duration-700 ease-out'
+            style={{ width: `${total ? (scoredCount / total) * 100 : 0}%` }}
+          />
+        </div>
+      </div>
+
+      {/* Filter tabs + search */}
+      <div className='flex flex-wrap items-center gap-3'>
+        <div className='flex items-center gap-1 rounded-lg border border-white/5 bg-[#101010] p-1'>
+          <FilterTab
+            label='Unscored'
+            active={filter === 'unscored'}
+            onClick={() => setFilter('unscored')}
+          />
+          <FilterTab
+            label='Scored'
+            active={filter === 'scored'}
+            onClick={() => setFilter('scored')}
+          />
+          <FilterTab
+            label='All'
+            active={filter === 'all'}
+            onClick={() => setFilter('all')}
+          />
+        </div>
+        <form
+          onSubmit={e => {
+            e.preventDefault();
+            setSearch(searchInput.trim());
+            setPage(1);
+          }}
+          className='relative ml-auto w-full sm:w-72'
+        >
+          <Search className='absolute top-1/2 left-3 h-3.5 w-3.5 -translate-y-1/2 text-gray-600' />
+          <input
+            type='text'
+            value={searchInput}
+            onChange={e => setSearchInput(e.target.value)}
+            placeholder='Search project or participant'
+            className='focus:border-primary/40 focus:ring-primary/30 w-full rounded-lg border border-white/5 bg-[#101010] py-2 pr-3 pl-9 text-sm text-white placeholder:text-gray-700 focus:ring-1 focus:outline-none'
+          />
+        </form>
+      </div>
+
+      {isPending && (
+        <div className='space-y-2'>
+          {Array.from({ length: 6 }).map((_, i) => (
+            <div key={i} className='h-16 animate-pulse rounded-xl bg-white/5' />
+          ))}
+        </div>
+      )}
+
+      {isError && (
+        <p className='text-sm text-red-400'>Failed to load submissions.</p>
+      )}
+
+      {!isPending && visible.length === 0 && (
+        <EmptyForFilter
+          filter={filter}
+          hasSearch={!!search}
+          hasAnyOnPage={submissions.length > 0}
+        />
+      )}
+
+      {!isPending && visible.length > 0 && (
+        <ul
+          className={cn(
+            'space-y-2',
+            isFetching && 'opacity-70 transition-opacity'
+          )}
+        >
+          {visible.map((s, i) => (
+            <li key={s.submission.id}>
+              <Row
+                hackathonId={hackathonId}
+                submission={s}
+                focused={i === focusIdx}
+                onHover={() => setFocusIdx(i)}
+              />
+            </li>
+          ))}
+        </ul>
+      )}
+
+      {totalPages > 1 && (
+        <Pagination
+          page={page}
+          totalPages={totalPages}
+          onChange={p => {
+            setPage(p);
+            setFocusIdx(0);
+          }}
+          disabled={isFetching}
+        />
+      )}
+
+      {visible.length > 0 && (
+        <p className='text-center text-[11px] text-gray-700'>
+          Press{' '}
+          <kbd className='rounded border border-white/10 bg-black/40 px-1 font-mono'>
+            ↑
+          </kbd>{' '}
+          <kbd className='rounded border border-white/10 bg-black/40 px-1 font-mono'>
+            ↓
+          </kbd>{' '}
+          to navigate,{' '}
+          <kbd className='rounded border border-white/10 bg-black/40 px-1 font-mono'>
+            ↵
+          </kbd>{' '}
+          to open
+        </p>
+      )}
+    </div>
+  );
+}
+
+function FilterTab({
+  label,
+  active,
+  onClick,
+}: {
+  label: string;
+  active: boolean;
+  onClick: () => void;
+}) {
+  return (
+    <button
+      type='button'
+      onClick={onClick}
+      className={cn(
+        'rounded-md px-3 py-1 text-xs font-medium transition-colors',
+        active
+          ? 'bg-white/10 text-white'
+          : 'text-gray-400 hover:bg-white/5 hover:text-gray-100'
+      )}
+    >
+      {label}
+    </button>
+  );
+}
+
+function Row({
+  hackathonId,
+  submission,
+  focused,
+  onHover,
+}: {
+  hackathonId: string;
+  submission: JudgingSubmission;
+  focused: boolean;
+  onHover: () => void;
+}) {
+  const scored = !!submission.myScore;
+  return (
+    <Link
+      href={`/judge/${hackathonId}/submissions/${submission.submission.id}`}
+      onMouseEnter={onHover}
+      className={cn(
+        'group flex items-center gap-3 rounded-xl border bg-[#101010] px-4 py-3 transition-all',
+        focused
+          ? 'border-primary/30 bg-[#0e1311]'
+          : 'border-white/5 hover:border-white/10'
+      )}
+    >
+      <span className='shrink-0'>
+        {scored ? (
+          <CheckCircle2 className='text-primary h-4 w-4' />
+        ) : (
+          <Circle className='h-4 w-4 text-gray-700' />
+        )}
+      </span>
+      <Avatar className='h-8 w-8 border border-white/10'>
+        <AvatarImage
+          src={submission.participant.user.image}
+          alt={submission.participant.user.name}
+        />
+        <AvatarFallback className='bg-white/5 text-[10px]'>
+          {(submission.participant.user.name ?? '?').slice(0, 2).toUpperCase()}
+        </AvatarFallback>
+      </Avatar>
+      <div className='min-w-0 flex-1'>
+        <div className='flex items-center gap-2'>
+          <p className='truncate text-sm font-medium text-white'>
+            {submission.submission.projectName}
+          </p>
+          {submission.submission.category && (
+            <span className='hidden shrink-0 rounded border border-white/10 bg-white/5 px-1.5 py-0.5 text-[10px] text-gray-400 sm:inline'>
+              {submission.submission.category}
+            </span>
+          )}
+        </div>
+        <p className='mt-0.5 truncate text-xs text-gray-500'>
+          {submission.participant.teamName
+            ? `Team · ${submission.participant.teamName}`
+            : submission.participant.user.name}
+        </p>
+      </div>
+      {scored && submission.myScore && (
+        <span className='shrink-0 rounded-md border border-emerald-700/40 bg-emerald-900/20 px-2 py-0.5 text-xs text-emerald-300 tabular-nums'>
+          {submission.myScore.totalScore.toFixed(1)}
+        </span>
+      )}
+      <ChevronRight className='h-4 w-4 shrink-0 text-gray-700 group-hover:text-gray-400' />
+    </Link>
+  );
+}
+
+function Pagination({
+  page,
+  totalPages,
+  onChange,
+  disabled,
+}: {
+  page: number;
+  totalPages: number;
+  onChange: (p: number) => void;
+  disabled?: boolean;
+}) {
+  return (
+    <div className='flex items-center justify-between text-sm'>
+      <button
+        type='button'
+        onClick={() => onChange(Math.max(1, page - 1))}
+        disabled={page <= 1 || disabled}
+        className='inline-flex items-center gap-1 rounded-md border border-white/10 bg-[#101010] px-3 py-1.5 text-gray-300 disabled:opacity-40'
+      >
+        <ChevronLeft className='h-3.5 w-3.5' /> Previous
+      </button>
+      <span className='text-gray-500'>
+        Page <span className='text-gray-300'>{page}</span>{' '}
+        <span className='text-gray-700'>/ {totalPages}</span>
+      </span>
+      <button
+        type='button'
+        onClick={() => onChange(Math.min(totalPages, page + 1))}
+        disabled={page >= totalPages || disabled}
+        className='inline-flex items-center gap-1 rounded-md border border-white/10 bg-[#101010] px-3 py-1.5 text-gray-300 disabled:opacity-40'
+      >
+        Next <ChevronRight className='h-3.5 w-3.5' />
+      </button>
+    </div>
+  );
+}
+
+function EmptyForFilter({
+  filter,
+  hasSearch,
+  hasAnyOnPage,
+}: {
+  filter: Filter;
+  hasSearch: boolean;
+  hasAnyOnPage: boolean;
+}) {
+  return (
+    <div className='rounded-2xl border border-dashed border-white/10 bg-[#0c0c0c] p-10 text-center'>
+      {filter === 'unscored' && !hasSearch && !hasAnyOnPage ? (
+        <>
+          <CheckCircle2 className='text-primary mx-auto mb-3 h-8 w-8' />
+          <h2 className='text-base font-medium text-white'>
+            You are caught up
+          </h2>
+          <p className='mt-1 text-sm text-gray-500'>
+            Every shortlisted submission has your score.
+          </p>
+        </>
+      ) : (
+        <>
+          <h2 className='text-base font-medium text-white'>Nothing to show</h2>
+          <p className='mt-1 text-sm text-gray-500'>
+            {hasSearch
+              ? 'No submissions match your search.'
+              : 'Switch filters to see other submissions.'}
+          </p>
+        </>
+      )}
+    </div>
+  );
+}
diff --git a/app/judge/invitations/[token]/page.tsx b/app/judge/invitations/[token]/page.tsx
new file mode 100644
index 00000000..762d0cc5
--- /dev/null
+++ b/app/judge/invitations/[token]/page.tsx
@@ -0,0 +1,264 @@
+'use client';
+
+import Link from 'next/link';
+import { useParams, useRouter } from 'next/navigation';
+import { useState } from 'react';
+import { CalendarClock, Gavel, Loader2 } from 'lucide-react';
+import { authClient } from '@/lib/auth-client';
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
+import { Button } from '@/components/ui/button';
+import { HackathonBanner } from '@/components/judge/HackathonBanner';
+import { DeadlineBadge } from '@/components/judge/DeadlineBadge';
+import {
+  useAcceptJudgeInvitation,
+  useDeclineJudgeInvitation,
+  useJudgeInvitationPreview,
+} from '@/hooks/judge/use-judge-queries';
+import { formatJudgeDate } from '@/components/judge/utils';
+
+export default function JudgeInvitationPage() {
+  const params = useParams<{ token: string }>();
+  const router = useRouter();
+  const token = params?.token ?? '';
+
+  const { data: session, isPending: sessionLoading } = authClient.useSession();
+  const { data, isPending, isError, error } = useJudgeInvitationPreview(token);
+
+  const accept = useAcceptJudgeInvitation(token);
+  const decline = useDeclineJudgeInvitation(token);
+
+  const [showDisplayName, setShowDisplayName] = useState(false);
+  const [displayName, setDisplayName] = useState('');
+
+  if (isPending || sessionLoading) {
+    return (
+      <div className='mx-auto max-w-2xl'>
+        <div className='h-40 animate-pulse rounded-2xl bg-white/5 sm:h-52' />
+        <div className='mt-4 h-48 animate-pulse rounded-2xl bg-white/5' />
+      </div>
+    );
+  }
+
+  if (isError || !data) {
+    return (
+      <FailState
+        title='Invitation not found'
+        body={
+          error instanceof Error
+            ? error.message
+            : 'This invitation link is no longer valid.'
+        }
+      />
+    );
+  }
+
+  const isPending_ = data.status === 'PENDING' && !data.isExpired;
+  const emailMismatch =
+    !!session?.user?.email &&
+    session.user.email.toLowerCase() !== data.email.toLowerCase();
+
+  const authReturnPath = `/judge/invitations/${token}`;
+  const signInHref = `/auth?mode=signin&callbackUrl=${encodeURIComponent(authReturnPath)}`;
+  const signUpHref = `/auth?mode=signup&email=${encodeURIComponent(
+    data.email
+  )}&callbackUrl=${encodeURIComponent(authReturnPath)}`;
+
+  const onAccept = () => {
+    if (!session) {
+      router.push(signInHref);
+      return;
+    }
+    accept.mutate(displayName ? { displayName } : {}, {
+      onSuccess: () => router.push(`/judge/${data.hackathon.id}`),
+    });
+  };
+
+  const onDecline = () => {
+    if (!session) {
+      router.push(signInHref);
+      return;
+    }
+    decline.mutate(undefined, {
+      onSuccess: () => router.push('/judge'),
+    });
+  };
+
+  return (
+    <div className='mx-auto max-w-2xl'>
+      <HackathonBanner
+        banner={data.hackathon.banner}
+        name={data.hackathon.name}
+        heightClassName='h-44 sm:h-56'
+      >
+        <div>
+          <p className='inline-flex items-center gap-1.5 rounded-md bg-white/10 px-2 py-0.5 text-[10px] tracking-wider text-white/90 uppercase backdrop-blur'>
+            <Gavel className='h-3 w-3' />
+            Judge invitation
+          </p>
+          <h1 className='mt-2 text-2xl font-semibold tracking-tight text-white sm:text-3xl'>
+            {data.hackathon.name}
+          </h1>
+          {data.hackathon.organization?.name && (
+            <p className='mt-1 text-sm text-white/80'>
+              Hosted by {data.hackathon.organization.name}
+            </p>
+          )}
+        </div>
+      </HackathonBanner>
+
+      <div className='mt-4 rounded-2xl border border-white/5 bg-[#101010] p-6'>
+        {/* Inviter row */}
+        {data.invitedBy && (
+          <div className='flex items-center gap-3'>
+            <Avatar className='h-9 w-9 border border-white/10'>
+              <AvatarImage
+                src={data.invitedBy.image ?? undefined}
+                alt={data.invitedBy.name}
+              />
+              <AvatarFallback className='bg-white/5 text-[10px]'>
+                {(data.invitedBy.name ?? '?').slice(0, 2).toUpperCase()}
+              </AvatarFallback>
+            </Avatar>
+            <p className='text-sm text-gray-300'>
+              <span className='font-medium text-white'>
+                {data.invitedBy.name}
+              </span>{' '}
+              invited{' '}
+              <span className='font-medium text-white'>{data.email}</span>
+            </p>
+          </div>
+        )}
+
+        {/* Optional message */}
+        {data.message && (
+          <blockquote className='border-primary/40 mt-5 rounded-r-md border-l-2 bg-white/[0.02] px-4 py-3 text-sm text-gray-300 italic'>
+            &ldquo;{data.message}&rdquo;
+          </blockquote>
+        )}
+
+        {/* Meta line */}
+        <div className='mt-5 flex flex-wrap items-center gap-2 text-xs text-gray-500'>
+          <DeadlineBadge
+            deadline={data.hackathon.judgingEnd}
+            prefix='Judging ends'
+          />
+          <span className='inline-flex items-center gap-1 rounded-md border border-white/10 bg-white/5 px-2 py-0.5'>
+            <CalendarClock className='h-3 w-3' />
+            Invitation expires {formatJudgeDate(data.expiresAt)}
+          </span>
+        </div>
+
+        {/* Email mismatch */}
+        {emailMismatch && (
+          <p className='mt-5 rounded-md border border-amber-800/40 bg-amber-950/30 p-3 text-xs text-amber-200'>
+            You are signed in as <strong>{session?.user?.email}</strong>. This
+            invitation was sent to <strong>{data.email}</strong>. Sign out and
+            sign in with the invited email to accept.
+          </p>
+        )}
+
+        {/* Action area */}
+        {isPending_ ? (
+          <div className='mt-6 space-y-3'>
+            {!emailMismatch && (
+              <>
+                <div className='flex flex-col gap-2 sm:flex-row'>
+                  <Button
+                    onClick={onAccept}
+                    disabled={accept.isPending}
+                    className='bg-primary hover:bg-primary/90 text-primary-foreground h-11 flex-1 text-sm font-semibold'
+                  >
+                    {accept.isPending ? (
+                      <>
+                        <Loader2 className='mr-2 h-4 w-4 animate-spin' />
+                        Accepting&hellip;
+                      </>
+                    ) : session ? (
+                      'Accept and start judging'
+                    ) : (
+                      'Sign in to accept'
+                    )}
+                  </Button>
+                  <Button
+                    variant='outline'
+                    onClick={onDecline}
+                    disabled={decline.isPending}
+                    className='h-11 border-white/10 bg-transparent text-gray-300 hover:bg-white/5'
+                  >
+                    {decline.isPending ? 'Declining…' : 'Decline'}
+                  </Button>
+                </div>
+
+                {!session ? (
+                  <p className='text-center text-xs text-gray-500'>
+                    New to Boundless?{' '}
+                    <Link
+                      href={signUpHref}
+                      className='text-primary hover:underline'
+                    >
+                      Create an account
+                    </Link>{' '}
+                    with {data.email}.
+                  </p>
+                ) : showDisplayName ? (
+                  <div className='rounded-lg border border-white/5 bg-black/40 p-3'>
+                    <label className='mb-1.5 block text-[10px] tracking-wider text-gray-500 uppercase'>
+                      Public display name (optional)
+                    </label>
+                    <input
+                      type='text'
+                      value={displayName}
+                      maxLength={120}
+                      onChange={e => setDisplayName(e.target.value)}
+                      placeholder={
+                        data.displayName ?? session?.user?.name ?? ''
+                      }
+                      className='focus:border-primary/40 focus:ring-primary/30 w-full rounded-md border border-white/10 bg-black/40 px-3 py-2 text-sm text-white placeholder:text-gray-700 focus:ring-1 focus:outline-none'
+                    />
+                  </div>
+                ) : (
+                  <button
+                    type='button'
+                    onClick={() => setShowDisplayName(true)}
+                    className='text-center text-xs text-gray-500 hover:text-gray-300'
+                  >
+                    Customise display name
+                  </button>
+                )}
+              </>
+            )}
+          </div>
+        ) : (
+          <div className='mt-6'>
+            <p className='text-sm text-gray-400'>
+              {data.isExpired
+                ? 'This invitation has expired. Ask the organizer to send a new one.'
+                : `This invitation is ${data.status.toLowerCase()} and cannot be acted on.`}
+            </p>
+            <Link
+              href='/judge'
+              className='text-primary mt-3 inline-block text-sm hover:underline'
+            >
+              Go to judge portal →
+            </Link>
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}
+
+function FailState({ title, body }: { title: string; body: string }) {
+  return (
+    <div className='mx-auto max-w-md rounded-2xl border border-white/5 bg-[#101010] p-8 text-center'>
+      <h2 className='text-lg font-semibold'>{title}</h2>
+      <p className='mt-2 text-sm text-gray-500'>{body}</p>
+      <Link
+        href='/judge'
+        className='text-primary mt-4 inline-block text-sm hover:underline'
+      >
+        Back to judge portal →
+      </Link>
+    </div>
+  );
+}
diff --git a/app/judge/invitations/page.tsx b/app/judge/invitations/page.tsx
new file mode 100644
index 00000000..327d56fc
--- /dev/null
+++ b/app/judge/invitations/page.tsx
@@ -0,0 +1,104 @@
+'use client';
+
+import Link from 'next/link';
+import { CalendarClock, ChevronRight, Mail } from 'lucide-react';
+import { AuthGuard } from '@/components/auth/AuthGuard';
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
+import { useMyJudgeInvitations } from '@/hooks/judge/use-judge-queries';
+import { formatJudgeDate } from '@/components/judge/utils';
+
+export default function JudgeInvitationsListPage() {
+  return (
+    <AuthGuard redirectTo='/auth?mode=signin'>
+      <InvitationsList />
+    </AuthGuard>
+  );
+}
+
+function InvitationsList() {
+  const { data, isPending, isError } = useMyJudgeInvitations();
+
+  return (
+    <div className='space-y-6'>
+      <header>
+        <h1 className='text-2xl font-semibold tracking-tight'>
+          Pending invitations
+        </h1>
+        <p className='mt-1 text-sm text-gray-500'>
+          Invitations sent to your email that have not been accepted or
+          declined.
+        </p>
+      </header>
+
+      {isPending && (
+        <div className='space-y-3'>
+          {Array.from({ length: 3 }).map((_, i) => (
+            <div
+              key={i}
+              className='h-20 animate-pulse rounded-2xl bg-white/5'
+            />
+          ))}
+        </div>
+      )}
+
+      {isError && (
+        <p className='text-sm text-red-400'>Failed to load invitations.</p>
+      )}
+
+      {!isPending && !isError && (data?.length ?? 0) === 0 && (
+        <div className='rounded-2xl border border-dashed border-white/10 bg-[#0c0c0c] p-12 text-center'>
+          <span className='inline-flex h-12 w-12 items-center justify-center rounded-full bg-white/5 text-gray-500'>
+            <Mail className='h-5 w-5' />
+          </span>
+          <h2 className='mt-4 text-base font-medium text-white'>
+            No pending invitations
+          </h2>
+          <p className='mt-1 text-sm text-gray-500'>
+            Invitations from organizers will land here.
+          </p>
+        </div>
+      )}
+
+      {!isPending && data && data.length > 0 && (
+        <ul className='space-y-3'>
+          {data.map(inv => (
+            <li key={inv.id}>
+              <Link
+                href={`/judge/invitations/${inv.token}`}
+                className='hover:border-primary/30 group flex items-center gap-4 rounded-2xl border border-white/5 bg-[#101010] px-5 py-4 transition-colors hover:bg-[#0e1311]'
+              >
+                <Avatar className='h-10 w-10 rounded-lg border border-white/10'>
+                  <AvatarImage
+                    src={inv.hackathon.organization?.logo ?? undefined}
+                    alt={inv.hackathon.organization?.name ?? ''}
+                    className='rounded-lg'
+                  />
+                  <AvatarFallback className='rounded-lg bg-white/5 text-[11px]'>
+                    {(inv.hackathon.organization?.name ?? inv.hackathon.name)
+                      .slice(0, 2)
+                      .toUpperCase()}
+                  </AvatarFallback>
+                </Avatar>
+                <div className='min-w-0 flex-1'>
+                  <p className='truncate text-sm font-medium text-white'>
+                    {inv.hackathon.name}
+                  </p>
+                  <p className='mt-0.5 truncate text-xs text-gray-500'>
+                    {inv.hackathon.organization?.name && (
+                      <span>{inv.hackathon.organization.name}</span>
+                    )}
+                  </p>
+                </div>
+                <span className='hidden items-center gap-1 rounded-md border border-white/10 bg-white/5 px-2 py-0.5 text-[11px] text-gray-400 sm:inline-flex'>
+                  <CalendarClock className='h-3 w-3' />
+                  Expires {formatJudgeDate(inv.expiresAt)}
+                </span>
+                <ChevronRight className='h-4 w-4 shrink-0 text-gray-700 group-hover:text-gray-400' />
+              </Link>
+            </li>
+          ))}
+        </ul>
+      )}
+    </div>
+  );
+}
diff --git a/app/judge/layout.tsx b/app/judge/layout.tsx
new file mode 100644
index 00000000..1c3a4d98
--- /dev/null
+++ b/app/judge/layout.tsx
@@ -0,0 +1,14 @@
+import type { Metadata } from 'next';
+import { ReactNode } from 'react';
+import { JudgePortalShell } from '@/components/judge/JudgePortalShell';
+
+export const metadata: Metadata = {
+  title: 'Judge Portal — Boundless',
+  description:
+    'Review and score hackathon submissions you have been invited to judge.',
+  robots: { index: false, follow: false },
+};
+
+export default function JudgeLayout({ children }: { children: ReactNode }) {
+  return <JudgePortalShell>{children}</JudgePortalShell>;
+}
diff --git a/app/judge/page.tsx b/app/judge/page.tsx
new file mode 100644
index 00000000..abc59dcc
--- /dev/null
+++ b/app/judge/page.tsx
@@ -0,0 +1,255 @@
+'use client';
+
+import Link from 'next/link';
+import { Gavel, Mail, Trophy } from 'lucide-react';
+import { AuthGuard } from '@/components/auth/AuthGuard';
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
+import { DeadlineBadge } from '@/components/judge/DeadlineBadge';
+import { useJudgeHackathons } from '@/hooks/judge/use-judge-queries';
+import type { JudgeAssignment } from '@/lib/api/judge';
+import { cn } from '@/lib/utils';
+
+export default function JudgeHomePage() {
+  return (
+    <AuthGuard redirectTo='/auth?mode=signin'>
+      <JudgeHome />
+    </AuthGuard>
+  );
+}
+
+type Bucket = 'open' | 'awaiting' | 'past';
+
+function bucketOf(a: JudgeAssignment): Bucket {
+  if (a.hackathon.resultsPublished) return 'past';
+  if (
+    a.hackathon.status === 'COMPLETED' ||
+    a.hackathon.status === 'CANCELLED' ||
+    a.hackathon.status === 'ARCHIVED'
+  ) {
+    return 'past';
+  }
+  // Anything else where results have not been published yet is either
+  // open for judging or waiting on the organizer to publish.
+  if (
+    a.hackathon.totalSubmissions > 0 &&
+    a.hackathon.myScoredCount >= a.hackathon.totalSubmissions
+  ) {
+    return 'awaiting';
+  }
+  return 'open';
+}
+
+function JudgeHome() {
+  const { data, isPending, isError, error } = useJudgeHackathons();
+
+  const grouped = {
+    open: [] as JudgeAssignment[],
+    awaiting: [] as JudgeAssignment[],
+    past: [] as JudgeAssignment[],
+  };
+  for (const a of data ?? []) grouped[bucketOf(a)].push(a);
+
+  return (
+    <div className='space-y-8'>
+      <header>
+        <h1 className='text-2xl font-semibold tracking-tight'>
+          Hackathons you’re judging
+        </h1>
+        <p className='mt-1 text-sm text-gray-500'>
+          You only see hackathons you have been invited to.
+        </p>
+      </header>
+
+      {isPending && (
+        <div className='space-y-3'>
+          {Array.from({ length: 3 }).map((_, i) => (
+            <div
+              key={i}
+              className='h-24 animate-pulse rounded-2xl bg-white/5'
+            />
+          ))}
+        </div>
+      )}
+
+      {isError && (
+        <p className='text-sm text-red-400'>
+          {error instanceof Error ? error.message : 'Failed to load'}
+        </p>
+      )}
+
+      {!isPending && !isError && (data?.length ?? 0) === 0 && <EmptyState />}
+
+      {grouped.open.length > 0 && (
+        <Section title='Open for judging' tone='primary'>
+          <ul className='space-y-3'>
+            {grouped.open.map(a => (
+              <li key={a.hackathon.id}>
+                <AssignmentRow assignment={a} variant='open' />
+              </li>
+            ))}
+          </ul>
+        </Section>
+      )}
+
+      {grouped.awaiting.length > 0 && (
+        <Section title='Waiting on results'>
+          <ul className='space-y-3'>
+            {grouped.awaiting.map(a => (
+              <li key={a.hackathon.id}>
+                <AssignmentRow assignment={a} variant='awaiting' />
+              </li>
+            ))}
+          </ul>
+        </Section>
+      )}
+
+      {grouped.past.length > 0 && (
+        <Section title='Past' muted>
+          <ul className='space-y-3'>
+            {grouped.past.map(a => (
+              <li key={a.hackathon.id}>
+                <AssignmentRow assignment={a} variant='past' />
+              </li>
+            ))}
+          </ul>
+        </Section>
+      )}
+    </div>
+  );
+}
+
+function Section({
+  title,
+  tone,
+  muted,
+  children,
+}: {
+  title: string;
+  tone?: 'primary';
+  muted?: boolean;
+  children: React.ReactNode;
+}) {
+  return (
+    <section>
+      <h2
+        className={cn(
+          'mb-3 text-xs font-medium tracking-wider uppercase',
+          tone === 'primary'
+            ? 'text-primary'
+            : muted
+              ? 'text-gray-600'
+              : 'text-gray-400'
+        )}
+      >
+        {title}
+      </h2>
+      {children}
+    </section>
+  );
+}
+
+function EmptyState() {
+  return (
+    <div className='rounded-2xl border border-dashed border-white/10 bg-[#0c0c0c] p-12 text-center'>
+      <span className='bg-primary/10 text-primary inline-flex h-12 w-12 items-center justify-center rounded-full'>
+        <Gavel className='h-5 w-5' />
+      </span>
+      <h2 className='mt-4 text-base font-medium text-white'>
+        No assignments yet
+      </h2>
+      <p className='mt-1 text-sm text-gray-500'>
+        Invitations from organizers will land here.
+      </p>
+      <Link
+        href='/judge/invitations'
+        className='text-primary mt-4 inline-flex items-center gap-1.5 text-sm hover:underline'
+      >
+        <Mail className='h-3.5 w-3.5' />
+        Check pending invitations
+      </Link>
+    </div>
+  );
+}
+
+function AssignmentRow({
+  assignment,
+  variant,
+}: {
+  assignment: JudgeAssignment;
+  variant: 'open' | 'awaiting' | 'past';
+}) {
+  const h = assignment.hackathon;
+  const pct =
+    h.totalSubmissions > 0
+      ? Math.round((h.myScoredCount / h.totalSubmissions) * 100)
+      : 0;
+
+  return (
+    <Link
+      href={`/judge/${h.id}`}
+      className={cn(
+        'group flex items-center gap-4 rounded-2xl border bg-[#101010] px-5 py-4 transition-all',
+        variant === 'open'
+          ? 'hover:border-primary/30 border-white/5 hover:bg-[#0e1311]'
+          : variant === 'awaiting'
+            ? 'border-white/5 hover:border-white/10'
+            : 'border-white/5 opacity-70 hover:border-white/10 hover:opacity-100'
+      )}
+    >
+      <Avatar className='h-10 w-10 rounded-lg border border-white/10'>
+        <AvatarImage
+          src={h.organization?.logo ?? undefined}
+          alt={h.organization?.name ?? ''}
+          className='rounded-lg'
+        />
+        <AvatarFallback className='rounded-lg bg-white/5 text-[11px]'>
+          {(h.organization?.name ?? h.name).slice(0, 2).toUpperCase()}
+        </AvatarFallback>
+      </Avatar>
+
+      <div className='min-w-0 flex-1'>
+        <div className='flex items-center gap-2'>
+          <h3 className='truncate text-sm font-medium text-white'>{h.name}</h3>
+        </div>
+        <div className='mt-0.5 flex flex-wrap items-center gap-x-2 gap-y-1 text-xs text-gray-500'>
+          {h.organization?.name && <span>{h.organization.name}</span>}
+          {variant !== 'past' && (
+            <>
+              <span className='text-gray-700'>·</span>
+              <DeadlineBadge deadline={h.judgingEnd} />
+            </>
+          )}
+          {variant === 'past' && h.resultsPublished && (
+            <>
+              <span className='text-gray-700'>·</span>
+              <span className='inline-flex items-center gap-1 text-amber-300/80'>
+                <Trophy className='h-3 w-3' /> Results published
+              </span>
+            </>
+          )}
+        </div>
+      </div>
+
+      {variant !== 'past' && (
+        <div className='hidden w-40 sm:block'>
+          <div className='flex items-center justify-between text-[11px] text-gray-500'>
+            <span>
+              <span className='font-medium text-white'>{h.myScoredCount}</span>
+              <span className='text-gray-700'> / {h.totalSubmissions}</span>
+            </span>
+            <span className='text-gray-700'>{pct}%</span>
+          </div>
+          <div className='mt-1.5 h-1.5 overflow-hidden rounded-full bg-white/5'>
+            <div
+              className={cn(
+                'h-full rounded-full transition-[width] duration-700 ease-out',
+                variant === 'open' ? 'bg-primary' : 'bg-gray-600'
+              )}
+              style={{ width: `${pct}%` }}
+            />
+          </div>
+        </div>
+      )}
+    </Link>
+  );
+}
diff --git a/components/auth/SignupForm.tsx b/components/auth/SignupForm.tsx
index adc9d64d..7c7c4c62 100644
--- a/components/auth/SignupForm.tsx
+++ b/components/auth/SignupForm.tsx
@@ -3,7 +3,7 @@ import { zodResolver } from '@hookform/resolvers/zod';
 import { LockIcon, MailIcon, User } from 'lucide-react';
 import Image from 'next/image';
 import Link from 'next/link';
-import { useRouter } from 'next/navigation';
+import { useRouter, useSearchParams } from 'next/navigation';
 import { useEffect } from 'react';
 import { useForm } from 'react-hook-form';
 import { toast } from 'sonner';
@@ -57,12 +57,25 @@ const SignupForm = ({
   lastMethod,
 }: SignupFormProps) => {
   const router = useRouter();
+  const searchParams = useSearchParams();
   const isGoogleLastUsed = lastMethod === 'google';
 
+  // Allow other flows (e.g. judge invitations) to pre-fill the email and
+  // route the user back to where they came from after the signup +
+  // verify roundtrip. Only honors same-origin paths to avoid open
+  // redirects.
+  const prefilledEmail = searchParams.get('email') ?? '';
+  const rawCallbackUrl = searchParams.get('callbackUrl');
+  const safeCallbackUrl =
+    rawCallbackUrl && rawCallbackUrl.startsWith('/') ? rawCallbackUrl : null;
+
   const form = useForm<z.infer<typeof formSchema>>({
     resolver: zodResolver(formSchema),
     defaultValues: {
-      email: defaultEmail ?? '',
+      // Prefer the explicit prop (most callers pass it through from
+      // their own URL parsing) but fall back to ?email= in the URL so
+      // judge-invitation deep links work even without a parent wrapper.
+      email: defaultEmail ?? prefilledEmail,
       firstName: '',
       lastName: '',
       password: '',
@@ -97,9 +110,9 @@ const SignupForm = ({
           toast.success(
             'Verification email sent! Please check your email to verify your account. You will be automatically logged in once verified.'
           );
-          router.push(
-            '/auth/check-email?email=' + encodeURIComponent(values.email)
-          );
+          const params = new URLSearchParams({ email: values.email });
+          if (safeCallbackUrl) params.set('callbackUrl', safeCallbackUrl);
+          router.push(`/auth/check-email?${params.toString()}`);
         },
         onError: ctx => {
           if (ctx.error.status === 409 || ctx.error.code === 'CONFLICT') {
diff --git a/components/judge/CountdownBanner.tsx b/components/judge/CountdownBanner.tsx
new file mode 100644
index 00000000..273bc1eb
--- /dev/null
+++ b/components/judge/CountdownBanner.tsx
@@ -0,0 +1,92 @@
+'use client';
+
+import { useEffect, useState } from 'react';
+import { Clock } from 'lucide-react';
+import { cn } from '@/lib/utils';
+import { formatCountdown, getCountdown } from './utils';
+
+interface CountdownBannerProps {
+  deadline: string | Date | null | undefined;
+  /** Label shown before the countdown, e.g. "Judging closes in". */
+  label?: string;
+  /** Hides the banner entirely when the deadline is further out than this. */
+  showWithinHours?: number;
+  /** Optional copy rendered after the countdown. */
+  hint?: string;
+  /** Custom message when the deadline has passed. */
+  closedLabel?: string;
+  className?: string;
+}
+
+/**
+ * Live deadline ticker. Ticks every second under one hour, every minute
+ * otherwise. Stays out of the way when the deadline is far off, slides
+ * in when it's near, and switches to a closed state past the deadline.
+ */
+export function CountdownBanner({
+  deadline,
+  label = 'Judging closes in',
+  showWithinHours = 48,
+  hint,
+  closedLabel = 'Judging is closed',
+  className,
+}: CountdownBannerProps) {
+  const [now, setNow] = useState<number>(() => Date.now());
+
+  useEffect(() => {
+    if (!deadline) return;
+    const tick = () => setNow(Date.now());
+    tick();
+    // Tick every second under an hour for the live HH:MM:SS feel,
+    // otherwise every minute to keep this cheap.
+    const parts = getCountdown(deadline);
+    const intervalMs = parts.totalMs < 60 * 60 * 1000 ? 1000 : 60_000;
+    const id = window.setInterval(tick, intervalMs);
+    return () => window.clearInterval(id);
+  }, [deadline]);
+
+  if (!deadline) return null;
+  const parts = getCountdown(deadline, now);
+
+  if (parts.isPast) {
+    return (
+      <div
+        className={cn(
+          'flex items-center gap-2 rounded-xl border border-red-900/40 bg-red-950/30 px-4 py-2.5 text-sm text-red-200',
+          className
+        )}
+      >
+        <Clock className='h-4 w-4 shrink-0' />
+        <span className='font-medium'>{closedLabel}</span>
+        {hint && <span className='text-red-300/70'>· {hint}</span>}
+      </div>
+    );
+  }
+
+  const hoursLeft = parts.days * 24 + parts.hours;
+  if (hoursLeft > showWithinHours) return null;
+
+  const tone =
+    hoursLeft < 1
+      ? 'border-red-900/40 bg-red-950/30 text-red-200'
+      : hoursLeft < 6
+        ? 'border-amber-800/40 bg-amber-950/30 text-amber-200'
+        : 'border-amber-900/30 bg-amber-950/20 text-amber-200/90';
+
+  return (
+    <div
+      className={cn(
+        'flex items-center gap-2 rounded-xl border px-4 py-2.5 text-sm',
+        tone,
+        className
+      )}
+    >
+      <Clock className='h-4 w-4 shrink-0' />
+      <span>{label}</span>
+      <span className='font-mono font-semibold tabular-nums'>
+        {formatCountdown(parts)}
+      </span>
+      {hint && <span className='ml-auto text-xs opacity-70'>{hint}</span>}
+    </div>
+  );
+}
diff --git a/components/judge/DeadlineBadge.tsx b/components/judge/DeadlineBadge.tsx
new file mode 100644
index 00000000..5df0e6d5
--- /dev/null
+++ b/components/judge/DeadlineBadge.tsx
@@ -0,0 +1,61 @@
+'use client';
+
+import { Clock } from 'lucide-react';
+import { cn } from '@/lib/utils';
+
+interface DeadlineBadgeProps {
+  deadline: string | Date | null | undefined;
+  /** Optional label prefix, eg "Judging ends". Defaults to no prefix. */
+  prefix?: string;
+  className?: string;
+}
+
+function dayDiff(target: Date): number {
+  const ms = target.getTime() - Date.now();
+  return Math.round(ms / (1000 * 60 * 60 * 24));
+}
+
+export function DeadlineBadge({
+  deadline,
+  prefix,
+  className,
+}: DeadlineBadgeProps) {
+  if (!deadline) return null;
+  const d = typeof deadline === 'string' ? new Date(deadline) : deadline;
+  if (Number.isNaN(d.getTime())) return null;
+
+  const days = dayDiff(d);
+  let tone: string;
+  let text: string;
+
+  if (days < 0) {
+    tone = 'border-red-900/40 bg-red-950/40 text-red-300';
+    text = `${Math.abs(days)} day${Math.abs(days) === 1 ? '' : 's'} overdue`;
+  } else if (days === 0) {
+    tone = 'border-amber-800/40 bg-amber-950/40 text-amber-200';
+    text = 'Ends today';
+  } else if (days <= 2) {
+    tone = 'border-amber-800/40 bg-amber-950/40 text-amber-200';
+    text = `${days} day${days === 1 ? '' : 's'} left`;
+  } else if (days <= 7) {
+    tone = 'border-amber-900/30 bg-amber-950/20 text-amber-300/80';
+    text = `${days} days left`;
+  } else {
+    tone = 'border-white/10 bg-white/5 text-gray-400';
+    text = `${days} days left`;
+  }
+
+  return (
+    <span
+      className={cn(
+        'inline-flex items-center gap-1 rounded-md border px-2 py-0.5 text-[11px] font-medium',
+        tone,
+        className
+      )}
+    >
+      <Clock className='h-3 w-3' />
+      {prefix && <span className='text-gray-500'>{prefix}</span>}
+      {text}
+    </span>
+  );
+}
diff --git a/components/judge/HackathonBanner.tsx b/components/judge/HackathonBanner.tsx
new file mode 100644
index 00000000..efb76186
--- /dev/null
+++ b/components/judge/HackathonBanner.tsx
@@ -0,0 +1,72 @@
+'use client';
+
+import Image from 'next/image';
+import { cn } from '@/lib/utils';
+
+interface HackathonBannerProps {
+  banner?: string | null;
+  name?: string;
+  /** Height class, eg "h-44" or "h-64". Defaults to a responsive value. */
+  heightClassName?: string;
+  /** Optional overlay content rendered on top of the banner. */
+  children?: React.ReactNode;
+  className?: string;
+}
+
+/**
+ * Hero banner for judge surfaces. Falls back to a brand-tinted gradient
+ * when no image is available, so empty hackathons still feel intentional.
+ */
+export function HackathonBanner({
+  banner,
+  name,
+  heightClassName = 'h-40 sm:h-52',
+  children,
+  className,
+}: HackathonBannerProps) {
+  return (
+    <div
+      className={cn(
+        'relative w-full overflow-hidden rounded-2xl border border-white/5',
+        heightClassName,
+        className
+      )}
+    >
+      {banner ? (
+        <Image
+          src={banner}
+          alt={`${name ?? 'Hackathon'} banner`}
+          fill
+          sizes='(max-width: 768px) 100vw, 960px'
+          className='object-cover'
+          priority={false}
+        />
+      ) : (
+        <div
+          className='absolute inset-0'
+          style={{
+            background:
+              'radial-gradient(120% 80% at 80% 0%, rgba(46,237,170,0.18) 0%, rgba(46,237,170,0) 55%), linear-gradient(135deg, #0f1411 0%, #060708 100%)',
+          }}
+        >
+          <div
+            className='absolute inset-0 opacity-[0.04]'
+            style={{
+              backgroundImage:
+                'radial-gradient(rgba(255,255,255,0.6) 1px, transparent 1px)',
+              backgroundSize: '20px 20px',
+            }}
+          />
+        </div>
+      )}
+
+      <div className='absolute inset-x-0 bottom-0 h-1/2 bg-gradient-to-t from-black/85 via-black/40 to-transparent' />
+
+      {children && (
+        <div className='absolute inset-0 flex items-end p-5 sm:p-6'>
+          <div className='w-full'>{children}</div>
+        </div>
+      )}
+    </div>
+  );
+}
diff --git a/components/judge/JudgePortalShell.tsx b/components/judge/JudgePortalShell.tsx
new file mode 100644
index 00000000..3e2bbc9d
--- /dev/null
+++ b/components/judge/JudgePortalShell.tsx
@@ -0,0 +1,97 @@
+'use client';
+
+import Link from 'next/link';
+import { usePathname } from 'next/navigation';
+import { ReactNode } from 'react';
+import { Gavel } from 'lucide-react';
+import { authClient } from '@/lib/auth-client';
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
+import { cn } from '@/lib/utils';
+
+/**
+ * Judge portal shell. Distinct from the org dashboard on purpose:
+ * minimal chrome, sticky top bar, no sidebar. The work happens in the
+ * main column.
+ */
+export function JudgePortalShell({ children }: { children: ReactNode }) {
+  const { data: session } = authClient.useSession();
+  const user = session?.user;
+  const pathname = usePathname();
+
+  return (
+    <div className='min-h-screen bg-[#030303] text-white'>
+      <header className='sticky top-0 z-30 border-b border-white/5 bg-[#030303]/85 backdrop-blur supports-[backdrop-filter]:bg-[#030303]/70'>
+        <div className='mx-auto flex h-14 max-w-6xl items-center justify-between px-4 sm:px-6'>
+          <Link
+            href='/judge'
+            className='group flex items-center gap-2 text-sm font-semibold tracking-tight'
+          >
+            <span className='bg-primary/15 text-primary inline-flex h-7 w-7 items-center justify-center rounded-md'>
+              <Gavel className='h-3.5 w-3.5' />
+            </span>
+            <span className='leading-tight'>
+              Judge Portal
+              <span className='ml-2 hidden text-xs font-normal text-gray-600 sm:inline'>
+                Boundless
+              </span>
+            </span>
+          </Link>
+
+          <nav className='flex items-center gap-1 text-sm text-gray-400'>
+            <ShellLink
+              href='/judge'
+              active={pathname === '/judge'}
+              label='Assignments'
+            />
+            <ShellLink
+              href='/judge/invitations'
+              active={pathname?.startsWith('/judge/invitations') ?? false}
+              label='Invitations'
+            />
+            <span className='mx-2 hidden h-4 w-px bg-white/10 sm:inline-block' />
+            <Link
+              href='/'
+              className='hidden rounded-md px-2 py-1 text-xs text-gray-500 hover:text-gray-200 sm:inline-block'
+            >
+              Exit portal
+            </Link>
+            {user && (
+              <Avatar className='ml-2 h-7 w-7 border border-white/10'>
+                <AvatarImage src={user.image ?? undefined} alt={user.name} />
+                <AvatarFallback className='bg-white/5 text-[10px]'>
+                  {(user.name ?? user.email ?? '?').slice(0, 2).toUpperCase()}
+                </AvatarFallback>
+              </Avatar>
+            )}
+          </nav>
+        </div>
+      </header>
+
+      <main className='mx-auto max-w-6xl px-4 py-8 sm:px-6'>{children}</main>
+    </div>
+  );
+}
+
+function ShellLink({
+  href,
+  label,
+  active,
+}: {
+  href: string;
+  label: string;
+  active: boolean;
+}) {
+  return (
+    <Link
+      href={href}
+      className={cn(
+        'rounded-md px-2.5 py-1 transition-colors',
+        active
+          ? 'bg-white/8 text-white'
+          : 'text-gray-400 hover:bg-white/5 hover:text-gray-100'
+      )}
+    >
+      {label}
+    </Link>
+  );
+}
diff --git a/components/judge/KeyboardShortcuts.tsx b/components/judge/KeyboardShortcuts.tsx
new file mode 100644
index 00000000..d1ea2ec7
--- /dev/null
+++ b/components/judge/KeyboardShortcuts.tsx
@@ -0,0 +1,99 @@
+'use client';
+
+import { useEffect, useState } from 'react';
+import { Keyboard } from 'lucide-react';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogHeader,
+  DialogTitle,
+} from '@/components/ui/dialog';
+
+export interface ShortcutDef {
+  keys: string[];
+  description: string;
+}
+
+interface KeyboardShortcutsProps {
+  shortcuts: ShortcutDef[];
+  /** When provided, pressing this key toggles the dialog. Defaults to '?'. */
+  triggerKey?: string;
+}
+
+export function KeyboardShortcuts({
+  shortcuts,
+  triggerKey = '?',
+}: KeyboardShortcutsProps) {
+  const [open, setOpen] = useState(false);
+
+  useEffect(() => {
+    const onKey = (e: KeyboardEvent) => {
+      const target = e.target as HTMLElement | null;
+      if (
+        target &&
+        (target.tagName === 'INPUT' ||
+          target.tagName === 'TEXTAREA' ||
+          target.isContentEditable)
+      ) {
+        return;
+      }
+      if (e.key === triggerKey || (e.key === '/' && e.shiftKey)) {
+        e.preventDefault();
+        setOpen(p => !p);
+      } else if (e.key === 'Escape') {
+        setOpen(false);
+      }
+    };
+    window.addEventListener('keydown', onKey);
+    return () => window.removeEventListener('keydown', onKey);
+  }, [triggerKey]);
+
+  return (
+    <>
+      <button
+        type='button'
+        onClick={() => setOpen(true)}
+        className='inline-flex items-center gap-1.5 rounded-md border border-white/10 bg-white/5 px-2.5 py-1 text-xs text-gray-400 hover:border-white/20 hover:text-white'
+        title='Keyboard shortcuts (press ?)'
+      >
+        <Keyboard className='h-3.5 w-3.5' />
+        <span className='hidden sm:inline'>Shortcuts</span>
+        <kbd className='rounded border border-white/10 bg-black/40 px-1 font-mono text-[10px] text-gray-500'>
+          ?
+        </kbd>
+      </button>
+
+      <Dialog open={open} onOpenChange={setOpen}>
+        <DialogContent className='border-white/10 bg-[#101010] text-white sm:max-w-md'>
+          <DialogHeader>
+            <DialogTitle>Keyboard shortcuts</DialogTitle>
+            <DialogDescription className='text-gray-500'>
+              Speed through the queue without leaving the keyboard.
+            </DialogDescription>
+          </DialogHeader>
+          <ul className='mt-2 space-y-1.5'>
+            {shortcuts.map((s, i) => (
+              <li
+                key={i}
+                className='flex items-center justify-between gap-3 rounded-md px-2 py-1.5 text-sm hover:bg-white/5'
+              >
+                <span className='text-gray-300'>{s.description}</span>
+                <span className='flex shrink-0 items-center gap-1'>
+                  {s.keys.map((k, j) => (
+                    <kbd
+                      key={j}
+                      className='rounded border border-white/10 bg-black/40 px-1.5 py-0.5 font-mono text-[11px] text-gray-300'
+                    >
+                      {k}
+                    </kbd>
+                  ))}
+                </span>
+              </li>
+            ))}
+          </ul>
+        </DialogContent>
+      </Dialog>
+    </>
+  );
+}
diff --git a/components/judge/ProgressRing.tsx b/components/judge/ProgressRing.tsx
new file mode 100644
index 00000000..3c259436
--- /dev/null
+++ b/components/judge/ProgressRing.tsx
@@ -0,0 +1,86 @@
+'use client';
+
+import { cn } from '@/lib/utils';
+
+interface ProgressRingProps {
+  value: number;
+  total: number;
+  size?: number;
+  strokeWidth?: number;
+  label?: React.ReactNode;
+  sublabel?: React.ReactNode;
+  className?: string;
+  /** When true, the ring renders muted (e.g. results published already). */
+  done?: boolean;
+}
+
+export function ProgressRing({
+  value,
+  total,
+  size = 144,
+  strokeWidth = 10,
+  label,
+  sublabel,
+  className,
+  done = false,
+}: ProgressRingProps) {
+  const safeTotal = Math.max(total, 0);
+  const safeValue = Math.min(Math.max(value, 0), safeTotal);
+  const pct = safeTotal === 0 ? 0 : safeValue / safeTotal;
+  const radius = (size - strokeWidth) / 2;
+  const circumference = radius * 2 * Math.PI;
+  const offset = circumference * (1 - pct);
+  const stroke = done ? 'stroke-gray-600' : 'stroke-primary';
+
+  return (
+    <div
+      className={cn(
+        'relative inline-flex items-center justify-center',
+        className
+      )}
+      style={{ width: size, height: size }}
+    >
+      <svg width={size} height={size} className='-rotate-90'>
+        <circle
+          cx={size / 2}
+          cy={size / 2}
+          r={radius}
+          fill='none'
+          strokeWidth={strokeWidth}
+          className='stroke-gray-900/80'
+        />
+        <circle
+          cx={size / 2}
+          cy={size / 2}
+          r={radius}
+          fill='none'
+          strokeWidth={strokeWidth}
+          strokeLinecap='round'
+          className={cn(
+            stroke,
+            'transition-[stroke-dashoffset] duration-700 ease-out'
+          )}
+          style={{
+            strokeDasharray: circumference,
+            strokeDashoffset: offset,
+          }}
+        />
+      </svg>
+      <div className='absolute inset-0 flex flex-col items-center justify-center text-center'>
+        <div className='text-2xl font-semibold tracking-tight text-white'>
+          {label ?? (
+            <>
+              {safeValue}
+              <span className='text-gray-600'>/{safeTotal}</span>
+            </>
+          )}
+        </div>
+        {sublabel && (
+          <div className='mt-0.5 text-[10px] tracking-wider text-gray-500 uppercase'>
+            {sublabel}
+          </div>
+        )}
+      </div>
+    </div>
+  );
+}
diff --git a/components/judge/ScoreSlider.tsx b/components/judge/ScoreSlider.tsx
new file mode 100644
index 00000000..fbfdff1a
--- /dev/null
+++ b/components/judge/ScoreSlider.tsx
@@ -0,0 +1,170 @@
+'use client';
+
+import { ChangeEvent, useRef } from 'react';
+import { cn } from '@/lib/utils';
+
+interface ScoreSliderProps {
+  value: number | '';
+  onChange: (next: number | '') => void;
+  min?: number;
+  max?: number;
+  step?: number;
+  label: string;
+  weight?: number;
+  description?: string;
+  error?: string | null;
+  isFocused?: boolean;
+  onFocus?: () => void;
+  onBlur?: () => void;
+  inputId?: string;
+  /** Optional comment box rendered below the slider. */
+  comment?: string;
+  onCommentChange?: (value: string) => void;
+  commentPlaceholder?: string;
+  onSubmitWithEnter?: () => void;
+  onAdvance?: () => void;
+  /** Render in read-only mode (post-deadline). */
+  disabled?: boolean;
+}
+
+export function ScoreSlider({
+  value,
+  onChange,
+  min = 0,
+  max = 10,
+  step = 0.1,
+  label,
+  weight,
+  description,
+  error,
+  isFocused,
+  onFocus,
+  onBlur,
+  inputId,
+  comment,
+  onCommentChange,
+  commentPlaceholder,
+  onSubmitWithEnter,
+  onAdvance,
+  disabled = false,
+}: ScoreSliderProps) {
+  const sliderRef = useRef<HTMLInputElement>(null);
+  const numericValue = typeof value === 'number' ? value : 0;
+  const pct = ((numericValue - min) / (max - min)) * 100;
+
+  const handleSlider = (e: ChangeEvent<HTMLInputElement>) => {
+    const next = parseFloat(e.target.value);
+    if (Number.isNaN(next)) return;
+    onChange(Math.round(next * 10) / 10);
+  };
+
+  const handleNumberInput = (e: ChangeEvent<HTMLInputElement>) => {
+    const raw = e.target.value;
+    if (raw === '') {
+      onChange('');
+      return;
+    }
+    const next = parseFloat(raw);
+    if (Number.isNaN(next)) return;
+    onChange(Math.min(max, Math.max(min, Math.round(next * 10) / 10)));
+  };
+
+  return (
+    <div
+      className={cn(
+        'rounded-xl border bg-[#101010] p-5 transition-all',
+        isFocused
+          ? 'border-primary/40 shadow-[0_0_0_1px_rgba(46,237,170,0.2)]'
+          : 'border-white/5 hover:border-white/10',
+        error && 'border-red-500/40',
+        disabled && 'pointer-events-none opacity-60'
+      )}
+      aria-disabled={disabled || undefined}
+    >
+      <div className='flex items-start justify-between gap-4'>
+        <div className='min-w-0 flex-1'>
+          <div className='flex items-center gap-2'>
+            <h4 className='text-sm font-medium text-white'>{label}</h4>
+            {typeof weight === 'number' && (
+              <span className='rounded border border-white/10 bg-white/5 px-1.5 py-0.5 text-[10px] text-gray-400'>
+                {weight}%
+              </span>
+            )}
+          </div>
+          {description && (
+            <p className='mt-1 text-xs leading-relaxed text-gray-500'>
+              {description}
+            </p>
+          )}
+        </div>
+        <div className='flex items-baseline gap-1 tabular-nums'>
+          <input
+            type='number'
+            min={min}
+            max={max}
+            step={step}
+            value={value === '' ? '' : numericValue}
+            onChange={handleNumberInput}
+            onFocus={onFocus}
+            onBlur={onBlur}
+            id={inputId}
+            disabled={disabled}
+            className={cn(
+              'w-14 rounded border border-white/10 bg-black/40 px-2 py-1 text-right text-xl font-semibold text-white outline-none',
+              'focus:border-primary/40 focus:ring-primary/30 focus:ring-1',
+              disabled && 'cursor-not-allowed'
+            )}
+            placeholder='—'
+          />
+          <span className='text-xs text-gray-600'>/{max}</span>
+        </div>
+      </div>
+
+      <div className='mt-4'>
+        <input
+          ref={sliderRef}
+          type='range'
+          min={min}
+          max={max}
+          step={step}
+          value={numericValue}
+          onChange={handleSlider}
+          onFocus={onFocus}
+          onBlur={onBlur}
+          disabled={disabled}
+          onKeyDown={e => {
+            if (e.key === 'Enter') {
+              e.preventDefault();
+              if (onAdvance) onAdvance();
+              else if (onSubmitWithEnter) onSubmitWithEnter();
+            }
+          }}
+          className='judge-slider w-full'
+          style={
+            {
+              ['--judge-slider-pct' as string]: `${pct}%`,
+            } as React.CSSProperties
+          }
+          aria-label={label}
+        />
+      </div>
+
+      {onCommentChange && (
+        <textarea
+          value={comment ?? ''}
+          onChange={e => onCommentChange(e.target.value)}
+          placeholder={commentPlaceholder ?? 'Optional note for the team'}
+          rows={2}
+          disabled={disabled}
+          className={cn(
+            'mt-3 w-full resize-none rounded-lg border border-white/5 bg-black/40 p-2.5 text-sm text-gray-200 placeholder:text-gray-700',
+            'focus:border-primary/40 focus:ring-primary/30 focus:ring-1 focus:outline-none',
+            disabled && 'cursor-not-allowed'
+          )}
+        />
+      )}
+
+      {error && <p className='mt-2 text-xs text-red-400'>{error}</p>}
+    </div>
+  );
+}
diff --git a/components/judge/utils.ts b/components/judge/utils.ts
new file mode 100644
index 00000000..16c1014b
--- /dev/null
+++ b/components/judge/utils.ts
@@ -0,0 +1,92 @@
+export function formatJudgeDate(
+  value: string | Date | null | undefined
+): string {
+  if (!value) return '—';
+  const d = typeof value === 'string' ? new Date(value) : value;
+  if (Number.isNaN(d.getTime())) return '—';
+  return d.toLocaleDateString(undefined, {
+    day: 'numeric',
+    month: 'short',
+    year: 'numeric',
+  });
+}
+
+export function relativeDeadline(
+  value: string | Date | null | undefined
+): string {
+  if (!value) return '';
+  const d = typeof value === 'string' ? new Date(value) : value;
+  const diffMs = d.getTime() - Date.now();
+  const diffDays = Math.round(diffMs / (1000 * 60 * 60 * 24));
+  if (Number.isNaN(diffMs)) return '';
+  if (diffDays === 0) return 'today';
+  if (diffDays === 1) return 'tomorrow';
+  if (diffDays === -1) return 'yesterday';
+  if (diffDays > 0) return `in ${diffDays} days`;
+  return `${Math.abs(diffDays)} days ago`;
+}
+
+/** Break a future date into a `{days, hours, minutes, seconds}` countdown. */
+export interface CountdownParts {
+  isPast: boolean;
+  totalMs: number;
+  days: number;
+  hours: number;
+  minutes: number;
+  seconds: number;
+}
+
+export function getCountdown(
+  value: string | Date | null | undefined,
+  now: number = Date.now()
+): CountdownParts {
+  if (!value) {
+    return {
+      isPast: true,
+      totalMs: 0,
+      days: 0,
+      hours: 0,
+      minutes: 0,
+      seconds: 0,
+    };
+  }
+  const target =
+    typeof value === 'string' ? new Date(value).getTime() : value.getTime();
+  const diff = target - now;
+  if (Number.isNaN(diff)) {
+    return {
+      isPast: true,
+      totalMs: 0,
+      days: 0,
+      hours: 0,
+      minutes: 0,
+      seconds: 0,
+    };
+  }
+  if (diff <= 0) {
+    return {
+      isPast: true,
+      totalMs: diff,
+      days: 0,
+      hours: 0,
+      minutes: 0,
+      seconds: 0,
+    };
+  }
+  const days = Math.floor(diff / (1000 * 60 * 60 * 24));
+  const hours = Math.floor((diff % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
+  const minutes = Math.floor((diff % (1000 * 60 * 60)) / (1000 * 60));
+  const seconds = Math.floor((diff % (1000 * 60)) / 1000);
+  return { isPast: false, totalMs: diff, days, hours, minutes, seconds };
+}
+
+export function formatCountdown(parts: CountdownParts): string {
+  if (parts.isPast) return 'Closed';
+  if (parts.days >= 1) {
+    return `${parts.days}d ${parts.hours}h`;
+  }
+  if (parts.hours >= 1) {
+    return `${parts.hours}h ${String(parts.minutes).padStart(2, '0')}m`;
+  }
+  return `${parts.minutes}m ${String(parts.seconds).padStart(2, '0')}s`;
+}
diff --git a/components/organization/cards/GradeSubmissionModal/ScoringSection.tsx b/components/organization/cards/GradeSubmissionModal/ScoringSection.tsx
index 5887c88a..e264cf70 100644
--- a/components/organization/cards/GradeSubmissionModal/ScoringSection.tsx
+++ b/components/organization/cards/GradeSubmissionModal/ScoringSection.tsx
@@ -21,6 +21,12 @@ interface ScoringSectionProps {
     criterionKey: string
   ) => void;
   getScoreColor: (percentage: number) => string;
+  /**
+   * Returns the relative weight of a criterion as a 0-100 percentage.
+   * Used so the "X% weight" badge stays honest regardless of how the
+   * organizer chose to scale weights.
+   */
+  getWeightPercent?: (criterion: JudgingCriterion) => number;
   overallComment: string;
   onOverallCommentChange: (value: string) => void;
   showComments?: boolean;
@@ -38,12 +44,13 @@ export const ScoringSection = ({
   onInputBlur,
   onKeyDown,
   getScoreColor,
+  getWeightPercent,
   overallComment,
   onOverallCommentChange,
   showComments = true,
 }: ScoringSectionProps) => {
   const getCriterionKey = (criterion: JudgingCriterion) => {
-    return criterion.id || criterion.name || criterion.title;
+    return criterion.id;
   };
 
   const scoredCount = criteria.filter(c => {
@@ -94,7 +101,10 @@ export const ScoringSection = ({
                       {criterionTitle}
                     </span>
                     <Badge className='rounded border border-gray-700 bg-gray-800 px-2 py-0.5 text-xs text-gray-400'>
-                      {criterion.weight}% weight
+                      {getWeightPercent
+                        ? getWeightPercent(criterion)
+                        : criterion.weight}
+                      % weight
                     </Badge>
                   </div>
                   {criterion.description && (
diff --git a/components/organization/cards/GradeSubmissionModal/TotalScoreCard.tsx b/components/organization/cards/GradeSubmissionModal/TotalScoreCard.tsx
index 31878019..ab6bbeb5 100644
--- a/components/organization/cards/GradeSubmissionModal/TotalScoreCard.tsx
+++ b/components/organization/cards/GradeSubmissionModal/TotalScoreCard.tsx
@@ -36,7 +36,7 @@ export const TotalScoreCard = ({
               <span className='text-4xl font-bold text-white'>
                 {totalScore.toFixed(1)}
               </span>
-              <span className='text-xl text-gray-500'>/ 100</span>
+              <span className='text-xl text-gray-500'>/ 10</span>
             </div>
           </div>
           <div
diff --git a/components/organization/cards/GradeSubmissionModal/index.tsx b/components/organization/cards/GradeSubmissionModal/index.tsx
index db80b55e..b9af98f5 100644
--- a/components/organization/cards/GradeSubmissionModal/index.tsx
+++ b/components/organization/cards/GradeSubmissionModal/index.tsx
@@ -1,5 +1,8 @@
 import BoundlessSheet from '@/components/sheet/boundless-sheet';
-import type { JudgingCriterion } from '@/lib/api/hackathons/judging';
+import {
+  disqualifySubmission,
+  type JudgingCriterion,
+} from '@/lib/api/hackathons/judging';
 import { ProjectHeader } from './ProjectHeader';
 import { ScoringSection } from './ScoringSection';
 import { TotalScoreCard } from './TotalScoreCard';
@@ -11,9 +14,12 @@ import { useScoreCalculation } from './useScoreCalculation';
 import { useJudgingCriteria } from './useJudgingCriteria';
 import { useSubmissionScores } from './useSubmissionScores';
 import { useScoreForm } from './useScoreForm';
+import { DisqualifyDialog } from '@/components/organization/hackathons/submissions/DisqualifyDialog';
 import { Switch } from '@/components/ui/switch';
 import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
 import { Badge } from '@/components/ui/badge';
+import { Ban } from 'lucide-react';
+import { toast } from 'sonner';
 import {
   Select,
   SelectContent,
@@ -77,6 +83,31 @@ export default function GradeSubmissionModal({
   const [selectedJudgeId, setSelectedJudgeId] = useState<string | undefined>(
     overrideJudgeId
   );
+  const [disqualifyOpen, setDisqualifyOpen] = useState(false);
+  const [isDisqualifying, setIsDisqualifying] = useState(false);
+
+  const handleDisqualify = async (reason: string) => {
+    setIsDisqualifying(true);
+    try {
+      const res = await disqualifySubmission(
+        organizationId,
+        hackathonId,
+        participantId,
+        reason
+      );
+      if (res.success) {
+        toast.success('Submission disqualified');
+        onSuccess?.();
+        onOpenChange(false);
+      } else {
+        toast.error(res.message || 'Failed to disqualify submission');
+      }
+    } catch (e: any) {
+      toast.error(e?.message || 'Failed to disqualify submission');
+    } finally {
+      setIsDisqualifying(false);
+    }
+  };
 
   const availableJudges = judges
     .map(j => ({
@@ -160,10 +191,11 @@ export default function GradeSubmissionModal({
     onClose: () => onOpenChange(false),
   });
 
-  const { totalScore, percentage, getScoreColor } = useScoreCalculation({
-    criteria,
-    scores,
-  });
+  const { totalScore, percentage, getScoreColor, getWeightPercent } =
+    useScoreCalculation({
+      criteria,
+      scores,
+    });
 
   return (
     <BoundlessSheet
@@ -209,6 +241,14 @@ export default function GradeSubmissionModal({
                       />
                       <span>Credit judge</span>
                     </div>
+                    <button
+                      type='button'
+                      onClick={() => setDisqualifyOpen(true)}
+                      className='ml-auto inline-flex items-center gap-1 text-[11px] text-amber-200/80 underline-offset-2 hover:text-amber-100 hover:underline'
+                    >
+                      <Ban className='h-3 w-3' />
+                      Disqualify submission
+                    </button>
                     {creditJudge && (
                       <div className='min-w-[220px]'>
                         <Select
@@ -278,6 +318,7 @@ export default function GradeSubmissionModal({
                     onInputBlur={handleInputBlur}
                     onKeyDown={handleKeyDown}
                     getScoreColor={getScoreColor}
+                    getWeightPercent={getWeightPercent}
                     overallComment={overallComment}
                     onOverallCommentChange={setOverallComment}
                     showComments={true}
@@ -354,6 +395,15 @@ export default function GradeSubmissionModal({
             />
           </div>
         </div>
+
+        {/* Organizer convenience: open the same DisqualifyDialog used
+            from the submissions page, scoped to this submission. */}
+        <DisqualifyDialog
+          open={disqualifyOpen}
+          onOpenChange={setDisqualifyOpen}
+          onSubmit={handleDisqualify}
+          isSubmitting={isDisqualifying}
+        />
       </div>
     </BoundlessSheet>
   );
diff --git a/components/organization/cards/GradeSubmissionModal/useScoreCalculation.ts b/components/organization/cards/GradeSubmissionModal/useScoreCalculation.ts
index 309380cb..afe95df3 100644
--- a/components/organization/cards/GradeSubmissionModal/useScoreCalculation.ts
+++ b/components/organization/cards/GradeSubmissionModal/useScoreCalculation.ts
@@ -6,28 +6,58 @@ interface UseScoreCalculationProps {
   scores: Record<string, number | string>;
 }
 
+/**
+ * Weighted-average scoring math for the legacy grading modal.
+ *
+ * `totalScore` is a 0-10 weighted average: each criterion's score is in
+ * 0-10, and the contribution is `score * weight / sum(weights)`. The
+ * answer stays in 0-10 regardless of what scale the weights are entered
+ * on (the previous implementation divided by a hardcoded 10, which only
+ * gave correct totals when weights happened to sum to 100).
+ *
+ * `percentage` is the same value expressed as 0-100 for the progress bar
+ * and color tone thresholds.
+ *
+ * `getWeightPercent(criterion)` returns the display "% weight" — the
+ * relative contribution of the criterion, which is what an organizer or
+ * judge actually wants to see. With weights `[1, 1]` it returns `50%`
+ * each; with `[50, 50]` it also returns `50%` each.
+ */
 export const useScoreCalculation = ({
   criteria,
   scores,
 }: UseScoreCalculationProps) => {
-  const totalScore = useMemo(() => {
-    if (criteria.length === 0) return 0;
+  const totalWeight = useMemo(
+    () =>
+      criteria.reduce(
+        (sum, c) => sum + (typeof c.weight === 'number' ? c.weight : 0),
+        0
+      ),
+    [criteria]
+  );
 
-    let totalWeightedScore = 0;
-    let totalWeight = 0;
+  const totalScore = useMemo(() => {
+    if (criteria.length === 0 || totalWeight === 0) return 0;
 
+    let weightedSum = 0;
     criteria.forEach(criterion => {
-      const key = criterion.id || criterion.name || criterion.title;
       const score =
-        typeof scores[key] === 'number' ? (scores[key] as number) : 0;
-      totalWeightedScore += score * criterion.weight;
-      totalWeight += criterion.weight;
+        typeof scores[criterion.id] === 'number'
+          ? (scores[criterion.id] as number)
+          : 0;
+      weightedSum += score * (criterion.weight ?? 0);
     });
 
-    return totalWeight > 0 ? totalWeightedScore / 10 : 0;
-  }, [criteria, scores]);
+    // Result is in 0-10 regardless of the absolute weight scale.
+    return weightedSum / totalWeight;
+  }, [criteria, scores, totalWeight]);
 
-  const percentage = useMemo(() => Math.round(totalScore), [totalScore]);
+  const percentage = useMemo(() => Math.round(totalScore * 10), [totalScore]);
+
+  const getWeightPercent = (criterion: JudgingCriterion): number => {
+    if (totalWeight === 0) return 0;
+    return Math.round(((criterion.weight ?? 0) / totalWeight) * 100);
+  };
 
   const getScoreColor = (percentage: number): string => {
     if (percentage >= 80) return 'bg-primary text-background';
@@ -39,6 +69,8 @@ export const useScoreCalculation = ({
   return {
     totalScore,
     percentage,
+    totalWeight,
+    getWeightPercent,
     getScoreColor,
   };
 };
diff --git a/components/organization/cards/GradeSubmissionModal/useScoreForm.ts b/components/organization/cards/GradeSubmissionModal/useScoreForm.ts
index 46339b41..50a20c13 100644
--- a/components/organization/cards/GradeSubmissionModal/useScoreForm.ts
+++ b/components/organization/cards/GradeSubmissionModal/useScoreForm.ts
@@ -54,7 +54,7 @@ export const useScoreForm = ({
   const [isLoading, setIsLoading] = useState(false);
 
   const getCriterionKey = (criterion: JudgingCriterion) => {
-    return criterion.id || criterion.name || criterion.title;
+    return criterion.id;
   };
 
   const handleScoreChange = (criterionKey: string, value: string | number) => {
@@ -151,7 +151,7 @@ export const useScoreForm = ({
           score: number;
           comment?: string;
         } = {
-          criterionId: criterion.id || criterion.name || criterion.title,
+          criterionId: criterion.id,
           score: typeof scores[key] === 'number' ? (scores[key] as number) : 0,
         };
         if (includeComments) {
diff --git a/components/organization/cards/GradeSubmissionModal/useSubmissionScores.ts b/components/organization/cards/GradeSubmissionModal/useSubmissionScores.ts
index a1f46977..0c0808b0 100644
--- a/components/organization/cards/GradeSubmissionModal/useSubmissionScores.ts
+++ b/components/organization/cards/GradeSubmissionModal/useSubmissionScores.ts
@@ -47,7 +47,7 @@ export const useSubmissionScores = ({
   const loadedTargetJudgeIdRef = useRef<string | null>(null);
 
   const getCriterionKey = (criterion: JudgingCriterion) => {
-    return criterion.id || criterion.name || (criterion as any).title;
+    return criterion.id;
   };
 
   const initializeForm = (criteriaList: JudgingCriterion[]) => {
diff --git a/components/organization/cards/Participant.tsx b/components/organization/cards/Participant.tsx
index 750670bb..d2ab9fef 100644
--- a/components/organization/cards/Participant.tsx
+++ b/components/organization/cards/Participant.tsx
@@ -28,7 +28,7 @@ const Participant = ({
   const [isReviewModalOpen, setIsReviewModalOpen] = useState(false);
   const [isJudgeModalOpen, setIsJudgeModalOpen] = useState(false);
   const [criteria, setCriteria] = useState<
-    Array<{ title: string; weight: number; description?: string }>
+    Array<{ id: string; title: string; weight: number; description?: string }>
   >([]);
   const [isLoadingCriteria, setIsLoadingCriteria] = useState(false);
 
@@ -58,6 +58,7 @@ const Participant = ({
       if (response.success) {
         setCriteria(
           response.data?.judgingCriteria?.map(criterion => ({
+            id: criterion.id ?? criterion.name ?? '',
             title: criterion.name || '',
             weight: criterion.weight || 0,
             description: criterion.description || '',
diff --git a/components/organization/hackathons/judging/InviteJudgeDialog.tsx b/components/organization/hackathons/judging/InviteJudgeDialog.tsx
new file mode 100644
index 00000000..6e2916d6
--- /dev/null
+++ b/components/organization/hackathons/judging/InviteJudgeDialog.tsx
@@ -0,0 +1,175 @@
+'use client';
+
+import { useState } from 'react';
+import { Loader2 } from 'lucide-react';
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@/components/ui/dialog';
+import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
+import { Textarea } from '@/components/ui/textarea';
+import { useInviteJudge } from '@/hooks/judge/use-organizer-invitations';
+
+const EMAIL_RE = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+
+export function InviteJudgeDialog({
+  open,
+  onOpenChange,
+  organizationId,
+  hackathonId,
+}: {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  organizationId: string;
+  hackathonId: string;
+}) {
+  const [email, setEmail] = useState('');
+  const [displayName, setDisplayName] = useState('');
+  const [message, setMessage] = useState('');
+  const [emailError, setEmailError] = useState<string | null>(null);
+
+  const invite = useInviteJudge(organizationId, hackathonId);
+
+  const reset = () => {
+    setEmail('');
+    setDisplayName('');
+    setMessage('');
+    setEmailError(null);
+  };
+
+  const handleSubmit = (e: React.FormEvent) => {
+    e.preventDefault();
+    const trimmed = email.trim().toLowerCase();
+    if (!EMAIL_RE.test(trimmed)) {
+      setEmailError('Enter a valid email address');
+      return;
+    }
+    setEmailError(null);
+    invite.mutate(
+      {
+        email: trimmed,
+        displayName: displayName.trim() || undefined,
+        message: message.trim() || undefined,
+      },
+      {
+        onSuccess: () => {
+          reset();
+          onOpenChange(false);
+        },
+      }
+    );
+  };
+
+  return (
+    <Dialog
+      open={open}
+      onOpenChange={o => {
+        if (!o) reset();
+        onOpenChange(o);
+      }}
+    >
+      <DialogContent className='border-white/5 bg-[#101010] text-white sm:max-w-md'>
+        <DialogHeader>
+          <DialogTitle>Invite a judge</DialogTitle>
+          <DialogDescription className='text-gray-500'>
+            They receive an email with a link to accept. Accepting grants access
+            only to this hackathon, not to your organization.
+          </DialogDescription>
+        </DialogHeader>
+
+        <form onSubmit={handleSubmit} className='space-y-4'>
+          <div>
+            <label
+              htmlFor='judge-email'
+              className='mb-1.5 block text-[10px] font-semibold tracking-wider text-gray-500 uppercase'
+            >
+              Email
+            </label>
+            <Input
+              id='judge-email'
+              type='email'
+              autoFocus
+              required
+              value={email}
+              onChange={e => {
+                setEmail(e.target.value);
+                if (emailError) setEmailError(null);
+              }}
+              placeholder='judge@example.com'
+              className='border-white/10 bg-black/40 text-white'
+            />
+            {emailError && (
+              <p className='mt-1 text-xs text-red-400'>{emailError}</p>
+            )}
+          </div>
+
+          <div>
+            <label
+              htmlFor='judge-display-name'
+              className='mb-1.5 block text-[10px] font-semibold tracking-wider text-gray-500 uppercase'
+            >
+              Display name (optional)
+            </label>
+            <Input
+              id='judge-display-name'
+              type='text'
+              maxLength={120}
+              value={displayName}
+              onChange={e => setDisplayName(e.target.value)}
+              placeholder='Shown on the judging panel'
+              className='border-white/10 bg-black/40 text-white'
+            />
+          </div>
+
+          <div>
+            <label
+              htmlFor='judge-message'
+              className='mb-1.5 block text-[10px] font-semibold tracking-wider text-gray-500 uppercase'
+            >
+              Personal note (optional)
+            </label>
+            <Textarea
+              id='judge-message'
+              maxLength={1000}
+              value={message}
+              onChange={e => setMessage(e.target.value)}
+              placeholder='Why you’d like them on the panel, what to expect…'
+              className='min-h-[96px] border-gray-800 bg-gray-950 text-white'
+            />
+          </div>
+
+          <DialogFooter className='gap-2'>
+            <Button
+              type='button'
+              variant='outline'
+              onClick={() => onOpenChange(false)}
+              disabled={invite.isPending}
+              className='border-white/10 bg-transparent text-gray-300 hover:bg-white/5'
+            >
+              Cancel
+            </Button>
+            <Button
+              type='submit'
+              disabled={invite.isPending || !email.trim()}
+              className='bg-primary hover:bg-primary/90 text-primary-foreground'
+            >
+              {invite.isPending ? (
+                <>
+                  <Loader2 className='mr-2 h-4 w-4 animate-spin' />
+                  Sending…
+                </>
+              ) : (
+                'Send invitation'
+              )}
+            </Button>
+          </DialogFooter>
+        </form>
+      </DialogContent>
+    </Dialog>
+  );
+}
diff --git a/components/organization/hackathons/judging/OrganizerJudgesPanel.tsx b/components/organization/hackathons/judging/OrganizerJudgesPanel.tsx
new file mode 100644
index 00000000..d062ec71
--- /dev/null
+++ b/components/organization/hackathons/judging/OrganizerJudgesPanel.tsx
@@ -0,0 +1,419 @@
+'use client';
+
+import { useEffect, useRef, useState } from 'react';
+import {
+  Loader2,
+  Mail,
+  MoreHorizontal,
+  RefreshCw,
+  RotateCcw,
+  UserPlus,
+  X,
+} from 'lucide-react';
+import { Button } from '@/components/ui/button';
+import { Badge } from '@/components/ui/badge';
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu';
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle,
+} from '@/components/ui/alert-dialog';
+import EmptyState from '@/components/EmptyState';
+import { InviteJudgeDialog } from './InviteJudgeDialog';
+import {
+  useCancelInvitation,
+  useOrgJudgeInvitations,
+  useResendInvitation,
+} from '@/hooks/judge/use-organizer-invitations';
+import type {
+  JudgeInvitationStatus,
+  OrganizerInvitationSummary,
+} from '@/lib/api/judge';
+
+interface CurrentJudge {
+  id: string;
+  userId?: string;
+  name?: string;
+  image?: string | null;
+}
+
+export function OrganizerJudgesPanel({
+  organizationId,
+  hackathonId,
+  currentJudges,
+  isRefreshingJudges,
+  canManage,
+  onRemoveJudge,
+  onJudgesChanged,
+}: {
+  organizationId: string;
+  hackathonId: string;
+  currentJudges: CurrentJudge[];
+  isRefreshingJudges?: boolean;
+  canManage: boolean;
+  onRemoveJudge: (userId: string) => void;
+  /** Fired when the panel detects an invitation was just accepted by the
+   *  invitee on another session — the parent page should re-fetch judges. */
+  onJudgesChanged?: () => void;
+}) {
+  const [inviteOpen, setInviteOpen] = useState(false);
+  const [cancelTarget, setCancelTarget] =
+    useState<OrganizerInvitationSummary | null>(null);
+
+  const {
+    data: invitations = [],
+    isPending: invitationsLoading,
+    isFetching: invitationsFetching,
+    refetch: refetchInvitations,
+  } = useOrgJudgeInvitations(organizationId, hackathonId);
+  const resend = useResendInvitation(organizationId, hackathonId);
+  const cancel = useCancelInvitation(organizationId, hackathonId);
+
+  // Detect ACCEPTED transitions in the polled invitations list — when an
+  // invitee accepts on another machine, ping the parent so the active
+  // judges list refreshes without a manual reload.
+  const previousAcceptedIdsRef = useRef<Set<string> | null>(null);
+  useEffect(() => {
+    const accepted = new Set(
+      invitations.filter(i => i.status === 'ACCEPTED').map(i => i.id)
+    );
+    const prev = previousAcceptedIdsRef.current;
+    if (prev !== null) {
+      let hasNew = false;
+      accepted.forEach(id => {
+        if (!prev.has(id)) hasNew = true;
+      });
+      if (hasNew) onJudgesChanged?.();
+    }
+    previousAcceptedIdsRef.current = accepted;
+  }, [invitations, onJudgesChanged]);
+
+  const pending = invitations.filter(
+    (i: OrganizerInvitationSummary) => i.status === 'PENDING'
+  );
+  const history = invitations.filter(
+    (i: OrganizerInvitationSummary) => i.status !== 'PENDING'
+  );
+
+  return (
+    <div className='space-y-6'>
+      <div className='flex flex-wrap items-center justify-between gap-3'>
+        <div>
+          <h3 className='text-lg font-medium'>Judging panel</h3>
+          <p className='text-sm text-gray-500'>
+            Invite judges by email. They only see this hackathon, never your
+            organization.
+          </p>
+        </div>
+        <div className='flex items-center gap-2'>
+          <Button
+            variant='outline'
+            size='sm'
+            onClick={() => {
+              refetchInvitations();
+              onJudgesChanged?.();
+            }}
+            disabled={invitationsFetching}
+            className='border-white/10 bg-transparent text-gray-300 hover:bg-white/5'
+          >
+            <RefreshCw
+              className={`mr-1.5 h-3.5 w-3.5 ${invitationsFetching ? 'animate-spin' : ''}`}
+            />
+            Refresh
+          </Button>
+          {canManage && (
+            <Button
+              onClick={() => setInviteOpen(true)}
+              className='bg-primary hover:bg-primary/90 text-primary-foreground'
+            >
+              <UserPlus className='mr-2 h-4 w-4' /> Invite judge
+            </Button>
+          )}
+        </div>
+      </div>
+
+      <div className='grid grid-cols-1 gap-6 lg:grid-cols-2'>
+        {/* Active judges */}
+        <section className='rounded-2xl border border-white/5 bg-[#101010] p-6'>
+          <h4 className='mb-4 flex items-center gap-2 text-xs font-medium tracking-wider text-gray-400 uppercase'>
+            Active judges
+            {isRefreshingJudges && (
+              <Loader2 className='h-3.5 w-3.5 animate-spin text-gray-600' />
+            )}
+            <span className='ml-auto rounded border border-white/10 bg-white/5 px-1.5 py-0.5 text-[10px] text-gray-300 normal-case'>
+              {currentJudges.length}
+            </span>
+          </h4>
+          {currentJudges.length === 0 ? (
+            <EmptyState
+              title='No judges yet'
+              description={
+                canManage
+                  ? 'Invite your first judge by email.'
+                  : 'Nobody has been added to this panel yet.'
+              }
+              type='compact'
+              className='py-8'
+            />
+          ) : (
+            <ul className='space-y-1.5'>
+              {currentJudges.map(judge => (
+                <li
+                  key={judge.id}
+                  className='flex items-center justify-between gap-3 rounded-lg border border-white/5 bg-white/[0.03] p-2.5 transition-colors hover:bg-white/[0.06]'
+                >
+                  <div className='flex min-w-0 items-center gap-3'>
+                    <Avatar className='h-8 w-8 border border-white/10'>
+                      <AvatarImage
+                        src={judge.image ?? undefined}
+                        alt={judge.name ?? ''}
+                      />
+                      <AvatarFallback className='bg-white/5 text-[10px]'>
+                        {(judge.name ?? '?').slice(0, 2).toUpperCase()}
+                      </AvatarFallback>
+                    </Avatar>
+                    <div className='min-w-0'>
+                      <p className='truncate text-sm font-medium text-white'>
+                        {judge.name}
+                      </p>
+                      <p className='text-[10px] tracking-wider text-emerald-400/70 uppercase'>
+                        Active
+                      </p>
+                    </div>
+                  </div>
+                  {canManage && (
+                    <Button
+                      variant='ghost'
+                      size='sm'
+                      className='text-red-300/80 hover:bg-red-400/10 hover:text-red-300'
+                      onClick={() => onRemoveJudge(judge.userId ?? judge.id)}
+                    >
+                      Remove
+                    </Button>
+                  )}
+                </li>
+              ))}
+            </ul>
+          )}
+        </section>
+
+        {/* Pending invitations */}
+        <section className='rounded-2xl border border-white/5 bg-[#101010] p-6'>
+          <h4 className='mb-4 flex items-center gap-2 text-xs font-medium tracking-wider text-gray-400 uppercase'>
+            Pending invitations
+            <span className='ml-auto rounded border border-white/10 bg-white/5 px-1.5 py-0.5 text-[10px] text-gray-300 normal-case'>
+              {pending.length}
+            </span>
+          </h4>
+
+          {invitationsLoading ? (
+            <div className='flex items-center gap-2 text-sm text-gray-500'>
+              <Loader2 className='h-4 w-4 animate-spin' /> Loading…
+            </div>
+          ) : pending.length === 0 ? (
+            <EmptyState
+              title='No pending invitations'
+              description={
+                canManage
+                  ? 'Use “Invite judge” to send one by email.'
+                  : 'No invitations are awaiting response.'
+              }
+              type='compact'
+              className='py-8'
+            />
+          ) : (
+            <ul className='space-y-2'>
+              {pending.map(inv => (
+                <PendingInvitationRow
+                  key={inv.id}
+                  invitation={inv}
+                  canManage={canManage}
+                  onResend={() => resend.mutate(inv.id)}
+                  onCancel={() => setCancelTarget(inv)}
+                  resending={resend.isPending && resend.variables === inv.id}
+                />
+              ))}
+            </ul>
+          )}
+
+          {history.length > 0 && (
+            <details className='mt-6 text-xs text-gray-500'>
+              <summary className='cursor-pointer select-none hover:text-gray-300'>
+                Show history ({history.length})
+              </summary>
+              <ul className='mt-3 space-y-1'>
+                {history.map(inv => (
+                  <li
+                    key={inv.id}
+                    className='flex items-center justify-between rounded-md border border-white/5 bg-black/30 p-2 text-xs'
+                  >
+                    <span className='truncate text-gray-400'>{inv.email}</span>
+                    <StatusBadge status={inv.status} />
+                  </li>
+                ))}
+              </ul>
+            </details>
+          )}
+        </section>
+      </div>
+
+      <InviteJudgeDialog
+        open={inviteOpen}
+        onOpenChange={setInviteOpen}
+        organizationId={organizationId}
+        hackathonId={hackathonId}
+      />
+
+      <AlertDialog
+        open={!!cancelTarget}
+        onOpenChange={o => !o && setCancelTarget(null)}
+      >
+        <AlertDialogContent className='border-white/5 bg-[#101010] text-white'>
+          <AlertDialogHeader>
+            <AlertDialogTitle>Cancel invitation?</AlertDialogTitle>
+            <AlertDialogDescription className='text-gray-400'>
+              The invitation link for{' '}
+              <strong className='text-gray-200'>{cancelTarget?.email}</strong>{' '}
+              will stop working immediately. They can be re-invited later.
+            </AlertDialogDescription>
+          </AlertDialogHeader>
+          <AlertDialogFooter>
+            <AlertDialogCancel className='border-white/10 bg-transparent text-gray-300 hover:bg-white/5'>
+              Keep invitation
+            </AlertDialogCancel>
+            <AlertDialogAction
+              className='bg-red-600 text-white hover:bg-red-700'
+              onClick={() => {
+                if (cancelTarget) cancel.mutate(cancelTarget.id);
+                setCancelTarget(null);
+              }}
+            >
+              Cancel invitation
+            </AlertDialogAction>
+          </AlertDialogFooter>
+        </AlertDialogContent>
+      </AlertDialog>
+    </div>
+  );
+}
+
+function PendingInvitationRow({
+  invitation,
+  canManage,
+  onResend,
+  onCancel,
+  resending,
+}: {
+  invitation: OrganizerInvitationSummary;
+  canManage: boolean;
+  onResend: () => void;
+  onCancel: () => void;
+  resending: boolean;
+}) {
+  const invitedRel = invitation.lastResentAt
+    ? `Resent ${formatRel(invitation.lastResentAt)}`
+    : `Invited ${formatRel(invitation.invitedAt)}`;
+  return (
+    <li className='flex items-center justify-between gap-3 rounded-lg border border-white/5 bg-white/[0.03] p-2.5 transition-colors hover:bg-white/[0.06]'>
+      <div className='flex min-w-0 items-center gap-3'>
+        <span className='border-primary/30 bg-primary/10 text-primary inline-flex h-8 w-8 shrink-0 items-center justify-center rounded-full border'>
+          <Mail className='h-3.5 w-3.5' />
+        </span>
+        <div className='min-w-0'>
+          <p className='truncate text-sm font-medium text-white'>
+            {invitation.email}
+          </p>
+          <p className='mt-0.5 text-xs text-gray-500'>
+            {invitedRel}
+            {invitation.resendCount > 0 && (
+              <span className='ml-2'>· resent {invitation.resendCount}×</span>
+            )}
+          </p>
+        </div>
+      </div>
+      {canManage && (
+        <DropdownMenu>
+          <DropdownMenuTrigger asChild>
+            <Button
+              variant='ghost'
+              size='icon'
+              className='h-8 w-8 text-gray-400'
+            >
+              <MoreHorizontal className='h-4 w-4' />
+            </Button>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent
+            align='end'
+            className='border-white/10 bg-[#101010] text-white'
+          >
+            <DropdownMenuItem
+              onClick={onResend}
+              disabled={resending}
+              className='cursor-pointer'
+            >
+              {resending ? (
+                <Loader2 className='mr-2 h-3.5 w-3.5 animate-spin' />
+              ) : (
+                <RotateCcw className='mr-2 h-3.5 w-3.5' />
+              )}
+              Resend (rotates link)
+            </DropdownMenuItem>
+            <DropdownMenuItem
+              onClick={onCancel}
+              className='cursor-pointer text-red-400 focus:text-red-300'
+            >
+              <X className='mr-2 h-3.5 w-3.5' />
+              Cancel invitation
+            </DropdownMenuItem>
+          </DropdownMenuContent>
+        </DropdownMenu>
+      )}
+    </li>
+  );
+}
+
+function StatusBadge({ status }: { status: JudgeInvitationStatus }) {
+  const cls =
+    status === 'ACCEPTED'
+      ? 'border-emerald-800/40 bg-emerald-900/20 text-emerald-300'
+      : status === 'DECLINED'
+        ? 'border-red-900/40 bg-red-950/30 text-red-300'
+        : status === 'EXPIRED'
+          ? 'border-amber-800/40 bg-amber-950/30 text-amber-300'
+          : 'border-white/10 bg-white/5 text-gray-400';
+  return (
+    <Badge
+      className={`rounded border px-1.5 py-0.5 text-[9px] tracking-wider uppercase ${cls}`}
+    >
+      {status.toLowerCase()}
+    </Badge>
+  );
+}
+
+function formatRel(value: string): string {
+  const d = new Date(value);
+  const diffMs = Date.now() - d.getTime();
+  const mins = Math.round(diffMs / 60000);
+  if (mins < 1) return 'just now';
+  if (mins < 60) return `${mins} min ago`;
+  const hours = Math.round(mins / 60);
+  if (hours < 24) return `${hours} h ago`;
+  const days = Math.round(hours / 24);
+  if (days === 1) return 'yesterday';
+  if (days < 14) return `${days} days ago`;
+  return d.toLocaleDateString(undefined, {
+    day: 'numeric',
+    month: 'short',
+  });
+}
diff --git a/hooks/judge/use-judge-queries.ts b/hooks/judge/use-judge-queries.ts
new file mode 100644
index 00000000..a0e419ba
--- /dev/null
+++ b/hooks/judge/use-judge-queries.ts
@@ -0,0 +1,236 @@
+'use client';
+
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import { toast } from 'sonner';
+import {
+  acceptJudgeInvitation,
+  declineJudgeInvitation,
+  getJudgeCriteria,
+  getJudgeHackathon,
+  getJudgeHackathons,
+  getJudgeInvitations,
+  getJudgeQueueNeighbors,
+  getJudgeResults,
+  getJudgeSubmission,
+  getJudgeSubmissions,
+  previewJudgeInvitation,
+  submitJudgeScore,
+  type SubmitJudgeScoreRequest,
+} from '@/lib/api/judge';
+import { extractApiErrorMessage } from '@/lib/api/api';
+
+export const judgeKeys = {
+  all: ['judge'] as const,
+  hackathons: () => [...judgeKeys.all, 'hackathons'] as const,
+  hackathon: (id: string) => [...judgeKeys.all, 'hackathon', id] as const,
+  criteria: (id: string) => [...judgeKeys.all, 'criteria', id] as const,
+  submissions: (id: string, params?: Record<string, unknown>) =>
+    [...judgeKeys.all, 'submissions', id, params ?? {}] as const,
+  submission: (hackathonId: string, submissionId: string) =>
+    [...judgeKeys.all, 'submission', hackathonId, submissionId] as const,
+  neighbors: (hackathonId: string, submissionId: string) =>
+    [...judgeKeys.all, 'neighbors', hackathonId, submissionId] as const,
+  results: (hackathonId: string) =>
+    [...judgeKeys.all, 'results', hackathonId] as const,
+  invitations: () => [...judgeKeys.all, 'invitations'] as const,
+  invitation: (token: string) =>
+    [...judgeKeys.all, 'invitation', token] as const,
+};
+
+export function useJudgeHackathons() {
+  return useQuery({
+    queryKey: judgeKeys.hackathons(),
+    queryFn: async () => {
+      const res = await getJudgeHackathons();
+      if (!res.success) throw new Error(res.message);
+      return res.data ?? [];
+    },
+  });
+}
+
+export function useJudgeHackathon(hackathonId: string | null | undefined) {
+  return useQuery({
+    queryKey: judgeKeys.hackathon(hackathonId ?? ''),
+    queryFn: async () => {
+      const res = await getJudgeHackathon(hackathonId as string);
+      if (!res.success) throw new Error(res.message);
+      return res.data;
+    },
+    enabled: !!hackathonId,
+  });
+}
+
+export function useJudgeCriteria(hackathonId: string | null | undefined) {
+  return useQuery({
+    queryKey: judgeKeys.criteria(hackathonId ?? ''),
+    queryFn: async () => {
+      const res = await getJudgeCriteria(hackathonId as string);
+      if (!res.success) throw new Error(res.message);
+      return res.data ?? [];
+    },
+    enabled: !!hackathonId,
+  });
+}
+
+export function useJudgeSubmissions(
+  hackathonId: string | null | undefined,
+  params: { page?: number; limit?: number; search?: string } = {}
+) {
+  return useQuery({
+    queryKey: judgeKeys.submissions(hackathonId ?? '', params),
+    queryFn: async () => {
+      const res = await getJudgeSubmissions(hackathonId as string, params);
+      if (!res.success) throw new Error(res.message);
+      return res.data;
+    },
+    enabled: !!hackathonId,
+  });
+}
+
+export function useJudgeResults(hackathonId: string | null | undefined) {
+  return useQuery({
+    queryKey: judgeKeys.results(hackathonId ?? ''),
+    queryFn: async () => {
+      const res = await getJudgeResults(hackathonId as string);
+      if (!res.success) throw new Error(res.message);
+      return res.data;
+    },
+    enabled: !!hackathonId,
+  });
+}
+
+export function useJudgeSubmission(
+  hackathonId: string | null | undefined,
+  submissionId: string | null | undefined
+) {
+  return useQuery({
+    queryKey: judgeKeys.submission(hackathonId ?? '', submissionId ?? ''),
+    queryFn: async () => {
+      const res = await getJudgeSubmission(
+        hackathonId as string,
+        submissionId as string
+      );
+      if (!res.success) throw new Error(res.message);
+      return res.data;
+    },
+    enabled: !!hackathonId && !!submissionId,
+  });
+}
+
+export function useJudgeQueueNeighbors(
+  hackathonId: string | null | undefined,
+  submissionId: string | null | undefined
+) {
+  return useQuery({
+    queryKey: judgeKeys.neighbors(hackathonId ?? '', submissionId ?? ''),
+    queryFn: async () => {
+      const res = await getJudgeQueueNeighbors(
+        hackathonId as string,
+        submissionId as string
+      );
+      if (!res.success) throw new Error(res.message);
+      return res.data;
+    },
+    enabled: !!hackathonId && !!submissionId,
+  });
+}
+
+export function useSubmitJudgeScore(hackathonId: string) {
+  const qc = useQueryClient();
+  return useMutation({
+    mutationFn: async (args: {
+      submissionId: string;
+      payload: SubmitJudgeScoreRequest;
+    }) => {
+      const res = await submitJudgeScore(
+        hackathonId,
+        args.submissionId,
+        args.payload
+      );
+      if (!res.success) throw new Error(res.message);
+      return res.data;
+    },
+    onSuccess: (_data, args) => {
+      toast.success('Score submitted');
+      qc.invalidateQueries({ queryKey: judgeKeys.hackathon(hackathonId) });
+      qc.invalidateQueries({
+        queryKey: judgeKeys.submissions(hackathonId),
+        exact: false,
+      });
+      qc.invalidateQueries({
+        queryKey: judgeKeys.submission(hackathonId, args.submissionId),
+      });
+      qc.invalidateQueries({
+        queryKey: judgeKeys.neighbors(hackathonId, args.submissionId),
+      });
+    },
+    onError: err => {
+      toast.error(extractApiErrorMessage(err, 'Failed to submit score'));
+    },
+  });
+}
+
+export function useMyJudgeInvitations() {
+  return useQuery({
+    queryKey: judgeKeys.invitations(),
+    queryFn: async () => {
+      const res = await getJudgeInvitations();
+      if (!res.success) throw new Error(res.message);
+      return res.data ?? [];
+    },
+  });
+}
+
+/**
+ * Public preview — works when logged out, so the invitee can see
+ * what they're being invited to before signing in.
+ */
+export function useJudgeInvitationPreview(token: string | undefined) {
+  return useQuery({
+    queryKey: judgeKeys.invitation(token ?? ''),
+    queryFn: async () => {
+      const res = await previewJudgeInvitation(token as string);
+      if (!res.success) throw new Error(res.message);
+      return res.data;
+    },
+    enabled: !!token,
+    retry: false,
+  });
+}
+
+export function useAcceptJudgeInvitation(token: string) {
+  const qc = useQueryClient();
+  return useMutation({
+    mutationFn: async (payload: { displayName?: string } = {}) => {
+      const res = await acceptJudgeInvitation(token, payload);
+      if (!res.success) throw new Error(res.message);
+      return res.data;
+    },
+    onSuccess: () => {
+      toast.success('Invitation accepted — you’re on the panel.');
+      qc.invalidateQueries({ queryKey: judgeKeys.all });
+    },
+    onError: err => {
+      toast.error(extractApiErrorMessage(err, 'Could not accept invitation'));
+    },
+  });
+}
+
+export function useDeclineJudgeInvitation(token: string) {
+  const qc = useQueryClient();
+  return useMutation({
+    mutationFn: async () => {
+      const res = await declineJudgeInvitation(token);
+      if (!res.success) throw new Error(res.message);
+      return res.data;
+    },
+    onSuccess: () => {
+      toast.success('Invitation declined.');
+      qc.invalidateQueries({ queryKey: judgeKeys.invitations() });
+      qc.invalidateQueries({ queryKey: judgeKeys.invitation(token) });
+    },
+    onError: err => {
+      toast.error(extractApiErrorMessage(err, 'Could not decline invitation'));
+    },
+  });
+}
diff --git a/hooks/judge/use-organizer-invitations.ts b/hooks/judge/use-organizer-invitations.ts
new file mode 100644
index 00000000..c5fab36f
--- /dev/null
+++ b/hooks/judge/use-organizer-invitations.ts
@@ -0,0 +1,126 @@
+'use client';
+
+import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
+import { toast } from 'sonner';
+import {
+  cancelJudgeInvitation,
+  inviteJudge,
+  listJudgeInvitations,
+  resendJudgeInvitation,
+  type InviteJudgePayload,
+  type JudgeInvitationStatus,
+} from '@/lib/api/judge';
+import { extractApiErrorMessage } from '@/lib/api/api';
+
+export const orgJudgeKeys = {
+  all: ['org-judge'] as const,
+  invitations: (
+    orgId: string,
+    hackathonId: string,
+    status?: JudgeInvitationStatus
+  ) =>
+    [
+      ...orgJudgeKeys.all,
+      'invitations',
+      orgId,
+      hackathonId,
+      status ?? 'all',
+    ] as const,
+};
+
+export function useOrgJudgeInvitations(
+  organizationId: string | null | undefined,
+  hackathonId: string | null | undefined,
+  status?: JudgeInvitationStatus
+) {
+  return useQuery({
+    queryKey: orgJudgeKeys.invitations(
+      organizationId ?? '',
+      hackathonId ?? '',
+      status
+    ),
+    queryFn: async () => {
+      const res = await listJudgeInvitations(
+        organizationId as string,
+        hackathonId as string,
+        status
+      );
+      if (!res.success) throw new Error(res.message);
+      return res.data ?? [];
+    },
+    enabled: !!organizationId && !!hackathonId,
+    // Organizers actively monitor the panel — refresh every minute so
+    // accepted/declined invitations surface without a manual reload.
+    refetchInterval: 60_000,
+    refetchOnWindowFocus: true,
+    refetchOnMount: 'always',
+  });
+}
+
+export function useInviteJudge(organizationId: string, hackathonId: string) {
+  const qc = useQueryClient();
+  return useMutation({
+    mutationFn: async (payload: InviteJudgePayload) => {
+      const res = await inviteJudge(organizationId, hackathonId, payload);
+      if (!res.success) throw new Error(res.message);
+      return res.data;
+    },
+    onSuccess: () => {
+      toast.success('Invitation sent');
+      qc.invalidateQueries({ queryKey: orgJudgeKeys.all });
+    },
+    onError: err => {
+      toast.error(extractApiErrorMessage(err, 'Could not send invitation'));
+    },
+  });
+}
+
+export function useResendInvitation(
+  organizationId: string,
+  hackathonId: string
+) {
+  const qc = useQueryClient();
+  return useMutation({
+    mutationFn: async (invitationId: string) => {
+      const res = await resendJudgeInvitation(
+        organizationId,
+        hackathonId,
+        invitationId
+      );
+      if (!res.success) throw new Error(res.message);
+      return res.data;
+    },
+    onSuccess: () => {
+      toast.success('Invitation resent with a fresh link');
+      qc.invalidateQueries({ queryKey: orgJudgeKeys.all });
+    },
+    onError: err => {
+      toast.error(extractApiErrorMessage(err, 'Could not resend invitation'));
+    },
+  });
+}
+
+export function useCancelInvitation(
+  organizationId: string,
+  hackathonId: string
+) {
+  const qc = useQueryClient();
+  return useMutation({
+    mutationFn: async (invitationId: string) => {
+      const res = await cancelJudgeInvitation(
+        organizationId,
+        hackathonId,
+        invitationId
+      );
+      if (!res.success) throw new Error(res.message);
+      return res.data;
+    },
+    onSuccess: () => {
+      toast.success('Invitation cancelled');
+      qc.invalidateQueries({ queryKey: orgJudgeKeys.all });
+    },
+    onError: err => {
+      toast.error(extractApiErrorMessage(err, 'Could not cancel invitation'));
+    },
+  });
+}
diff --git a/lib/api/hackathons.ts b/lib/api/hackathons.ts
index 7aef31cb..4adef112 100644
--- a/lib/api/hackathons.ts
+++ b/lib/api/hackathons.ts
@@ -125,8 +125,13 @@ export interface HackathonRewards {
 }
 
 // Judging Tab Types
+//
+// Persisted criteria always carry a non-empty unique `id` (the server
+// auto-generates one on create). In-progress local drafts may not yet
+// have an id, but anything coming back from the API does. Consumers
+// should rely on `id` and never fall back to `name`/`title`.
 export interface JudgingCriterion {
-  id?: string;
+  id: string;
   name?: string;
   title: string;
   weight: number; // 0-100
diff --git a/lib/api/hackathons/judging.ts b/lib/api/hackathons/judging.ts
index 800a0332..f2c9ec8a 100644
--- a/lib/api/hackathons/judging.ts
+++ b/lib/api/hackathons/judging.ts
@@ -3,7 +3,11 @@ import { ApiResponse, PaginatedResponse } from '../types';
 
 // Judging API Types
 export interface JudgingCriterion {
-  id?: string;
+  // Server guarantees a non-empty unique id (auto-generated on create
+  // if the client omits one). Frontend code should rely on this and
+  // not fall back to name/title — the fallback chain silently merges
+  // duplicate-named criteria.
+  id: string;
   name?: string;
   title: string;
   weight: number; // 0-100
@@ -623,14 +627,47 @@ export const getJudgingWinners = async (
 };
 
 /**
- * Publish judging results (finalize rankings)
+ * Judging completeness preview: what would block publishing right now.
  */
-export const publishJudgingResults = async (
+export interface JudgingCompletenessPreview {
+  complete: boolean;
+  expectedJudgeCount: number;
+  totalShortlisted: number;
+  incompleteSubmissionCount: number;
+  incompleteJudges: Array<{
+    id: string;
+    name: string;
+    missingCount: number;
+  }>;
+  sampleIncompleteSubmissions: Array<{
+    submissionId: string;
+    projectName: string;
+    missingJudges: Array<{ id: string; name: string }>;
+  }>;
+}
+
+export const getJudgingCompleteness = async (
   organizationId: string,
   hackathonId: string
+): Promise<ApiResponse<JudgingCompletenessPreview>> => {
+  const res = await api.get(
+    `/organizations/${organizationId}/hackathons/${hackathonId}/judging/completeness`
+  );
+  return res.data;
+};
+
+/**
+ * Publish judging results (finalize rankings). Pass `acceptPartial: true`
+ * to publish even when some active judges have outstanding work.
+ */
+export const publishJudgingResults = async (
+  organizationId: string,
+  hackathonId: string,
+  options: { acceptPartial?: boolean } = {}
 ): Promise<ApiResponse<null>> => {
   const res = await api.post(
-    `/organizations/${organizationId}/hackathons/${hackathonId}/judging/publish-results`
+    `/organizations/${organizationId}/hackathons/${hackathonId}/judging/publish-results`,
+    options.acceptPartial ? { acceptPartial: true } : undefined
   );
   return res.data;
 };
diff --git a/lib/api/judge.ts b/lib/api/judge.ts
new file mode 100644
index 00000000..f55d9de1
--- /dev/null
+++ b/lib/api/judge.ts
@@ -0,0 +1,408 @@
+import api from './api';
+import { ApiResponse } from './types';
+import type {
+  CriterionScoreRequest,
+  JudgingCriterion,
+  JudgingSubmission,
+} from './hackathons/judging';
+
+// ---------------------------------------------------------------------------
+// Types
+// ---------------------------------------------------------------------------
+
+export type JudgeInvitationStatus =
+  | 'PENDING'
+  | 'ACCEPTED'
+  | 'DECLINED'
+  | 'REVOKED'
+  | 'EXPIRED';
+
+export interface JudgeHackathonSummary {
+  id: string;
+  slug: string | null;
+  name: string;
+  banner: string | null;
+  status: string;
+  judgingStart: string | null;
+  judgingEnd: string | null;
+  submissionDeadline: string | null;
+  resultsPublished: boolean;
+  resultsPublishedAt: string | null;
+  organization: { id: string; name: string; logo: string | null } | null;
+  totalSubmissions: number;
+  myScoredCount: number;
+}
+
+export interface JudgeAssignment {
+  assignedAt: string;
+  hackathon: JudgeHackathonSummary;
+}
+
+export interface JudgeHackathonOverview {
+  id: string;
+  slug: string | null;
+  name: string;
+  banner: string | null;
+  description: string | null;
+  tagline: string | null;
+  status: string;
+  judgingStart: string | null;
+  judgingEnd: string | null;
+  submissionDeadline: string | null;
+  judgingCriteria: JudgingCriterion[] | null;
+  resultsPublished: boolean;
+  resultsPublishedAt: string | null;
+  organization: { id: string; name: string; logo: string | null } | null;
+  totalSubmissions: number;
+  myScoredCount: number;
+  /** First unscored submission in the canonical queue, or null when caught up. */
+  firstUnscoredSubmissionId: string | null;
+}
+
+export interface JudgeQueueNeighbor {
+  submissionId: string;
+  projectName: string;
+}
+
+export interface JudgeQueueNeighbors {
+  position: number | null;
+  total: number;
+  scoredCount: number;
+  prev: JudgeQueueNeighbor | null;
+  next: JudgeQueueNeighbor | null;
+  /** Next unscored after the current submission. Wraps to the start of the queue if none found after. */
+  nextUnscored: JudgeQueueNeighbor | null;
+}
+
+export interface JudgeSubmissionsResponse {
+  submissions: JudgingSubmission[];
+  criteria: JudgingCriterion[];
+  pagination: {
+    page: number;
+    limit: number;
+    total: number;
+    totalPages: number;
+  };
+  /** Total submissions the calling judge has scored in this hackathon. */
+  scoredCount?: number;
+}
+
+export interface JudgeInvitationPreview {
+  id: string;
+  email: string;
+  status: JudgeInvitationStatus;
+  expiresAt: string;
+  displayName: string | null;
+  message: string | null;
+  isExpired: boolean;
+  hackathon: {
+    id: string;
+    slug: string | null;
+    name: string;
+    banner: string | null;
+    judgingStart: string | null;
+    judgingEnd: string | null;
+    organization: { id: string; name: string; logo: string | null } | null;
+  };
+  invitedBy: { id: string; name: string; image: string | null } | null;
+}
+
+export interface JudgeInvitationSummary {
+  id: string;
+  hackathonId: string;
+  email: string;
+  token: string;
+  status: JudgeInvitationStatus;
+  invitedAt: string;
+  expiresAt: string;
+  message: string | null;
+  displayName: string | null;
+  hackathon: JudgeInvitationPreview['hackathon'];
+  invitedBy: { id: string; name: string } | null;
+}
+
+export interface SubmitJudgeScoreRequest {
+  criteriaScores: CriterionScoreRequest[];
+  comment?: string;
+  notes?: string;
+}
+
+// ---------------------------------------------------------------------------
+// Endpoints — judge dashboard
+// ---------------------------------------------------------------------------
+
+export const getJudgeHackathons = async (): Promise<
+  ApiResponse<JudgeAssignment[]>
+> => {
+  const res =
+    await api.get<ApiResponse<JudgeAssignment[]>>('/judge/hackathons');
+  return res.data;
+};
+
+export const getJudgeHackathon = async (
+  hackathonId: string
+): Promise<ApiResponse<JudgeHackathonOverview>> => {
+  const res = await api.get<ApiResponse<JudgeHackathonOverview>>(
+    `/judge/hackathons/${hackathonId}`
+  );
+  return res.data;
+};
+
+export const getJudgeCriteria = async (
+  hackathonId: string
+): Promise<ApiResponse<JudgingCriterion[]>> => {
+  const res = await api.get<ApiResponse<JudgingCriterion[]>>(
+    `/judge/hackathons/${hackathonId}/criteria`
+  );
+  return res.data;
+};
+
+export const getJudgeSubmissions = async (
+  hackathonId: string,
+  params: {
+    page?: number;
+    limit?: number;
+    search?: string;
+    sortBy?: 'date' | 'name' | 'score' | 'rank';
+    order?: 'asc' | 'desc';
+  } = {}
+): Promise<ApiResponse<JudgeSubmissionsResponse>> => {
+  const search = new URLSearchParams();
+  if (params.page) search.set('page', String(params.page));
+  if (params.limit) search.set('limit', String(params.limit));
+  if (params.search) search.set('search', params.search);
+  if (params.sortBy) search.set('sortBy', params.sortBy);
+  if (params.order) search.set('order', params.order);
+  const qs = search.toString();
+  const res = await api.get<ApiResponse<JudgeSubmissionsResponse>>(
+    `/judge/hackathons/${hackathonId}/submissions${qs ? `?${qs}` : ''}`
+  );
+  return res.data;
+};
+
+export interface JudgeResultItem {
+  submissionId: string;
+  projectName: string;
+  participantId: string;
+  teamId: string | null;
+  status: string;
+  submittedAt: string;
+  averageScore: number;
+  totalScore: number;
+  judgeCount: number;
+  expectedJudgeCount: number;
+  rank: number | null;
+  computedRank?: number;
+  isComplete: boolean;
+  prize?: string;
+}
+
+export interface JudgeResultsResponse {
+  resultsPublished: boolean;
+  resultsPublishedAt: string | null;
+  results: JudgeResultItem[];
+}
+
+export const getJudgeResults = async (
+  hackathonId: string
+): Promise<ApiResponse<JudgeResultsResponse>> => {
+  const res = await api.get<ApiResponse<JudgeResultsResponse>>(
+    `/judge/hackathons/${hackathonId}/results`
+  );
+  return res.data;
+};
+
+export interface JudgeSubmissionDetail {
+  submission: {
+    id: string;
+    projectName: string;
+    category: string;
+    description: string;
+    logo?: string;
+    videoUrl?: string;
+    introduction?: string;
+    links: Array<{ type?: string; url?: string }>;
+    socialLinks: Record<string, unknown>;
+    submissionDate: string;
+    status: string;
+    rank?: number;
+  };
+  participant: {
+    id: string;
+    userId: string;
+    user: {
+      id: string;
+      email: string;
+      name: string;
+      username: string;
+      image?: string;
+    };
+    participationType: string;
+    teamId?: string;
+    teamName?: string;
+  };
+  myScore: {
+    judgeId: string;
+    judgeName: string;
+    criteriaScores: Array<{
+      criterionId: string;
+      score: number;
+      comment?: string;
+    }>;
+    totalScore: number;
+    submittedAt: string;
+    comment: string | null;
+  } | null;
+  criteria: JudgingCriterion[];
+  averageScore: number | null;
+  judgeCount: number;
+  resultsPublished: boolean;
+}
+
+export const getJudgeSubmission = async (
+  hackathonId: string,
+  submissionId: string
+): Promise<ApiResponse<JudgeSubmissionDetail>> => {
+  const res = await api.get<ApiResponse<JudgeSubmissionDetail>>(
+    `/judge/hackathons/${hackathonId}/submissions/${submissionId}`
+  );
+  return res.data;
+};
+
+export const getJudgeQueueNeighbors = async (
+  hackathonId: string,
+  submissionId: string
+): Promise<ApiResponse<JudgeQueueNeighbors>> => {
+  const res = await api.get<ApiResponse<JudgeQueueNeighbors>>(
+    `/judge/hackathons/${hackathonId}/submissions/${submissionId}/neighbors`
+  );
+  return res.data;
+};
+
+export const submitJudgeScore = async (
+  hackathonId: string,
+  submissionId: string,
+  payload: SubmitJudgeScoreRequest
+): Promise<ApiResponse<unknown>> => {
+  const res = await api.post<ApiResponse<unknown>>(
+    `/judge/hackathons/${hackathonId}/submissions/${submissionId}/score`,
+    payload
+  );
+  return res.data;
+};
+
+// ---------------------------------------------------------------------------
+// Endpoints — invitations
+// ---------------------------------------------------------------------------
+
+export const getJudgeInvitations = async (): Promise<
+  ApiResponse<JudgeInvitationSummary[]>
+> => {
+  const res =
+    await api.get<ApiResponse<JudgeInvitationSummary[]>>('/judge/invitations');
+  return res.data;
+};
+
+export const previewJudgeInvitation = async (
+  token: string
+): Promise<ApiResponse<JudgeInvitationPreview>> => {
+  const res = await api.get<ApiResponse<JudgeInvitationPreview>>(
+    `/judge/invitations/${token}`
+  );
+  return res.data;
+};
+
+export const acceptJudgeInvitation = async (
+  token: string,
+  payload: { displayName?: string } = {}
+): Promise<ApiResponse<unknown>> => {
+  const res = await api.post<ApiResponse<unknown>>(
+    `/judge/invitations/${token}/accept`,
+    payload
+  );
+  return res.data;
+};
+
+export const declineJudgeInvitation = async (
+  token: string
+): Promise<ApiResponse<unknown>> => {
+  const res = await api.post<ApiResponse<unknown>>(
+    `/judge/invitations/${token}/decline`
+  );
+  return res.data;
+};
+
+// ---------------------------------------------------------------------------
+// Endpoints — organizer-side invitation management
+// ---------------------------------------------------------------------------
+
+export interface OrganizerInvitationSummary {
+  id: string;
+  hackathonId: string;
+  email: string;
+  status: JudgeInvitationStatus;
+  invitedAt: string;
+  expiresAt: string;
+  acceptedAt: string | null;
+  declinedAt: string | null;
+  revokedAt: string | null;
+  resendCount: number;
+  lastResentAt: string | null;
+  displayName: string | null;
+  message: string | null;
+  invitedBy: { id: string; name: string; image: string | null } | null;
+  acceptedByUser: { id: string; name: string; image: string | null } | null;
+}
+
+export interface InviteJudgePayload {
+  email: string;
+  displayName?: string;
+  message?: string;
+  expiresInDays?: number;
+}
+
+export const inviteJudge = async (
+  organizationId: string,
+  hackathonIdOrSlug: string,
+  payload: InviteJudgePayload
+): Promise<ApiResponse<OrganizerInvitationSummary>> => {
+  const res = await api.post<ApiResponse<OrganizerInvitationSummary>>(
+    `/organizations/${organizationId}/hackathons/${hackathonIdOrSlug}/judging/invitations`,
+    payload
+  );
+  return res.data;
+};
+
+export const listJudgeInvitations = async (
+  organizationId: string,
+  hackathonIdOrSlug: string,
+  status?: JudgeInvitationStatus
+): Promise<ApiResponse<OrganizerInvitationSummary[]>> => {
+  const qs = status ? `?status=${status}` : '';
+  const res = await api.get<ApiResponse<OrganizerInvitationSummary[]>>(
+    `/organizations/${organizationId}/hackathons/${hackathonIdOrSlug}/judging/invitations${qs}`
+  );
+  return res.data;
+};
+
+export const cancelJudgeInvitation = async (
+  organizationId: string,
+  hackathonIdOrSlug: string,
+  invitationId: string
+): Promise<ApiResponse<OrganizerInvitationSummary>> => {
+  const res = await api.delete<ApiResponse<OrganizerInvitationSummary>>(
+    `/organizations/${organizationId}/hackathons/${hackathonIdOrSlug}/judging/invitations/${invitationId}`
+  );
+  return res.data;
+};
+
+export const resendJudgeInvitation = async (
+  organizationId: string,
+  hackathonIdOrSlug: string,
+  invitationId: string
+): Promise<ApiResponse<OrganizerInvitationSummary>> => {
+  const res = await api.post<ApiResponse<OrganizerInvitationSummary>>(
+    `/organizations/${organizationId}/hackathons/${hackathonIdOrSlug}/judging/invitations/${invitationId}/resend`
+  );
+  return res.data;
+};
diff --git a/lib/utils/hackathon-form-transforms.ts b/lib/utils/hackathon-form-transforms.ts
index 3db8245a..52c2e2e3 100644
--- a/lib/utils/hackathon-form-transforms.ts
+++ b/lib/utils/hackathon-form-transforms.ts
@@ -126,6 +126,9 @@ export const transformToApiFormat = (stepData: {
     judging: {
       criteria:
         judging?.criteria?.map(criterion => ({
+          // Preserve the server-issued id where present so the UI keys
+          // stay stable across edits.
+          id: criterion.id ?? criterion.name ?? '',
           title: criterion.name,
           weight: criterion.weight,
           description: criterion.description,
diff --git a/types/hackathon/core.ts b/types/hackathon/core.ts
index e7e87176..738aa45b 100644
--- a/types/hackathon/core.ts
+++ b/types/hackathon/core.ts
@@ -117,7 +117,9 @@ export interface HackathonRewards {
 }
 
 export interface JudgingCriterion {
-  id?: string;
+  // Server-side guarantee: persisted criteria always have a non-empty
+  // unique id. Local drafts may briefly lack one before they're sent.
+  id: string;
   name?: string;
   title: string;
   weight: number; // 0-100