diff --git a/src/components/NotificationsPanel.test.tsx b/src/components/NotificationsPanel.test.tsx
index 2af9f68..92d6265 100644
--- a/src/components/NotificationsPanel.test.tsx
+++ b/src/components/NotificationsPanel.test.tsx
@@ -445,12 +445,12 @@ describe('NotificationsPanel', () => {
   });
 
   describe('dark mode support', () => {
-    it('includes dark mode classes', () => {
+    it('includes glass terminal dark theme classes', () => {
       render(<NotificationsPanel {...defaultProps} />);
 
       const panel = screen.getByRole('dialog');
-      expect(panel).toHaveClass('bg-white', 'dark:bg-gray-900');
-      expect(panel).toHaveClass('border-gray-200', 'dark:border-gray-800');
+      expect(panel).toHaveClass('glass-card');
+      expect(panel).toHaveClass('rounded-2xl', 'text-white', 'shadow-2xl');
     });
   });
 
diff --git a/src/components/NotificationsPanel.tsx b/src/components/NotificationsPanel.tsx
index 28ed3de..77ba252 100644
--- a/src/components/NotificationsPanel.tsx
+++ b/src/components/NotificationsPanel.tsx
@@ -44,10 +44,10 @@ const NotificationsPanel: React.FC<{ id: string; onClose: () => void }> = ({
       aria-labelledby={titleId}
       aria-describedby={descriptionId}
       tabIndex={-1}
-      className="absolute right-0 mt-2 w-96 max-w-[calc(100vw-2rem)] bg-white dark:bg-gray-900 border border-gray-200 dark:border-gray-800 rounded-lg shadow-lg z-50"
+      className="glass-card absolute right-0 mt-2 w-96 max-w-[calc(100vw-2rem)] rounded-2xl text-white shadow-2xl z-50"
     >
-      <div className="p-4 border-b border-gray-100 dark:border-gray-800 flex items-center justify-between gap-2 flex-wrap">
-        <h2 id={titleId} className="text-lg font-medium text-gray-900 dark:text-gray-100">
+      <div className="p-4 border-b border-[#BEC7FE]/10 flex items-center justify-between gap-2 flex-wrap">
+        <h2 id={titleId} className="text-lg font-medium text-gray-100">
           Notifications
         </h2>
         <div className="flex items-center gap-2">
@@ -56,7 +56,7 @@ const NotificationsPanel: React.FC<{ id: string; onClose: () => void }> = ({
               type="button"
               aria-label="Mark all notifications as read"
               onClick={() => void markAllAsRead()}
-              className="shrink-0 rounded-lg px-3 py-1.5 text-sm font-medium text-[#2C4BFD] dark:text-blue-400 hover:bg-blue-50 dark:hover:bg-blue-900/20 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#2C4BFD] focus-visible:ring-offset-2 dark:focus-visible:ring-offset-gray-900 transition-colors"
+              className="shrink-0 rounded-lg px-3 py-1.5 text-sm font-medium text-[#2C4BFD] hover:bg-[#2C4BFD]/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#2C4BFD] focus-visible:ring-offset-2 focus-visible:ring-offset-[#111827] transition-colors"
             >
               Mark all as read
             </button>
@@ -66,7 +66,7 @@ const NotificationsPanel: React.FC<{ id: string; onClose: () => void }> = ({
             ref={closeButtonRef}
             onClick={onClose}
             aria-label="Close notifications"
-            className="shrink-0 rounded-lg px-3 py-1.5 text-sm font-medium text-gray-700 dark:text-gray-200 hover:bg-gray-100 dark:hover:bg-gray-800 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#2C4BFD] focus-visible:ring-offset-2 dark:focus-visible:ring-offset-gray-900"
+            className="shrink-0 rounded-lg px-3 py-1.5 text-sm font-medium text-gray-300 hover:bg-white/5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#2C4BFD] focus-visible:ring-offset-2 focus-visible:ring-offset-[#111827]"
           >
             Close
           </button>
@@ -102,12 +102,12 @@ const NotificationsPanel: React.FC<{ id: string; onClose: () => void }> = ({
             {list.map((n) => (
               <div
                 key={n.id}
-                className={`p-4 border-b border-gray-100 dark:border-gray-800 flex items-start justify-between gap-3 ${n.read ? 'opacity-60' : ''}`}
+                className={`p-4 border-b border-[#BEC7FE]/10 flex items-start justify-between gap-3 ${n.read ? 'opacity-60' : ''}`}
               >
                 <div className="min-w-0">
-                  <div className="font-medium text-gray-900 dark:text-gray-100">{n.title}</div>
-                  <div className="text-sm text-gray-600 dark:text-gray-400">{n.message}</div>
-                  <div className="text-xs text-gray-500 dark:text-gray-500 mt-1">
+                  <div className="font-medium text-gray-100">{n.title}</div>
+                  <div className="text-sm text-gray-400">{n.message}</div>
+                  <div className="text-xs text-gray-500 mt-1">
                     {new Date(n.createdAt).toLocaleString()}
                   </div>
                 </div>
@@ -116,7 +116,7 @@ const NotificationsPanel: React.FC<{ id: string; onClose: () => void }> = ({
                     type="button"
                     aria-label={`Mark notification "${n.title}" as read`}
                     onClick={() => markAsRead(n.id)}
-                    className="shrink-0 p-2 rounded-lg hover:bg-gray-100 dark:hover:bg-gray-800 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#2C4BFD] focus-visible:ring-offset-2 dark:focus-visible:ring-offset-gray-900"
+                    className="shrink-0 p-2 rounded-lg hover:bg-white/5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[#2C4BFD] focus-visible:ring-offset-2 focus-visible:ring-offset-[#111827]"
                   >
                     <Check className="w-4 h-4" aria-hidden />
                   </button>
diff --git a/src/components/PredictionHistory.tsx b/src/components/PredictionHistory.tsx
index b8a323b..02ec491 100644
--- a/src/components/PredictionHistory.tsx
+++ b/src/components/PredictionHistory.tsx
@@ -82,6 +82,7 @@ export default function PredictionHistory({ userId, optimisticPrediction }: Pred
   }, [history, userId]);
 
   useEffect(() => {
+    // eslint-disable-next-line react-hooks/set-state-in-effect
     void loadHistory();
   }, [loadHistory]);
 
diff --git a/src/components/PriceChart.tsx b/src/components/PriceChart.tsx
index 8f6cdc7..11f3ec4 100644
--- a/src/components/PriceChart.tsx
+++ b/src/components/PriceChart.tsx
@@ -487,6 +487,7 @@ const PriceChart = ({ height = 300, asset = "XLM", entryPrice, onPriceUpdate }:
 
   // Reload data when asset changes — reset and load mock/API data
   useEffect(() => {
+    /* eslint-disable react-hooks/set-state-in-effect */
     setData([]);
     setIsLoading(true);
     setLoadError(null);
@@ -499,8 +500,8 @@ const PriceChart = ({ height = 300, asset = "XLM", entryPrice, onPriceUpdate }:
       setIsLoading(false);
     }
 
-    // Also attempt to fetch live data from API
     void loadInitialPrices();
+    /* eslint-enable react-hooks/set-state-in-effect */
   }, [asset]); // eslint-disable-line react-hooks/exhaustive-deps
 
   // Update chart line color when asset changes
diff --git a/src/pages/Dashboard.tsx b/src/pages/Dashboard.tsx
index 7b3bcb4..c5fd2c2 100644
--- a/src/pages/Dashboard.tsx
+++ b/src/pages/Dashboard.tsx
@@ -181,7 +181,9 @@ const activeRoundId = useRoundStore((state) => state.activeRound?.id ?? null);
 
   // Clear the entry marker whenever the active round changes.
   useEffect(() => {
+    /* eslint-disable react-hooks/set-state-in-effect */
     setEntryPrice(null);
+    /* eslint-enable react-hooks/set-state-in-effect */
   }, [activeRoundId]);
 
   const [stats, setStats] = useState<UserStats | null>(null);
@@ -283,8 +285,10 @@ const activeRoundId = useRoundStore((state) => state.activeRound?.id ?? null);
   }, [isWalletConnected, publicKey]);
 
   useEffect(() => {
+    /* eslint-disable react-hooks/set-state-in-effect */
     void fetchStats();
     void fetchActivities();
+    /* eslint-enable react-hooks/set-state-in-effect */
   }, [fetchStats, fetchActivities]);
 
   const refreshInspector = useCallback(async () => {
@@ -309,7 +313,9 @@ const activeRoundId = useRoundStore((state) => state.activeRound?.id ?? null);
   }, [isWalletConnected, publicKey]);
 
   useEffect(() => {
+    /* eslint-disable react-hooks/set-state-in-effect */
     void refreshInspector();
+    /* eslint-enable react-hooks/set-state-in-effect */
   }, [refreshInspector]);
 
   const handleRoundSoundToggle = (enabled: boolean) => {
diff --git a/src/pages/Learn.tsx b/src/pages/Learn.tsx
index 6def81f..3b49617 100644
--- a/src/pages/Learn.tsx
+++ b/src/pages/Learn.tsx
@@ -52,7 +52,9 @@ const LearnPage = () => {
     }, []);
 
     useEffect(() => {
+        /* eslint-disable react-hooks/set-state-in-effect */
         fetchData();
+        /* eslint-enable react-hooks/set-state-in-effect */
     }, [fetchData]);
 
     if (loading) {