1 files changed, 9 insertions, 1 deletions
diff --git a/apps/web/app/reader/_components/offline-banner.tsx b/apps/web/app/reader/_components/offline-banner.tsx
index 81ebf8f..b6089de 100644
--- a/apps/web/app/reader/_components/offline-banner.tsx
+++ b/apps/web/app/reader/_components/offline-banner.tsx
@@ -1,6 +1,8 @@
 "use client"
 
 import { useSyncExternalStore } from "react"
+import { TIER_LIMITS, type SubscriptionTier } from "@asa-news/shared"
+import { useUserProfile } from "@/lib/queries/use-user-profile"
 
 function subscribe(callback: () => void) {
   window.addEventListener("online", callback)
@@ -21,12 +23,18 @@ function getServerSnapshot() {
 
 export function OfflineBanner() {
   const isOnline = useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot)
+  const { data: userProfile } = useUserProfile()
 
   if (isOnline) return null
 
+  const tier = (userProfile?.tier ?? "free") as SubscriptionTier
+  const allowsOffline = TIER_LIMITS[tier]?.allowsOfflineReading ?? false
+
   return (
     <div className="border-b border-border bg-background-tertiary px-3 py-1.5 text-center text-text-dim">
-      you are offline — showing cached content
+      {allowsOffline
+        ? "you are offline \u2014 showing cached content"
+        : "you are offline \u2014 offline reading is available on pro and developer plans"}
     </div>
   )
 }