diff --git a/.env.example b/.env.example
index 8ffa7e4..8a9f8af 100644
--- a/.env.example
+++ b/.env.example
@@ -20,6 +20,11 @@ VITE_APP_NAME=starr
 VITE_API_URL=https://api.yourdomain.com/api
 VITE_APP_URL=https://api.yourdomain.com
 
+# ── Environment ───────────────────────────────────────────────────────────────
+#  "production" (droplet) or "qas" (home-hosted, behind Cloudflare Tunnel).
+#  Set to "qas" only on the QAS Preview build in Vercel's project settings.
+VITE_APP_ENV=production
+
 # ── PayPal ────────────────────────────────────────────────────────────────────
 #  Client ID is the public key — safe to expose in the browser bundle.
 #  developer.paypal.com → My Apps & Credentials → Live tab → Client ID
diff --git a/src/components/generic/EnvironmentBanner.jsx b/src/components/generic/EnvironmentBanner.jsx
new file mode 100644
index 0000000..91b843c
--- /dev/null
+++ b/src/components/generic/EnvironmentBanner.jsx
@@ -0,0 +1,46 @@
+import { useState } from "react";
+import { X } from "lucide-react";
+
+// Hardcoded (not DB-driven) — flip to false if it should reappear on every
+// reload instead of staying dismissed once closed.
+const PERSIST_DISMISSAL = true;
+const DISMISS_KEY = "qas_env_banner_dismissed";
+
+export default function EnvironmentBanner() {
+  const [dismissed, setDismissed] = useState(
+    () => PERSIST_DISMISSAL && localStorage.getItem(DISMISS_KEY) === "true"
+  );
+
+  if (dismissed) return null;
+
+  const handleDismiss = () => {
+    if (PERSIST_DISMISSAL) localStorage.setItem(DISMISS_KEY, "true");
+    setDismissed(true);
+  };
+
+  return (
+    <div role="status" className="w-full shadow-sm px-4 md:px-6 bg-amber-400">
+      <div className="relative w-full rounded-none py-2 flex items-center justify-center px-10">
+        <p className="text-sm font-semibold leading-snug truncate text-amber-950">
+          Development / Staging (QAS) environment — not production
+        </p>
+
+        <div
+          role="button"
+          tabIndex={0}
+          onClick={handleDismiss}
+          onKeyDown={(e) => {
+            if (e.key !== "Enter" && e.key !== " ") return;
+            e.preventDefault();
+            handleDismiss();
+          }}
+          aria-label="Dismiss environment banner"
+          title="Dismiss"
+          className="absolute right-2 inline-flex items-center justify-center size-8 rounded-lg cursor-pointer hover:opacity-70 transition-opacity text-amber-950"
+        >
+          <X className="size-4" />
+        </div>
+      </div>
+    </div>
+  );
+}
diff --git a/src/modules/admin/layouts/AdminLayout.jsx b/src/modules/admin/layouts/AdminLayout.jsx
index 98af361..c9c64ad 100644
--- a/src/modules/admin/layouts/AdminLayout.jsx
+++ b/src/modules/admin/layouts/AdminLayout.jsx
@@ -23,6 +23,8 @@ import { cn } from "@/lib/utils"
 import UserMenu from "@/components/generic/UserMenu"
 import NotificationBell from "@/components/generic/NotificationBell"
 import AdminStickyAnnouncementBar from "@/components/generic/AdminStickyAnnouncementBar"
+import EnvironmentBanner from "@/components/generic/EnvironmentBanner"
+import { isQasEnv } from "@/utils/environment.util"
 import UploadProgressToast from "@/components/generic/UploadProgressToast"
 import { ROLE_CONFIG } from "@/data/profile.data"
 
