diff --git a/web/package-lock.json b/web/package-lock.json
index 88d38a2..5a562da 100644
--- a/web/package-lock.json
+++ b/web/package-lock.json
@@ -7,11 +7,6 @@
             "dependencies": {
                 "@inertiajs/vue3": "^2.3.18",
                 "@vitejs/plugin-vue": "^6.0.5",
-                "class-variance-authority": "^0.7.1",
-                "clsx": "^2.1.1",
-                "lucide-vue-next": "^1.0.0",
-                "radix-vue": "^1.9.17",
-                "tailwind-merge": "^3.5.0",
                 "vue": "^3.5.30"
             },
             "devDependencies": {
@@ -487,68 +482,6 @@
                 "node": ">=18"
             }
         },
-        "node_modules/@floating-ui/core": {
-            "version": "1.7.5",
-            "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.7.5.tgz",
-            "integrity": "sha512-1Ih4WTWyw0+lKyFMcBHGbb5U5FtuHJuujoyyr5zTaWS5EYMeT6Jb2AuDeftsCsEuchO+mM2ij5+q9crhydzLhQ==",
-            "license": "MIT",
-            "dependencies": {
-                "@floating-ui/utils": "^0.2.11"
-            }
-        },
-        "node_modules/@floating-ui/dom": {
-            "version": "1.7.6",
-            "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.7.6.tgz",
-            "integrity": "sha512-9gZSAI5XM36880PPMm//9dfiEngYoC6Am2izES1FF406YFsjvyBMmeJ2g4SAju3xWwtuynNRFL2s9hgxpLI5SQ==",
-            "license": "MIT",
-            "dependencies": {
-                "@floating-ui/core": "^1.7.5",
-                "@floating-ui/utils": "^0.2.11"
-            }
-        },
-        "node_modules/@floating-ui/utils": {
-            "version": "0.2.11",
-            "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.11.tgz",
-            "integrity": "sha512-RiB/yIh78pcIxl6lLMG0CgBXAZ2Y0eVHqMPYugu+9U0AeT6YBeiJpf7lbdJNIugFP5SIjwNRgo4DhR1Qxi26Gg==",
-            "license": "MIT"
-        },
-        "node_modules/@floating-ui/vue": {
-            "version": "1.1.11",
-            "resolved": "https://registry.npmjs.org/@floating-ui/vue/-/vue-1.1.11.tgz",
-            "integrity": "sha512-HzHKCNVxnGS35r9fCHBc3+uCnjw9IWIlCPL683cGgM9Kgj2BiAl8x1mS7vtvP6F9S/e/q4O6MApwSHj8hNLGfw==",
-            "license": "MIT",
-            "dependencies": {
-                "@floating-ui/dom": "^1.7.6",
-                "@floating-ui/utils": "^0.2.11",
-                "vue-demi": ">=0.13.0"
-            }
-        },
-        "node_modules/@floating-ui/vue/node_modules/vue-demi": {
-            "version": "0.14.10",
-            "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
-            "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
-            "hasInstallScript": true,
-            "license": "MIT",
-            "bin": {
-                "vue-demi-fix": "bin/vue-demi-fix.js",
-                "vue-demi-switch": "bin/vue-demi-switch.js"
-            },
-            "engines": {
-                "node": ">=12"
-            },
-            "funding": {
-                "url": "https://github.com/sponsors/antfu"
-            },
-            "peerDependencies": {
-                "@vue/composition-api": "^1.0.0-rc.1",
-                "vue": "^3.0.0-0 || ^2.6.0"
-            },
-            "peerDependenciesMeta": {
-                "@vue/composition-api": {
-                    "optional": true
-                }
-            }
-        },
         "node_modules/@inertiajs/core": {
             "version": "2.3.18",
             "resolved": "https://registry.npmjs.org/@inertiajs/core/-/core-2.3.18.tgz",
@@ -577,24 +510,6 @@
                 "vue": "^3.0.0"
             }
         },
-        "node_modules/@internationalized/date": {
-            "version": "3.12.0",
-            "resolved": "https://registry.npmjs.org/@internationalized/date/-/date-3.12.0.tgz",
-            "integrity": "sha512-/PyIMzK29jtXaGU23qTvNZxvBXRtKbNnGDFD+PY6CZw/Y8Ex8pFUzkuCJCG9aOqmShjqhS9mPqP6Dk5onQY8rQ==",
-            "license": "Apache-2.0",
-            "dependencies": {
-                "@swc/helpers": "^0.5.0"
-            }
-        },
-        "node_modules/@internationalized/number": {
-            "version": "3.6.5",
-            "resolved": "https://registry.npmjs.org/@internationalized/number/-/number-3.6.5.tgz",
-            "integrity": "sha512-6hY4Kl4HPBvtfS62asS/R22JzNNy8vi/Ssev7x6EobfCp+9QIB2hKvI2EtbdJ0VSQacxVNtqhE/NmF/NZ0gm6g==",
-            "license": "Apache-2.0",
-            "dependencies": {
-                "@swc/helpers": "^0.5.0"
-            }
-        },
         "node_modules/@jridgewell/gen-mapping": {
             "version": "0.3.13",
             "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz",
@@ -991,15 +906,6 @@
                 "win32"
             ]
         },
-        "node_modules/@swc/helpers": {
-            "version": "0.5.19",
-            "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.19.tgz",
-            "integrity": "sha512-QamiFeIK3txNjgUTNppE6MiG3p7TdninpZu0E0PbqVh1a9FNLT2FRhisaa4NcaX52XVhA5l7Pk58Ft7Sqi/2sA==",
-            "license": "Apache-2.0",
-            "dependencies": {
-                "tslib": "^2.8.0"
-            }
-        },
         "node_modules/@tailwindcss/node": {
             "version": "4.2.2",
             "resolved": "https://registry.npmjs.org/@tailwindcss/node/-/node-4.2.2.tgz",
@@ -1272,32 +1178,6 @@
                 "vite": "^5.2.0 || ^6 || ^7 || ^8"
             }
         },
-        "node_modules/@tanstack/virtual-core": {
-            "version": "3.13.23",
-            "resolved": "https://registry.npmjs.org/@tanstack/virtual-core/-/virtual-core-3.13.23.tgz",
-            "integrity": "sha512-zSz2Z2HNyLjCplANTDyl3BcdQJc2k1+yyFoKhNRmCr7V7dY8o8q5m8uFTI1/Pg1kL+Hgrz6u3Xo6eFUB7l66cg==",
-            "license": "MIT",
-            "funding": {
-                "type": "github",
-                "url": "https://github.com/sponsors/tannerlinsley"
-            }
-        },
-        "node_modules/@tanstack/vue-virtual": {
-            "version": "3.13.23",
-            "resolved": "https://registry.npmjs.org/@tanstack/vue-virtual/-/vue-virtual-3.13.23.tgz",
-            "integrity": "sha512-b5jPluAR6U3eOq6GWAYSpj3ugnAIZgGR0e6aGAgyRse0Yu6MVQQ0ZWm9SArSXWtageogn6bkVD8D//c4IjW3xQ==",
-            "license": "MIT",
-            "dependencies": {
-                "@tanstack/virtual-core": "3.13.23"
-            },
-            "funding": {
-                "type": "github",
-                "url": "https://github.com/sponsors/tannerlinsley"
-            },
-            "peerDependencies": {
-                "vue": "^2.7.0 || ^3.0.0"
-            }
-        },
         "node_modules/@types/estree": {
             "version": "1.0.8",
             "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz",
@@ -1319,12 +1199,6 @@
                 "@types/lodash": "*"
             }
         },
