fix(dashboard): scope h-full to xl + tighter mobile sizing on KPIs

The Alerts rail and Reminders rail were using h-full unconditionally, which
worked at xl: where the dashboard grid pairs them with a sibling chart
column, but produced weirdly stretched empty cards in the single-column
mobile stack (no fixed-height context to fill).

  alert-rail / my-reminders-rail: h-full -> xl:h-full

KPI tiles + skeleton rendered the same desktop padding (p-5) and font sizes
on phone, leaving the value cramped against a wide white frame. Tighter
mobile defaults that scale up at sm:

  KPITile      p-3 sm:p-5, label text-[10px] sm:text-xs,
               value mt-1 text-lg sm:mt-2 sm:text-2xl, value truncates
  KpiTileSkeleton: matching p-3 sm:p-5 + smaller skeleton bars on mobile

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

src/components/ui/kpi-tile.tsx

@@ -45,7 +45,7 @@ export function KPITile({
     <div
       data-testid="kpi-tile"
       className={cn(
-        'group relative overflow-hidden rounded-xl border border-border bg-gradient-brand-soft p-5 shadow-sm transition-all duration-base ease-smooth hover:shadow-md',
+        'group relative overflow-hidden rounded-xl border border-border bg-gradient-brand-soft p-3 shadow-sm transition-all duration-base ease-smooth hover:shadow-md sm:p-5',
         className,
       )}
       {...props}
@@ -53,10 +53,12 @@ export function KPITile({
       <div className={cn('absolute inset-x-0 top-0 h-1', ACCENT_STRIPES[accent])} aria-hidden />
       <div className="flex items-start justify-between gap-4">
         <div className="min-w-0">
-          <div className="text-xs font-medium uppercase tracking-wide text-muted-foreground">
+          <div className="text-[10px] font-medium uppercase tracking-wide text-muted-foreground sm:text-xs">
             {title}
           </div>
-          <div className="mt-2 text-2xl font-semibold tabular-nums text-foreground">{value}</div>
+          <div className="mt-1 truncate text-lg font-semibold tabular-nums text-foreground sm:mt-2 sm:text-2xl">
+            {value}
+          </div>
           {typeof delta === 'number' ? (
             <div className={cn('mt-1 text-xs font-medium', deltaClass)}>
               {deltaPrefix}