feat(admin): design system audit fixes

- Add CSS design tokens for consistency (--admin-danger-hover, --admin-accent-dot, shadow-md warm tone)
- Replace unicode icons with inline SVG (⋮, ✕, ▼, ▶)
- Consolidate duplicate PageHeader/AdminPageHeader components
- Standardize border-radius (rounded-xl → rounded-lg for ViewModeTabs)
- Remove hardcoded brand UUID in products page
- Replace hardcoded bg-red-600 with CSS variables in delete buttons
- Add AdminButton, AdminFilterTabs, AdminSearchInput, PageHeader design system components
- Fix GlassModal and AdminModal close button styling
- Remove duplicate 'New Lot' button on Route Trace dashboard

src/components/admin/TaxDashboard.tsx

@@ -8,6 +8,7 @@ import {
   type TaxOrderRow,
   type TaxByStateRow,
 } from "@/lib/reports-export";
+import { AdminButton, AdminFilterTabs } from "@/components/admin/design-system";
 
 type DatePreset = "month" | "quarter" | "this_year" | "custom";
 
@@ -80,12 +81,13 @@ function SummaryCard({
 
 function ExportBtn({ label, onClick }: { label: string; onClick: () => void }) {
   return (
-    <button
+    <AdminButton
       onClick={onClick}
-      className="rounded-lg border border-zinc-600 px-3 py-1.5 text-xs font-medium text-zinc-400 hover:bg-zinc-800"
+      variant="secondary"
+      size="sm"
     >
       Export CSV
-    </button>
+    </AdminButton>
   );
 }
 
@@ -123,8 +125,8 @@ function ReportTable({ headers, rows, renderRow }: {
 }
 
 const TABS = [
-  { id: "summary", label: "Tax Summary" },
-  { id: "orders", label: "Taxable Orders" },
+  { value: "summary", label: "Tax Summary" },
+  { value: "orders", label: "Taxable Orders" },
 ];
 
 export default function TaxDashboard({
@@ -279,20 +281,17 @@ export default function TaxDashboard({
       )}
 
       {/* ── Filters ── */}
-      <div className="flex flex-wrap items-center gap-3 rounded-xl bg-zinc-900 border border-zinc-800 px-5 py-4">
+      <div className="flex flex-wrap items-center gap-3 rounded-xl border border-[var(--admin-border)] bg-[var(--admin-card-bg)] px-5 py-4">
         <div className="flex gap-1">
           {(["month", "quarter", "this_year", "custom"] as DatePreset[]).map((p) => (
-            <button
+            <AdminButton
               key={p}
               onClick={() => setPreset(p)}
-              className={`rounded-lg px-3 py-1.5 text-xs font-medium ${
-                preset === p
-                  ? "bg-slate-900 text-white"
-                  : "bg-zinc-950 text-zinc-400 hover:bg-slate-200"
-              }`}
+              variant={preset === p ? "primary" : "secondary"}
+              size="sm"
             >
               {p === "month" ? "This Month" : p === "quarter" ? "This Quarter" : p === "this_year" ? "This Year" : "Custom"}
-            </button>
+            </AdminButton>
           ))}
         </div>
 
@@ -331,13 +330,15 @@ export default function TaxDashboard({
           </select>
         )}
 
-        <button
+        <AdminButton
           onClick={handleFetch}
           disabled={loading || !selectedBrandId}
-          className="rounded-lg bg-blue-600 px-4 py-1.5 text-xs font-medium text-white hover:bg-blue-700 disabled:opacity-50"
+          variant="primary"
+          size="sm"
+          isLoading={loading}
         >
-          {loading ? "Loading..." : "Refresh"}
-        </button>
+          Refresh
+        </AdminButton>
 
         <span className="ml-auto text-xs text-zinc-500">
           {preset === "quarter" ? quarterLabel(range.start, range.end) :
@@ -347,21 +348,13 @@ export default function TaxDashboard({
       </div>
 
       {/* ── Tab bar ── */}
-      <div className="flex gap-1 border-b border-zinc-800">
-        {TABS.map((tab) => (
-          <button
-            key={tab.id}
-            onClick={() => setActiveTab(tab.id)}
-            className={`px-4 py-2 text-sm font-medium border-b-2 -mb-px ${
-              activeTab === tab.id
-                ? "border-blue-600 text-blue-400"
-                : "border-transparent text-zinc-500 hover:text-zinc-300"
-            }`}
-          >
-            {tab.label}
-          </button>
-        ))}
-      </div>
+      <AdminFilterTabs
+        activeTab={activeTab}
+        onTabChange={setActiveTab}
+        tabs={TABS}
+        size="md"
+        showCounts={false}
+      />
 
       {/* ── TAX SUMMARY TAB ── */}
       {activeTab === "summary" && (