Initial commit

src/components/game/TimeDisplay.tsx

@@ -0,0 +1,51 @@
+'use client';
+
+import { Play, Pause } from 'lucide-react';
+import { Button } from '@/components/ui/button';
+import { fmt } from '@/lib/game/store';
+import { formatHour } from '@/lib/game/formatting';
+
+interface TimeDisplayProps {
+  day: number;
+  hour: number;
+  insight: number;
+  paused: boolean;
+  onTogglePause: () => void;
+}
+
+export function TimeDisplay({
+  day,
+  hour,
+  insight,
+  paused,
+  onTogglePause,
+}: TimeDisplayProps) {
+  return (
+    <div className="flex items-center gap-4">
+      <div className="text-center">
+        <div className="text-lg font-bold game-mono text-amber-400">
+          Day {day}
+        </div>
+        <div className="text-xs text-gray-400">
+          {formatHour(hour)}
+        </div>
+      </div>
+      
+      <div className="text-center">
+        <div className="text-lg font-bold game-mono text-purple-400">
+          {fmt(insight)}
+        </div>
+        <div className="text-xs text-gray-400">Insight</div>
+      </div>
+      
+      <Button
+        variant="ghost"
+        size="sm"
+        onClick={onTogglePause}
+        className="text-gray-400 hover:text-white"
+      >
+        {paused ? <Play className="w-4 h-4" /> : <Pause className="w-4 h-4" />}
+      </Button>
+    </div>
+  );
+}