-        "node_modules/@types/web-bluetooth": {
-            "version": "0.0.20",
-            "resolved": "https://registry.npmjs.org/@types/web-bluetooth/-/web-bluetooth-0.0.20.tgz",
-            "integrity": "sha512-g9gZnnXVq7gM7v3tJCWV/qw7w+KeOlSHAhgF9RytFyifW6AF61hdT2ucrYhPq9hLs5JIryeupHV3qGk95dH9ow==",
-            "license": "MIT"
-        },
         "node_modules/@vitejs/plugin-vue": {
             "version": "6.0.5",
             "resolved": "https://registry.npmjs.org/@vitejs/plugin-vue/-/plugin-vue-6.0.5.tgz",
@@ -1506,94 +1380,6 @@
             "integrity": "sha512-YXgQ7JjaO18NeK2K9VTbDHaFy62WrObMa6XERNfNOkAhD1F1oDSf3ZJ7K6GqabZ0BvSDHajp8qfS5Sa2I9n8uQ==",
             "license": "MIT"
         },
-        "node_modules/@vueuse/core": {
-            "version": "10.11.1",
-            "resolved": "https://registry.npmjs.org/@vueuse/core/-/core-10.11.1.tgz",
-            "integrity": "sha512-guoy26JQktXPcz+0n3GukWIy/JDNKti9v6VEMu6kV2sYBsWuGiTU8OWdg+ADfUbHg3/3DlqySDe7JmdHrktiww==",
-            "license": "MIT",
-            "dependencies": {
-                "@types/web-bluetooth": "^0.0.20",
-                "@vueuse/metadata": "10.11.1",
-                "@vueuse/shared": "10.11.1",
-                "vue-demi": ">=0.14.8"
-            },
-            "funding": {
-                "url": "https://github.com/sponsors/antfu"
-            }
-        },
-        "node_modules/@vueuse/core/node_modules/vue-demi": {
-            "version": "0.14.10",
-            "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
-            "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
-            "hasInstallScript": true,
-            "license": "MIT",
-            "bin": {
-                "vue-demi-fix": "bin/vue-demi-fix.js",
-                "vue-demi-switch": "bin/vue-demi-switch.js"
-            },
-            "engines": {
-                "node": ">=12"
-            },
-            "funding": {
-                "url": "https://github.com/sponsors/antfu"
-            },
-            "peerDependencies": {
-                "@vue/composition-api": "^1.0.0-rc.1",
-                "vue": "^3.0.0-0 || ^2.6.0"
-            },
-            "peerDependenciesMeta": {
-                "@vue/composition-api": {
-                    "optional": true
-                }
-            }
-        },
-        "node_modules/@vueuse/metadata": {
-            "version": "10.11.1",
-            "resolved": "https://registry.npmjs.org/@vueuse/metadata/-/metadata-10.11.1.tgz",
-            "integrity": "sha512-IGa5FXd003Ug1qAZmyE8wF3sJ81xGLSqTqtQ6jaVfkeZ4i5kS2mwQF61yhVqojRnenVew5PldLyRgvdl4YYuSw==",
-            "license": "MIT",
-            "funding": {
-                "url": "https://github.com/sponsors/antfu"
-            }
-        },
-        "node_modules/@vueuse/shared": {
-            "version": "10.11.1",
-            "resolved": "https://registry.npmjs.org/@vueuse/shared/-/shared-10.11.1.tgz",
-            "integrity": "sha512-LHpC8711VFZlDaYUXEBbFBCQ7GS3dVU9mjOhhMhXP6txTV4EhYQg/KGnQuvt/sPAtoUKq7VVUnL6mVtFoL42sA==",
-            "license": "MIT",
-            "dependencies": {
-                "vue-demi": ">=0.14.8"
-            },
-            "funding": {
-                "url": "https://github.com/sponsors/antfu"
-            }
-        },
-        "node_modules/@vueuse/shared/node_modules/vue-demi": {
-            "version": "0.14.10",
-            "resolved": "https://registry.npmjs.org/vue-demi/-/vue-demi-0.14.10.tgz",
-            "integrity": "sha512-nMZBOwuzabUO0nLgIcc6rycZEebF6eeUfaiQx9+WSk8e29IbLvPU9feI6tqW4kTo3hvoYAJkMh8n8D0fuISphg==",
-            "hasInstallScript": true,
-            "license": "MIT",
-            "bin": {
-                "vue-demi-fix": "bin/vue-demi-fix.js",
-                "vue-demi-switch": "bin/vue-demi-switch.js"
-            },
-            "engines": {
-                "node": ">=12"
-            },
-            "funding": {
-                "url": "https://github.com/sponsors/antfu"
-            },
-            "peerDependencies": {
-                "@vue/composition-api": "^1.0.0-rc.1",
-                "vue": "^3.0.0-0 || ^2.6.0"
-            },
-            "peerDependenciesMeta": {
-                "@vue/composition-api": {
-                    "optional": true
-                }
-            }
-        },
         "node_modules/alien-signals": {
             "version": "1.0.13",
             "resolved": "https://registry.npmjs.org/alien-signals/-/alien-signals-1.0.13.tgz",
@@ -1627,18 +1413,6 @@
                 "url": "https://github.com/chalk/ansi-styles?sponsor=1"
             }
         },
