chore: format the tree and clear ruff's findings

Applies ruff format, ruff check --fix and prettier, so CI can gate on all three.
The surviving unused imports were all re-exports in __init__.py, now covered by a
per-file ignore; the pdf.js viewer and the generated openapi types join the
vendored code that eslint and prettier already skip.

frontend/src/routes/(root)/(library)/library/[libraryId]/+page.svelte

@@ -1,15 +1,14 @@
 <script lang="ts">
 	import { ScrollArea } from '$lib/components/ui/scroll-area/index.js';
-	import * as Empty from '$lib/components/ui/empty/index.js'
-	import { Button } from '$lib/components/ui/button/index.js'
+	import * as Empty from '$lib/components/ui/empty/index.js';
+	import { Button } from '$lib/components/ui/button/index.js';
 	import BookList from '$lib/components/view/book-list.svelte';
 	import { FolderX, Upload } from '@lucide/svelte';
 	import { getBookOperationsState } from '$lib/state/bookOperations.svelte.js';
 
 	let { data } = $props();
 
-	let bookOps = getBookOperationsState()
-
+	let bookOps = getBookOperationsState();
 </script>
 
 <ScrollArea class="h-full w-full">
@@ -22,7 +21,7 @@
 
 	<!-- Empty when no preset returned anything, i.e. the library has no books -->
 	{#if data.presets.every((preset) => data.shelves[preset.id].length === 0)}
-		<div class="flex flex-col items-center justify-center w-full h-full">
+		<div class="flex h-full w-full flex-col items-center justify-center">
 			<!-- Show a CTA to upload books if the library is empty -->
 			<Empty.Root class="mb-[12vh]">
 				<Empty.Header>

frontend/src/routes/(root)/+layout.svelte

@@ -44,7 +44,6 @@
 	});
 </script>
 
-
 <div class="[--header-height:calc(--spacing(14))]">
 	<Sidebar.Provider class="flex flex-col">
 		<div class="flex h-screen">

frontend/src/routes/(root)/settings/appearance/+page.svelte

@@ -71,7 +71,8 @@
 
 	<!-- Colours -->
 	<section class="flex flex-col gap-3">
-		<Label class="text-xs font-medium tracking-wider text-muted-foreground uppercase">Colours</Label>
+		<Label class="text-xs font-medium tracking-wider text-muted-foreground uppercase">Colours</Label
+		>
 		<div class="grid gap-x-6 gap-y-1 sm:grid-cols-2">
 			{#each COLOR_TOKENS as token (token.key)}
 				<div class="flex items-center gap-3 rounded-md px-2 py-2 hover:bg-muted">
@@ -94,7 +95,8 @@
 
 	<!-- Radius -->
 	<section class="flex flex-col gap-3">
-		<Label class="text-xs font-medium tracking-wider text-muted-foreground uppercase">Corners</Label>
+		<Label class="text-xs font-medium tracking-wider text-muted-foreground uppercase">Corners</Label
+		>
 		<div class="flex flex-wrap gap-2">
 			{#each RADII as option (option.value)}
 				<button
@@ -138,7 +140,8 @@
 
 	<!-- Preview -->
 	<section class="flex flex-col gap-3">
-		<Label class="text-xs font-medium tracking-wider text-muted-foreground uppercase">Preview</Label>
+		<Label class="text-xs font-medium tracking-wider text-muted-foreground uppercase">Preview</Label
+		>
 		<div class="rounded-lg border bg-sidebar p-4">
 			<div class="flex flex-col gap-4 rounded-lg border bg-card p-4">
 				<div class="flex items-baseline justify-between gap-4">

frontend/src/routes/(root)/settings/devices/+page.server.ts

@@ -1,9 +1,9 @@
-import { listDevices } from "$lib/api/device.remote";
+import { listDevices } from '$lib/api/device.remote';
 
 export async function load() {
-    const devices = await listDevices();
+	const devices = await listDevices();
 
-    return {
-        devices
-    };
+	return {
+		devices
+	};
 }

frontend/src/routes/(root)/settings/devices/+page.svelte

@@ -109,9 +109,7 @@
 				<Smartphone />
 			</Empty.Media>
 			<Empty.Title>No devices</Empty.Title>
-			<Empty.Description>
-				Add a device to sync your KOReader reading progress.
-			</Empty.Description>
+			<Empty.Description>Add a device to sync your KOReader reading progress.</Empty.Description>
 		</Empty.Header>
 		<Empty.Content>
 			<Button onclick={() => (createDialogOpen = true)}>
@@ -224,12 +222,14 @@
 		<AlertDialog.Header>
 			<AlertDialog.Title>Regenerate API key?</AlertDialog.Title>
 			<AlertDialog.Description>
-				This will invalidate the current API key for "{regenerateConfirmDevice?.name}".
-				You will need to update the key in your KOReader device settings.
+				This will invalidate the current API key for "{regenerateConfirmDevice?.name}". You will
+				need to update the key in your KOReader device settings.
 			</AlertDialog.Description>
 		</AlertDialog.Header>
 		<AlertDialog.Footer>
-			<AlertDialog.Cancel onclick={() => (regenerateConfirmDevice = null)}>Cancel</AlertDialog.Cancel>
+			<AlertDialog.Cancel onclick={() => (regenerateConfirmDevice = null)}
+				>Cancel</AlertDialog.Cancel
+			>
 			<AlertDialog.Action
 				onclick={() => regenerateConfirmDevice && handleRegenerate(regenerateConfirmDevice)}
 			>

frontend/src/routes/(root)/settings/libraries/+page.svelte

@@ -38,7 +38,9 @@
 						>
 						<Table.Cell class="font-medium">
 							<a
-								href={resolve('/(root)/(library)/library/[libraryId]', { libraryId: String(library.id) })}
+								href={resolve('/(root)/(library)/library/[libraryId]', {
+									libraryId: String(library.id)
+								})}
 								class="hover:underline">{library.name}</a
 							>
 						</Table.Cell>

frontend/src/routes/(root)/settings/libraries/[libraryId]/duplicates/+page.server.ts

@@ -10,9 +10,7 @@ export async function load({ params, depends }) {
 	// identifiers, description, publisher — so fetch them in one go rather than per
 	// card, and let the dialog pick out the books for its own group.
 	const ids = [...new Set(groups.flatMap((group) => group.books.map((book) => book.book_id)))];
-	const books = ids.length
-		? await listBooks({ ids, pageSize: ids.length })
-		: { items: [] };
+	const books = ids.length ? await listBooks({ ids, pageSize: ids.length }) : { items: [] };
 
 	return { groups, books: books.items };
 }