fix(hover): correct card hover borders to domain colors

Replace hover:border-surface-400 with domain-colored borders.
Add hover:underline to text links missing it.

Confab-Link: http://localhost:8080/sessions/0ec83454-d346-4329-8aaf-6b12139bf596

_includes/components/widgets/blogroll.njk

@@ -27,7 +27,7 @@
       <li>
         <a
           :href="blog.siteUrl || blog.feedUrl"
-          class="flex items-center gap-2 text-sm text-surface-700 dark:text-surface-300 hover:text-accent-600 dark:hover:text-accent-400 transition-colors"
+          class="flex items-center gap-2 text-sm text-surface-700 dark:text-surface-300 hover:text-accent-600 dark:hover:text-accent-400 hover:underline transition-colors"
           target="_blank"
           rel="noopener"
         >

_includes/components/widgets/categories.njk

@@ -5,7 +5,7 @@
   <h3 class="widget-title">Categories</h3>
   <div class="flex flex-wrap gap-2">
     {% for category in categories %}
-    <a href="/categories/{{ category | slugify }}/" class="p-category">
+    <a href="/categories/{{ category | slugify }}/" class="p-category hover:bg-surface-200 dark:hover:bg-surface-700 transition-colors">
       {{ category }}
     </a>
     {% endfor %}

_includes/components/widgets/subscribe.njk

@@ -3,13 +3,13 @@
 <div class="widget">
   <h3 class="widget-title">Subscribe</h3>
   <div class="space-y-2">
-    <a href="/feed.xml" class="flex items-center gap-2 text-sm text-surface-600 dark:text-surface-400 hover:text-orange-600 dark:hover:text-orange-400 transition-colors">
+    <a href="/feed.xml" class="flex items-center gap-2 text-sm text-surface-600 dark:text-surface-400 hover:text-orange-600 dark:hover:text-orange-400 hover:underline transition-colors">
       <svg class="w-4 h-4 text-orange-500" fill="currentColor" viewBox="0 0 24 24">
         <path d="M6.18 15.64a2.18 2.18 0 0 1 2.18 2.18C8.36 19 7.38 20 6.18 20C5 20 4 19 4 17.82a2.18 2.18 0 0 1 2.18-2.18M4 4.44A15.56 15.56 0 0 1 19.56 20h-2.83A12.73 12.73 0 0 0 4 7.27V4.44m0 5.66a9.9 9.9 0 0 1 9.9 9.9h-2.83A7.07 7.07 0 0 0 4 12.93V10.1Z"/>
       </svg>
       RSS Feed
     </a>
-    <a href="/feed.json" class="flex items-center gap-2 text-sm text-surface-600 dark:text-surface-400 hover:text-orange-600 dark:hover:text-orange-400 transition-colors">
+    <a href="/feed.json" class="flex items-center gap-2 text-sm text-surface-600 dark:text-surface-400 hover:text-orange-600 dark:hover:text-orange-400 hover:underline transition-colors">
       <svg class="w-4 h-4 text-yellow-500" fill="currentColor" viewBox="0 0 24 24">
         <path d="M5 3h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2m3 12h2v2H8v-2m4-8h2v10h-2V7m4 4h2v6h-2v-6Z"/>
       </svg>

_includes/components/widgets/toc.njk

@@ -7,7 +7,7 @@
     <ul class="space-y-1 text-sm">
       {% for item in toc %}
       <li class="{% if item.level > 2 %}ml-{{ (item.level - 2) * 3 }}{% endif %}">
-        <a href="#{{ item.slug }}" class="text-surface-600 dark:text-surface-400 hover:text-accent-600 dark:hover:text-accent-400 transition-colors">
+        <a href="#{{ item.slug }}" class="text-surface-600 dark:text-surface-400 hover:text-accent-600 dark:hover:text-accent-400 hover:underline transition-colors">
           {{ item.text }}
         </a>
       </li>

news.njk

@@ -12,7 +12,7 @@ withSidebar: true
     </p>
     <p class="text-xs text-surface-500 mt-2" x-show="lastUpdated">
       Last updated: <span class="font-mono" x-text="formatDate(lastUpdated, 'full')"></span>
-      <button @click="refresh()" class="ml-2 text-accent-600 hover:text-accent-700 dark:text-accent-400 focus:outline-none focus:ring-2 focus:ring-accent-500 rounded" :disabled="loading">
+      <button @click="refresh()" class="ml-2 text-accent-600 hover:text-accent-700 dark:text-accent-400 rounded" :disabled="loading">
         <svg class="w-3 h-3 inline" :class="{ 'animate-spin': loading }" fill="none" stroke="currentColor" viewBox="0 0 24 24">
           <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 4v5h.582m15.356 2A8.001 8.001 0 004.582 9m0 0H9m11 11v-5h-.581m0 0a8.003 8.003 0 01-15.357-2m15.357 2H15"/>
         </svg>
@@ -45,7 +45,7 @@ withSidebar: true
           <button
             @click="viewMode = 'list'"
             :class="viewMode === 'list' ? 'bg-accent-600 text-white' : 'bg-surface-100 dark:bg-surface-800 text-surface-700 dark:text-surface-300 hover:bg-surface-200 dark:hover:bg-surface-700'"
-            class="px-3 py-2 rounded-lg text-sm font-medium transition-colors flex items-center gap-2 focus:outline-none focus:ring-2 focus:ring-accent-500"
+            class="px-3 py-2 rounded-lg text-sm font-medium transition-colors flex items-center gap-2"
             title="List view"
           >
             <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -56,7 +56,7 @@ withSidebar: true
           <button
             @click="viewMode = 'card'"
             :class="viewMode === 'card' ? 'bg-accent-600 text-white' : 'bg-surface-100 dark:bg-surface-800 text-surface-700 dark:text-surface-300 hover:bg-surface-200 dark:hover:bg-surface-700'"
