diff --git a/app/frontend/src/index.css b/app/frontend/src/index.css
index 68c365e..0e6775c 100644
--- a/app/frontend/src/index.css
+++ b/app/frontend/src/index.css
@@ -398,6 +398,10 @@ textarea {
   background: var(--text-tertiary);
 }
 
+.status-sleeping {
+  background: var(--info, #6366f1);
+}
+
 @keyframes pulse-ring {
   0% { transform: scale(1); opacity: 0.7; }
   70% { transform: scale(2); opacity: 0; }
diff --git a/app/frontend/src/lib/api-client.ts b/app/frontend/src/lib/api-client.ts
index 8255d3b..3cf4428 100644
--- a/app/frontend/src/lib/api-client.ts
+++ b/app/frontend/src/lib/api-client.ts
@@ -1,6 +1,6 @@
 import type { components, paths } from '@/generated/api-types';
 
-export type ServiceStatus = 'running' | 'degraded' | 'stopped' | 'building' | 'failed' | 'unknown';
+export type ServiceStatus = 'running' | 'degraded' | 'stopped' | 'building' | 'failed' | 'sleeping' | 'waking' | 'unknown';
 
 export type ProjectStats = components['schemas']['ProjectStats'];
 
@@ -1742,6 +1742,10 @@ export function serviceStatusClass(status: ServiceStatus): string {
       return 'status-building';
     case 'failed':
       return 'status-failed';
+    case 'sleeping':
+      return 'status-sleeping';
+    case 'waking':
+      return 'status-building';
     case 'stopped':
       return 'status-stopped';
     default: