feat: Stage 3 — application shell and navigation

frontend/src/pages/BlocklistsPage.tsx

@@ -0,0 +1,23 @@
+/**
+ * Blocklists placeholder page — full implementation in Stage 10.
+ */
+
+import { Text, makeStyles, tokens } from "@fluentui/react-components";
+
+const useStyles = makeStyles({
+  root: { padding: tokens.spacingVerticalXXL },
+});
+
+export function BlocklistsPage(): JSX.Element {
+  const styles = useStyles();
+  return (
+    <div className={styles.root}>
+      <Text as="h1" size={700} weight="semibold">
+        Blocklists
+      </Text>
+      <Text as="p" size={300}>
+        Blocklist management will be implemented in Stage 10.
+      </Text>
+    </div>
+  );
+}

frontend/src/pages/ConfigPage.tsx

@@ -0,0 +1,23 @@
+/**
+ * Configuration placeholder page — full implementation in Stage 8.
+ */
+
+import { Text, makeStyles, tokens } from "@fluentui/react-components";
+
+const useStyles = makeStyles({
+  root: { padding: tokens.spacingVerticalXXL },
+});
+
+export function ConfigPage(): JSX.Element {
+  const styles = useStyles();
+  return (
+    <div className={styles.root}>
+      <Text as="h1" size={700} weight="semibold">
+        Configuration
+      </Text>
+      <Text as="p" size={300}>
+        fail2ban configuration editor will be implemented in Stage 8.
+      </Text>
+    </div>
+  );
+}

frontend/src/pages/HistoryPage.tsx

@@ -0,0 +1,23 @@
+/**
+ * Ban history placeholder page — full implementation in Stage 9.
+ */
+
+import { Text, makeStyles, tokens } from "@fluentui/react-components";
+
+const useStyles = makeStyles({
+  root: { padding: tokens.spacingVerticalXXL },
+});
+
+export function HistoryPage(): JSX.Element {
+  const styles = useStyles();
+  return (
+    <div className={styles.root}>
+      <Text as="h1" size={700} weight="semibold">
+        History
+      </Text>
+      <Text as="p" size={300}>
+        Historical ban query view will be implemented in Stage 9.
+      </Text>
+    </div>
+  );
+}

frontend/src/pages/JailDetailPage.tsx

@@ -0,0 +1,25 @@
+/**
+ * Jail detail placeholder page — full implementation in Stage 6.
+ */
+
+import { Text, makeStyles, tokens } from "@fluentui/react-components";
+import { useParams } from "react-router-dom";
+
+const useStyles = makeStyles({
+  root: { padding: tokens.spacingVerticalXXL },
+});
+
+export function JailDetailPage(): JSX.Element {
+  const styles = useStyles();
+  const { name } = useParams<{ name: string }>();
+  return (
+    <div className={styles.root}>
+      <Text as="h1" size={700} weight="semibold">
+        Jail: {name}
+      </Text>
+      <Text as="p" size={300}>
+        Jail detail view will be implemented in Stage 6.
+      </Text>
+    </div>
+  );
+}

frontend/src/pages/JailsPage.tsx

@@ -0,0 +1,23 @@
+/**
+ * Jails overview placeholder page — full implementation in Stage 6.
+ */
+
+import { Text, makeStyles, tokens } from "@fluentui/react-components";
+
+const useStyles = makeStyles({
+  root: { padding: tokens.spacingVerticalXXL },
+});
+
+export function JailsPage(): JSX.Element {
+  const styles = useStyles();
+  return (
+    <div className={styles.root}>
+      <Text as="h1" size={700} weight="semibold">
+        Jails
+      </Text>
+      <Text as="p" size={300}>
+        Jail management will be implemented in Stage 6.
+      </Text>
+    </div>
+  );
+}

frontend/src/pages/MapPage.tsx

@@ -0,0 +1,23 @@
+/**
+ * World Map placeholder page — full implementation in Stage 5.
+ */
+
+import { Text, makeStyles, tokens } from "@fluentui/react-components";
+
+const useStyles = makeStyles({
+  root: { padding: tokens.spacingVerticalXXL },
+});
+
+export function MapPage(): JSX.Element {
+  const styles = useStyles();
+  return (
+    <div className={styles.root}>
+      <Text as="h1" size={700} weight="semibold">
+        World Map
+      </Text>
+      <Text as="p" size={300}>
+        Geographical ban overview will be implemented in Stage 5.
+      </Text>
+    </div>
+  );
+}