diff --git a/src/routes/match/[id]/+layout.svelte b/src/routes/match/[id]/+layout.svelte
index 422c928..c3f563e 100644
--- a/src/routes/match/[id]/+layout.svelte
+++ b/src/routes/match/[id]/+layout.svelte
@@ -48,7 +48,8 @@
 	<!-- Background Image -->
 	<div class="absolute inset-0">
 		<img src={mapBg} alt={mapName} class="h-full w-full object-cover" onerror={handleImageError} />
-		<div class="absolute inset-0 bg-gradient-to-r from-black/90 via-black/70 to-black/50"></div>
+		<!-- Stronger gradient overlay for better text contrast -->
+		<div class="absolute inset-0 bg-gradient-to-r from-black/95 via-black/85 to-black/75"></div>
 	</div>
 
 	<div class="container relative mx-auto px-4 py-8">
@@ -82,20 +83,28 @@
 		<!-- Score -->
 		<div class="mb-6 flex items-center justify-center gap-6">
 			<div class="text-center">
-				<div class="text-sm font-medium text-white/70">TERRORISTS</div>
-				<div class="font-mono text-5xl font-bold text-terrorist drop-shadow-lg">
+				<div class="text-sm font-medium text-white/90 drop-shadow-md">TERRORISTS</div>
+				<div
+					class="font-mono text-5xl font-bold text-terrorist"
+					style="text-shadow: 0 4px 8px rgba(0, 0, 0, 0.8), 0 2px 4px rgba(0, 0, 0, 0.6);"
+				>
 					{match.score_team_a}
 				</div>
 			</div>
-			<div class="text-3xl font-bold text-white/40">:</div>
+			<div class="text-3xl font-bold text-white/60 drop-shadow-lg">:</div>
 			<div class="text-center">
-				<div class="text-sm font-medium text-white/70">COUNTER-TERRORISTS</div>
-				<div class="font-mono text-5xl font-bold text-ct drop-shadow-lg">{match.score_team_b}</div>
+				<div class="text-sm font-medium text-white/90 drop-shadow-md">COUNTER-TERRORISTS</div>
+				<div
+					class="font-mono text-5xl font-bold text-ct"
+					style="text-shadow: 0 4px 8px rgba(0, 0, 0, 0.8), 0 2px 4px rgba(0, 0, 0, 0.6);"
+				>
+					{match.score_team_b}
+				</div>
 			</div>
 		</div>
 
 		<!-- Match Meta -->
-		<div class="flex flex-wrap items-center justify-center gap-4 text-sm text-white/80">
+		<div class="flex flex-wrap items-center justify-center gap-4 text-sm text-white drop-shadow-md">
 			<div class="flex items-center gap-2">
 				<Calendar class="h-4 w-4" />
 				<span>{formattedDate}</span>
@@ -111,7 +120,7 @@
 		</div>
 
 		<!-- Tabs -->
-		<div class="mt-6 rounded-lg bg-black/30 p-4 backdrop-blur-sm">
+		<div class="mt-6 rounded-lg bg-black/50 p-4 backdrop-blur-sm">
 			<Tabs {tabs} variant="bordered" size="md" />
 		</div>
 	</div>