feat(demo): add demo manifest, Dutch demo entry, permanent badge and About page

Adds GET /api/v1/demo/manifest as a single source of truth for the demo's
fictional org identity (Northstar Mobility -- surfacing the project's
already-locked tenant name), synthetic-data/reset state, and live scenario
readiness. Rewrites the login screen in Dutch with an honest, no-password
demo entry and a guided-demo entry point, replaces the loud full-width
demo banner with a subtle badge + popover, and adds a compact About page
explaining what's real vs. synthetic vs. not yet connected.

frontend/src/components/Layout.tsx

@@ -4,6 +4,8 @@ import { api, ApiError } from "../api/client";
 import { useAuth } from "../context/AuthContext";
 import type { Role, SearchResultItem } from "../api/types";
 import { BrandMark, Icon, type IconName } from "./Icons";
+import { DemoBadge } from "./DemoBadge";
+import { useDemoManifest } from "../context/DemoManifestContext";
 
 const SEARCH_ICON: Record<SearchResultItem["type"], IconName> = {
   vehicle: "fleet",
@@ -42,6 +44,7 @@ const NAV_GROUPS: Array<{ label: string; items: NavItem[] }> = [
 
 export function Layout() {
   const { user, logout } = useAuth();
+  const { manifest } = useDemoManifest();
   const navigate = useNavigate();
   const [mobileOpen, setMobileOpen] = useState(false);
   const [searchQuery, setSearchQuery] = useState("");
@@ -192,7 +195,7 @@ export function Layout() {
           <span className="environment-dot" />
           <div><strong>Demo environment</strong><span>Synthetic data only</span></div>
         </div>
-        {user?.role === "operations_manager" && (
+        {user?.role === "operations_manager" && manifest?.allow_reset !== false && (
           <div className="sidebar-reset">
             {resetError && <p className="error" role="alert">{resetError}</p>}
             {!resetConfirming ? (
@@ -274,6 +277,7 @@ export function Layout() {
             )}
           </div>
           <div className="topbar-meta">
+            <DemoBadge />
             <span className="timezone"><Icon name="clock" /> Europe/Brussels</span>
             {user && (
               <div className="operator">
@@ -287,7 +291,6 @@ export function Layout() {
           </div>
         </header>
 
-        <p className="demo-banner"><Icon name="shield" /> Synthetic demo data · no real customer or vehicle information</p>
         <main id="main-content" tabIndex={-1}><Outlet /></main>
         <footer className="app-footer"><span>MobilityOps PoC</span><span>Europe/Brussels · Synthetic demo data</span></footer>
       </div>