diff --git a/web/frontend/index.html b/web/frontend/index.html
index 80856a75..ee2468ad 100644
--- a/web/frontend/index.html
+++ b/web/frontend/index.html
@@ -10,7 +10,7 @@
   <link rel="preconnect" href="https://fonts.googleapis.com">
   <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
   <link
-    href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=Inter:wght@300;400;500;600;700&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap"
+    href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&family=Inter:wght@300;400;500;600;700&family=Literata:ital,opsz,wght@0,7..72,200..900;1,7..72,200..900&display=swap"
     rel="stylesheet">
 </head>
 
diff --git a/web/frontend/src/components/transcript/TranscriptView.tsx b/web/frontend/src/components/transcript/TranscriptView.tsx
index f748e938..60f53488 100644
--- a/web/frontend/src/components/transcript/TranscriptView.tsx
+++ b/web/frontend/src/components/transcript/TranscriptView.tsx
@@ -270,7 +270,7 @@ export const TranscriptView = forwardRef<HTMLDivElement, TranscriptViewProps>(({
                             ref={(el) => { segmentRefs.current[i] = el; }}
                             onClick={(e) => handleExpandedClick(e, i)}
                             className={cn(
-                                "flex-grow text-base text-carbon-700 dark:text-carbon-300 leading-relaxed whitespace-pre-wrap font-reading transition-colors duration-200",
+                                "flex-grow text-base text-primary leading-relaxed whitespace-pre-wrap font-reading transition-colors duration-200",
                                 isModifierPressed ? 'cursor-pointer hover:text-carbon-900 dark:hover:text-carbon-100' : 'cursor-text'
                             )}
                         >
diff --git a/web/frontend/src/features/transcription/components/AudioFilesTable.tsx b/web/frontend/src/features/transcription/components/AudioFilesTable.tsx
index 2c0e6f12..d1103610 100644
--- a/web/frontend/src/features/transcription/components/AudioFilesTable.tsx
+++ b/web/frontend/src/features/transcription/components/AudioFilesTable.tsx
@@ -689,16 +689,15 @@ export const AudioFilesTable = memo(function AudioFilesTable({
 								onTouchStart={() => startLongPress(file.id)}
 								onTouchEnd={clearLongPress}
 							>
-								{/* Left: Identification */}
 								<div className="flex items-center gap-4 min-w-0 transition-[padding] duration-200">
 									{/* Icon (Tinted Pastel Square) - Lighter Shade */}
-									<div className="flex-shrink-0 w-12 h-12 flex items-center justify-center rounded-xl bg-[#FFFAF0] text-[#FF6D20] group-hover:opacity-0 transition-opacity duration-200">
+									<div className="flex-shrink-0 w-12 h-12 flex items-center justify-center rounded-xl bg-[#FFFAF0] text-[#FF6D20] transition-opacity duration-200">
 										<FileAudio className="h-6 w-6" strokeWidth={2} />
 									</div>
 
 									{/* Text */}
 									<div className="min-w-0">
-										<h4 className="font-semibold text-gray-900 dark:text-gray-100 truncate text-lg leading-tight group-hover:text-[#FF6D20] transition-colors">
+										<h4 className="font-normal text-gray-900 dark:text-gray-100 truncate text-lg leading-tight group-hover:text-[#FF6D20] transition-colors">
 											{file.title || getFileName(file.audio_path)}
 										</h4>
 										<div className="flex items-center gap-1.5 mt-1 text-sm text-gray-500">
diff --git a/web/frontend/src/index.css b/web/frontend/src/index.css
index c1491712..a79768fe 100644
--- a/web/frontend/src/index.css
+++ b/web/frontend/src/index.css
@@ -77,7 +77,7 @@
   --font-display: 'Outfit', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
   --font-mono: 'Fira Code', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
   --font-inter: 'Inter', sans-serif;
-  --font-lora: 'Lora', serif;
+  --font-reading: 'Literata', serif;
   /* For Transcripts */
 
   /* UI Token Mappings for Tailwind v4 */
@@ -136,7 +136,7 @@
   /* Card is also white */
 
   /* Text: Never use pure black #000000. It causes eye strain on white. */
-  --text-primary: #171717;
+  --text-primary: #161616;
   /* Neutral Charcoal */
   --text-secondary: #737373;
   /* Neutral Grey */
@@ -330,15 +330,18 @@
 
   /* Transcript Font Utility */
   .font-transcript {
-    font-family: var(--font-lora);
+    font-family: var(--font-reading);
     font-size: 1.125rem;
     /* 18px */
-    line-height: 1.7;
+    line-height: 1.5;
   }
 
   /* Applied to TranscriptView for Lora support */
   .font-reading {
-    font-family: var(--font-lora);
+    font-family: var(--font-reading);
+    font-size: 1.125rem;
+    /* 18px */
+    line-height: 1.5;
   }
 }