style(frontend): mobile responsive polish for Dashboard/Providers/Upload/Reconciliation

src/pages/Providers.tsx

@@ -10,13 +10,13 @@ export function Providers() {
   const items = data?.items ?? [];
 
   return (
-    <div className="space-y-8 animate-fade-in">
+    <div className="space-y-6 md:space-y-8 animate-fade-in">
       <header>
         <div className="text-[10.5px] font-semibold uppercase tracking-[0.18em] text-muted-foreground mb-2 flex items-center gap-2">
           <span className="inline-block h-px w-6 bg-border" />
           Providers
         </div>
-        <h1 className="text-[22px] font-semibold tracking-tight">Provider directory</h1>
+        <h1 className="text-[22px] sm:text-[26px] font-semibold tracking-tight">Provider directory</h1>
         <p className="text-muted-foreground mt-1.5 text-[14px]">
           NPIs registered with the clearinghouse for 837P submission and 835
           remittance retrieval.
@@ -49,7 +49,7 @@ export function Providers() {
           {items.map((p) => (
             <article
               key={p.npi}
-              className="surface rounded-xl p-6 flex flex-col gap-4 hover:bg-muted/20 transition-colors"
+              className="surface rounded-xl p-4 sm:p-6 flex flex-col gap-4 hover:bg-muted/20 transition-colors"
             >
               <div className="flex items-start gap-3">
                 <div className="h-10 w-10 rounded-lg bg-muted/60 flex items-center justify-center text-foreground">