Add public scoreboard page and landing top-three section

Final PBCTF 5.0 standings at /leaderboard: full board in the retro
terminal style with team search, banned teams shown in red and
unranked. Landing gets a Hall of Fame section with the top three
podium linking to the full board, plus a Scoreboard nav link.

Author: WasThatRudy

app/leaderboard/leaderboard-client.tsx

@@ -0,0 +1,14 @@
+"use client";
+
+import dynamic from "next/dynamic";
+
+// Client-only mount, same as the landing page: the scoreboard reuses the
+// landing components (canvas starfield, sessionStorage-backed sound hook).
+const LeaderboardPage = dynamic(
+  () => import("@/components/landing/Leaderboard/LeaderboardPage"),
+  { ssr: false }
+);
+
+export default function LeaderboardClient() {
+  return <LeaderboardPage />;
+}

app/leaderboard/page.tsx

@@ -0,0 +1,12 @@
+import type { Metadata } from "next";
+import LeaderboardClient from "./leaderboard-client";
+
+export const metadata: Metadata = {
+  title: "Scoreboard",
+  description:
+    "Final PBCTF 5.0 standings. Every ranked team, every score, and the ones that didn't play fair.",
+};
+
+export default function LeaderboardRoute() {
+  return <LeaderboardClient />;
+}

components/landing/Header/Header.jsx

@@ -9,6 +9,7 @@ const NAV_LINKS = [
   { id: 'nav-timeline', label: 'Timeline', href: '#timeline' },
   { id: 'nav-categories', label: 'Categories', href: '#categories' },
   { id: 'nav-prizes', label: 'Prizes', href: '#prizes' },
+  { id: 'nav-leaderboard', label: 'Scoreboard', href: '#leaderboard' },
   { id: 'nav-faq', label: 'FAQ', href: '#faq' },
 ];
 

components/landing/LandingPage.tsx

@@ -12,6 +12,7 @@ import MissionBrief from "./MissionBrief/MissionBrief";
 import Timeline from "./Timeline/Timeline";
 import Categories from "./Categories/Categories";
 import Prizes from "./Prizes/Prizes";
+import Leaderboard from "./Leaderboard/Leaderboard";
 import AboutPointBlank from "./AboutPointBlank/AboutPointBlank";
 import Venue from "./Venue/Venue";
 import FAQ from "./FAQ/FAQ";
@@ -92,6 +93,7 @@ export default function LandingPage() {
           <Timeline />
           <Categories />
           <Prizes />
+          <Leaderboard />
           <Sponsors />
           <AboutPointBlank />
           <Venue />

components/landing/Leaderboard/Leaderboard.css

@@ -0,0 +1,23 @@
+/* ===================================================================
+   Leaderboard — landing "Final Standings" section (top three + CTA)
+   =================================================================== */
+
+.pbctf-landing .lb-section__header {
+  margin-bottom: var(--space-12);
+}
+
+.pbctf-landing .lb-section__cta {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: var(--space-4);
+  margin-top: var(--space-12);
+}
+
+.pbctf-landing .lb-section__note {
+  font-family: 'JetBrains Mono', monospace;
+  font-size: var(--text-xs);
+  letter-spacing: 0.08em;
+  color: var(--muted-dark);
+  text-align: center;
+}

components/landing/Leaderboard/Leaderboard.jsx

@@ -0,0 +1,80 @@
+import { useRef } from 'react';
+import { gsap } from 'gsap';
+import { ScrollTrigger } from 'gsap/ScrollTrigger';
+import { useGSAP } from '@gsap/react';
+import { useRetroSound } from '../hooks/useRetroSound';
+import { getTopThree, RANKED_COUNT, BANNED_COUNT } from '@/data/leaderboard';
+import Podium from './Podium';
+import './Leaderboard.css';
+
+gsap.registerPlugin(ScrollTrigger);
+
+const TOP_THREE = getTopThree();
+
+export default function Leaderboard() {
+  const sectionRef = useRef(null);
+  const { playHover, playClick } = useRetroSound();
+
+  useGSAP(() => {
+    const ctx = sectionRef.current;
+    if (!ctx) return;
+
+    const cards = ctx.querySelectorAll('.lb-podium__card');
+    gsap.set(cards, { opacity: 0, y: 40 });
+    gsap.to(cards, {
+      opacity: 1,
+      y: 0,
+      duration: 0.9,
+      stagger: 0.12,
+      ease: 'expo.out',
+      scrollTrigger: {
+        trigger: ctx,
+        start: 'top 75%',
+      },
+    });
+  }, { scope: sectionRef });
+
+  return (
+    <section id="leaderboard" className="section lb-section" ref={sectionRef}>
+      <div className="container">
+        <header className="lb-section__header">
+          <span className="section__label">Final_Standings</span>
+          <h2 className="section__title">Hall of Fame</h2>
+          <p className="section__subtitle">
+            The dust has settled. Out of {RANKED_COUNT} ranked teams, these
+            three claimed the podium.
+          </p>
+        </header>
+
+        <Podium teams={TOP_THREE} />
+
+        <div className="lb-section__cta">
+          <a
+            href="/leaderboard"
+            className="btn btn--secondary"
+            onMouseEnter={playHover}
+            onClick={playClick}
+          >
+            View Full Scoreboard
+            <svg
+              className="btn__arrow"
+              viewBox="0 0 24 24"
+              fill="none"
+              stroke="currentColor"
+              strokeWidth="2"
+              strokeLinecap="round"
+              strokeLinejoin="round"
+              aria-hidden="true"
+            >
+              <line x1="5" y1="12" x2="19" y2="12" />
+              <polyline points="12 5 19 12 12 19" />
+            </svg>
+          </a>
+          <p className="lb-section__note">
+            {BANNED_COUNT} teams were disqualified for rule violations and hold no rank.
+          </p>
+        </div>
+      </div>
+    </section>
+  );
+}