diff --git a/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.html b/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.html
index 1cf14a54d..34d0b9556 100644
--- a/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.html
+++ b/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.html
@@ -1,6 +1,41 @@
-@if (tx.status.confirmed) {
-<div class="acceleration-timeline box">
+<div class="acceleration-timeline box" [class.lower-padding]="!tx.status.confirmed">
   <div class="timeline-wrapper">
+    @if (!tx.status.confirmed) {
+    <div class="timeline">
+      <div class="intervals">
+        <div class="node-spacer"></div>
+        <div class="interval-spacer"></div>
+        <div class="node-spacer"></div>
+        <div class="interval">
+          <div class="interval-time">
+            @if (eta) {
+              ~<app-time [time]="eta?.wait / 1000"></app-time> <!-- <span *ngIf="accelerateRatio > 1" class="compare"> ({{ accelerateRatio }}x faster)</span> -->
+              }
+          </div>
+        </div>
+        <div class="node-spacer"></div>
+      </div>
+      <div class="nodes">
+        <div class="node-spacer"></div>
+        <div class="interval-spacer"></div>
+        <div class="node">
+          <div class="acc-to-confirmed right go-faster"></div>
+        </div>
+        <div class="interval-spacer">
+        </div>
+        <div class="node" [id]="'confirmed'">
+          <div class="acc-to-confirmed left go-faster"></div>
+          <div class="shape-border waiting">
+            <div class="shape animate"></div>
+          </div>
+          <!-- <div>
+            <span class="symbol">< </span><app-fee-rate [fee]="tx.effectiveFeePerVsize" [unitStyle]="{ display: 'block', marginTop: '-0.5em'}"></app-fee-rate>
+          </div> -->
+          <div class="status"><span class="badge badge-waiting" i18n="transaction.rbf.mined">Mined</span></div>
+        </div>
+      </div>
+    </div>
+    }
     <div class="timeline">
       <div class="intervals">
         <div class="node-spacer"></div>
@@ -12,7 +47,13 @@
         <div class="node-spacer"></div>
         <div class="interval">
           <div class="interval-time">
-            <app-time [time]="tx.status.block_time - acceleratedAt"></app-time>
+            @if (tx.status.confirmed) {
+              <div class="interval-time">
+                <app-time [time]="tx.status.block_time - acceleratedAt"></app-time>
+              </div>
+            } @else if (standardETA && !tx.status.confirmed) {
+              <!-- ~<app-time [time]="standardETA / 1000 - now"></app-time> -->
+            }
           </div>
         </div>
         <div class="node-spacer"></div>
@@ -25,128 +66,71 @@
           </div>
           <div class="status"><span class="badge badge-primary" i18n="transaction.first-seen|Transaction first seen">First seen</span></div>
           <div class="time">
-            <app-time *ngIf="transactionTime > 0" kind="since" [time]="transactionTime"></app-time>
+            @if (useAbsoluteTime) {
+            <span>{{ transactionTime * 1000 | date }}</span>
+            } @else {
+            <app-time kind="since" [time]="transactionTime"></app-time>
+            }
           </div>
         </div>
         <div class="interval-spacer">
           <div class="seen-to-acc"></div>
         </div>
-        <div class="node" [id]="'accelerated'">
+        <div class="node" [class.accelerated]="!tx.status.confirmed" [id]="'accelerated'">
           <div class="seen-to-acc left"></div>
-          <div class="acc-to-confirmed right"></div>
-          <div class="shape-border">
+          @if (tx.status.confirmed) {
+            <div class="acc-to-confirmed right"></div>
+          } @else {
+          <div class="seen-to-acc right"></div>
+          }
+          <div  class="shape-border">
             <div class="shape"></div>
+            @if (!tx.status.confirmed) {
+            <div class="connector down loading"></div>
+            }
           </div>
-          <div class="status"><span class="badge badge-accelerated" i18n="transaction.audit.accelerated">Accelerated</span></div>
-          <div class="time">
-            <app-time *ngIf="acceleratedAt" kind="since" [time]="acceleratedAt"></app-time>
+          @if (tx.status.confirmed) {
+            <div class="status"><span class="badge badge-accelerated" i18n="transaction.audit.accelerated">Accelerated</span></div>
+          }
+          <div class="time offset-left" [class.no-margin]="!tx.status.confirmed">
+            @if (!tx.status.confirmed) {
+            <span i18n="transaction.audit.accelerated">Accelerated</span>{{ "" }} 
+            }
+            @if (useAbsoluteTime) {
+            <span>{{ acceleratedAt * 1000 | date }}</span>
+            } @else {
+            <app-time kind="since" [time]="acceleratedAt"></app-time>
+            }
           </div>
         </div>
         <div class="interval-spacer">
+          @if (tx.status.confirmed) {
           <div class="acc-to-confirmed"></div>
+          } @else {
+          <div class="seen-to-acc"></div>
+          }
         </div>
-        <div class="node selected" [id]="'confirmed'">
-          <div class="acc-to-confirmed left" ></div>
-          <div class="shape-border">
+        <div class="node" [class.selected]="tx.status.confirmed" [id]="'confirmed'">
+          @if (tx.status.confirmed) {
+          <div class="acc-to-confirmed left"></div>
+          } @else {
+          <div class="seen-to-acc left"></div>
+          }
+          <div class="shape-border" [class.waiting]="!tx.status.confirmed">
             <div class="shape"></div>
           </div>
+          @if (tx.status.confirmed) {
           <div class="status"><span class="badge badge-success" i18n="transaction.rbf.mined">Mined</span></div>
           <div class="time">
+            @if (useAbsoluteTime) {
+            <span>{{ tx.status.block_time * 1000 | date }}</span>
+            } @else {
             <app-time kind="since" [time]="tx.status.block_time"></app-time>
+            }
           </div>
+          }
         </div>
-      </div>  
+      </div>
     </div>
   </div>
 </div>
-} @else if (acceleratedETA) { <!-- Not yet accelerated; to be shown only in acceleration checkout -->
-} @else if (standardETA) { <!-- Accelerated -->
-  <div class="acceleration-timeline box lower-padding">
-    <div class="timeline-wrapper">
-      <div class="timeline">
-        <div class="intervals">
-          <div class="node-spacer"></div>
-          <div class="interval-spacer"></div>
-          <div class="node-spacer"></div>
-          <div class="interval">
-            <div class="interval-time">
-              @if (eta) {
-                ~<app-time [time]="eta?.wait / 1000"></app-time> <!-- <span *ngIf="accelerateRatio > 1" class="compare"> ({{ accelerateRatio }}x faster)</span> -->
-                }
-            </div>
-          </div>
-          <div class="node-spacer"></div>
-        </div>
-        <div class="nodes">
-          <div class="node-spacer"></div>
-          <div class="interval-spacer"></div>
-          <div class="node">
-            <div class="acc-to-confirmed right go-faster"></div>
-          </div>
-          <div class="interval-spacer">
-          </div>
-          <div class="node" [id]="'confirmed'">
-            <div class="acc-to-confirmed left go-faster"></div>
-            <div class="shape-border waiting">
-              <div class="shape animate"></div>
-            </div>
-            <div class="status"><span class="badge badge-waiting" i18n="transaction.rbf.mined">Mined</span></div>
-          </div>
-        </div>
-      </div>
-      <div class="timeline">
-        <div class="intervals">
-          <div class="node-spacer"></div>
-          <div class="interval">
-            <div class="interval-time">
-              <app-time [time]="acceleratedAt - transactionTime"></app-time>
-            </div>
-          </div>
-          <div class="node-spacer"></div>
-          <div class="interval">
-            <div class="interval-time">
-                <!-- ~<app-time [time]="standardETA / 1000 - now"></app-time> -->
-                -
-            </div>
-          </div>
-          <div class="node-spacer"></div>
-        </div>
-        <div class="nodes">
-          <div class="node" [id]="'first-seen'">
-            <div class="seen-to-acc right"></div>
-            <div class="shape-border">
-              <div class="shape"></div>
-            </div>
-            <div class="status"><span class="badge badge-primary" i18n="transaction.first-seen|Transaction first seen">First seen</span></div>
-            <div class="time">
-              <app-time *ngIf="transactionTime > 0" kind="since" [time]="transactionTime"></app-time>
-            </div>
-          </div>
-          <div class="interval-spacer">
-            <div class="seen-to-acc"></div>
-          </div>
-          <div class="node accelerated" [id]="'accelerated'">
-            <div class="seen-to-acc left"></div>
-            <div class="seen-to-acc right"></div>
-            <div  class="shape-border">
-              <div class="shape"></div>
-              <div class="connector down loading"></div>
-            </div>
-            <div class="time" style="margin-top: 3px;">
-              <span i18n="transaction.audit.accelerated">Accelerated</span>&nbsp;<app-time *ngIf="acceleratedAt" kind="since" [time]="acceleratedAt"></app-time>
-            </div>
-          </div>
-          <div class="interval-spacer">
-            <div class="seen-to-acc"></div>
-          </div>
-          <div class="node" [id]="'confirmed'">
-            <div class="seen-to-acc left"></div>
-            <div class="shape-border waiting">
-              <div class="shape"></div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-}
\ No newline at end of file
diff --git a/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.scss b/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.scss
index dd815ba45..93a0cdba1 100644
--- a/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.scss
+++ b/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.scss
@@ -209,7 +209,7 @@
       }
 
       .status {
-        margin-top: -64px;
+        margin-top: -66px;
 
         .badge.badge-waiting {
           opacity: 0.5;
@@ -224,10 +224,20 @@
       }
 
       .time {
-        margin-top: 33px;
+        margin-top: 32px;
         font-size: 12px;
         line-height: 16px;
         white-space: nowrap;
+
+        &.offset-left {
+          @media (max-width: 650px) {
+            margin-left: -20px;
+          }
+        }
+
+        &.no-margin {
+          margin-top: 0px;
+        }
       }
     }
   }
