diff --git a/dprint.json b/dprint.json
index bc8bd21..776bdf3 100644
--- a/dprint.json
+++ b/dprint.json
@@ -16,7 +16,7 @@
     "https://plugins.dprint.dev/g-plane/markup_fmt-v0.25.3.wasm"
   ],
   "typescript": {
-    "lineWidth": 100,
+    "lineWidth": 120,
     "indentWidth": 4,
     "useTabs": false,
     "semiColons": "prefer",
@@ -41,7 +41,7 @@
     "lineWidth": 100
   },
   "markup": {
-    "printWidth": 100,
+    "printWidth": 120,
     "indentWidth": 4,
     "useTabs": false,
     "quotes": "double",
diff --git a/src/entities/Font/lib/normalize/normalize.test.ts b/src/entities/Font/lib/normalize/normalize.test.ts
index e45eefa..c3166e7 100644
--- a/src/entities/Font/lib/normalize/normalize.test.ts
+++ b/src/entities/Font/lib/normalize/normalize.test.ts
@@ -24,11 +24,9 @@ describe('Font Normalization', () => {
             subsets: ['latin', 'latin-ext'],
             files: {
                 regular: 'https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu72xKOzY.woff2',
-                '700':
-                    'https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1Mu72xWUlvAx05IsDqlA.woff2',
+                '700': 'https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1Mu72xWUlvAx05IsDqlA.woff2',
                 italic: 'https://fonts.gstatic.com/s/roboto/v30/KFOkCnqEu92Fr1Mu51xIIzI.woff2',
-                '700italic':
-                    'https://fonts.gstatic.com/s/roboto/v30/KFOjCnqEu92Fr1Mu51TzBic6CsQ.woff2',
+                '700italic': 'https://fonts.gstatic.com/s/roboto/v30/KFOjCnqEu92Fr1Mu51TzBic6CsQ.woff2',
             },
             version: 'v30',
             lastModified: '2022-01-01',
diff --git a/src/features/GetFonts/lib/mapper/mapManagerToParams.ts b/src/features/GetFonts/lib/mapper/mapManagerToParams.ts
index 93a9a59..8375a10 100644
--- a/src/features/GetFonts/lib/mapper/mapManagerToParams.ts
+++ b/src/features/GetFonts/lib/mapper/mapManagerToParams.ts
@@ -26,9 +26,7 @@ import type { FilterManager } from '../filterManager/filterManager.svelte';
  */
 export function mapManagerToParams(manager: FilterManager): Partial<ProxyFontsParams> {
     const providers = manager.getGroup('providers')?.instance.selectedProperties.map(p => p.value);
-    const categories = manager.getGroup('categories')?.instance.selectedProperties.map(p =>
-        p.value
-    );
+    const categories = manager.getGroup('categories')?.instance.selectedProperties.map(p => p.value);
     const subsets = manager.getGroup('subsets')?.instance.selectedProperties.map(p => p.value);
 
     return {
diff --git a/src/routes/Page.svelte b/src/routes/Page.svelte
index 08568e4..cc31fb3 100644
--- a/src/routes/Page.svelte
+++ b/src/routes/Page.svelte
@@ -32,7 +32,7 @@ $effect(() => {
 </script>
 
 <!-- Font List -->
-<div class="p-2 h-full flex flex-col gap-3 overflow-hidden">
+<div class="p-2 h-full flex flex-col gap-3">
     {#key isEmptyScreen}
         <div
             class={cn(
@@ -53,7 +53,7 @@ $effect(() => {
         </div>
     {/key}
 
-    <div class="my-2 mx-10">
+    <div class="my-6">
         <ComparisonSlider />
     </div>
 
diff --git a/src/shared/api/api.ts b/src/shared/api/api.ts
index 1b440d6..a786e4c 100644
--- a/src/shared/api/api.ts
+++ b/src/shared/api/api.ts
@@ -56,6 +56,5 @@ export const api = {
             body: JSON.stringify(body),
         }),
 
-    delete: <T>(url: string, options?: RequestInit) =>
-        request<T>(url, { ...options, method: 'DELETE' }),
+    delete: <T>(url: string, options?: RequestInit) => request<T>(url, { ...options, method: 'DELETE' }),
 };
diff --git a/src/shared/shadcn/ui/badge/badge.svelte b/src/shared/shadcn/ui/badge/badge.svelte
index 523a922..2caaee6 100644
--- a/src/shared/shadcn/ui/badge/badge.svelte
+++ b/src/shared/shadcn/ui/badge/badge.svelte
@@ -9,10 +9,8 @@ export const badgeVariants = tv({
         'focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive inline-flex w-fit shrink-0 items-center justify-center gap-1 overflow-hidden rounded-full border px-2 py-0.5 text-xs font-medium whitespace-nowrap transition-[color,box-shadow] focus-visible:ring-[3px] [&>svg]:pointer-events-none [&>svg]:size-3',
     variants: {
         variant: {
-            default:
-                'bg-primary text-primary-foreground [a&]:hover:bg-primary/90 border-transparent',
-            secondary:
-                'bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90 border-transparent',
+            default: 'bg-primary text-primary-foreground [a&]:hover:bg-primary/90 border-transparent',
+            secondary: 'bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90 border-transparent',
             destructive:
                 'bg-destructive [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/70 border-transparent text-white',
             outline: 'text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground',
diff --git a/src/shared/shadcn/ui/sidebar/sidebar-provider.svelte b/src/shared/shadcn/ui/sidebar/sidebar-provider.svelte
index 5d9e4e5..4bb4d4c 100644
--- a/src/shared/shadcn/ui/sidebar/sidebar-provider.svelte
+++ b/src/shared/shadcn/ui/sidebar/sidebar-provider.svelte
@@ -33,8 +33,7 @@ const sidebar = setSidebar({
         onOpenChange(value);
 
         // This sets the cookie to keep the sidebar state.
-        document.cookie =
-            `${SIDEBAR_COOKIE_NAME}=${open}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
+        document.cookie = `${SIDEBAR_COOKIE_NAME}=${open}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
     },
 });
 </script>
diff --git a/src/shared/ui/CheckboxFilter/CheckboxFilter.svelte b/src/shared/ui/CheckboxFilter/CheckboxFilter.svelte
index e7ed2b3..5ab3e1a 100644
--- a/src/shared/ui/CheckboxFilter/CheckboxFilter.svelte
+++ b/src/shared/ui/CheckboxFilter/CheckboxFilter.svelte
@@ -59,8 +59,7 @@ const hasSelection = $derived(selectedCount > 0);
             class={buttonVariants({
                 variant: 'ghost',
                 size: 'sm',
-                class:
-                    'flex-1 justify-between gap-2 hover:bg-transparent focus-visible:ring-1 focus-visible:ring-ring',
+                class: 'flex-1 justify-between gap-2 hover:bg-transparent focus-visible:ring-1 focus-visible:ring-ring',
             })}
         >
             <h4 class="text-sm font-semibold">{displayedLabel}</h4>
@@ -107,9 +106,7 @@ const hasSelection = $derived(selectedCount > 0);
                                 active:scale-[0.98] active:transition-transform active:duration-75
                             "
                         >
-                            <!--
-                                Checkbox handles toggle, styled for accessibility with focus rings
-                            -->
+                            <!-- Checkbox handles toggle, styled for accessibility with focus rings -->
                             <Checkbox
                                 id={property.id}
                                 bind:checked={property.selected}
diff --git a/src/shared/ui/ExpandableWrapper/ExpandableWrapper.stories.svelte b/src/shared/ui/ExpandableWrapper/ExpandableWrapper.stories.svelte
index a8976ac..aacfa84 100644
--- a/src/shared/ui/ExpandableWrapper/ExpandableWrapper.stories.svelte
+++ b/src/shared/ui/ExpandableWrapper/ExpandableWrapper.stories.svelte
@@ -32,8 +32,7 @@ const { Story } = defineMeta({
     parameters: {
         docs: {
             description: {
-                component:
-                    'Animated styled wrapper for content that can be expanded and collapsed.',
+                component: 'Animated styled wrapper for content that can be expanded and collapsed.',
             },
             story: { inline: false }, // Render stories in iframe for state isolation
         },
diff --git a/src/shared/ui/VirtualList/VirtualList.svelte b/src/shared/ui/VirtualList/VirtualList.svelte
index 719a957..3534351 100644
--- a/src/shared/ui/VirtualList/VirtualList.svelte
+++ b/src/shared/ui/VirtualList/VirtualList.svelte
@@ -55,8 +55,7 @@ interface Props {
     children: Snippet<[{ item: T; index: number; isVisible: boolean; proximity: number }]>;
 }
 
-let { items, itemHeight = 80, overscan = 5, class: className, onVisibleItemsChange, children }:
-    Props = $props();
+let { items, itemHeight = 80, overscan = 5, class: className, onVisibleItemsChange, children }: Props = $props();
 
 const virtualizer = createVirtualizer(() => ({
     count: items.length,
diff --git a/src/widgets/ComparisonSlider/ui/ComparisonSlider/ComparisonSlider.svelte b/src/widgets/ComparisonSlider/ui/ComparisonSlider/ComparisonSlider.svelte
index 5a8c088..abaebb3 100644
--- a/src/widgets/ComparisonSlider/ui/ComparisonSlider/ComparisonSlider.svelte
+++ b/src/widgets/ComparisonSlider/ui/ComparisonSlider/ComparisonSlider.svelte
@@ -138,20 +138,15 @@ $effect(() => {
 });
 </script>
 
-{#snippet renderLine(line: LineData, lineIndex: number)}
+{#snippet renderLine(line: LineData, index: number)}
     <div
-        bind:this={lineElements[lineIndex]}
+        bind:this={lineElements[index]}
         class="relative flex w-full justify-center items-center whitespace-nowrap"
         style:height={`${heightControl.value}em`}
         style:line-height={`${heightControl.value}em`}
     >
         {#each line.text.split('') as char, charIndex}
-            {@const { proximity, isPast } = charComparison.getCharState(
-        charIndex,
-        sliderPos,
-        lineElements[lineIndex],
-        container,
-    ),}
+            {@const { proximity, isPast } = charComparison.getCharState(charIndex, sliderPos, lineElements[index], container)}
             <!--
                 Single Character Span
                 - Font Family switches based on `isPast`