diff --git a/app/components/Package/Table.vue b/app/components/Package/Table.vue
index 10edaff64..f8068cb15 100644
--- a/app/components/Package/Table.vue
+++ b/app/components/Package/Table.vue
@@ -115,7 +115,7 @@ function getColumnLabelKey(id: ColumnId): string {
           <!-- Name (always visible) -->
           <th
             scope="col"
-            class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset focus-visible:outline-none"
+            class="py-3 px-3 text-xs text-start text-fg-muted font-mono font-medium uppercase tracking-wider whitespace-nowrap select-none focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset focus-visible:outline-none"
             :class="{
               'cursor-pointer hover:text-fg transition-colors duration-200': isSortable('name'),
             }"
@@ -149,7 +149,7 @@ function getColumnLabelKey(id: ColumnId): string {
           <th
             v-if="isColumnVisible('version')"
             scope="col"
-            class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider"
+            class="py-3 px-3 text-xs text-start text-fg-muted font-mono font-medium uppercase tracking-wider whitespace-nowrap select-none"
           >
             {{ $t(getColumnLabelKey('version')) }}
           </th>
@@ -157,7 +157,7 @@ function getColumnLabelKey(id: ColumnId): string {
           <th
             v-if="isColumnVisible('description')"
             scope="col"
-            class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider"
+            class="py-3 px-3 text-xs text-start text-fg-muted font-mono font-medium uppercase tracking-wider whitespace-nowrap select-none"
           >
             {{ $t(getColumnLabelKey('description')) }}
           </th>
@@ -165,7 +165,7 @@ function getColumnLabelKey(id: ColumnId): string {
           <th
             v-if="isColumnVisible('downloads')"
             scope="col"
-            class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-end focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset focus-visible:outline-none"
+            class="py-3 px-3 text-xs text-start text-fg-muted font-mono font-medium uppercase tracking-wider whitespace-nowrap select-none text-end focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset focus-visible:outline-none"
             :class="{
               'cursor-pointer hover:text-fg transition-colors duration-200':
                 isSortable('downloads'),
@@ -200,7 +200,7 @@ function getColumnLabelKey(id: ColumnId): string {
           <th
             v-if="isColumnVisible('updated')"
             scope="col"
-            class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset focus-visible:outline-none"
+            class="py-3 px-3 text-xs text-start text-fg-muted font-mono font-medium uppercase tracking-wider whitespace-nowrap select-none text-end focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset focus-visible:outline-none"
             :class="{
               'cursor-pointer hover:text-fg transition-colors duration-200': isSortable('updated'),
             }"
@@ -234,7 +234,7 @@ function getColumnLabelKey(id: ColumnId): string {
           <th
             v-if="isColumnVisible('maintainers')"
             scope="col"
-            class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider"
+            class="py-3 px-3 text-xs text-start text-fg-muted font-mono font-medium uppercase tracking-wider whitespace-nowrap select-none text-end"
           >
             {{ $t(getColumnLabelKey('maintainers')) }}
           </th>
@@ -242,7 +242,7 @@ function getColumnLabelKey(id: ColumnId): string {
           <th
             v-if="isColumnVisible('keywords')"
             scope="col"
-            class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider"
+            class="py-3 px-3 text-xs text-start text-fg-muted font-mono font-medium uppercase tracking-wider whitespace-nowrap select-none text-end"
           >
             {{ $t(getColumnLabelKey('keywords')) }}
           </th>
@@ -250,7 +250,7 @@ function getColumnLabelKey(id: ColumnId): string {
           <th
             v-if="isColumnVisible('qualityScore')"
             scope="col"
-            class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-end"
+            class="py-3 px-3 text-xs text-start text-fg-muted font-mono font-medium uppercase tracking-wider whitespace-nowrap select-none text-end"
           >
             {{ $t(getColumnLabelKey('qualityScore')) }}
           </th>
@@ -258,7 +258,7 @@ function getColumnLabelKey(id: ColumnId): string {
           <th
             v-if="isColumnVisible('popularityScore')"
             scope="col"
-            class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-end"
+            class="py-3 px-3 text-xs text-start text-fg-muted font-mono font-medium uppercase tracking-wider whitespace-nowrap select-none text-end"
           >
             {{ $t(getColumnLabelKey('popularityScore')) }}
           </th>
@@ -266,7 +266,7 @@ function getColumnLabelKey(id: ColumnId): string {
           <th
             v-if="isColumnVisible('maintenanceScore')"
             scope="col"
-            class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-end"
+            class="py-3 px-3 text-xs text-start text-fg-muted font-mono font-medium uppercase tracking-wider whitespace-nowrap select-none text-end"
           >
             {{ $t(getColumnLabelKey('maintenanceScore')) }}
           </th>
@@ -274,7 +274,7 @@ function getColumnLabelKey(id: ColumnId): string {
           <th
             v-if="isColumnVisible('combinedScore')"
             scope="col"
-            class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider text-end"
+            class="py-3 px-3 text-xs text-start text-fg-muted font-mono font-medium uppercase tracking-wider whitespace-nowrap select-none text-end"
           >
             {{ $t(getColumnLabelKey('combinedScore')) }}
           </th>
@@ -282,7 +282,7 @@ function getColumnLabelKey(id: ColumnId): string {
           <th
             v-if="isColumnVisible('security')"
             scope="col"
-            class="py-3 px-3 text-xs font-mono font-medium text-fg-muted uppercase tracking-wider"
+            class="py-3 px-3 text-xs text-start text-fg-muted font-mono font-medium uppercase tracking-wider whitespace-nowrap select-none text-end"
           >
             {{ $t(getColumnLabelKey('security')) }}
           </th>
@@ -301,17 +301,17 @@ function getColumnLabelKey(id: ColumnId): string {
             <td v-if="isColumnVisible('description')" class="py-3 px-3">
               <div class="h-4 w-48 bg-bg-muted rounded animate-pulse" />
             </td>
-            <td v-if="isColumnVisible('downloads')" class="py-3 px-3 text-end">
+            <td v-if="isColumnVisible('downloads')" class="py-3 px-3">
               <div class="h-4 w-16 bg-bg-muted rounded animate-pulse ms-auto" />
             </td>
             <td v-if="isColumnVisible('updated')" class="py-3 px-3">
-              <div class="h-4 w-20 bg-bg-muted rounded animate-pulse" />
+              <div class="h-4 w-20 bg-bg-muted rounded animate-pulse ms-auto" />
             </td>
             <td v-if="isColumnVisible('maintainers')" class="py-3 px-3">
-              <div class="h-4 w-24 bg-bg-muted rounded animate-pulse" />
+              <div class="h-4 w-24 bg-bg-muted rounded animate-pulse ms-auto" />
             </td>
             <td v-if="isColumnVisible('keywords')" class="py-3 px-3">
-              <div class="h-4 w-32 bg-bg-muted rounded animate-pulse" />
+              <div class="h-4 w-32 bg-bg-muted rounded animate-pulse ms-auto" />
             </td>
           </tr>
         </template>
diff --git a/app/components/Package/TableRow.vue b/app/components/Package/TableRow.vue
index 8c1e421b5..53b4d4a4e 100644
--- a/app/components/Package/TableRow.vue
+++ b/app/components/Package/TableRow.vue
@@ -44,7 +44,7 @@ const allMaintainersText = computed(() => {
 
 <template>
   <tr
-    class="border-b border-border hover:bg-bg-muted transition-colors duration-200 focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset focus-visible:outline-none focus:bg-bg-muted"
+    class="group border-b border-border hover:bg-bg-muted transition-colors duration-200 focus-visible:ring-2 focus-visible:ring-fg focus-visible:ring-inset focus-visible:outline-none focus:bg-bg-muted"
     tabindex="0"
     :data-result-index="index"
   >
@@ -52,7 +52,7 @@ const allMaintainersText = computed(() => {
     <td class="py-2 px-3">
       <NuxtLink
         :to="packageUrl"
-        class="font-mono text-sm text-fg hover:text-accent-muted transition-colors duration-200"
+        class="font-mono text-sm text-fg hover:text-accent-fallback transition-colors duration-200"
       >
         {{ pkg.name }}
       </NuxtLink>
@@ -80,7 +80,10 @@ const allMaintainersText = computed(() => {
     </td>
 
     <!-- Updated -->
-    <td v-if="isColumnVisible('updated')" class="py-2 px-3 font-mono text-xs text-fg-muted">
+    <td
+      v-if="isColumnVisible('updated')"
+      class="py-2 px-3 font-mono text-end text-xs text-fg-muted"
+    >
       <DateTime
         v-if="updatedDate"
         :datetime="updatedDate"
@@ -92,7 +95,7 @@ const allMaintainersText = computed(() => {
     </td>
 
     <!-- Maintainers -->
-    <td v-if="isColumnVisible('maintainers')" class="py-2 px-3 text-sm text-fg-muted">
+    <td v-if="isColumnVisible('maintainers')" class="py-2 px-3 text-sm text-fg-muted text-end">
       <span
         v-if="pkg.maintainers?.length"
         :title="pkg.maintainers.length > 3 ? allMaintainersText : undefined"
@@ -104,7 +107,7 @@ const allMaintainersText = computed(() => {
         >
           <NuxtLink
             :to="`/~${maintainer.username || maintainer.name}`"
-            class="hover:text-accent-muted transition-colors duration-200"
+            class="hover:text-accent-fallback transition-colors duration-200"
             @click.stop
             >{{ maintainer.username || maintainer.name || maintainer.email }}</NuxtLink
           ><span v-if="idx < Math.min(pkg.maintainers.length, 3) - 1">, </span>
@@ -117,10 +120,10 @@ const allMaintainersText = computed(() => {
     </td>
 
     <!-- Keywords -->
-    <td v-if="isColumnVisible('keywords')" class="py-2 px-3">
+    <td v-if="isColumnVisible('keywords')" class="py-2 px-3 text-end">
       <div
         v-if="pkg.keywords?.length"
-        class="flex flex-wrap gap-1"
+        class="flex flex-wrap gap-1 justify-end"
         :aria-label="$t('package.card.keywords')"
       >
         <TagClickable
@@ -130,6 +133,7 @@ const allMaintainersText = computed(() => {
           :status="props.filters?.keywords.includes(keyword) ? 'active' : 'default'"
           :title="`Filter by ${keyword}`"
           @click.stop="emit('clickKeyword', keyword)"
+          :class="{ 'group-hover:bg-bg-elevated': !props.filters?.keywords.includes(keyword) }"
         >
           {{ keyword }}
         </TagClickable>
diff --git a/uno.config.ts b/uno.config.ts
index d4aed7116..f49fd3ab0 100644
--- a/uno.config.ts
+++ b/uno.config.ts
@@ -120,7 +120,7 @@ export default defineConfig({
   shortcuts: [
     // Layout
     ['container', 'max-w-6xl mx-auto px-4 sm:px-6'],
-    ['container-sm', 'max-w-4xl mx-auto px-4 sm:px-6'],
+    ['container-sm', 'max-w-5xl mx-auto px-4 sm:px-6'],
 
     // Focus states - subtle but accessible
     ['focus-ring', 'outline-none focus-visible:(ring-2 ring-fg/10 ring-offset-2)'],