diff --git a/static/css/components/timeline.css b/static/css/components/timeline.css
index 32a1404..2ff4d20 100644
--- a/static/css/components/timeline.css
+++ b/static/css/components/timeline.css
@@ -54,42 +54,46 @@ ol.tw-border-l-2 {
   background: transparent !important;
   color: #6b7280;
 }
-
-/* 1. Scale up the Typography */
-#Tailscaleipdoesntwork h3,
-.tw-text-lg {
-  font-size: 1.5rem !important; /* Larger Heading */
-  line-height: 1.2 !important;
-}
-
+/* 1. Main Text Size - Matching standard blog paragraphs */
 #Tailscaleipdoesntwork p,
 .tw-text-base {
-  font-size: 1.15rem !important; /* Larger Body Text */
-  line-height: 1.6 !important;
-  color: #374151 !important; /* Slightly darker for better readability */
+  font-size: 1.125rem !important; /* ~18px */
+  line-height: 1.7 !important;
+  color: #333 !important;
+  margin-top: 8px !important;
 }
 
+/* 2. Heading Size */
+#Tailscaleipdoesntwork h3,
+.tw-text-lg {
+  font-size: 1.5rem !important; /* ~24px */
+  font-weight: 700 !important;
+  margin-bottom: 4px !important;
+}
+
+/* 3. Date Size */
 time,
 .tw-text-sm {
-  font-size: 1rem !important; /* Larger Date */
-  margin-bottom: 0.5rem !important;
+  font-size: 0.95rem !important;
+  font-weight: 600 !important;
+  color: #6b7280 !important;
 }
 
-/* 2. Scale the Dot and Line */
+/* 4. The Alignment "Math" */
+/* If <li> has tw-ml-6 (1.5rem), the dot needs to move left exactly that much */
 .timeline-button {
-  width: 1rem !important; /* Bigger dot */
-  height: 1rem !important;
-  left: -2.05rem !important; /* Re-center the bigger dot on the line */
-  top: 0.4rem;
+  width: 12px !important;
+  height: 12px !important;
+  position: absolute;
+  left: -1.88rem !important; /* Adjust this slightly if the dot isn't centered on the line */
+  top: 0.5rem;
+  background: #cbd5e1;
+  border: 3px solid white !important;
+  border-radius: 50%;
+  z-index: 10;
 }
 
+/* 5. The Vertical Line */
 ol.tw-border-l-2 {
-  border-left-width: 3px !important; /* Thicker vertical line */
-  margin-left: 2rem !important; /* Push away from the edge */
-}
-
-/* 3. Ensure it expands to the full container width */
-li.tw-mb-10 {
-  margin-bottom: 3rem !important; /* More breathing room between items */
-  width: 100% !important;
+  border-left: 2px solid #e2e8f0 !important;
 }