-            class="px-3 py-2 rounded-lg text-sm font-medium transition-colors flex items-center gap-2 focus:outline-none focus:ring-2 focus:ring-accent-500"
+            class="px-3 py-2 rounded-lg text-sm font-medium transition-colors flex items-center gap-2"
             title="Card view"
           >
             <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -67,7 +67,7 @@ withSidebar: true
           <button
             @click="viewMode = 'full'"
             :class="viewMode === 'full' ? 'bg-accent-600 text-white' : 'bg-surface-100 dark:bg-surface-800 text-surface-700 dark:text-surface-300 hover:bg-surface-200 dark:hover:bg-surface-700'"
-            class="px-3 py-2 rounded-lg text-sm font-medium transition-colors flex items-center gap-2 focus:outline-none focus:ring-2 focus:ring-accent-500"
+            class="px-3 py-2 rounded-lg text-sm font-medium transition-colors flex items-center gap-2"
             title="Expanded view"
           >
             <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -81,7 +81,7 @@ withSidebar: true
         <div class="relative" x-show="feeds.length > 1">
           <select
             x-model="filterFeed"
-            class="appearance-none bg-surface-100 dark:bg-surface-800 border border-surface-300 dark:border-surface-600 rounded-lg px-4 py-2 pr-8 text-sm text-surface-700 dark:text-surface-300 focus:outline-none focus:ring-2 focus:ring-accent-500 transition-colors"
+            class="appearance-none bg-surface-100 dark:bg-surface-800 border border-surface-300 dark:border-surface-600 rounded-lg px-4 py-2 pr-8 text-sm text-surface-700 dark:text-surface-300 transition-colors"
           >
             <option value="all">All Sources (<span x-text="feeds.length"></span>)</option>
             <template x-for="feed in feeds" :key="feed.id">
@@ -125,7 +125,7 @@ withSidebar: true
         {# List View #}
         <div x-show="viewMode === 'list'" class="space-y-3">
           <template x-for="item in filteredItems" :key="item.id">
-            <article class="flex items-start gap-4 p-4 bg-surface-50 dark:bg-surface-800 rounded-lg border border-surface-200 dark:border-surface-700 shadow-sm hover:border-accent-400 dark:hover:border-accent-600 transition-colors">
+            <article class="flex items-start gap-4 p-4 bg-surface-50 dark:bg-surface-800 rounded-lg border border-surface-200 dark:border-surface-700 shadow-sm hover:border-amber-400 dark:hover:border-amber-600 transition-colors">
               <img
                 x-show="item.imageUrl"
                 :src="item.imageUrl"
@@ -190,7 +190,7 @@ withSidebar: true
         {# Card View #}
         <div x-show="viewMode === 'card'" class="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
           <template x-for="item in filteredItems" :key="item.id">
-            <article class="bg-surface-50 dark:bg-surface-800 rounded-xl border border-surface-200 dark:border-surface-700 shadow-sm overflow-hidden hover:border-accent-400 dark:hover:border-accent-600 transition-colors">
+            <article class="bg-surface-50 dark:bg-surface-800 rounded-lg border border-surface-200 dark:border-surface-700 shadow-sm overflow-hidden hover:border-amber-400 dark:hover:border-amber-600 transition-colors">
               <div x-show="item.imageUrl" class="aspect-video bg-surface-100 dark:bg-surface-700">
                 <img
                   :src="item.imageUrl"
@@ -243,7 +243,7 @@ withSidebar: true
         {# Full/Expanded View #}
         <div x-show="viewMode === 'full'" class="space-y-6">
           <template x-for="item in filteredItems" :key="item.id">
-            <article class="bg-surface-50 dark:bg-surface-800 rounded-xl border border-surface-200 dark:border-surface-700 shadow-sm overflow-hidden">
+            <article class="bg-surface-50 dark:bg-surface-800 rounded-lg border border-surface-200 dark:border-surface-700 shadow-sm overflow-hidden">
               <div x-show="item.imageUrl" class="aspect-[3/1] bg-surface-100 dark:bg-surface-700">
                 <img
                   :src="item.imageUrl"
@@ -329,7 +329,7 @@ withSidebar: true
         <button
           @click="loadPage(pagination.page - 1)"
           :disabled="!pagination.hasPrev || loading"
-          class="px-4 py-2 rounded-lg text-sm font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed bg-surface-100 dark:bg-surface-800 hover:bg-surface-200 dark:hover:bg-surface-700 focus:outline-none focus:ring-2 focus:ring-accent-500"
+          class="px-4 py-2 rounded-lg text-sm font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed bg-surface-100 dark:bg-surface-800 hover:bg-surface-200 dark:hover:bg-surface-700"
         >
           Previous
         </button>
@@ -339,7 +339,7 @@ withSidebar: true
         <button
           @click="loadPage(pagination.page + 1)"
           :disabled="!pagination.hasNext || loading"
-          class="px-4 py-2 rounded-lg text-sm font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed bg-surface-100 dark:bg-surface-800 hover:bg-surface-200 dark:hover:bg-surface-700 focus:outline-none focus:ring-2 focus:ring-accent-500"
+          class="px-4 py-2 rounded-lg text-sm font-medium transition-colors disabled:opacity-50 disabled:cursor-not-allowed bg-surface-100 dark:bg-surface-800 hover:bg-surface-200 dark:hover:bg-surface-700"
         >
           Next
         </button>