mobile support for client review player

app/client/[token]/review/[versionId]/page.tsx

@@ -278,7 +278,7 @@ export default function ClientReviewPage({
           <Button
             size="sm"
             variant="outline"
-            className="h-8 text-xs gap-1 text-orange-400 border-orange-500/30 hover:bg-orange-500/10"
+            className="h-10 sm:h-8 text-xs gap-1 text-orange-400 border-orange-500/30 hover:bg-orange-500/10"
             onClick={() => setApprovalDialog({ open: true, status: "NEEDS_CHANGES" })}
           >
             <AlertCircle className="h-3.5 w-3.5" />
@@ -286,7 +286,7 @@ export default function ClientReviewPage({
           </Button>
           <Button
             size="sm"
-            className="h-8 text-xs gap-1 bg-emerald-600 hover:bg-emerald-500 text-white"
+            className="h-10 sm:h-8 text-xs gap-1 bg-emerald-600 hover:bg-emerald-500 text-white"
             onClick={() => setApprovalDialog({ open: true, status: "APPROVED" })}
           >
             <CheckCircle2 className="h-3.5 w-3.5" />
@@ -295,8 +295,8 @@ export default function ClientReviewPage({
         </div>
       </header>
 
-      {/* Main: player + comments */}
-      <div className="flex flex-1 overflow-hidden">
+      {/* Main: player + comments — stacked on mobile, side-by-side on md+ */}
+      <div className="flex flex-col md:flex-row flex-1 overflow-hidden">
         {/* Player */}
         <div className="flex-1 min-w-0 min-h-0 overflow-hidden flex flex-col bg-black">
           <ReviewPlayer
@@ -310,7 +310,7 @@ export default function ClientReviewPage({
         </div>
 
         {/* Comment panel */}
-        <div className="w-72 xl:w-80 shrink-0 flex flex-col border-l border-zinc-800 bg-zinc-900">
+        <div className="h-64 md:h-auto md:w-72 xl:w-80 shrink-0 flex flex-col border-t md:border-t-0 md:border-l border-zinc-800 bg-zinc-900">
           <div className="px-4 py-3 border-b border-zinc-800 flex items-center justify-between">
             <h3 className="text-sm font-semibold text-white flex items-center gap-2">
               <MessageSquare className="h-4 w-4 text-zinc-400" />