ui fixes

app/letters/year/[year]/year-month-browser.tsx

@@ -4,7 +4,6 @@ import { useState, useMemo, useRef } from "react";
 import Link from "next/link";
 import { Card, CardContent } from "@/components/ui/card";
 import { buttonVariants } from "@/components/ui/button";
-import { ReadingSettings } from "@/components/reading-settings";
 import { cn } from "@/lib/utils";
 import { ChevronLeft, ChevronRight, Menu } from "lucide-react";
 import {
@@ -356,27 +355,22 @@ export function YearMonthBrowser({
     <>
       {/* Header */}
       <header className="border-b border-border bg-card px-6 py-4 sticky top-0 z-20">
-        <div className="max-w-5xl mx-auto flex items-start justify-between gap-4">
-          <div className="flex-1 min-w-0">
-            <Link
-              href="/letters?view=year"
-              className="text-sm text-muted-foreground hover:text-foreground transition-colors"
-            >
-              &larr; Letters by Year
-            </Link>
-            <h1 className="mt-3 text-2xl font-bold text-foreground">
-              <span className="text-primary">Letters: </span>
-              {activeLabel} {year}
-            </h1>
-            <p className="mt-1 text-muted-foreground">
-              {activeGroup?.count ?? 0}{" "}
-              {(activeGroup?.count ?? 0) === 1 ? "letter" : "letters"} ·{" "}
-              {totalCount} total in {year}
-            </p>
-          </div>
-          <div className="shrink-0 pt-1">
-            <ReadingSettings />
-          </div>
+        <div className="max-w-5xl mx-auto">
+          <Link
+            href="/letters?view=year"
+            className="text-sm text-muted-foreground hover:text-foreground transition-colors"
+          >
+            &larr; Letters by Year
+          </Link>
+          <h1 className="mt-3 text-2xl font-bold text-foreground">
+            <span className="text-primary">Letters: </span>
+            {activeLabel} {year}
+          </h1>
+          <p className="mt-1 text-muted-foreground">
+            {activeGroup?.count ?? 0}{" "}
+            {(activeGroup?.count ?? 0) === 1 ? "letter" : "letters"} ·{" "}
+            {totalCount} total in {year}
+          </p>
         </div>
       </header>