-        "node_modules/aria-hidden": {
-            "version": "1.2.6",
-            "resolved": "https://registry.npmjs.org/aria-hidden/-/aria-hidden-1.2.6.tgz",
-            "integrity": "sha512-ik3ZgC9dY/lYVVM++OISsaYDeg1tb0VtP5uL3ouh1koGOaUMDPpbFIei4JkFimWUFPn90sbMNMXQAIVOlnYKJA==",
-            "license": "MIT",
-            "dependencies": {
-                "tslib": "^2.0.0"
-            },
-            "engines": {
-                "node": ">=10"
-            }
-        },
         "node_modules/asynckit": {
             "version": "0.4.0",
             "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
@@ -1732,18 +1506,6 @@
                 "node": ">=8"
             }
         },
-        "node_modules/class-variance-authority": {
-            "version": "0.7.1",
-            "resolved": "https://registry.npmjs.org/class-variance-authority/-/class-variance-authority-0.7.1.tgz",
-            "integrity": "sha512-Ka+9Trutv7G8M6WT6SeiRWz792K5qEqIGEGzXKhAE6xOWAY6pPH8U+9IY3oCMv6kqTmLsv7Xh/2w2RigkePMsg==",
-            "license": "Apache-2.0",
-            "dependencies": {
-                "clsx": "^2.1.1"
-            },
-            "funding": {
-                "url": "https://polar.sh/cva"
-            }
-        },
         "node_modules/cliui": {
             "version": "8.0.1",
             "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
@@ -1759,15 +1521,6 @@
                 "node": ">=12"
             }
         },
-        "node_modules/clsx": {
-            "version": "2.1.1",
-            "resolved": "https://registry.npmjs.org/clsx/-/clsx-2.1.1.tgz",
-            "integrity": "sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==",
-            "license": "MIT",
-            "engines": {
-                "node": ">=6"
-            }
-        },
         "node_modules/color-convert": {
             "version": "2.0.1",
             "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
@@ -1838,12 +1591,6 @@
             "dev": true,
             "license": "MIT"
         },
-        "node_modules/defu": {
-            "version": "6.1.4",
-            "resolved": "https://registry.npmjs.org/defu/-/defu-6.1.4.tgz",
-            "integrity": "sha512-mEQCMmwJu317oSz8CwdIOdwf3xMif1ttiM8LTufzc3g6kR+9Pe236twL8j3IYT1F7GfRgGcW6MWxzZjLIkuHIg==",
-            "license": "MIT"
-        },
         "node_modules/delayed-stream": {
             "version": "1.0.0",
             "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
@@ -2012,12 +1759,6 @@
             "integrity": "sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==",
             "license": "MIT"
         },
-        "node_modules/fast-deep-equal": {
-            "version": "3.1.3",
-            "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
-            "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
-            "license": "MIT"
-        },
         "node_modules/fdir": {
             "version": "6.5.0",
             "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
@@ -2525,15 +2266,6 @@
             "integrity": "sha512-kVI48u3PZr38HdYz98UmfPnXl2DXrpdctLrFLCd3kOx1xUkOmpFPx7gCWWM5MPkL/fD8zb+Ph0QzjGFs4+hHWg==",
             "license": "MIT"
         },
