diff --git a/german-app-frontend/src/components/features/story/StoryPlayer.tsx b/german-app-frontend/src/components/features/story/StoryPlayer.tsx
index b9cb476..30da665 100644
--- a/german-app-frontend/src/components/features/story/StoryPlayer.tsx
+++ b/german-app-frontend/src/components/features/story/StoryPlayer.tsx
@@ -30,8 +30,13 @@ export function StoryPlayer({
 
   // Construct audio URL from segment audioUrl
   // Backend serves files from wwwroot, so URLs are like /audio/story/level1-segment1.wav
+  // In Docker, use relative path (nginx proxies to backend)
+  const baseUrl = import.meta.env.PROD 
+    ? ''  // Production: relative path, nginx handles it
+    : (import.meta.env.VITE_API_URL || 'http://localhost:5000');
+  
   const audioUrl = segment.audioUrl
-    ? `${import.meta.env.VITE_API_URL || 'http://localhost:5000'}${segment.audioUrl}`
+    ? `${baseUrl}${segment.audioUrl}`
     : null;
 
   // Load audio metadata when component mounts or segment changes
diff --git a/german-app-frontend/src/lib/api/story.ts b/german-app-frontend/src/lib/api/story.ts
index 48d384a..0406511 100644
--- a/german-app-frontend/src/lib/api/story.ts
+++ b/german-app-frontend/src/lib/api/story.ts
@@ -11,7 +11,11 @@ import type {
 } from '../../types/api/story';
 
 // Base API URL - should match your backend configuration
-const API_BASE_URL = import.meta.env.VITE_API_URL || 'http://localhost:5000/api';
+// In Docker (production), use relative path since nginx proxies /api to backend
+// In development, use the VITE_API_URL or default to localhost:5000
+const API_BASE_URL = import.meta.env.PROD 
+  ? '/api'  // Production (Docker): nginx proxies /api to backend:8080
+  : (import.meta.env.VITE_API_URL || 'http://localhost:5000/api');
 
 /**
  * Fetches with automatic token handling for authenticated requests