style: format web/src with oxfmt defaults (via vp fmt)

One-time mechanical sweep, isolated from any functional change.
- oxfmt defaults: double quotes, semicolons, 2-space indent, LF,
  printWidth 100, trailing commas, bracket spacing, arrow parens.
- vite.config.ts gains an fmt.ignorePatterns block for web/static:
  vendored/minified assets (htmx.min.js, compiled css) must never
  be reformatted.
- Verified: rebuild after the sweep produces byte-identical JS/CSS
  bundles; only sourcemaps changed (they embed sourcesContent).

web/src/custom-section-builder.ts

@@ -174,16 +174,7 @@ const FILTER_FIELDS: FilterField[] = [
       { id: "in", label: "In", requiresValue: true },
     ],
     valueType: "select",
-    options: [
-      "English",
-      "Spanish",
-      "French",
-      "German",
-      "Japanese",
-      "Chinese",
-      "Russian",
-      "Other",
-    ],
+    options: ["English", "Spanish", "French", "German", "Japanese", "Chinese", "Russian", "Other"],
   },
   {
     id: "format",
@@ -300,45 +291,28 @@ function addFilterRule(): void {
 
   container.appendChild(ruleElement);
 
-  const fieldSelect = ruleElement.querySelector(
-    ".field-select",
-  ) as HTMLSelectElement;
-  const removeBtn = ruleElement.querySelector(
-    ".remove-rule-btn",
-  ) as HTMLButtonElement;
+  const fieldSelect = ruleElement.querySelector(".field-select") as HTMLSelectElement;
+  const removeBtn = ruleElement.querySelector(".remove-rule-btn") as HTMLButtonElement;
 
   fieldSelect.addEventListener("change", () => onFieldChange(ruleElement));
   removeBtn.addEventListener("click", () => removeFilterRule(ruleId));
 }
 
 function onFieldChange(ruleElement: HTMLElement): void {
-  const fieldSelect = ruleElement.querySelector(
-    ".field-select",
-  ) as HTMLSelectElement;
-  const operatorSelect = ruleElement.querySelector(
-    ".operator-select",
-  ) as HTMLSelectElement;
-  const valueInput = ruleElement.querySelector(
-    ".value-input",
-  ) as HTMLInputElement;
+  const fieldSelect = ruleElement.querySelector(".field-select") as HTMLSelectElement;
+  const operatorSelect = ruleElement.querySelector(".operator-select") as HTMLSelectElement;
+  const valueInput = ruleElement.querySelector(".value-input") as HTMLInputElement;
 
   const fieldId = fieldSelect.value;
   const field = FILTER_FIELDS.find((f) => f.id === fieldId);
 
   operatorSelect.innerHTML = field
-    ? field.operators
-        .map((op) => `<option value="${op.id}">${op.label}</option>`)
-        .join("")
+    ? field.operators.map((op) => `<option value="${op.id}">${op.label}</option>`).join("")
     : '<option value="">Select field first...</option>';
 
   operatorSelect.disabled = !field;
 
-  if (
-    field &&
-    field.operators.some(
-      (op) => op.id === operatorSelect.value && op.requiresValue,
-    )
-  ) {
+  if (field && field.operators.some((op) => op.id === operatorSelect.value && op.requiresValue)) {
     valueInput.classList.remove("hidden");
 
     if (field.valueType === "select" && field.options) {
@@ -356,9 +330,7 @@ function onFieldChange(ruleElement: HTMLElement): void {
   }
 
   operatorSelect.addEventListener("change", () => {
-    const selectedOp = field?.operators.find(
-      (op) => op.id === operatorSelect.value,
-    );
+    const selectedOp = field?.operators.find((op) => op.id === operatorSelect.value);
     if (selectedOp?.requiresValue) {
       valueInput.classList.remove("hidden");
     } else {
@@ -384,15 +356,9 @@ function onBookSearchInput(): void {
 }
 
 async function searchBooks(): Promise<void> {
-  const searchInput = document.getElementById(
-    "book-search",
-  ) as HTMLInputElement;
-  const librarySelect = document.getElementById(
-    "section-library",
-  ) as HTMLSelectElement;
-  const resultsContainer = document.getElementById(
-    "search-results",
-  ) as HTMLElement;
+  const searchInput = document.getElementById("book-search") as HTMLInputElement;
+  const librarySelect = document.getElementById("section-library") as HTMLSelectElement;
+  const resultsContainer = document.getElementById("search-results") as HTMLElement;
 
   const query = searchInput?.value.trim();
   const libraryId = librarySelect?.value;
@@ -426,9 +392,7 @@ async function searchBooks(): Promise<void> {
 }
 
 function displaySearchResults(books: BookInfo[]): void {
-  const resultsContainer = document.getElementById(
-    "search-results",
-  ) as HTMLElement;
+  const resultsContainer = document.getElementById("search-results") as HTMLElement;
   if (!resultsContainer) return;
 
   if (books.length === 0) {
@@ -458,11 +422,7 @@ function displaySearchResults(books: BookInfo[]): void {
   resultsContainer.classList.remove("hidden");
 }
 
-const addBookToSelection = (
-  bookId: string,
-  title: string,
-  author: string,
-): void => {
+const addBookToSelection = (bookId: string, title: string, author: string): void => {
   if (selectedBooks.has(bookId)) {
     showToast("Book already selected", "error");
     return;
@@ -508,12 +468,8 @@ function updateSelectedBooksDisplay(): void {
 }
 
 async function loadPreview(): Promise<void> {
-  const previewContainer = document.getElementById(
-    "preview-container",
-  ) as HTMLElement;
-  const librarySelect = document.getElementById(
-    "section-library",
-  ) as HTMLSelectElement;
+  const previewContainer = document.getElementById("preview-container") as HTMLElement;
+  const librarySelect = document.getElementById("section-library") as HTMLSelectElement;
   const libraryId = librarySelect?.value;
 
   if (!libraryId) {
@@ -543,8 +499,7 @@ async function loadPreview(): Promise<void> {
     }
   } catch (error) {
     console.error("Preview error:", error);
-    previewContainer.innerHTML =
-      '<p class="text-center text-red-500">Failed to load preview</p>';
+    previewContainer.innerHTML = '<p class="text-center text-red-500">Failed to load preview</p>';
   }
 }
 
@@ -556,15 +511,9 @@ function gatherFilterRules(): FilterRule[] {
   const rules: FilterRule[] = [];
 
   ruleElements.forEach((element, index) => {
-    const fieldSelect = element.querySelector(
-      ".field-select",
-    ) as HTMLSelectElement;
-    const operatorSelect = element.querySelector(
-      ".operator-select",
-    ) as HTMLSelectElement;
-    const valueInput = element.querySelector(
-      ".value-input",
-    ) as HTMLInputElement;
+    const fieldSelect = element.querySelector(".field-select") as HTMLSelectElement;
+    const operatorSelect = element.querySelector(".operator-select") as HTMLSelectElement;
+    const valueInput = element.querySelector(".value-input") as HTMLInputElement;
 
     if (fieldSelect.value && operatorSelect.value) {
       rules.push({
@@ -581,9 +530,7 @@ function gatherFilterRules(): FilterRule[] {
 }
 
 function displayPreview(items: BookInfo[]): void {
-  const previewContainer = document.getElementById(
-    "preview-container",
-  ) as HTMLElement;
+  const previewContainer = document.getElementById("preview-container") as HTMLElement;
   if (!previewContainer) return;
 
   if (items.length === 0) {
@@ -626,8 +573,7 @@ async function saveCustomSection(event: Event): Promise<void> {
   const name = formData.get("name") as string;
   const icon = formData.get("icon") as string;
   const description = formData.get("description") as string;
-  const matchType = (document.getElementById("match-type") as HTMLSelectElement)
-    .value;
+  const matchType = (document.getElementById("match-type") as HTMLSelectElement).value;
 
   if (!libraryId || !name) {
     showToast("Please fill in required fields", "error");