diff --git a/src/app/dashboard/fuel/fuel-view.tsx b/src/app/dashboard/fuel/fuel-view.tsx
index 7baa5cd..937afcb 100644
--- a/src/app/dashboard/fuel/fuel-view.tsx
+++ b/src/app/dashboard/fuel/fuel-view.tsx
@@ -840,7 +840,7 @@ function AlertCard({
       href={href}
       aria-label={`View ${v.description} — ${v.alert} alert, ${v.warn} warn`}
       className={cn(
-        "flex h-full flex-col justify-between gap-3 rounded-xl border p-4 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-[#F2B165]",
+        "flex h-full flex-col justify-between gap-2 rounded-xl border p-3 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-[#F2B165] sm:gap-3 sm:p-4",
         toneClasses,
       )}
     >
@@ -938,7 +938,7 @@ function AlertListRow({
     <Link
       href={href}
       aria-label={`View ${v.description} — ${v.alert} alert, ${v.warn} warn`}
-      className="group flex items-center gap-3 rounded-lg border border-border/60 bg-card px-4 py-3 transition-colors hover:border-[#F2B165]/60 focus:outline-none focus-visible:ring-2 focus-visible:ring-[#F2B165]"
+      className="group flex items-center gap-2 rounded-lg border border-border/60 bg-card px-3 py-2 transition-colors hover:border-[#F2B165]/60 focus:outline-none focus-visible:ring-2 focus-visible:ring-[#F2B165] sm:gap-3 sm:px-4 sm:py-3"
     >
       <span
         aria-hidden
@@ -1026,7 +1026,7 @@ function FleetMobileCard({
     edit.editing ? (
       <div
         className={cn(
-          "flex flex-col gap-2 rounded-xl border border-border/60 bg-card p-3",
+          "flex flex-col gap-1.5 rounded-xl border border-border/60 bg-card p-2.5 sm:gap-2 sm:p-3",
           edit.isDirty && "border-[#F2B165]/60 bg-[#F2B165]/5",
         )}
       >