diff --git a/Modules/Package.resolved b/Modules/Package.resolved
index 0c3a0a72b4ed..2c8dd7a7818f 100644
--- a/Modules/Package.resolved
+++ b/Modules/Package.resolved
@@ -1,5 +1,5 @@
 {
-  "originHash" : "e3e823d31b833eca898ce70bd04f75d481070d36c5823cfffae0afc36ad263fc",
+  "originHash" : "42f8ac89b366ace35f0f0a03b37756e9686dfff9077324712b71128995463b67",
   "pins" : [
     {
       "identity" : "alamofire",
@@ -381,7 +381,7 @@
       "kind" : "remoteSourceControl",
       "location" : "https://github.com/wordpress-mobile/WordPressKit-iOS",
       "state" : {
-        "revision" : "2613f213b1a958266f88fa7e99d990292096bffb"
+        "revision" : "67db92e3ea5ad8574911df592a838b4729ab9ca5"
       }
     },
     {
diff --git a/Modules/Package.swift b/Modules/Package.swift
index 7efc5411c3df..bceaa85a6db5 100644
--- a/Modules/Package.swift
+++ b/Modules/Package.swift
@@ -50,7 +50,7 @@ let package = Package(
         .package(url: "https://github.com/wordpress-mobile/NSURL-IDN", revision: "b34794c9a3f32312e1593d4a3d120572afa0d010"),
         .package(
             url: "https://github.com/wordpress-mobile/WordPressKit-iOS",
-            revision: "2613f213b1a958266f88fa7e99d990292096bffb" // see wpios-edition branch
+            revision: "67db92e3ea5ad8574911df592a838b4729ab9ca5" // see wpios-edition branch
         ),
         .package(url: "https://github.com/zendesk/support_sdk_ios", from: "8.0.3"),
         // We can't use wordpress-rs branches nor commits here. Only tags work.
diff --git a/Modules/Sources/JetpackStats/Cards/ChartCard.swift b/Modules/Sources/JetpackStats/Cards/ChartCard.swift
index 7da30f38bcee..5f9f0009d325 100644
--- a/Modules/Sources/JetpackStats/Cards/ChartCard.swift
+++ b/Modules/Sources/JetpackStats/Cards/ChartCard.swift
@@ -53,6 +53,13 @@ struct ChartCard: View {
             .presentationDetents([.medium, .large])
             .presentationDragIndicator(.visible)
         }
+        .sheet(isPresented: $isShowingRawData) {
+            if let data = viewModel.chartData[selectedMetric] {
+                NavigationStack {
+                    ChartDataListView(data: data, dateRange: dateRange)
+                }
+            }
+        }
     }
 
     private func headerView(for metric: SiteMetric) -> some View {
@@ -165,15 +172,6 @@ struct ChartCard: View {
                 .frame(width: 56, height: 50)
         }
         .tint(Color.primary)
-        .sheet(isPresented: $isShowingRawData) {
-            NavigationStack {
-                ChartDataListView(
-                    chartDataDict: viewModel.chartData,
-                    selectedMetric: selectedMetric,
-                    dateRanges: dateRange
-                )
-            }
-        }
     }
 
     @ViewBuilder
@@ -190,11 +188,6 @@ struct ChartCard: View {
             }
         }
         Section {
-            Button {
-                // Not implemented
-            } label: {
-                Label(Strings.Buttons.share, systemImage: "square.and.arrow.up")
-            }
             Button {
                 isShowingRawData = true
             } label: {
diff --git a/Modules/Sources/JetpackStats/Cards/TopListCard.swift b/Modules/Sources/JetpackStats/Cards/TopListCard.swift
index b215aa597f1d..aa870c3a621d 100644
--- a/Modules/Sources/JetpackStats/Cards/TopListCard.swift
+++ b/Modules/Sources/JetpackStats/Cards/TopListCard.swift
@@ -43,6 +43,9 @@ struct TopListCard: View {
             moreMenu
         }
         .cardStyle()
+        .onTapGesture {
+            navigateToTopListScreen()
+        }
         .grayscale(viewModel.isStale ? 1 : 0)
         .opacity(viewModel.isEditing ? 0.6 : 1)
         .scaleEffect(viewModel.isEditing ? 0.95 : 1)
@@ -58,13 +61,6 @@ struct TopListCard: View {
             .presentationDetents([.medium, .large])
             .presentationDragIndicator(.visible)
         }
-        .background(
-            Color.clear
-                .contentShape(Rectangle())
-                .onTapGesture {
-                    navigateToTopListScreen()
-                }
-        )
     }
 
     private var cardHeaderView: some View {
@@ -132,7 +128,7 @@ struct TopListCard: View {
         .environment(\.context, context)
         .environment(\.router, router)
 
-        router.navigate(to: screen)
+        router.navigate(to: screen, title: viewModel.selection.item.localizedTitle)
     }
 
     private var itemTypePicker: some View {
@@ -188,11 +184,6 @@ struct TopListCard: View {
     @ViewBuilder
     private var moreMenuContent: some View {
         Section {
-            Button {
-                // Not implemented
-            } label: {
-                Label(Strings.Buttons.share, systemImage: "square.and.arrow.up")
-            }
             if let documentationURL = viewModel.selection.item.documentationURL {
                 Link(destination: documentationURL) {
                     Label(Strings.Buttons.learnMore, systemImage: "info.circle")
@@ -275,9 +266,7 @@ struct TopListCard: View {
 }
 
 #Preview {
-    NavigationView {
-        TopListCardPreview(item: .authors)
-    }
+    TopListCardPreview(item: .authors)
 }
 
 private struct TopListCardPreview: View {
@@ -299,7 +288,6 @@ private struct TopListCardPreview: View {
 
     var body: some View {
         TopListCard(viewModel: viewModel)
-            .cardStyle()
             .frame(maxWidth: .infinity, maxHeight: .infinity)
             .background(Constants.Colors.background)
     }
diff --git a/Modules/Sources/JetpackStats/Extensions/Calendar+Presets.swift b/Modules/Sources/JetpackStats/Extensions/Calendar+Presets.swift
index 490260796a1c..ad4487f3c18e 100644
--- a/Modules/Sources/JetpackStats/Extensions/Calendar+Presets.swift
+++ b/Modules/Sources/JetpackStats/Extensions/Calendar+Presets.swift
@@ -2,7 +2,7 @@ import Foundation
 
 /// Represents predefined date range options for stats filtering.
 /// Each preset defines a specific time period relative to the current date.
-enum DateIntervalPreset: CaseIterable, Identifiable {
+enum DateIntervalPreset: String, CaseIterable, Identifiable {
     /// The current calendar day
     case today
     /// The current calendar week
diff --git a/Modules/Sources/JetpackStats/Resources/interactive-map-template.html b/Modules/Sources/JetpackStats/Resources/interactive-map-template.html
index 0268521cc1e7..e9f53d62c553 100644
--- a/Modules/Sources/JetpackStats/Resources/interactive-map-template.html
+++ b/Modules/Sources/JetpackStats/Resources/interactive-map-template.html
@@ -20,13 +20,8 @@
             height: auto;
         }
         path {
-            cursor: pointer;
             transition: opacity 0.2s ease;
         }
-        path:hover {
-            opacity: 0.8;
-            stroke-width: 2;
-        }
         path.selected {
             stroke-width: 3;
             stroke: #007AFF;
@@ -34,7 +29,7 @@
     </style>
     <script>
         let selectedCountry = null;
-        
+
         function selectCountry(element) {
             if (selectedCountry && selectedCountry !== element) {
                 selectedCountry.classList.remove('selected');
diff --git a/Modules/Sources/JetpackStats/Screens/ChartDataListView.swift b/Modules/Sources/JetpackStats/Screens/ChartDataListView.swift
index 3d65d1c29975..ed70dc8a9dcc 100644
--- a/Modules/Sources/JetpackStats/Screens/ChartDataListView.swift
+++ b/Modules/Sources/JetpackStats/Screens/ChartDataListView.swift
@@ -1,47 +1,51 @@
 import SwiftUI
+import UniformTypeIdentifiers
 
 struct ChartDataListView: View {
-    let chartDataDict: [SiteMetric: ChartData]
-    let selectedMetric: SiteMetric?
-    let dateRanges: StatsDateRange?
-
-    @Environment(\.dismiss) private var dismiss
+    let data: ChartData
+    let dateRange: StatsDateRange
 
     @Environment(\.context) var context
-
-    private var dateRangeFormatter: StatsDateRangeFormatter {
-        context.formatters.dateRange
-    }
+    @Environment(\.dismiss) private var dismiss
 
     var body: some View {
         ScrollView {
-            if let selectedType = selectedMetric,
-               let chartData = chartDataDict[selectedType] {
-                VStack(alignment: .leading, spacing: 20) {
-                    summaryCard(for: chartData, metric: selectedType)
-                        .padding()
-                        .cardStyle()
-                        .padding(.top)
-
-                    dataItemsView(for: chartData, metric: selectedType)
-                        .padding(.horizontal)
-                        .padding(.bottom)
-                }
+            VStack(alignment: .leading, spacing: Constants.step4) {
+                summaryCard(for: data, metric: data.metric)
+                    .padding(.vertical, Constants.step2)
+                    .padding(.horizontal, Constants.step3)
+                    .background(Constants.Colors.background.opacity(0.66))
+                    .cardStyle()
+                    .padding(.top, Constants.step2)
+
+                dataItemsView(for: data, metric: data.metric)
+                    .padding(.horizontal, Constants.step1)
             }
         }
-        .background(Constants.Colors.background)
-        .navigationTitle("Chart Data")
+        .background(Constants.Colors.secondaryBackground)
+        .navigationTitle(Strings.ChartData.title)
         .navigationBarTitleDisplayMode(.inline)
         .toolbar {
             ToolbarItem(placement: .topBarLeading) {
-                Button("Done") {
+                Button(Strings.Buttons.done) {
                     dismiss()
                 }
             }
-
             ToolbarItem(placement: .topBarTrailing) {
-                Button {
-                    // Share action to be implemented
+                Menu {
+                    ShareLink(
+                        item: ChartDataCSVRepresentation(
+                            data: data,
+                            dateRange: dateRange,
+                            context: context
+                        ),
+                        preview: SharePreview(
+                            generateCSVFilename(),
+                            image: Image(systemName: "doc.text")
+                        )
+                    ) {
+                        Label(Strings.Buttons.downloadCSV, systemImage: "square.and.arrow.down")
+                    }
                 } label: {
                     Image(systemName: "square.and.arrow.up")
                 }
@@ -56,33 +60,27 @@ struct ChartDataListView: View {
             previousValue: chartData.previousTotal,
             metric: metric
         )
-
         return VStack(alignment: .leading, spacing: 16) {
             // Header section
             VStack(alignment: .leading, spacing: 2) {
-                StatsCardTitleView(title: metric.localizedTitle, showChevron: true)
-
-                if let dateRanges {
-                    Text("\(dateRangeFormatter.string(from: dateRanges.dateInterval)) vs \(dateRangeFormatter.string(from: dateRanges.effectiveComparisonInterval))")
-                        .font(.caption)
-                        .foregroundColor(.secondary)
-                } else {
-                    Text("Period comparison")
-                        .font(.caption)
-                        .foregroundColor(.secondary)
-                }
+                Text(metric.localizedTitle)
+                    .font(.title3.weight(.semibold))
+                Text(context.formatters.dateRange.string(from: dateRange.dateInterval))
+                    .font(.subheadline)
+                    .foregroundColor(.secondary)
             }
 
             // Metrics section
-            HStack(alignment: .top, spacing: 24) {
+            HStack(alignment: .top, spacing: 0) {
                 metricColumn(
-                    label: "Value",
+                    label: Strings.ChartData.total,
                     value: formatter.format(value: chartData.currentTotal, context: .compact),
                     formatter: formatter
                 )
+                .padding(.trailing, Constants.step2)
 
                 metricColumn(
-                    label: "Previous",
+                    label: Strings.ChartData.previous,
                     value: formatter.format(value: chartData.previousTotal, context: .compact),
                     formatter: formatter
                 )
@@ -91,7 +89,7 @@ struct ChartDataListView: View {
                 Spacer(minLength: 0)
 
                 VStack(alignment: .trailing, spacing: 2) {
-                    Text("CHANGE")
+                    Text(Strings.ChartData.change.uppercased())
                         .font(.caption.weight(.medium))
                         .foregroundColor(.secondary)
 
@@ -100,15 +98,15 @@ struct ChartDataListView: View {
                             .font(.body.weight(.medium))
 
                         Text(formatter.format(value: abs(trendViewModel.currentValue - trendViewModel.previousValue), context: .compact))
-                            .font(Font.make(.recoleta, textStyle: .title, weight: .medium))
-                            .padding(.trailing, 14)
+                            .font(.title2.weight(.semibold))
+                            .padding(.trailing, 8)
 
                         Image(systemName: trendViewModel.systemImage)
-                            .font(Font.make(.recoleta, textStyle: .body, weight: .medium))
-                            .padding(.bottom, 2)
+                            .font(.footnote.weight(.medium))
+                            .padding(.bottom, 1)
 
                         Text(trendViewModel.formattedPercentage)
-                            .font(Font.make(.recoleta, textStyle: .title, weight: .medium))
+                            .font(.title2.weight(.semibold))
                     }
                     .foregroundStyle(trendViewModel.sentiment.foregroundColor)
                 }
@@ -124,23 +122,36 @@ struct ChartDataListView: View {
                 .foregroundColor(.secondary)
 
             Text(value)
-                .font(Font.make(.recoleta, textStyle: .title, weight: .medium))
+                .font(.title2.weight(.semibold))
         }
     }
 
-    private func dataItemsView(for chartData: ChartData, metric: SiteMetric) -> some View {
-        let formatter = StatsValueFormatter(metric: metric)
+    private func generateCSVFilename() -> String {
+        let dateFormatter = DateFormatter()
+        dateFormatter.dateFormat = "yyyy-MM-dd"
+        let dateString = dateFormatter.string(from: Date())
 
-        let maxValue = chartData.currentData.map(\.value).max() ?? 1
+        let metricName = data.metric.localizedTitle
+            .replacingOccurrences(of: " ", with: "_")
 
-        return VStack(alignment: .leading, spacing: 16) {
-            VStack(alignment: .leading, spacing: 12) {
-                Text("Detailed Data")
-                    .font(.headline)
+        let dateRangeString = context.formatters.dateRange.string(from: dateRange.dateInterval)
+            .replacingOccurrences(of: "/", with: "-")
+            .replacingOccurrences(of: ",", with: "")
+            .replacingOccurrences(of: " ", with: "_")
+
+        return "\(metricName)_\(dateRangeString)_\(dateString).csv"
+    }
+
+    private func dataItemsView(for chartData: ChartData, metric: SiteMetric) -> some View {
+        let formatter = StatsValueFormatter(metric: metric)
+        return VStack(alignment: .leading, spacing: Constants.step1) {
+            VStack(alignment: .leading, spacing: Constants.step2) {
+                Text(Strings.ChartData.detailedData)
+                    .font(.subheadline.weight(.semibold))
 
                 // Header
                 HStack {
-                    Text("DATE")
+                    Text(Strings.ChartData.date)
                         .font(.caption)
                         .fontWeight(.medium)
                         .foregroundColor(.secondary)
@@ -148,7 +159,7 @@ struct ChartDataListView: View {
 
                     Spacer()
 
-                    Text("VALUE")
+                    Text(Strings.ChartData.value)
                         .font(.caption)
                         .fontWeight(.medium)
                         .foregroundColor(.secondary)
@@ -157,23 +168,12 @@ struct ChartDataListView: View {
             }
             .padding(.horizontal)
 
-            // Data items
-            VStack(spacing: 8) {
-                ForEach(Array(chartData.currentData.enumerated()), id: \.element.date) { index, currentPoint in
-                    let previousValue = index < chartData.mappedPreviousData.count ? chartData.mappedPreviousData[index].value : 0
-                    let change = currentPoint.value - previousValue
-                    let changePercent = previousValue > 0 ? (Double(change) / Double(previousValue)) * 100 : 0
-
-                    let previousDate = index < chartData.previousData.count ? chartData.previousData[index].date : nil
-
+            VStack(spacing: Constants.step1 / 2) {
+                ForEach(chartData.currentData) { point in
                     DataItemRow(
-                        date: context.formatters.date.formatDate(currentPoint.date, granularity: chartData.granularity),
-                        currentValue: currentPoint.value,
-                        previousValue: previousValue,
-                        previousDate: previousDate != nil ? context.formatters.date.formatDate(previousDate!, granularity: chartData.granularity) : nil,
-                        change: change,
-                        changePercent: changePercent,
-                        maxValue: maxValue,
+                        date: context.formatters.date.formatDate(point.date, granularity: chartData.granularity),
+                        value: point.value,
+                        maxValue: chartData.maxValue,
                         formatter: formatter,
                         metric: metric
                     )
@@ -185,22 +185,15 @@ struct ChartDataListView: View {
 
 // MARK: - Data Item Row
 
-// TODO: reuse the code with the horizontal bar chart thingy
 private struct DataItemRow: View {
     let date: String
-    let currentValue: Int
-    let previousValue: Int
-    let previousDate: String?
-    let change: Int
-    let changePercent: Double
+    let value: Int
     let maxValue: Int
     let formatter: StatsValueFormatter
     let metric: SiteMetric
 
-    @ScaledMetric(relativeTo: .body) private var valueColumnWidth: CGFloat = 60
-
     var body: some View {
-        return HStack(spacing: 16) {
+        HStack(spacing: 16) {
             Text(date)
                 .font(.callout)
                 .foregroundColor(.primary)
@@ -208,62 +201,19 @@ private struct DataItemRow: View {
 
             Spacer(minLength: 8)
 
-            VStack(alignment: .trailing, spacing: 0) {
-                Text(formatter.format(value: currentValue))
-                    .font(.callout.weight(.medium))
-                    .foregroundColor(.primary)
-                    .contentTransition(.numericText())
-
-            }
+            Text(formatter.format(value: value))
+                .font(.callout.weight(.medium))
+                .foregroundColor(.primary)
+                .contentTransition(.numericText())
         }
         .padding(.vertical, 12)
         .padding(.horizontal, 12)
         .background(
-            DataBarBackground(value: currentValue, maxValue: maxValue, metric: metric)
+            TopListItemBarBackground(value: value, maxValue: maxValue, barColor: metric.primaryColor)
         )
     }
 }
 
-// MARK: - Data Bar Background
-
-private struct DataBarBackground: View {
-    let value: Int
-    let maxValue: Int
-    let metric: SiteMetric
-
-    @Environment(\.colorScheme) private var colorScheme
-
-    var body: some View {
-        GeometryReader { geometry in
-            HStack(spacing: 0) {
-                RoundedRectangle(cornerRadius: 6)
-                    .fill(barColor)
-                    .frame(width: barWidth(in: geometry))
-                    .animation(.spring(response: 0.4, dampingFraction: 0.8), value: value)
-                Spacer(minLength: 0)
-            }
-        }
-    }
-
-    private var barColor: Color {
-        metric.primaryColor.opacity(colorScheme == .light ? 0.09 : 0.5)
-    }
-
-    private func barWidth(in geometry: GeometryProxy) -> CGFloat {
-        guard maxValue > 0 else {
-            return 0
-        }
-        let value = geometry.size.width * CGFloat(value) / CGFloat(maxValue)
-        return max(0, value)
-    }
-}
-
-extension View {
-    func cornerRadius(_ radius: CGFloat, corners: UIRectCorner) -> some View {
-        clipShape(RoundedCorner(radius: radius, corners: corners))
-    }
-}
-
 struct RoundedCorner: Shape {
     var radius: CGFloat = .infinity
     var corners: UIRectCorner = .allCorners
@@ -277,31 +227,28 @@ struct RoundedCorner: Shape {
 #Preview {
     NavigationStack {
         ChartDataListView(
-            chartDataDict: [
-                .views: ChartData(
-                    metric: .views,
-                    granularity: .day,
-                    currentTotal: 3000,
-                    currentData: [
-                        DataPoint(date: Date(), value: 1000),
-                        DataPoint(date: Date().addingTimeInterval(-86400), value: 1200),
-                        DataPoint(date: Date().addingTimeInterval(-172800), value: 800)
-                    ],
-                    previousTotal: 2750,
-                    previousData: [
-                        DataPoint(date: Date().addingTimeInterval(-604800), value: 900),
-                        DataPoint(date: Date().addingTimeInterval(-691200), value: 1100),
-                        DataPoint(date: Date().addingTimeInterval(-777600), value: 750)
-                    ],
-                    mappedPreviousData: [
-                        DataPoint(date: Date(), value: 900),
-                        DataPoint(date: Date().addingTimeInterval(-86400), value: 1100),
-                        DataPoint(date: Date().addingTimeInterval(-172800), value: 750)
-                    ]
-                )
-            ],
-            selectedMetric: .views,
-            dateRanges: Calendar.demo.makeDateRange(for: .last7Days)
+            data: ChartData(
+                metric: .views,
+                granularity: .day,
+                currentTotal: 3000,
+                currentData: [
+                    DataPoint(date: Date(), value: 1000),
+                    DataPoint(date: Date().addingTimeInterval(-86400), value: 1200),
+                    DataPoint(date: Date().addingTimeInterval(-172800), value: 800)
+                ],
+                previousTotal: 2750,
+                previousData: [
+                    DataPoint(date: Date().addingTimeInterval(-604800), value: 900),
+                    DataPoint(date: Date().addingTimeInterval(-691200), value: 1100),
+                    DataPoint(date: Date().addingTimeInterval(-777600), value: 750)
+                ],
+                mappedPreviousData: [
+                    DataPoint(date: Date(), value: 900),
+                    DataPoint(date: Date().addingTimeInterval(-86400), value: 1100),
+                    DataPoint(date: Date().addingTimeInterval(-172800), value: 750)
+                ]
+            ),
+            dateRange: Calendar.demo.makeDateRange(for: .last7Days)
         )
     }
 }
diff --git a/Modules/Sources/JetpackStats/Screens/RealtimeTabView.swift b/Modules/Sources/JetpackStats/Screens/RealtimeTabView.swift
index 30fbbcb677f3..365d2342dc25 100644
--- a/Modules/Sources/JetpackStats/Screens/RealtimeTabView.swift
+++ b/Modules/Sources/JetpackStats/Screens/RealtimeTabView.swift
@@ -2,6 +2,7 @@ import SwiftUI
 
 struct RealtimeTabView: View {
     @Environment(\.context) var context
+    @ScaledMetric private var maxWidth = 720
 
     var body: some View {
         ScrollView {
@@ -16,6 +17,8 @@ struct RealtimeTabView: View {
                 realtimeTopLocations
             }
             .padding(.vertical, Constants.step2)
+            .frame(maxWidth: maxWidth, alignment: .center)
+            .frame(maxWidth: maxWidth)
         }
     }
 
diff --git a/Modules/Sources/JetpackStats/Screens/StatsMainView.swift b/Modules/Sources/JetpackStats/Screens/StatsMainView.swift
index b205cddf1464..b43ff0e7b043 100644
--- a/Modules/Sources/JetpackStats/Screens/StatsMainView.swift
+++ b/Modules/Sources/JetpackStats/Screens/StatsMainView.swift
@@ -12,8 +12,9 @@ public struct StatsMainView: View {
     public init(context: StatsContext, router: StatsRouter) {
         self.context = context
         self.router = router
-        let defaultDateRange = context.calendar.makeDateRange(for: .today)
-        self._viewModel = StateObject(wrappedValue: StatsViewModel(context: context, initialDateRange: defaultDateRange))
+
+        let viewModel = StatsViewModel(context: context)
+        self._viewModel = StateObject(wrappedValue: viewModel)
     }
 
     public var body: some View {
diff --git a/Modules/Sources/JetpackStats/Screens/TrafficTabView.swift b/Modules/Sources/JetpackStats/Screens/TrafficTabView.swift
index 76cb744bd925..a49e11cdb16b 100644
--- a/Modules/Sources/JetpackStats/Screens/TrafficTabView.swift
+++ b/Modules/Sources/JetpackStats/Screens/TrafficTabView.swift
@@ -6,6 +6,8 @@ struct TrafficTabView: View {
     @State private var isShowingCustomRangePicker = false
     @State private var isShowingAddCardSheet = false
 
+    @ScaledMetric private var maxWidth = 720
+
     @Environment(\.context) var context
 
     init(viewModel: StatsViewModel) {
@@ -28,6 +30,8 @@ struct TrafficTabView: View {
                     timeZoneInfo
                 }
                 .padding(.vertical, Constants.step2)
+                .frame(maxWidth: maxWidth, alignment: .center)
+                .frame(maxWidth: .infinity)
                 .onReceive(viewModel.scrollToCardSubject) { cardID in
                     // Use a more elegant spring animation for scrolling
                     withAnimation(.spring) {
@@ -149,9 +153,7 @@ struct TrafficTabView: View {
 
 #Preview {
     NavigationView {
-        TrafficTabView(
-            viewModel: StatsViewModel(context: .demo, initialDateRange: Calendar.demo.makeDateRange(for: .today))
-        )
+        TrafficTabView(viewModel: StatsViewModel(context: .demo))
     }
     .environment(\.context, .demo)
     .environment(\.router, StatsRouter(viewController: UINavigationController(), factory: MockStatsRouterScreenFactory()))
diff --git a/Modules/Sources/JetpackStats/Services/CSVExporter.swift b/Modules/Sources/JetpackStats/Services/CSVExporter.swift
index 77442feb7f36..1ee61f0caf9a 100644
--- a/Modules/Sources/JetpackStats/Services/CSVExporter.swift
+++ b/Modules/Sources/JetpackStats/Services/CSVExporter.swift
@@ -8,10 +8,10 @@ protocol CSVExporterProtocol {
 /// Exports stats data to CSV format following RFC 4180 standard
 struct CSVExporter: CSVExporterProtocol {
     // RFC 4180: Use CRLF for line endings
-    private static let lineEnding = "\r\n"
+    static let lineEnding = "\r\n"
 
     // Characters that require field escaping according to RFC 4180
-    private static let charactersRequiringEscape = CharacterSet(charactersIn: ",\"\r\n")
+    static let charactersRequiringEscape = CharacterSet(charactersIn: ",\"\r\n")
 
     func generateCSV(from items: [any TopListItemProtocol], metric: SiteMetric) -> String {
         guard !items.isEmpty else { return "" }
@@ -28,21 +28,21 @@ struct CSVExporter: CSVExporterProtocol {
 
         // Build header row
         let headers = exportableType.csvHeaders + [metric.localizedTitle]
-        csvLines.append(buildCSVRow(from: headers))
+        csvLines.append(Self.buildCSVRow(from: headers))
 
         // Build data rows
         for item in items {
             guard let exportableItem = item as? CSVExportable else { continue }
 
             let values = exportableItem.csvValues + [formatMetricValue(item.metrics[metric])]
-            csvLines.append(buildCSVRow(from: values))
+            csvLines.append(Self.buildCSVRow(from: values))
         }
 
         return csvLines.joined(separator: Self.lineEnding)
     }
 
     /// Builds a CSV row from an array of values, properly escaping fields as needed
-    private func buildCSVRow(from values: [String]) -> String {
+    static func buildCSVRow(from values: [String]) -> String {
         values
             .map { escapeCSVField($0) }
             .joined(separator: ",")
@@ -56,9 +56,9 @@ struct CSVExporter: CSVExporterProtocol {
     /// Escapes a CSV field according to RFC 4180 rules:
     /// - Fields containing comma, quotes, CR, or LF must be enclosed in double quotes
     /// - Double quotes within fields must be escaped by doubling them
-    private func escapeCSVField(_ field: String) -> String {
+    static func escapeCSVField(_ field: String) -> String {
         // Quick check if escaping is needed
-        guard field.rangeOfCharacter(from: Self.charactersRequiringEscape) != nil else {
+        guard field.rangeOfCharacter(from: charactersRequiringEscape) != nil else {
             return field
         }
 
@@ -93,3 +93,51 @@ struct CSVDataRepresentation: Transferable {
         return data
     }
 }
+
+struct ChartDataCSVRepresentation: Transferable {
+    let data: ChartData
+    let dateRange: StatsDateRange
+    let context: StatsContext
+
+    static var transferRepresentation: some TransferRepresentation {
+        let dataRepresentation = DataRepresentation(exportedContentType: .commaSeparatedText) { (representation: ChartDataCSVRepresentation) in
+            try representation.generateCSVData()
+        }
+        if #available(iOS 17.0, *) {
+            return dataRepresentation.suggestedFileName { representation in
+                let dateString = representation.context.formatters.dateRange.string(from: representation.dateRange.dateInterval)
+                    .replacingOccurrences(of: "/", with: "-")
+                    .replacingOccurrences(of: ",", with: "")
+                return "\(representation.data.metric.localizedTitle)-\(dateString).csv"
+            }
+        } else {
+            return dataRepresentation
+        }
+    }
+
+    private func generateCSVData() throws -> Data {
+        let csvContent = generateCSV()
+        guard let data = csvContent.data(using: .utf8) else {
+            throw CocoaError(.fileWriteUnknown)
+        }
+        return data
+    }
+
+    private func generateCSV() -> String {
+        let formatter = StatsValueFormatter(metric: data.metric)
+        var csvLines = [String]()
+
+        // Header row
+        let headers = [Strings.CSVExport.date, data.metric.localizedTitle]
+        csvLines.append(CSVExporter.buildCSVRow(from: headers))
+
+        // Data rows
+        for point in data.currentData {
+            let dateString = context.formatters.date.formatDate(point.date, granularity: data.granularity)
+            let valueString = formatter.format(value: point.value)
+            csvLines.append(CSVExporter.buildCSVRow(from: [dateString, valueString]))
+        }
+
+        return csvLines.joined(separator: CSVExporter.lineEnding)
+    }
+}
diff --git a/Modules/Sources/JetpackStats/Services/Data/TopListItemType.swift b/Modules/Sources/JetpackStats/Services/Data/TopListItemType.swift
index e58c3c351ccd..8ea79d0d56ce 100644
--- a/Modules/Sources/JetpackStats/Services/Data/TopListItemType.swift
+++ b/Modules/Sources/JetpackStats/Services/Data/TopListItemType.swift
@@ -5,10 +5,10 @@ enum TopListItemType: String, Identifiable, CaseIterable, Sendable, Codable {
     case authors
     case referrers
     case locations
+    case videos
     case externalLinks
-    case fileDownloads
     case searchTerms
-    case videos
+    case fileDownloads
     case archive
 
     var id: TopListItemType { self }
@@ -55,7 +55,7 @@ enum TopListItemType: String, Identifiable, CaseIterable, Sendable, Codable {
     }
 
     static let secondaryItems: Set<TopListItemType> = [
-        .externalLinks, .fileDownloads, .searchTerms, .videos, .archive
+        .externalLinks, .fileDownloads, .searchTerms, .archive
     ]
 
     var documentationURL: URL? {
diff --git a/Modules/Sources/JetpackStats/Services/Mocks/MockStatsService.swift b/Modules/Sources/JetpackStats/Services/Mocks/MockStatsService.swift
index d125cf3ca581..b05bf1e9b90f 100644
--- a/Modules/Sources/JetpackStats/Services/Mocks/MockStatsService.swift
+++ b/Modules/Sources/JetpackStats/Services/Mocks/MockStatsService.swift
@@ -7,7 +7,9 @@ actor MockStatsService: ObservableObject, StatsServiceProtocol {
     private var dailyTopListData: [TopListItemType: [Date: [any TopListItemProtocol]]] = [:]
     private let calendar: Calendar
 
-    let supportedMetrics = SiteMetric.allCases.filter { $0 != .downloads }
+    let supportedMetrics = SiteMetric.allCases.filter {
+        $0 != .downloads && $0 != .bounceRate && $0 != .timeOnSite
+    }
     let supportedItems = TopListItemType.allCases
 
     nonisolated func getSupportedMetrics(for item: TopListItemType) -> [SiteMetric] {
diff --git a/Modules/Sources/JetpackStats/Services/StatsService.swift b/Modules/Sources/JetpackStats/Services/StatsService.swift
index deb5228d44f3..429508fe15f2 100644
--- a/Modules/Sources/JetpackStats/Services/StatsService.swift
+++ b/Modules/Sources/JetpackStats/Services/StatsService.swift
@@ -16,7 +16,8 @@ actor StatsService: StatsServiceProtocol {
     private var mocks: MockStatsService
 
     // Cache
-    private var siteStatsCache: [SiteStatsCacheKey: CachedSiteStats] = [:]
+    private var siteStatsCache: [SiteStatsCacheKey: CachedEntity<SiteMetricsResponse>] = [:]
+    private var topListCache: [TopListCacheKey: CachedEntity<TopListResponse>] = [:]
     private let currentPeriodTTL: TimeInterval = 30 // 30 seconds for current period
 
     let supportedMetrics: [SiteMetric] = [
@@ -71,7 +72,7 @@ actor StatsService: StatsServiceProtocol {
         // Historical data never expires (ttl = nil), current period data expires after 30 seconds
         let ttl = intervalContainsCurrentDate(interval) ? currentPeriodTTL : nil
 
-        siteStatsCache[cacheKey] = CachedSiteStats(data: data, timestamp: Date(), ttl: ttl)
+        siteStatsCache[cacheKey] = CachedEntity(data: data, timestamp: Date(), ttl: ttl)
 
         return data
     }
@@ -97,8 +98,22 @@ actor StatsService: StatsServiceProtocol {
     }
 
     func getTopListData(_ item: TopListItemType, metric: SiteMetric, interval: DateInterval, granularity: DateRangeGranularity, limit: Int?) async throws -> TopListResponse {
+        // Check cache first
+        let cacheKey = TopListCacheKey(item: item, metric: metric, interval: interval, granularity: granularity, limit: limit)
+        if let cached = topListCache[cacheKey], !cached.isExpired {
+            return cached.data
+        }
+
+        // Fetch fresh data
         do {
-            return try await _getTopListData(item, metric: metric, interval: interval, granularity: granularity, limit: limit)
+            let data = try await _getTopListData(item, metric: metric, interval: interval, granularity: granularity, limit: limit)
+
+            // Cache the result
+            // Historical data never expires (ttl = nil), current period data expires after 30 seconds
+            let ttl = intervalContainsCurrentDate(interval) ? currentPeriodTTL : nil
+            topListCache[cacheKey] = CachedEntity(data: data, timestamp: Date(), ttl: ttl)
+
+            return data
         } catch {
             // A workaround for an issue where `/stats` return `"summary": null`
             // when there are no recoreded periods (happens when the entire requested
@@ -294,9 +309,10 @@ actor StatsService: StatsServiceProtocol {
         calendar.timeZone = siteTimeZone
         let now = Date()
         let startOfToday = calendar.startOfDay(for: now)
-        let endOfToday = calendar.date(byAdding: .day, value: 1, to: startOfToday)!.addingTimeInterval(-1)
-
-        return interval.start <= endOfToday && interval.end >= startOfToday
+        guard let endOfToday = calendar.date(byAdding: .day, value: 1, to: startOfToday) else {
+            return false
+        }
+        return interval.end >= startOfToday && interval.start < endOfToday
     }
 
     /// Convert from the site timezone (used in JetpackState) to the local
@@ -378,8 +394,8 @@ private struct SiteStatsCacheKey: Hashable {
     let granularity: DateRangeGranularity
 }
 
-private struct CachedSiteStats {
-    let data: SiteMetricsResponse
+private struct CachedEntity<T> {
+    let data: T
     let timestamp: Date
     let ttl: TimeInterval?
 
@@ -391,6 +407,14 @@ private struct CachedSiteStats {
     }
 }
 
+private struct TopListCacheKey: Hashable {
+    let item: TopListItemType
+    let metric: SiteMetric
+    let interval: DateInterval
+    let granularity: DateRangeGranularity
+    let limit: Int?
+}
+
 // MARK: - Mapping
 
 private extension WordPressKit.StatsPeriodUnit {
diff --git a/Modules/Sources/JetpackStats/StatsRouter.swift b/Modules/Sources/JetpackStats/StatsRouter.swift
index b1ab126f4760..bc17ce16679c 100644
--- a/Modules/Sources/JetpackStats/StatsRouter.swift
+++ b/Modules/Sources/JetpackStats/StatsRouter.swift
@@ -37,8 +37,12 @@ public final class StatsRouter: @unchecked Sendable {
     }
 
     @MainActor
-    func navigate<Content: View>(to view: Content) {
+    func navigate<Content: View>(to view: Content, title: String? = nil) {
         let viewController = UIHostingController(rootView: view)
+        if let title {
+            // This ensures that it gets rendered instantly on navigation
+            viewController.title = title
+        }
         navigationController?.pushViewController(viewController, animated: true)
     }
 
diff --git a/Modules/Sources/JetpackStats/StatsViewModel.swift b/Modules/Sources/JetpackStats/StatsViewModel.swift
index febb5900029c..4ea2b2120260 100644
--- a/Modules/Sources/JetpackStats/StatsViewModel.swift
+++ b/Modules/Sources/JetpackStats/StatsViewModel.swift
@@ -7,6 +7,7 @@ final class StatsViewModel: ObservableObject, CardConfigurationDelegate {
     @Published var dateRange: StatsDateRange {
         didSet {
             updateViewModelsDateRange()
+            saveSelectedDateRangePreset()
         }
     }
     @Published private(set) var cards: [any TrafficCardViewModel] = []
@@ -14,13 +15,22 @@ final class StatsViewModel: ObservableObject, CardConfigurationDelegate {
     let scrollToCardSubject = PassthroughSubject<UUID, Never>()
 
     let context: StatsContext
+
     private let userDefaults: UserDefaults
     private let configurationKey = "JetpackStatsTrafficConfiguration"
+    private let dateRangePresetKey = "JetpackStatsSelectedDateRangePreset"
 
-    init(context: StatsContext, initialDateRange: StatsDateRange, userDefaults: UserDefaults = .standard) {
+    init(context: StatsContext, userDefaults: UserDefaults = .standard) {
         self.context = context
-        self.dateRange = initialDateRange
         self.userDefaults = userDefaults
+
+        // Try to load the saved preset, otherwise use the initial date range
+        if let savedPreset = Self.loadDateRangePreset(from: userDefaults, key: dateRangePresetKey) {
+            self.dateRange = context.calendar.makeDateRange(for: savedPreset)
+        } else {
+            self.dateRange = context.calendar.makeDateRange(for: .last7Days)
+        }
+
         self.trafficCardConfiguration = Self.loadConfiguration(
             from: userDefaults,
             key: configurationKey,
@@ -194,8 +204,40 @@ final class StatsViewModel: ObservableObject, CardConfigurationDelegate {
 
         // Scroll to the moved card after a short delay
         Task {
-            try? await Task.sleep(for: .milliseconds(300))
+            try? await Task.sleep(for: .milliseconds(250))
             scrollToCardSubject.send(card.id)
         }
     }
+
+    // MARK: - Date Range Persistence
+
+    private func saveSelectedDateRangePreset() {
+        if let preset = dateRange.preset {
+            userDefaults.set(preset.rawValue, forKey: dateRangePresetKey)
+        } else {
+            userDefaults.removeObject(forKey: dateRangePresetKey)
+        }
+    }
+
+    private static func loadDateRangePreset(from userDefaults: UserDefaults, key: String) -> DateIntervalPreset? {
+        guard let rawValue = userDefaults.string(forKey: key),
+              let preset = DateIntervalPreset(rawValue: rawValue) else {
+            return nil
+        }
+        return preset
+    }
+
+    // MARK: - Reset Settings
+
+    /// Resets all persistently stored settings including card configuration and date range preset
+    func resetAllSettings() {
+        // Reset card configuration
+        resetToDefault()
+
+        // Reset date range preset
+        userDefaults.removeObject(forKey: dateRangePresetKey)
+
+        // Reset date range to default
+        dateRange = context.calendar.makeDateRange(for: .last7Days)
+    }
 }
diff --git a/Modules/Sources/JetpackStats/Strings.swift b/Modules/Sources/JetpackStats/Strings.swift
index d214d91bf554..839c916ef616 100644
--- a/Modules/Sources/JetpackStats/Strings.swift
+++ b/Modules/Sources/JetpackStats/Strings.swift
@@ -224,4 +224,14 @@ enum Strings {
         static let selectMetric = AppLocalizedString("jetpackStats.addChart.selectMetric", value: "Select Metrics", comment: "Title for metric selection")
         static let selectDataType = AppLocalizedString("jetpackStats.addChart.selectDataType", value: "Select Data Type", comment: "Title for data type selection")
     }
+
+    enum ChartData {
+        static let title = AppLocalizedString("jetpackStats.chartData.title", value: "Chart Data", comment: "Title for chart data screen")
+        static let total = AppLocalizedString("jetpackStats.chartData.total", value: "Total", comment: "Label for total value")
+        static let previous = AppLocalizedString("jetpackStats.chartData.previous", value: "Previous", comment: "Label for previous value")
+        static let change = AppLocalizedString("jetpackStats.chartData.change", value: "Change", comment: "Label for change value")
+        static let detailedData = AppLocalizedString("jetpackStats.chartData.detailedData", value: "Detailed Data", comment: "Section title for detailed data")
+        static let date = AppLocalizedString("jetpackStats.chartData.date", value: "DATE", comment: "Column header for date")
+        static let value = AppLocalizedString("jetpackStats.chartData.value", value: "VALUE", comment: "Column header for value")
+    }
 }
diff --git a/Modules/Sources/JetpackStats/Utilities/Modifiers/CardModifier.swift b/Modules/Sources/JetpackStats/Utilities/Modifiers/CardModifier.swift
index ac772b6b38a3..2b77573d781c 100644
--- a/Modules/Sources/JetpackStats/Utilities/Modifiers/CardModifier.swift
+++ b/Modules/Sources/JetpackStats/Utilities/Modifiers/CardModifier.swift
@@ -1,6 +1,8 @@
 import SwiftUI
 
 struct CardModifier: ViewModifier {
+    @Environment(\.horizontalSizeClass) var horizontalSizeClass
+
     func body(content: Content) -> some View {
         content
             .background(Constants.Colors.secondaryBackground)
@@ -9,7 +11,7 @@ struct CardModifier: ViewModifier {
                     .stroke(Color(.opaqueSeparator), lineWidth: 0.5)
             )
             .clipShape(RoundedRectangle(cornerRadius: 26))
-            .padding(.horizontal, Constants.step1)
+            .padding(.horizontal, horizontalSizeClass == .regular ? Constants.step3 : Constants.step1)
     }
 }
 
diff --git a/Modules/Sources/JetpackStats/Utilities/StatsDateRange.swift b/Modules/Sources/JetpackStats/Utilities/StatsDateRange.swift
index b8aeca766f46..372f050914d5 100644
--- a/Modules/Sources/JetpackStats/Utilities/StatsDateRange.swift
+++ b/Modules/Sources/JetpackStats/Utilities/StatsDateRange.swift
@@ -18,16 +18,21 @@ struct StatsDateRange: Equatable, Sendable {
     /// The calendar used for date calculations.
     let calendar: Calendar
 
+    /// The preset that was used to create this date range, if any.
+    var preset: DateIntervalPreset?
+
     init(
         interval: DateInterval,
         component: Calendar.Component,
         comparison: DateRangeComparisonPeriod = .precedingPeriod,
-        calendar: Calendar
+        calendar: Calendar,
+        preset: DateIntervalPreset? = nil
     ) {
         self.dateInterval = interval
         self.comparison = comparison
         self.component = component
         self.calendar = calendar
+        self.preset = preset
         self.effectiveComparisonInterval = interval
         self.refreshEffectiveComparisonPeriodInterval()
     }
@@ -35,6 +40,7 @@ struct StatsDateRange: Equatable, Sendable {
     mutating func update(preset: DateIntervalPreset) {
         dateInterval = calendar.makeDateInterval(for: preset)
         component = preset.component
+        self.preset = preset
         refreshEffectiveComparisonPeriodInterval()
     }
 
@@ -53,7 +59,8 @@ struct StatsDateRange: Equatable, Sendable {
     func navigate(_ direction: Calendar.NavigationDirection) -> StatsDateRange {
         // Use the component if available, otherwise determine it from the interval
         let newInterval = calendar.navigate(dateInterval, direction: direction, component: component)
-        return StatsDateRange(interval: newInterval, component: component, comparison: comparison, calendar: calendar)
+        // When navigating, we lose the preset since it's no longer a standard preset
+        return StatsDateRange(interval: newInterval, component: component, comparison: comparison, calendar: calendar, preset: nil)
     }
 
     /// Returns true if can navigate in the specified direction.
@@ -99,7 +106,8 @@ extension Calendar {
             interval: makeDateInterval(for: preset),
             component: preset.component,
             comparison: comparison,
-            calendar: self
+            calendar: self,
+            preset: preset
         )
     }
 }
diff --git a/Modules/Sources/JetpackStats/Views/AvatarView.swift b/Modules/Sources/JetpackStats/Views/AvatarView.swift
index 279c5ab1e1eb..0335e418aea5 100644
--- a/Modules/Sources/JetpackStats/Views/AvatarView.swift
+++ b/Modules/Sources/JetpackStats/Views/AvatarView.swift
@@ -19,7 +19,7 @@ struct AvatarView: View {
                         .resizable()
                         .aspectRatio(contentMode: .fill)
                 } placeholder: {
-                    placeholderView
+                    Constants.Colors.background
                 }
                 .frame(width: size, height: size)
                 .clipShape(Circle())
diff --git a/Modules/Sources/JetpackStats/Views/CountryMap/InteractiveMapView.swift b/Modules/Sources/JetpackStats/Views/CountryMap/InteractiveMapView.swift
index 37647f812650..4c91091b4ae1 100644
--- a/Modules/Sources/JetpackStats/Views/CountryMap/InteractiveMapView.swift
+++ b/Modules/Sources/JetpackStats/Views/CountryMap/InteractiveMapView.swift
@@ -50,16 +50,16 @@ struct InteractiveMapView: View {
                     tintColor.lightened(by: 0.75),
                     tintColor
                 ],
-                strokeColor: UIColor(white: 0.85, alpha: 1),
-                fillColor: UIColor(white: 0.96, alpha: 1)
+                strokeColor: UIColor(white: 0.8, alpha: 1),
+                fillColor: UIColor(white: 0.94, alpha: 1)
             )
             self.darkStyle = MapStyle(
                 colorAxis: [
                     tintColor.lightened(by: 0.7),
                     tintColor
                 ],
-                strokeColor: UIColor(white: 0.33, alpha: 1),
-                fillColor: UIColor(white: 0.13, alpha: 1)
+                strokeColor: UIColor(white: 0.36, alpha: 1),
+                fillColor: UIColor(white: 0.19, alpha: 1)
             )
         }
     }
diff --git a/Modules/Sources/JetpackStats/Views/LegacyFloatingDateControl.swift b/Modules/Sources/JetpackStats/Views/LegacyFloatingDateControl.swift
index cc1db9d53323..c4f6ed1c56a5 100644
--- a/Modules/Sources/JetpackStats/Views/LegacyFloatingDateControl.swift
+++ b/Modules/Sources/JetpackStats/Views/LegacyFloatingDateControl.swift
@@ -43,7 +43,10 @@ struct LegacyFloatingDateControl: View {
 
     private var dateRangeButton: some View {
         Menu {
-            StatsDateRangePickerMenu(selection: $dateRange, isShowingCustomRangePicker: $isShowingCustomRangePicker)
+            StatsDateRangePickerMenu(
+                selection: $dateRange,
+                isShowingCustomRangePicker: $isShowingCustomRangePicker
+            )
         } label: {
             dateRangeButtonContent
                 .contentShape(Rectangle())
diff --git a/Modules/Sources/JetpackStats/Views/MetricsOverviewTabView.swift b/Modules/Sources/JetpackStats/Views/MetricsOverviewTabView.swift
index c6563efc78e7..d8e90c9a7609 100644
--- a/Modules/Sources/JetpackStats/Views/MetricsOverviewTabView.swift
+++ b/Modules/Sources/JetpackStats/Views/MetricsOverviewTabView.swift
@@ -16,6 +16,7 @@ struct MetricsOverviewTabView: View {
     @Binding var selectedMetric: SiteMetric
 
     @ScaledMetric(relativeTo: .title) private var minTabWidth: CGFloat = 96
+    @Environment(\.horizontalSizeClass) var horizontalSizeClass
 
     var body: some View {
         ScrollViewReader { proxy in
@@ -33,7 +34,7 @@ struct MetricsOverviewTabView: View {
 
     private func makeItemView(for item: MetricData, onTap: @escaping () -> Void) -> some View {
         MetricItemView(data: item, isSelected: selectedMetric == item.metric, onTap: onTap)
-            .frame(minWidth: minTabWidth)
+            .frame(minWidth: minTabWidth + (horizontalSizeClass == .compact ? 0 : 8))
             .id(item.metric)
     }
 
diff --git a/Modules/Sources/JetpackStats/Views/TopList/TopListItemBarBackground.swift b/Modules/Sources/JetpackStats/Views/TopList/TopListItemBarBackground.swift
index 36dfd47421df..6d709826a4c5 100644
--- a/Modules/Sources/JetpackStats/Views/TopList/TopListItemBarBackground.swift
+++ b/Modules/Sources/JetpackStats/Views/TopList/TopListItemBarBackground.swift
@@ -12,8 +12,8 @@ struct TopListItemBarBackground: View {
             HStack(spacing: 0) {
                 LinearGradient(
                     colors: [
-                        barColor.opacity(colorScheme == .light ? 0.06 : 0.15),
-                        barColor.opacity(colorScheme == .light ? 0.12 : 0.3),
+                        barColor.opacity(colorScheme == .light ? 0.06 : 0.22),
+                        barColor.opacity(colorScheme == .light ? 0.12 : 0.35),
                     ],
                     startPoint: .leading,
                     endPoint: .trailing
diff --git a/Modules/Sources/JetpackStats/Views/TopList/TopListItemView.swift b/Modules/Sources/JetpackStats/Views/TopList/TopListItemView.swift
index 77e287eb0706..d02050e75a4b 100644
--- a/Modules/Sources/JetpackStats/Views/TopList/TopListItemView.swift
+++ b/Modules/Sources/JetpackStats/Views/TopList/TopListItemView.swift
@@ -132,7 +132,7 @@ private extension TopListItemView {
             let detailsView = PostStatsView(post: post, dateRange: dateRange)
                 .environment(\.context, context)
                 .environment(\.router, router)
-            router.navigate(to: detailsView)
+            router.navigate(to: detailsView, title: Strings.PostDetails.title)
         case let archiveItem as TopListItem.ArchiveItem:
             if let url = URL(string: archiveItem.href) {
                 router.openURL(url)
@@ -141,22 +141,22 @@ private extension TopListItemView {
             let detailsView = AuthorStatsView(author: author, initialDateRange: dateRange, context: context)
                 .environment(\.context, context)
                 .environment(\.router, router)
-            router.navigate(to: detailsView)
+            router.navigate(to: detailsView, title: Strings.AuthorDetails.title)
         case let referrer as TopListItem.Referrer:
             let detailsView = ReferrerStatsView(referrer: referrer, dateRange: dateRange)
                 .environment(\.context, context)
                 .environment(\.router, router)
-            router.navigate(to: detailsView)
+            router.navigate(to: detailsView, title: Strings.ReferrerDetails.title)
         case let archiveSection as TopListItem.ArchiveSection:
             let detailsView = ArchiveStatsView(archiveSection: archiveSection, dateRange: dateRange)
                 .environment(\.context, context)
                 .environment(\.router, router)
-            router.navigate(to: detailsView)
+            router.navigate(to: detailsView, title: archiveSection.displayName)
         case let externalLink as TopListItem.ExternalLink:
             let detailsView = ExternalLinkStatsView(externalLink: externalLink, dateRange: dateRange)
                 .environment(\.context, context)
                 .environment(\.router, router)
-            router.navigate(to: detailsView)
+            router.navigate(to: detailsView, title: Strings.ExternalLinkDetails.title)
         default:
             break
         }
diff --git a/Modules/Sources/JetpackStats/Views/TopList/TopListItemsView.swift b/Modules/Sources/JetpackStats/Views/TopList/TopListItemsView.swift
index 7bbb2c08f6bc..ed7ddb5f95d5 100644
--- a/Modules/Sources/JetpackStats/Views/TopList/TopListItemsView.swift
+++ b/Modules/Sources/JetpackStats/Views/TopList/TopListItemsView.swift
@@ -46,11 +46,15 @@ struct PlaceholderRowView: View {
         Rectangle()
             .fill(Color.clear)
             .background(
-                TopListItemBarBackground(
-                    value: 100,
-                    maxValue: 100,
-                    barColor: .secondary.opacity(0.5)
+                LinearGradient(
+                    colors: [
+                        Color.secondary.opacity(0.08),
+                        Color.secondary.opacity(0.02)
+                    ],
+                    startPoint: .leading,
+                    endPoint: .trailing
                 )
+                .clipShape(RoundedRectangle(cornerRadius: Constants.step1))
             )
             .frame(height: height)
     }