web/settings: move accessibility settings to the accessibility page

also rearranged the nav bar a bit to make it look cleaner

... and also accommodated for the new location of accessibility settings (oops)

web/src/routes/settings/accessibility/+page.svelte

@@ -0,0 +1,39 @@
+<script lang="ts">
+    import { device } from "$lib/device";
+    import { t } from "$lib/i18n/translations";
+
+    import SettingsToggle from "$components/buttons/SettingsToggle.svelte";
+    import SettingsCategory from "$components/settings/SettingsCategory.svelte";
+</script>
+
+<SettingsCategory
+    sectionId="visual"
+    title={$t("settings.accessibility.visual")}
+>
+    <SettingsToggle
+        settingContext="accessibility"
+        settingId="reduceMotion"
+        title={$t("settings.accessibility.motion.title")}
+        description={$t("settings.accessibility.motion.description")}
+    />
+    <SettingsToggle
+        settingContext="accessibility"
+        settingId="reduceTransparency"
+        title={$t("settings.accessibility.transparency.title")}
+        description={$t("settings.accessibility.transparency.description")}
+    />
+</SettingsCategory>
+
+{#if device.supports.haptics}
+    <SettingsCategory
+        sectionId="haptics"
+        title={$t("settings.accessibility.haptics")}
+    >
+        <SettingsToggle
+            settingContext="accessibility"
+            settingId="disableHaptics"
+            title={$t("settings.accessibility.haptics.title")}
+            description={$t("settings.accessibility.haptics.description")}
+        />
+    </SettingsCategory>
+{/if}