-        "node_modules/lucide-vue-next": {
-            "version": "1.0.0",
-            "resolved": "https://registry.npmjs.org/lucide-vue-next/-/lucide-vue-next-1.0.0.tgz",
-            "integrity": "sha512-V6SPvx1IHTj/UY+FrIYWV5faISsPSb8BnWSFDxAtezWKvWc9ZZ40PDrdu1/Qb5vg4lHWr1hs1BAMGVGm6V1Xdg==",
-            "license": "ISC",
-            "peerDependencies": {
-                "vue": ">=3.0.1"
-            }
-        },
         "node_modules/magic-string": {
             "version": "0.30.21",
             "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz",
@@ -2747,46 +2479,6 @@
                 "url": "https://github.com/sponsors/ljharb"
             }
         },
-        "node_modules/radix-vue": {
-            "version": "1.9.17",
-            "resolved": "https://registry.npmjs.org/radix-vue/-/radix-vue-1.9.17.tgz",
-            "integrity": "sha512-mVCu7I2vXt1L2IUYHTt0sZMz7s1K2ZtqKeTIxG3yC5mMFfLBG4FtE1FDeRMpDd+Hhg/ybi9+iXmAP1ISREndoQ==",
-            "license": "MIT",
-            "dependencies": {
-                "@floating-ui/dom": "^1.6.7",
-                "@floating-ui/vue": "^1.1.0",
-                "@internationalized/date": "^3.5.4",
-                "@internationalized/number": "^3.5.3",
-                "@tanstack/vue-virtual": "^3.8.1",
-                "@vueuse/core": "^10.11.0",
-                "@vueuse/shared": "^10.11.0",
-                "aria-hidden": "^1.2.4",
-                "defu": "^6.1.4",
-                "fast-deep-equal": "^3.1.3",
-                "nanoid": "^5.0.7"
-            },
-            "peerDependencies": {
-                "vue": ">= 3.2.0"
-            }
-        },
-        "node_modules/radix-vue/node_modules/nanoid": {
-            "version": "5.1.7",
-            "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-5.1.7.tgz",
-            "integrity": "sha512-ua3NDgISf6jdwezAheMOk4mbE1LXjm1DfMUDMuJf4AqxLFK3ccGpgWizwa5YV7Yz9EpXwEaWoRXSb/BnV0t5dQ==",
-            "funding": [
-                {
-                    "type": "github",
-                    "url": "https://github.com/sponsors/ai"
-                }
-            ],
-            "license": "MIT",
-            "bin": {
-                "nanoid": "bin/nanoid.js"
-            },
-            "engines": {
-                "node": "^18 || >=20"
-            }
-        },
         "node_modules/require-directory": {
             "version": "2.1.1",
             "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
@@ -2989,16 +2681,6 @@
                 "url": "https://github.com/chalk/supports-color?sponsor=1"
             }
         },
-        "node_modules/tailwind-merge": {
-            "version": "3.5.0",
-            "resolved": "https://registry.npmjs.org/tailwind-merge/-/tailwind-merge-3.5.0.tgz",
-            "integrity": "sha512-I8K9wewnVDkL1NTGoqWmVEIlUcB9gFriAEkXkfCjX5ib8ezGxtR3xD7iZIxrfArjEsH7F1CHD4RFUtxefdqV/A==",
-            "license": "MIT",
-            "funding": {
-                "type": "github",
-                "url": "https://github.com/sponsors/dcastil"
-            }
-        },
         "node_modules/tailwindcss": {
             "version": "4.2.2",
             "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.2.2.tgz",
@@ -3050,6 +2732,7 @@
             "version": "2.8.1",
             "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
             "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
+            "dev": true,
             "license": "0BSD"
         },
         "node_modules/typescript": {
diff --git a/web/package.json b/web/package.json
index 20375c0..0665759 100644
--- a/web/package.json
+++ b/web/package.json
@@ -21,11 +21,6 @@
     "dependencies": {
         "@inertiajs/vue3": "^2.3.18",
         "@vitejs/plugin-vue": "^6.0.5",
-        "class-variance-authority": "^0.7.1",
-        "clsx": "^2.1.1",
-        "lucide-vue-next": "^1.0.0",
-        "radix-vue": "^1.9.17",
-        "tailwind-merge": "^3.5.0",
         "vue": "^3.5.30"
     }
 }