@@ -50,6 +52,7 @@ const AdminLayout = () => {
                 {/* AdminProvider wraps header + body so UserMenu can access ProfileProvider */}
                 <AdminProvider>
                     <div ref={headerRef} className={cn('fixed top-0 z-50 w-full bg-background border-b')} >
+                        {isQasEnv && <EnvironmentBanner />}
                         <AdminStickyAnnouncementBar />
                         <div className="w-full flex items-center justify-between xs:px-4 lg:px-5 py-3">
                             <div className="flex gap-4 items-center">
diff --git a/src/modules/admin/pages/assets/AddAsset.jsx b/src/modules/admin/pages/assets/AddAsset.jsx
index e7cf541..29350e8 100644
--- a/src/modules/admin/pages/assets/AddAsset.jsx
+++ b/src/modules/admin/pages/assets/AddAsset.jsx
@@ -13,6 +13,7 @@ import { useUploadQueue } from "@/contexts/UploadQueueContext";
 import { useAuth } from "@/contexts/AuthContext";
 import { MAX_ASSET_FILE_SIZE_SINGLE, MAX_ASSET_FILE_SIZE_SINGLE_LABEL } from "@/utils/assetUpload.util";
 import { formatFileSize } from "@/utils/format.util";
+import { isQasEnv, QAS_UPLOAD_LIMIT_MB } from "@/utils/environment.util";
 import { useUnsavedChangesGuard } from "@/hooks/useUnsavedChangesGuard";
 import { Button } from "@/components/ui/button";
 import { Label } from "@/components/ui/label";
@@ -239,6 +240,11 @@ export default function AddAsset() {
                             error={errors._file?.message}
                         />
                         <FieldError message={errors._file?.message} />
+                        {isQasEnv && (
+                            <p className="text-xs text-amber-600">
+                                Self-hosted staging environment — uploads over {QAS_UPLOAD_LIMIT_MB}MB may fail (Cloudflare limit).
+                            </p>
+                        )}
                         <Link
                             to="/admin/assets/add/bulk"
                             className="inline-flex items-center gap-1 text-xs text-primary hover:underline"
diff --git a/src/modules/admin/pages/assets/AddAssetsBulk.jsx b/src/modules/admin/pages/assets/AddAssetsBulk.jsx
index a4a61a1..480bf10 100644
--- a/src/modules/admin/pages/assets/AddAssetsBulk.jsx
+++ b/src/modules/admin/pages/assets/AddAssetsBulk.jsx
@@ -11,6 +11,7 @@ import { useAssets } from "@/contexts/AdminAssetsContext";
 import { useUploadQueue } from "@/contexts/UploadQueueContext";
 import { useAuth } from "@/contexts/AuthContext";
 import { formatFileSize } from "@/utils/format.util";
+import { isQasEnv, QAS_UPLOAD_LIMIT_MB } from "@/utils/environment.util";
 import { Button } from "@/components/ui/button";
 import { Progress } from "@/components/ui/progress";
 import {
@@ -194,6 +195,11 @@ export default function AddAssetsBulk() {
 
             {/* ── Drop zone ── */}
             <DropZone onFiles={handleFiles} />
+            {isQasEnv && (
+                <p className="text-xs text-amber-600">
+                    Self-hosted staging environment — uploads over {QAS_UPLOAD_LIMIT_MB}MB may fail (Cloudflare limit).
+                </p>
+            )}
 
             {/* ── File list ── */}
             {total > 0 && (
diff --git a/src/modules/client/components/blocks/FileUpload.jsx b/src/modules/client/components/blocks/FileUpload.jsx
index 3d785af..c32ea6e 100644
--- a/src/modules/client/components/blocks/FileUpload.jsx
+++ b/src/modules/client/components/blocks/FileUpload.jsx
@@ -13,6 +13,7 @@ import {
 } from "lucide-react";
 import { cn } from "@/lib/utils";
 import { toast } from "sonner";
+import { isQasEnv, QAS_UPLOAD_LIMIT_MB } from "@/utils/environment.util";
 
 // ── Helpers ───────────────────────────────────────────────────────────────────
 function formatBytes(b) {
@@ -271,6 +272,11 @@ const FileUpload = ({
                     <p className="text-sm font-medium">Drop files here or click to browse</p>
                     <p className="text-sm text-muted-foreground mt-1">Upload your work to submit with this task</p>
                     <p className="text-sm mt-2">{derivedHint}</p>
+                    {isQasEnv && (
+                        <p className="text-xs text-amber-600 mt-1">
+                            Self-hosted staging environment — uploads over {QAS_UPLOAD_LIMIT_MB}MB may fail (Cloudflare limit).
+                        </p>
+                    )}
                 </div>
             )}
 
@@ -303,6 +309,11 @@ const FileUpload = ({
                     )}
 
                     <p className="text-xs text-muted-foreground mt-2">{derivedHint}</p>
+                    {isQasEnv && (
+                        <p className="text-xs text-amber-600 mt-1">
+                            Self-hosted staging environment — uploads over {QAS_UPLOAD_LIMIT_MB}MB may fail (Cloudflare limit).
+                        </p>
+                    )}
                 </div>
             )}
 
diff --git a/src/modules/client/layout/ClientLayout.jsx b/src/modules/client/layout/ClientLayout.jsx
index d62f44f..b921ca6 100644
--- a/src/modules/client/layout/ClientLayout.jsx
+++ b/src/modules/client/layout/ClientLayout.jsx
@@ -38,6 +38,8 @@ import { AVATAR_COLORS } from "@/data/profile.data"
 import { Badge } from "@/components/ui/badge"
 import ClientNotificationBell from "@/components/generic/ClientNotificationBell"
 import StickyAnnouncementBar from "@/components/generic/StickyAnnouncementBar"
+import EnvironmentBanner from "@/components/generic/EnvironmentBanner"
+import { isQasEnv } from "@/utils/environment.util"
 import { QRCodeCanvas } from "qrcode.react"
 
 // ─── Refer / Invite dialog ────────────────────────────────────────────────────
@@ -443,6 +445,7 @@ const ClientLayout = () => {
         <ClientProvider>
             <div className="min-h-screen flex flex-col">
                 <header ref={headerRef} className="fixed top-0 left-0 right-0 z-50 flex flex-col">
+                    {isQasEnv && <EnvironmentBanner />}
                     <StickyAnnouncementBar />
                     <ClientNav />
                 </header>
diff --git a/src/modules/client/pages/UnitList.jsx b/src/modules/client/pages/UnitList.jsx
index 044afe4..bb29416 100644
--- a/src/modules/client/pages/UnitList.jsx
+++ b/src/modules/client/pages/UnitList.jsx
@@ -30,7 +30,7 @@ import { TYPE_DEFS } from "@/modules/admin/components/courses/completionRequirem
 
 const QuizPrerequisiteGate = ({ previousQuizzes, units, onQuizClick }) => {
     const [open, setOpen] = useState(false);
-    const passed   = previousQuizzes.filter((q) => q.has_passed).length;
+    const passed = previousQuizzes.filter((q) => q.has_passed).length;
     const useModal = previousQuizzes.length > QUIZ_MODAL_THRESHOLD;
 
     return (
@@ -95,11 +95,10 @@ const QuizGateList = ({ requiredQuizzes, units, onQuizClick, onItemClick }) => (
                     onQuizClick({ unit: units.find((u) => u.unit_id === q.unitId), quiz: { quiz_id: q.quizId } });
                     onItemClick?.();
                 }}
-                className={`flex items-center gap-3 p-3 rounded-lg border transition-colors ${
-                    q.has_passed
+                className={`flex items-center gap-3 p-3 rounded-lg border transition-colors ${q.has_passed
                         ? "bg-emerald-50 dark:bg-emerald-900/20 border-emerald-200 dark:border-emerald-800"
                         : "border-border hover:bg-muted cursor-pointer"
-                }`}
+                    }`}
             >
                 {q.has_passed
                     ? <CheckCircle2 className="size-5 text-emerald-500 shrink-0" />
@@ -207,20 +206,20 @@ const SidebarContent = ({
                                     {(unit.lessons ?? []).map((lesson) => {
                                         const lessonDone = getLessonCompleted?.(lesson);
                                         return (
-                                        <li
-                                            key={lesson.lesson_id}
-                                            onClick={() => onLessonClick({ unit, lesson })}
-                                            className={`flex items-center gap-2 pl-4 pr-3 py-1.5 text-sm rounded-md hover:bg-muted-foreground/10 hover:text-foreground cursor-pointer transition-colors ${selectedLessonId === lesson.lesson_id
-                                                ? "bg-muted-foreground/10 text-foreground font-medium"
-                                                : "text-muted-foreground"
-                                                }`}
-                                        >
-                                            {lessonDone
-                                                ? <CheckCircle2 className="size-3.5 text-emerald-500 shrink-0" />
-                                                : <Circle className="size-3.5 text-muted-foreground/30 shrink-0" />
-                                            }
-                                            <span className="truncate lg:w-40">{lesson.title}</span>
-                                        </li>
+                                            <li
+                                                key={lesson.lesson_id}
+                                                onClick={() => onLessonClick({ unit, lesson })}
+                                                className={`flex items-center gap-2 pl-4 pr-3 py-1.5 text-sm rounded-md hover:bg-muted-foreground/10 hover:text-foreground cursor-pointer transition-colors ${selectedLessonId === lesson.lesson_id
+                                                    ? "bg-muted-foreground/10 text-foreground font-medium"
+                                                    : "text-muted-foreground"
+                                                    }`}
+                                            >
+                                                {lessonDone
+                                                    ? <CheckCircle2 className="size-3.5 text-emerald-500 shrink-0" />
+                                                    : <Circle className="size-3.5 text-muted-foreground/30 shrink-0" />
+                                                }
+                                                <span className="truncate lg:w-40">{lesson.title}</span>
+                                            </li>
                                         );
                                     })}
                                     {unit.quiz && (() => {
@@ -228,21 +227,20 @@ const SidebarContent = ({
                                         return (
                                             <li
                                                 onClick={() => onQuizClick({ unit, quiz: unit.quiz })}
-                                                className={`flex items-center gap-2 pl-6 pr-3 py-1.5 text-sm rounded-md cursor-pointer transition-colors ${
-                                                    selectedQuizId === unit.quiz.quiz_id
+                                                className={`flex items-center gap-2 pl-6 pr-3 py-1.5 text-sm rounded-md cursor-pointer transition-colors ${selectedQuizId === unit.quiz.quiz_id
                                                         ? "bg-muted-foreground/10 text-foreground font-medium"
                                                         : unit.quiz.has_passed
-                                                        ? "text-emerald-600 dark:text-emerald-400 hover:bg-muted-foreground/10"
-                                                        : quizLocked
-                                                        ? "text-muted-foreground/50 hover:bg-muted-foreground/5"
-                                                        : "text-muted-foreground hover:bg-muted-foreground/10 hover:text-foreground"
-                                                }`}
+                                                            ? "text-emerald-600 dark:text-emerald-400 hover:bg-muted-foreground/10"
+                                                            : quizLocked
+                                                                ? "text-muted-foreground/50 hover:bg-muted-foreground/5"
+                                                                : "text-muted-foreground hover:bg-muted-foreground/10 hover:text-foreground"
+                                                    }`}
                                             >
                                                 {unit.quiz.has_passed
                                                     ? <CheckCircle2 className="size-3.5 text-emerald-500 shrink-0" />
                                                     : quizLocked
-                                                    ? <Lock className="size-3.5 text-amber-500 shrink-0" />
-                                                    : <ClipboardList className="size-3.5 shrink-0" />
+                                                        ? <Lock className="size-3.5 text-amber-500 shrink-0" />
+                                                        : <ClipboardList className="size-3.5 shrink-0" />
                                                 }
                                                 {"Quiz"}
                                             </li>
@@ -335,6 +333,7 @@ const UnitList = () => {
     const [sidebarOpen, setSidebarOpen] = useState(false);
     const [desktopSidebarOpen, setDesktopSidebarOpen] = useState(true);
     const [helpOpen, setHelpOpen] = useState(false);
+    const [taskModeOpen, setTaskModeOpen] = useState(false);
 
     const resetCompletion = () => setSelectedCompletion(false);
 
@@ -373,19 +372,19 @@ const UnitList = () => {
     const courseNoticeTitle = courseNoticeMissingQuiz && courseNoticeNoAssessment
         ? "Quizzes & Assessment Coming Soon"
         : courseNoticeMissingQuiz
-        ? "Quizzes Coming Soon"
-        : "Assessment Coming Soon";
+            ? "Quizzes Coming Soon"
+            : "Assessment Coming Soon";
 
     const courseNoticeDescription = courseNoticeMissingQuiz && courseNoticeNoAssessment
         ? "Some units in this course don't have a quiz yet, and this course does not have an assessment built yet — we are currently working on both. You may proceed with your studies. Enjoy!"
         : courseNoticeMissingQuiz
-        ? "Some units in this course don't have a quiz yet — we are currently working on it. You may proceed with your studies. Enjoy!"
-        : "This course does not have an assessment built yet — we are currently working on it. You may proceed with your studies. Enjoy!";
+            ? "Some units in this course don't have a quiz yet — we are currently working on it. You may proceed with your studies. Enjoy!"
+            : "This course does not have an assessment built yet — we are currently working on it. You may proceed with your studies. Enjoy!";
 
     // ── Session guard — block navigation while a quiz/assessment is in progress ─
-    const quizActiveRef                   = useRef(false);   // sync check inside handlers
+    const quizActiveRef = useRef(false);   // sync check inside handlers
     const [quizSessionActive, setQuizSessionActive] = useState(false);
-    const [pendingNav, setPendingNav]     = useState(null);  // deferred nav fn
+    const [pendingNav, setPendingNav] = useState(null);  // deferred nav fn
 
     const setQuizActive = useCallback((active) => {
         quizActiveRef.current = active;
@@ -596,7 +595,7 @@ const UnitList = () => {
             .then(({ data }) => {
                 if (data?.data?.has_task) setTaskCtx(data.data);
             })
-            .catch(() => {});   // non-critical — silently swallow
+            .catch(() => { });   // non-critical — silently swallow
     }, [courseId]);
 
     // ── Toast when a task's read requirements are all done ────────────────
@@ -693,8 +692,8 @@ const UnitList = () => {
             label: selectedCompletion
                 ? "Course Complete"
                 : selectedAssessment
-                ? "Course Assessment"
-                : currentUnit ? `Unit ${(course?.units?.indexOf(currentUnit) ?? 0) + 1}: ${currentUnit.title}` : "Select a lesson"
+                    ? "Course Assessment"
+                    : currentUnit ? `Unit ${(course?.units?.indexOf(currentUnit) ?? 0) + 1}: ${currentUnit.title}` : "Select a lesson"
         },
     ];
     const breadcrumbItemsMobile = [
@@ -823,9 +822,9 @@ const UnitList = () => {
     const units = course?.units ?? [];
     const nextContent = getNextContent();
     const nextLabel = nextContent
-        ? nextContent.type === "lesson"     ? nextContent.lesson.title
-        : nextContent.type === "quiz"       ? (nextContent.quiz.title || "Quiz")
-        : (nextContent.assessment?.title || "Course Assessment")
+        ? nextContent.type === "lesson" ? nextContent.lesson.title
+            : nextContent.type === "quiz" ? (nextContent.quiz.title || "Quiz")
+                : (nextContent.assessment?.title || "Course Assessment")
         : null;
     const showSidebarContent = desktopSidebarOpen && !quizSessionActive;
 
@@ -973,20 +972,21 @@ const UnitList = () => {
                 </div>
             </ResponsiveModal>
 
-            {/* ── Task-mode banner ─────────────────────────────────────────── */}
-            {taskCtx?.has_task && (
-                <div className={`fixed xs:top-[124px] lg:top-[112px] left-0 right-0 z-30 flex items-center gap-2 text-white text-xs font-medium px-4 py-1.5 shadow-sm transition-colors ${
-                    course?.is_completed ? 'bg-green-600' : 'bg-blue-600'
-                }`}>
-                    <ListChecks className="size-3.5 shrink-0" />
-                    <span>
-                        {course?.is_completed
-                            ? 'Course complete — tracking finished'
-                            : 'Task mode — reading progress is being tracked automatically'
-                        }
-                    </span>
+            {/* ── "Task mode" info dialog ── */}
+            <ResponsiveModal
+                open={taskModeOpen}
+                onOpenChange={setTaskModeOpen}
+                title="Task mode"
+                description=""
+                footer={<Button onClick={() => setTaskModeOpen(false)}>Got it</Button>}
+            >
+                <div className="space-y-3 text-sm text-muted-foreground">
+                    <p>
+                        This course is part of one of your assigned <strong className="text-foreground">tasks</strong>.
+                        Your reading and completion progress here is being tracked automatically — no need to do anything extra.
+                    </p>
                 </div>
-            )}
+            </ResponsiveModal>
 
             {/* ── Up next after passing a quiz ── */}
             {selectedQuizId && quiz?.has_passed && !quizSessionActive && nextContent && (
@@ -999,7 +999,7 @@ const UnitList = () => {
                             <span className="text-sm text-muted-foreground font-normal">Up next</span>
                             {nextContent.type === "lesson" ? nextContent.lesson.title
                                 : nextContent.type === "quiz" ? (nextContent.quiz.title || "Quiz")
-                                : (nextContent.assessment?.title || "Course Assessment")}
+                                    : (nextContent.assessment?.title || "Course Assessment")}
                         </div>
                         <ArrowRight className="size-4 text-muted-foreground" />
                     </div>
@@ -1019,24 +1019,45 @@ const UnitList = () => {
                             <AppBreadcrumb items={breadcrumbItemsMobile} />
                         </div>
 
-                        {!selectedQuizId && !selectedAssessment && !selectedCompletion && lesson && (
-                            isProgressCompleted(lesson.uuid) ? (
-                                <div className="hidden lg:flex items-center gap-1.5 text-sm font-medium text-emerald-600 dark:text-emerald-400 shrink-0">
-                                    <CheckCheck className="size-4" />
-                                    Done
-                                </div>
-                            ) : (
-                                <Button
-                                    variant="ghost"
-                                    size="sm"
-                                    className="hidden lg:flex items-center gap-1.5 text-muted-foreground shrink-0"
-                                    onClick={() => setHelpOpen(true)}
-                                >
-                                    <HelpCircle className="size-4" />
-                                    How to complete
-                                </Button>
-                            )
-                        )}
+                        <div className="hidden lg:flex items-center gap-2 shrink-0">
+                            {taskCtx?.has_task && (
+                                course?.is_completed ? (
+                                    <div className="flex items-center gap-1.5 text-sm font-medium text-emerald-600 dark:text-emerald-400 shrink-0">
+                                        <CheckCheck className="size-4" />
+                                        Task complete
+                                    </div>
+                                ) : (
+                                    <Button
+                                        variant="outline"
+                                        size="sm"
+                                        className="flex items-center gap-1.5 text-blue-600 dark:text-blue-400 shrink-0"
+                                        onClick={() => setTaskModeOpen(true)}
+                                    >
+                                        <ListChecks className="size-4" />
+                                        Task mode
+                                    </Button>
+                                )
+                            )}
+
+                            {!selectedQuizId && !selectedAssessment && !selectedCompletion && lesson && (
+                                isProgressCompleted(lesson.uuid) ? (
+                                    <div className="flex items-center gap-1.5 text-sm font-medium text-emerald-600 dark:text-emerald-400 shrink-0">
+                                        <CheckCheck className="size-4" />
+                                        Done
+                                    </div>
+                                ) : (
+                                    <Button
+                                        variant="ghost"
+                                        size="sm"
+                                        className="flex items-center gap-1.5 text-muted-foreground shrink-0"
+                                        onClick={() => setHelpOpen(true)}
+                                    >
+                                        <HelpCircle className="size-4" />
+                                        How to complete
+                                    </Button>
+                                )
+                            )}
+                        </div>
 
                         {/* Mobile hamburger */}
                         <Sheet open={sidebarOpen} onOpenChange={setSidebarOpen}>
@@ -1086,7 +1107,7 @@ const UnitList = () => {
             </div>
 
             {/* ── Desktop sidebar: rail + collapsible content panel (desktop only) ── */}
-            <div className={`hidden lg:flex flex-row fixed ${taskCtx?.has_task ? "top-[140px]" : "top-[112px]"} bottom-0 left-0 z-30 bg-muted border-r`}>
+            <div className="hidden lg:flex flex-row fixed top-[112px] bottom-0 left-0 z-30 bg-muted border-r">
                 {/* Rail — always visible */}
                 <div className="w-14 shrink-0 flex flex-col items-center pt-3">
                     <Button
@@ -1130,7 +1151,7 @@ const UnitList = () => {
             </div>
 
             {/* ── Main content ── */}
-            <div className={`${taskCtx?.has_task ? "xs:mt-42 lg:mt-36" : "mt-32"} ${showSidebarContent ? "lg:ml-80" : "lg:ml-14"} p-4 md:p-6 min-h-screen`}>
+            <div className={`mt-32 ${showSidebarContent ? "lg:ml-80" : "lg:ml-14"} p-4 md:p-6 min-h-screen`}>
                 <div className="relative w-full h-full mx-auto max-w-2xl">
                     {selectedCompletion ? (
                         <CourseCompleteBlock course={course} />
diff --git a/src/utils/environment.util.js b/src/utils/environment.util.js
new file mode 100644
index 0000000..90f9bc3
--- /dev/null
+++ b/src/utils/environment.util.js
@@ -0,0 +1,3 @@
+export const isQasEnv = import.meta.env.VITE_APP_ENV === "qas";
+
+export const QAS_UPLOAD_LIMIT_MB = 100;