fix mobile css

my-blog/static/css/style.css

@@ -199,20 +199,18 @@ a.view-markdown:any-link {
 
 /* Main Content */
 .main-content {
-    grid-area: main;
-    max-width: 1000px;
-    margin: 0 auto;
-    /* padding: 24px; */
-    padding-top: 80px;
-    width: 100%;
+	grid-area: main;
+	max-width: 1000px;
+	margin: 0 auto;
+	padding: 0px;
+	width: 100%;
 }
 
 @media (max-width: 1000px) {
-    .main-content {
-        /* padding: 20px; */
-        padding: 0px;
-        max-width: 100%;
-    }
+	.main-content {
+		padding: 0px;
+		max-width: 100%;
+	}
 }
 
 /* Timeline */
@@ -232,6 +230,7 @@ a.view-markdown:any-link {
 .timeline-feed {
     display: flex;
     flex-direction: column;
+				padding: 100px 0;
     /* gap: 24px; */
 }
 
@@ -333,6 +332,7 @@ a.view-markdown:any-link {
     /* gap: 40px; */
     max-width: 1000px;
     margin: 0 auto;
+				padding: 100px 0;
 }
 
 /* article.article-content { padding: 10px; } */
@@ -781,8 +781,6 @@ article.article-content {
 .comment-section {
     max-width: 800px;
     margin: 0 auto;
-    /* margin-top: 48px; */
-    /* padding-top: 32px; */
 }
 
 .comment-container {
@@ -819,7 +817,7 @@ article.article-content {
         grid-template-columns: 1fr;
         gap: 24px;
         max-width: 100%;
-        padding: 0;
+        padding: 50px 0;
         margin: 0;
     }
 }
@@ -1081,7 +1079,7 @@ article.article-content {
     
 				.article-title {
 					   font-size: 24px;
-					   padding: 30px 0px;
+					   padding: 10px;
 				}
 
     .message-header .avatar {
@@ -1100,4 +1098,15 @@ article.article-content {
         width: 100%;
         padding: 0;
     }
+
+				.comment-section {
+        padding: 50px 0;
+				}
+
+				.article-meta {
+					padding: 10px;
+				}
+				.article-actions {
+					padding: 10px;
+				}
 }

oauth/src/App.css

@@ -262,11 +262,22 @@ body {
   cursor: not-allowed;
 }
 
-/* Main Content */
 .main-content {
-  max-width: 800px;
-  margin: 0 auto;
-  padding: 20px 0;
+	grid-area: main;
+	max-width: 1000px;
+	margin: 0 auto;
+	padding: 0px;
+	width: 100%;
+}
+
+@media (max-width: 1000px) {
+	.main-content {
+		padding: 0px !important;
+		margin: 0px !important;
+		max-width: 100% !important;
+		width: 100% !important;
+		overflow-x: hidden !important;
+	}
 }
 
 /* Bluesky Footer */
@@ -744,15 +755,7 @@ body {
     padding: 0 !important;
     margin: 0 !important;
   }
-  
-  .main-content {
-    padding: 0px !important;
-    margin: 0px !important;
-    max-width: 100% !important;
-    width: 100% !important;
-    overflow-x: hidden !important;
-  }
-  
+ 
   /* OAuth app mobile fixes - prevent overflow and content issues */
   .oauth-app-header {
     padding: 0px !important;