diff --git a/web/phpunit.xml b/web/phpunit.xml
index e7f0a48..660a765 100644
--- a/web/phpunit.xml
+++ b/web/phpunit.xml
@@ -18,14 +18,20 @@
         </include>
     </source>
     <php>
-        <env name="APP_ENV" value="testing"/>
+        <env name="APP_ENV" value="testing" force="true"/>
         <env name="APP_MAINTENANCE_DRIVER" value="file"/>
         <env name="BCRYPT_ROUNDS" value="4"/>
         <env name="BROADCAST_CONNECTION" value="null"/>
         <env name="CACHE_STORE" value="array"/>
-        <env name="DB_CONNECTION" value="sqlite"/>
-        <env name="DB_DATABASE" value=":memory:"/>
-        <env name="DB_URL" value=""/>
+        <env name="DB_CONNECTION" value="sqlite" force="true"/>
+        <env name="DB_DATABASE" value=":memory:" force="true"/>
+        <env name="DB_URL" value="" force="true"/>
+        <!-- Laravel reads $_SERVER before $_ENV: without these, a DB_* variable in the
+             shell (e.g. on a server) would point the tests — and RefreshDatabase — at a real database -->
+        <server name="APP_ENV" value="testing" force="true"/>
+        <server name="DB_CONNECTION" value="sqlite" force="true"/>
+        <server name="DB_DATABASE" value=":memory:" force="true"/>
+        <server name="DB_URL" value="" force="true"/>
         <env name="MAIL_MAILER" value="array"/>
         <env name="QUEUE_CONNECTION" value="sync"/>
         <env name="SESSION_DRIVER" value="array"/>
diff --git a/web/resources/js/Components/Pagination.vue b/web/resources/js/Components/Pagination.vue
new file mode 100644
index 0000000..7f91262
--- /dev/null
+++ b/web/resources/js/Components/Pagination.vue
@@ -0,0 +1,35 @@
+<template>
+  <nav v-if="links.length > 3" class="mt-8 flex flex-wrap items-center justify-center gap-1" aria-label="Pagination">
+    <template v-for="(link, i) in links" :key="i">
+      <Link
+        v-if="link.url"
+        :href="link.url"
+        preserve-scroll
+        :class="[
+          'min-w-9 rounded-md border px-3 py-1.5 text-center text-sm transition-colors',
+          link.active
+            ? 'border-indigo-600 bg-indigo-600 text-white'
+            : 'border-gray-200 bg-white text-gray-700 hover:border-gray-300',
+        ]"
+        :aria-current="link.active ? 'page' : undefined"
+      >
+        {{ label(link.label) }}
+      </Link>
+      <span v-else class="min-w-9 rounded-md px-3 py-1.5 text-center text-sm text-gray-300">
+        {{ label(link.label) }}
+      </span>
+    </template>
+  </nav>
+</template>
+
+<script setup lang="ts">
+import { Link } from '@inertiajs/vue3';
+import type { PaginationLink } from '@/types';
+
+defineProps<{ links: PaginationLink[] }>();
+
+// Laravel's labels are HTML entities ("&laquo; Previous"); render them as plain text
+function label(raw: string): string {
+  return raw.replace('&laquo;', '«').replace('&raquo;', '»');
+}
+</script>
diff --git a/web/resources/js/Components/SessionCard.vue b/web/resources/js/Components/SessionCard.vue
index 386e6b8..d0aeee2 100644
--- a/web/resources/js/Components/SessionCard.vue
+++ b/web/resources/js/Components/SessionCard.vue
@@ -1,5 +1,5 @@
 <template>
-  <a
+  <Link
     :href="`/sessions/${session.id}`"
     class="block rounded-xl border border-gray-200 bg-white p-4 shadow-sm hover:shadow-md hover:border-indigo-300 transition-all group"
   >
@@ -17,10 +17,11 @@
     <div class="mt-3 flex items-center gap-4 text-xs text-gray-400">
       <span>Session {{ session.session_id?.substring(0, 8) }}</span>
     </div>
-  </a>
+  </Link>
 </template>
 
 <script setup lang="ts">
