diff --git a/frontend/App.tsx b/frontend/App.tsx
index a1dbd34..897063f 100755
--- a/frontend/App.tsx
+++ b/frontend/App.tsx
@@ -961,7 +961,7 @@ const AppContent: React.FC<{ msalInstance: any }> = ({ msalInstance }) => {
   const userInfo = getUserInfo(msalInstance);
 
   return (
-    <div className={`flex h-screen ${mainBgColor} font-sans text-gray-800 overflow-hidden`}>
+    <div className={`flex h-screen ${mainBgColor} font-sans text-gray-800 overflow-hidden min-w-[900px]`}>
       <Sidebar
         activeItem={currentView}
         onNavigate={(view) => handleNavigate(view as View)}
diff --git a/frontend/components/Campaigns.tsx b/frontend/components/Campaigns.tsx
index ffa56aa..dc25dd4 100755
--- a/frontend/components/Campaigns.tsx
+++ b/frontend/components/Campaigns.tsx
@@ -1682,8 +1682,8 @@ const ProofDetailView: React.FC<{
                     >
                         <ArrowLeftIcon className="h-6 w-6" />
                     </button>
-                    <div>
-                        <h1 className="text-3xl lg:text-4xl font-semibold text-oliver-black">{proof.proofName}</h1>
+                    <div className="min-w-0">
+                        <h1 className="text-3xl lg:text-4xl font-semibold text-oliver-black truncate" title={proof.proofName}>{proof.proofName}</h1>
                         <div className="flex items-center gap-2 mt-2 text-sm text-oliver-black/60 font-medium">
                             <span>{proof.channel}</span>
                             <span className="text-grey-300">&bull;</span>
@@ -1699,7 +1699,7 @@ const ProofDetailView: React.FC<{
                 </div>
             </header>
 
-             <div className="max-w-screen-2xl mx-auto grid grid-cols-1 lg:grid-cols-3 gap-x-12">
+             <div className="max-w-screen-2xl mx-auto grid grid-cols-1 xl:grid-cols-3 gap-x-12">
                 <div className="lg:col-span-1">
                     <div className="sticky top-8 flex flex-col gap-y-6">
                         <div>
@@ -1714,7 +1714,7 @@ const ProofDetailView: React.FC<{
                         </div>
 
                         <div>
-                            <div className="flex items-center justify-between mb-3 gap-2">
+                            <div className="flex flex-wrap items-center justify-between mb-3 gap-2">
                                 <h3 className="text-xl font-semibold text-oliver-black flex items-center gap-2">
                                     <HistoryIcon className="h-6 w-6 text-oliver-azure"/>
                                     Version History
@@ -1722,7 +1722,7 @@ const ProofDetailView: React.FC<{
                                 <div className="flex items-center gap-2">
                                     <button
                                         onClick={handleDownload}
-                                        className="flex items-center gap-2 text-sm bg-oliver-azure text-white font-semibold py-1.5 px-3 rounded-full border border-transparent hover:bg-oliver-azure/90 transition-colors duration-200"
+                                        className="flex items-center gap-2 text-sm bg-oliver-azure text-white font-semibold py-1.5 px-3 rounded-full border border-transparent hover:bg-oliver-azure/90 hover:shadow-sm active:scale-95 active:bg-oliver-azure/80 transition-all duration-150 shrink-0 whitespace-nowrap"
                                         title={`Download Version ${selectedVersion.version}`}
                                     >
                                         <DownloadIcon className="h-4 w-4" />
@@ -1731,7 +1731,7 @@ const ProofDetailView: React.FC<{
                                     <button
                                         onClick={handleDownloadReport}
                                         disabled={isExporting}
-                                        className="flex items-center gap-2 text-sm bg-white text-oliver-azure font-semibold py-1.5 px-3 rounded-full border-2 border-oliver-azure hover:bg-oliver-azure hover:text-white transition-colors duration-200 disabled:bg-gray-300 disabled:text-oliver-black/60 disabled:border-grey-300 disabled:cursor-wait"
+                                        className="flex items-center gap-2 text-sm bg-white text-oliver-azure font-semibold py-1.5 px-3 rounded-full border-2 border-oliver-azure hover:bg-oliver-azure hover:text-white hover:shadow-sm active:scale-95 transition-all duration-150 disabled:bg-gray-300 disabled:text-oliver-black/60 disabled:border-grey-300 disabled:cursor-wait shrink-0 whitespace-nowrap"
                                         title={`Download Report for Version ${selectedVersion.version}`}
                                     >
                                         {isExporting ? (
@@ -1750,7 +1750,7 @@ const ProofDetailView: React.FC<{
                                         <button
                                             onClick={handleUploadClick}
                                             disabled={isUploadingNewVersion}
-                                            className="flex items-center gap-2 text-sm bg-white text-oliver-azure font-semibold py-1.5 px-3 rounded-full border-2 border-oliver-azure hover:bg-oliver-azure hover:text-white transition-colors duration-200 disabled:bg-gray-300 disabled:text-oliver-black/60 disabled:border-grey-300 disabled:cursor-wait"
+                                            className="flex items-center gap-2 text-sm bg-white text-oliver-azure font-semibold py-1.5 px-3 rounded-full border-2 border-oliver-azure hover:bg-oliver-azure hover:text-white hover:shadow-sm active:scale-95 transition-all duration-150 disabled:bg-gray-300 disabled:text-oliver-black/60 disabled:border-grey-300 disabled:cursor-wait shrink-0 whitespace-nowrap"
                                             title="Upload a new version of this proof"
                                         >
                                             {isUploadingNewVersion ? (
@@ -1801,7 +1801,7 @@ const ProofDetailView: React.FC<{
                         </div>
                     </div>
                 </div>
-                <div className="mt-12 lg:mt-0 lg:col-span-2">
+                <div className="mt-12 xl:mt-0 xl:col-span-2">
                     {selectedVersion.isIdenticalFile && (
                         <div className="mb-6 bg-warning-light border border-warning rounded-[10px] p-4 flex items-start gap-3">
                             <ExclamationTriangleIcon className="w-5 h-5 text-warning flex-shrink-0 mt-0.5" />