diff --git a/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.ts b/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.ts
index 38d48dd05..df4de1f20 100644
--- a/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.ts
+++ b/frontend/src/app/components/acceleration-timeline/acceleration-timeline.component.ts
@@ -19,15 +19,22 @@ export class AccelerationTimelineComponent implements OnInit, OnChanges {
   acceleratedAt: number;
   now: number;
   accelerateRatio: number;
+  useAbsoluteTime: boolean = false;
 
   constructor() {}
 
   ngOnInit(): void {
     this.acceleratedAt = this.tx.acceleratedAt ?? new Date().getTime() / 1000;
+    this.now = Math.floor(new Date().getTime() / 1000);
+    this.useAbsoluteTime = this.tx.status.block_time < this.now - 7 * 24 * 3600;
+
+    window.setInterval(() => {
+      this.now = Math.floor(new Date().getTime() / 1000);
+      this.useAbsoluteTime = this.tx.status.block_time < this.now - 7 * 24 * 3600;
+    }, 60000);
   }
 
   ngOnChanges(changes): void {
-    this.now = Math.floor(new Date().getTime() / 1000);
     // Hide standard ETA while we don't have a proper standard ETA calculation, see https://github.com/mempool/mempool/issues/65
     
     // if (changes?.eta?.currentValue || changes?.standardETA?.currentValue || changes?.acceleratedETA?.currentValue) {
diff --git a/frontend/src/app/components/transaction/transaction.component.html b/frontend/src/app/components/transaction/transaction.component.html
index 22916b242..e9b2d8f19 100644
--- a/frontend/src/app/components/transaction/transaction.component.html
+++ b/frontend/src/app/components/transaction/transaction.component.html
@@ -640,7 +640,9 @@
         <td>
           <div class="effective-fee-container">
             @if (accelerationInfo?.acceleratedFeeRate && (!tx.effectiveFeePerVsize || accelerationInfo.acceleratedFeeRate >= tx.effectiveFeePerVsize || tx.acceleration)) {
-              <app-fee-rate [fee]="accelerationInfo.acceleratedFeeRate"></app-fee-rate>
+              @if (tx.effectiveFeePerVsize) { <!-- Avoid briefly displaying a wrong accelerated fee rate while loading -->
+                <app-fee-rate [fee]="accelerationInfo.acceleratedFeeRate"></app-fee-rate>
+              }
             } @else {
               <app-fee-rate [fee]="tx.effectiveFeePerVsize"></app-fee-rate>
             }