+import { Link } from '@inertiajs/vue3';
 import ToolBadge from './ToolBadge.vue';
 import type { AiSession } from '@/types';
 
diff --git a/web/resources/js/Pages/Dashboard.vue b/web/resources/js/Pages/Dashboard.vue
index f43828e..5dcb823 100644
--- a/web/resources/js/Pages/Dashboard.vue
+++ b/web/resources/js/Pages/Dashboard.vue
@@ -7,10 +7,10 @@
           <p class="text-sm text-gray-500">AI session transfer platform</p>
         </div>
         <nav class="flex items-center gap-6 text-sm font-medium">
-          <a href="/projects" class="text-gray-600 hover:text-indigo-600">Projects</a>
-          <a href="/migration/wizard" class="rounded-lg bg-indigo-600 px-4 py-2 text-white hover:bg-indigo-700 transition-colors">
+          <Link href="/projects" class="text-gray-600 hover:text-indigo-600">Projects</Link>
+          <Link href="/migration/wizard" class="rounded-lg bg-indigo-600 px-4 py-2 text-white hover:bg-indigo-700 transition-colors">
             Migration Wizard
-          </a>
+          </Link>
           <span v-if="user" class="text-gray-400" data-testid="current-user">{{ user.name }}</span>
           <Link
             href="/logout"
@@ -51,20 +51,20 @@
         <h2 class="text-lg font-semibold text-gray-700">Quick Actions</h2>
       </div>
       <div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
-        <a href="/migration/wizard" class="flex items-center gap-4 rounded-xl border border-gray-200 bg-white p-5 hover:shadow-md transition-all">
+        <Link href="/migration/wizard" class="flex items-center gap-4 rounded-xl border border-gray-200 bg-white p-5 hover:shadow-md transition-all">
           <span class="text-3xl">⚡</span>
           <div>
             <p class="font-semibold">Migration Wizard</p>
             <p class="text-sm text-gray-500">Transfer sessions between AI tools</p>
           </div>
-        </a>
-        <a href="/projects" class="flex items-center gap-4 rounded-xl border border-gray-200 bg-white p-5 hover:shadow-md transition-all">
+        </Link>
+        <Link href="/projects" class="flex items-center gap-4 rounded-xl border border-gray-200 bg-white p-5 hover:shadow-md transition-all">
           <span class="text-3xl">📂</span>
           <div>
             <p class="font-semibold">Browse Projects</p>
             <p class="text-sm text-gray-500">View all projects and sessions</p>
           </div>
-        </a>
+        </Link>
       </div>
     </main>
   </div>
diff --git a/web/resources/js/Pages/Migration/Wizard.vue b/web/resources/js/Pages/Migration/Wizard.vue
index 2f6d0eb..6a59eca 100644
--- a/web/resources/js/Pages/Migration/Wizard.vue
+++ b/web/resources/js/Pages/Migration/Wizard.vue
@@ -2,7 +2,7 @@
   <div class="min-h-screen bg-gray-50">
     <header class="bg-white border-b border-gray-200 px-6 py-4">
       <div class="max-w-2xl mx-auto flex items-center gap-4">
-        <a href="/" class="text-gray-400 hover:text-gray-600">← Home</a>
+        <Link href="/" class="text-gray-400 hover:text-gray-600">← Home</Link>
         <h1 class="text-xl font-bold text-gray-900">Migration Wizard</h1>
       </div>
     </header>
@@ -185,6 +185,7 @@
 </template>
 
 <script setup lang="ts">
+import { Link } from '@inertiajs/vue3';
 import { computed, ref, reactive } from 'vue';
 import ToolBadge from '@/Components/ToolBadge.vue';
 import type { Project } from '@/types';
diff --git a/web/resources/js/Pages/Projects/Index.vue b/web/resources/js/Pages/Projects/Index.vue
index 59aa243..4159136 100644
--- a/web/resources/js/Pages/Projects/Index.vue
+++ b/web/resources/js/Pages/Projects/Index.vue
@@ -2,7 +2,7 @@
   <div class="min-h-screen bg-gray-50">
     <header class="bg-white border-b border-gray-200 px-6 py-4">
       <div class="max-w-7xl mx-auto flex items-center gap-4">
