fix(admin): align console pages with the shared nav, add drive status

src/app/admin/problems/[slug]/edit/page.tsx

@@ -24,7 +24,7 @@ export default async function EditProblemPage({
 
   return (
     <main className="flex-1">
-      <section className="mx-auto max-w-3xl px-6 pt-6 pb-24">
+      <section className="mx-auto max-w-4xl px-6 pb-24">
         <Link
           href="/admin"
           className="font-mono text-[11px] uppercase tracking-wider text-charcoal/50 hover:text-bronze"

src/app/admin/problems/new/page.tsx

@@ -13,7 +13,7 @@ export default async function NewProblemPage() {
 
   return (
     <main className="flex-1">
-      <section className="mx-auto max-w-3xl px-6 pt-6 pb-24">
+      <section className="mx-auto max-w-4xl px-6 pb-24">
         <Link
           href="/admin"
           className="font-mono text-[11px] uppercase tracking-wider text-charcoal/50 hover:text-bronze"

src/app/admin/teachers/page.tsx

@@ -23,7 +23,7 @@ export default async function AdminTeachersPage() {
 
   return (
     <main className="flex-1">
-      <section className="mx-auto max-w-4xl px-6 pt-6 pb-24">
+      <section className="mx-auto max-w-4xl px-6 pb-24">
         <div className="mb-8">
           <p className="font-mono text-xs uppercase tracking-widest text-bronze">
             Management

src/components/admin/RecruitmentPanel.tsx

@@ -1,6 +1,7 @@
 "use client";
 
 import { useState } from "react";
+import { toShareUrl } from "@/lib/recruitment";
 
 export interface RecruitmentPanelState {
   isOpen: boolean;
@@ -20,6 +21,15 @@ export default function RecruitmentPanel({ initial }: { initial: RecruitmentPane
   const [error, setError] = useState<string | null>(null);
   const [saving, setSaving] = useState(false);
 
+  // Deliberately derived from `saved`, not the editor state: this line describes
+  // what /join is serving right now. Reading the unsaved fields would announce a
+  // drive as open the moment someone ticked the box, before anything was written.
+  const liveStatus = !saved.formUrl
+    ? "No form link saved yet — /join is showing the closed notice."
+    : saved.isOpen
+      ? "Recruitment is open. /join is showing the form."
+      : "Recruitment is closed. /join is showing the closed notice.";
+
   const dirty =
     isOpen !== saved.isOpen ||
     formUrl !== (saved.formUrl ?? "") ||
@@ -129,6 +139,20 @@ export default function RecruitmentPanel({ initial }: { initial: RecruitmentPane
           )}
         </div>
 
+        <div className="mt-5 flex flex-wrap items-center gap-x-4 gap-y-2 border-t border-hairline pt-4">
+          <span className="text-xs text-charcoal/70">{liveStatus}</span>
+          {saved.formUrl && (
+            <a
+              href={toShareUrl(saved.formUrl)}
+              target="_blank"
+              rel="noopener noreferrer"
+              className="font-mono text-[11px] uppercase tracking-wider text-bronze hover:text-chocolate transition"
+            >
+              Preview the saved form &rarr;
+            </a>
+          )}
+        </div>
+
         <p className="mt-4 text-[11px] text-charcoal/45">
           Paste either the plain form link or the one from the embed (&lt;&gt;) dialog — both
           work. Must be an https://docs.google.com/forms/… URL.