style(tables): remove small-caps from headers and simplify bag status

- Replace small-caps + tracking-wide thead with plain text-text-secondary
  across all 7 list tables
- Bag status: widen progress bar to fill cell, use thicker bar on desktop
- Bag status: replace pill with plain text for "Closed"
- Bag status: use text-xs instead of small-caps for amount labels

templates/partials/lists/bag_list.html

@@ -21,7 +21,7 @@
     {{ table::search_header(navigator, "#bag-list") }}
     <div class="overflow-x-auto">
       <table class="responsive-table min-w-full divide-y text-left text-sm text-text">
-        <thead class="bg-surface-alt text-xs font-semibold tracking-wide text-text small-caps">
+        <thead class="bg-surface-alt text-xs font-semibold text-text-secondary">
           <tr>
             {{ table::sortable_header("Added", "created-at", navigator, "#bag-list") }}
             {{ table::sortable_header("Roaster", "roaster", navigator, "#bag-list") }}
@@ -50,13 +50,13 @@
             </td>
             <td data-label="Status" class="mobile-hidden px-4 py-3 whitespace-nowrap">
               {% if bag.closed %}
-              <span class="pill pill-warning">Closed</span>
+              <span class="text-text-muted">Closed</span>
               {% else %}
-              <div class="w-14">
+              <div>
-                <div class="h-1.5 rounded-full bg-surface-alt overflow-hidden">
+                <div class="h-2.5 rounded-full bg-surface-alt overflow-hidden">
                   <div class="h-full rounded-full bg-accent" style="width: {{ bag.used_percent }}%"></div>
                 </div>
-                <div class="mt-0.5 text-text-muted small-caps" style="font-size: 0.7rem">{{ bag.remaining }} / {{ bag.amount }}g</div>
+                <div class="mt-0.5 text-xs text-text-muted">{{ bag.remaining }} / {{ bag.amount }}g</div>
               </div>
               {% endif %}
             </td>
@@ -65,7 +65,7 @@
               <div class="h-1.5 rounded-full bg-surface-alt overflow-hidden">
                 <div class="h-full rounded-full bg-accent" style="width: {{ bag.used_percent }}%"></div>
               </div>
-              <div class="mt-0.5 text-right text-text-muted small-caps" style="font-size: 0.7rem">{{ bag.remaining }} / {{ bag.amount }}g</div>
+              <div class="mt-0.5 text-right text-xs text-text-muted">{{ bag.remaining }} / {{ bag.amount }}g</div>
             </td>
             {% endif %}
             <td data-label="Finished" class="mobile-hidden whitespace-nowrap px-4 py-3 font-medium text-text-secondary">
@@ -97,7 +97,7 @@
               <div class="inline-flex items-center gap-2">
                 <span class="md:hidden">
                 {% if bag.closed %}
-                <span class="pill pill-warning text-[0.625rem] py-0 px-1.5">Closed</span>
+                <span class="text-text-muted">Closed</span>
                 {% endif %}
                 </span>
                 <button type="button"

templates/partials/lists/brew_list.html

@@ -36,7 +36,7 @@
 
     <div class="overflow-x-auto">
       <table class="responsive-table min-w-full divide-y text-left text-sm text-text">
-        <thead class="bg-surface-alt text-xs font-semibold tracking-wide text-text small-caps">
+        <thead class="bg-surface-alt text-xs font-semibold text-text-secondary">
           <tr>
             {{ table::sortable_header("Added", "created-at", navigator, "#brew-list") }}
             <th scope="col" class="px-4 py-3">Coffee</th>

templates/partials/lists/cafe_list.html

@@ -21,7 +21,7 @@
     {{ table::search_header(navigator, "#cafe-list") }}
     <div class="overflow-x-auto">
       <table class="responsive-table min-w-full divide-y text-left text-sm text-text">
-        <thead class="bg-surface-alt text-xs font-semibold tracking-wide text-text small-caps">
+        <thead class="bg-surface-alt text-xs font-semibold text-text-secondary">
           <tr>
             {{ table::sortable_header("Added", "created-at", navigator, "#cafe-list") }}
             {{ table::sortable_header("Name", "name", navigator, "#cafe-list") }}

templates/partials/lists/cup_list.html

@@ -21,7 +21,7 @@
     {{ table::search_header(navigator, "#cup-list") }}
     <div class="overflow-x-auto">
       <table class="responsive-table min-w-full divide-y text-left text-sm text-text">
-        <thead class="bg-surface-alt text-xs font-semibold tracking-wide text-text small-caps">
+        <thead class="bg-surface-alt text-xs font-semibold text-text-secondary">
           <tr>
             {{ table::sortable_header("Added", "created-at", navigator, "#cup-list") }}
             {{ table::sortable_header("Roast", "roast", navigator, "#cup-list") }}

templates/partials/lists/gear_list.html

@@ -22,7 +22,7 @@
 
     <div class="overflow-x-auto">
       <table class="responsive-table min-w-full divide-y text-left text-sm text-text">
-        <thead class="bg-surface-alt text-xs font-semibold tracking-wide text-text small-caps">
+        <thead class="bg-surface-alt text-xs font-semibold text-text-secondary">
           <tr>
             {{ table::sortable_header("Added", "created-at", navigator, "#gear-list") }}
             {{ table::sortable_header("Category", "category", navigator, "#gear-list") }}

templates/partials/lists/roast_list.html

@@ -21,7 +21,7 @@
     {{ table::search_header(navigator, "#roast-list") }}
     <div class="overflow-x-auto">
       <table class="responsive-table min-w-full divide-y text-left text-sm text-text">
-        <thead class="bg-surface-alt text-xs font-semibold tracking-wide text-text small-caps">
+        <thead class="bg-surface-alt text-xs font-semibold text-text-secondary">
           <tr>
             {{ table::sortable_header("Added", "created-at", navigator, "#roast-list") }}
             {{ table::sortable_header("Roast", "name", navigator, "#roast-list") }}

templates/partials/lists/roaster_list.html

@@ -21,7 +21,7 @@
     {{ table::search_header(navigator, "#roaster-list") }}
     <div class="overflow-x-auto">
       <table class="responsive-table min-w-full divide-y text-left text-sm text-text">
-        <thead class="bg-surface-alt text-xs font-semibold tracking-wide text-text small-caps">
+        <thead class="bg-surface-alt text-xs font-semibold text-text-secondary">
           <tr>
             {{ table::sortable_header("Added", "created-at", navigator, "#roaster-list") }}
             {{ table::sortable_header("Name", "name", navigator, "#roaster-list") }}