-        <a href="/" class="text-gray-400 hover:text-gray-600">← Home</a>
+        <Link href="/" class="text-gray-400 hover:text-gray-600">← Home</Link>
         <h1 class="text-xl font-bold text-gray-900">Projects</h1>
       </div>
     </header>
@@ -14,7 +14,7 @@
       </div>
 
       <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4">
-        <a
+        <Link
           v-for="project in projects.data"
           :key="project.id"
           :href="`/projects/${project.id}`"
@@ -31,20 +31,25 @@
               {{ project.ai_sessions_count }} session(s)
             </span>
           </div>
-        </a>
+        </Link>
       </div>
+
+      <Pagination :links="projects.links" />
     </main>
   </div>
 </template>
 
 <script setup lang="ts">
-import type { Project } from '@/types';
+import { Link } from '@inertiajs/vue3';
+import Pagination from '@/Components/Pagination.vue';
+import type { PaginationLink, Project } from '@/types';
 
 defineProps<{
   projects: {
     data: Project[];
     current_page: number;
     last_page: number;
+    links: PaginationLink[];
   };
 }>();
 </script>
diff --git a/web/resources/js/Pages/Projects/Show.vue b/web/resources/js/Pages/Projects/Show.vue
index 8008cc1..10d076c 100644
--- a/web/resources/js/Pages/Projects/Show.vue
+++ b/web/resources/js/Pages/Projects/Show.vue
@@ -2,7 +2,7 @@
   <div class="min-h-screen bg-gray-50">
     <header class="bg-white border-b border-gray-200 px-6 py-4">
       <div class="max-w-7xl mx-auto flex items-center gap-4">
-        <a href="/projects" class="text-gray-400 hover:text-gray-600">← Projects</a>
+        <Link href="/projects" class="text-gray-400 hover:text-gray-600">← Projects</Link>
         <h1 class="text-xl font-bold text-gray-900">{{ project.name }}</h1>
       </div>
     </header>
@@ -30,6 +30,7 @@
 </template>
 
 <script setup lang="ts">
+import { Link } from '@inertiajs/vue3';
 import SessionCard from '@/Components/SessionCard.vue';
 import type { AiSession, Project } from '@/types';
 
diff --git a/web/resources/js/Pages/Sessions/Show.vue b/web/resources/js/Pages/Sessions/Show.vue
index 5035a05..bcae5c7 100644
--- a/web/resources/js/Pages/Sessions/Show.vue
+++ b/web/resources/js/Pages/Sessions/Show.vue
@@ -2,11 +2,11 @@
   <div class="min-h-screen bg-gray-50">
     <header class="bg-white border-b border-gray-200 px-6 py-4">
       <div class="max-w-4xl mx-auto flex items-center gap-4">
-        <a
+        <Link
           v-if="session.project"
           :href="`/projects/${session.project_id}`"
           class="text-gray-400 hover:text-gray-600"
-        >← Project</a>
+        >← Project</Link>
         <h1 class="text-xl font-bold text-gray-900">{{ session.title }}</h1>
         <ToolBadge :tool="session.source_tool" />
       </div>
@@ -39,6 +39,7 @@
 </template>
 
 <script setup lang="ts">
+import { Link } from '@inertiajs/vue3';
 import ToolBadge from '@/Components/ToolBadge.vue';
 import TurnBlock from '@/Components/TurnBlock.vue';
 import type { AiSession, SessionDTO } from '@/types';
diff --git a/web/resources/js/types/index.d.ts b/web/resources/js/types/index.d.ts
index 54440ae..bdd5206 100644
--- a/web/resources/js/types/index.d.ts
+++ b/web/resources/js/types/index.d.ts
@@ -66,3 +66,10 @@ export interface SharedProps {
   auth: { user: AuthUser | null };
   [key: string]: unknown;
 }
+
+/** One entry of a Laravel paginator's `links` array. */
+export interface PaginationLink {
+  url: string | null;
+  label: string;
+  active: boolean;
+}