Signed-off-by: Matt Bruce <mbrucedogs@gmail.com>

Andromida/App/Views/History/HistoryMonthView.swift

@@ -72,6 +72,16 @@ struct HistoryMonthView: View {
         .padding(Design.Spacing.medium)
         .background(AppSurface.card)
         .clipShape(.rect(cornerRadius: Design.CornerRadius.large))
+        .overlay(
+            RoundedRectangle(cornerRadius: Design.CornerRadius.large)
+                .stroke(AppBorder.subtle.opacity(Design.Opacity.light), lineWidth: 1)
+        )
+        .shadow(
+            color: AppBorder.subtle.opacity(Design.Opacity.light),
+            radius: AppMetrics.Shadow.radiusSmall,
+            x: AppMetrics.Shadow.xOffsetNone,
+            y: AppMetrics.Shadow.yOffsetSmall
+        )
     }
     
     private var weekdayHeader: some View {

Andromida/App/Views/History/HistoryView.swift

@@ -23,6 +23,7 @@ struct HistoryView: View {
     @State private var monthsToShow = 2
     @State private var refreshToken = UUID()
     @State private var cachedProgressByDate: [Date: Double] = [:]
+    @State private var headerMinY: CGFloat = 0
     
     private let calendar = Calendar.current
     private let baseMonthsToShow = 2
@@ -43,6 +44,29 @@ struct HistoryView: View {
         )
     }
     
+    private let headerMaxHeight: CGFloat = 84
+    private let headerMinHeight: CGFloat = 58
+
+    private var headerHeight: CGFloat {
+        let collapseDistance = headerMaxHeight - headerMinHeight
+        let collapseAmount = min(max(-headerMinY, 0), collapseDistance)
+        return headerMaxHeight - collapseAmount
+    }
+    
+    private var headerScale: CGFloat {
+        let collapseDistance = headerMaxHeight - headerMinHeight
+        guard collapseDistance > 0 else { return 1 }
+        let progress = min(max(-headerMinY / collapseDistance, 0), 1)
+        return 1 - (0.08 * progress)
+    }
+    
+    private var headerOpacity: Double {
+        let collapseDistance = headerMaxHeight - headerMinHeight
+        guard collapseDistance > 0 else { return 1 }
+        let progress = min(max(-headerMinY / collapseDistance, 0), 1)
+        return 1 - (0.25 * progress)
+    }
+    
     /// Generate months based on expanded state
     /// - Collapsed: Last month + current month (2 months)
     /// - Expanded: Up to 12 months of history
@@ -82,10 +106,23 @@ struct HistoryView: View {
     
     var body: some View {
         ScrollView(.vertical, showsIndicators: false) {
-            VStack(alignment: .leading, spacing: Design.Spacing.large) {
+            LazyVStack(alignment: .leading, spacing: Design.Spacing.large, pinnedViews: [.sectionHeaders]) {
-                // Header with Show More/Less button
+                Section(
-                headerSection
+                    header: headerSection
-                
+                        .padding(.top, Design.Spacing.large)
+                        .padding(.bottom, Design.Spacing.small)
+                        .frame(maxWidth: .infinity, alignment: .leading)
+                        .frame(height: headerHeight, alignment: .bottom)
+                        .scaleEffect(headerScale, anchor: .leading)
+                        .opacity(headerOpacity)
+                        .background(
+                            GeometryReader { proxy in
+                                Color.clear
+                                    .preference(key: HistoryHeaderMinYKey.self, value: proxy.frame(in: .named("historyScroll")).minY)
+                            }
+                        )
+                        .background(AppSurface.primary.opacity(0.9))
+                ) {
                     // Ritual filter picker
                     ritualPicker
                     
@@ -108,8 +145,12 @@ struct HistoryView: View {
                     }
                     .id(refreshToken)
                 }
-            .padding(Design.Spacing.large)
             }
+            .padding(.horizontal, Design.Spacing.large)
+            .padding(.bottom, Design.Spacing.large)
+        }
+        .coordinateSpace(name: "historyScroll")
+        .onPreferenceChange(HistoryHeaderMinYKey.self) { headerMinY = $0 }
         .background(LinearGradient(
             colors: [AppSurface.primary, AppSurface.secondary],
             startPoint: .topLeading,
@@ -247,6 +288,14 @@ struct HistoryView: View {
     }
 }
 
+private struct HistoryHeaderMinYKey: PreferenceKey {
+    static var defaultValue: CGFloat = 0
+
+    static func reduce(value: inout CGFloat, nextValue: () -> CGFloat) {
+        value = nextValue()
+    }
+}
+
 #Preview {
     HistoryView(store: RitualStore.preview)
 }

Andromida/App/Views/Today/Components/TodayRitualSectionView.swift

@@ -21,16 +21,14 @@ struct TodayRitualSectionView: View {
 
     var body: some View {
         VStack(alignment: .leading, spacing: Bedrock.Design.Spacing.large) {
-            // Section header with time indicator
+            focusCard
+
+            VStack(alignment: .leading, spacing: Bedrock.Design.Spacing.large) {
                 HStack {
-                VStack(alignment: .leading, spacing: Bedrock.Design.Spacing.xSmall) {
+                    SectionHeaderView(
-                    Text(focusTitle)
+                        title: String(localized: "Habits"),
-                        .font(.headline)
+                        subtitle: String(localized: "Tap to check in")
-                        .foregroundStyle(AppTextColors.primary)
+                    )
-                    Text(focusTheme)
-                        .font(.subheadline)
-                        .foregroundStyle(AppTextColors.secondary)
-                }
 
                     Spacer()
 
@@ -40,15 +38,23 @@ struct TodayRitualSectionView: View {
                         .accessibilityLabel(timeOfDay.displayName)
                 }
 
-            focusCard
-
-            SectionHeaderView(
-                title: String(localized: "Habits"),
-                subtitle: String(localized: "Tap to check in")
-            )
-
                 habitsList
             }
+            .padding(.horizontal, Bedrock.Design.Spacing.large)
+            .padding(.bottom, Bedrock.Design.Spacing.large)
+        }
+        .background(AppSurface.card)
+        .clipShape(.rect(cornerRadius: Design.CornerRadius.large))
+        .overlay(
+            RoundedRectangle(cornerRadius: Design.CornerRadius.large)
+                .stroke(AppBorder.subtle.opacity(Design.Opacity.light), lineWidth: 1)
+        )
+        .shadow(
+            color: AppBorder.subtle.opacity(Design.Opacity.light),
+            radius: AppMetrics.Shadow.radiusSmall,
+            x: AppMetrics.Shadow.xOffsetNone,
+            y: AppMetrics.Shadow.yOffsetSmall
+        )
     }
 
     private var focusCard: some View {

Andromida/App/Views/Today/TodayView.swift

@@ -5,6 +5,7 @@ struct TodayView: View {
     @Bindable var store: RitualStore
     @Bindable var categoryStore: CategoryStore
     @Environment(\.horizontalSizeClass) private var horizontalSizeClass
+    @State private var headerMinY: CGFloat = 0
     
     /// Rituals to show now based on current time of day
     private var todayRituals: [Ritual] {
@@ -36,11 +37,48 @@ struct TodayView: View {
         )
     }
     
+    private let headerMaxHeight: CGFloat = 76
+    private let headerMinHeight: CGFloat = 52
+
+    private var headerHeight: CGFloat {
+        let collapseDistance = headerMaxHeight - headerMinHeight
+        let collapseAmount = min(max(-headerMinY, 0), collapseDistance)
+        return headerMaxHeight - collapseAmount
+    }
+    
+    private var headerScale: CGFloat {
+        let collapseDistance = headerMaxHeight - headerMinHeight
+        guard collapseDistance > 0 else { return 1 }
+        let progress = min(max(-headerMinY / collapseDistance, 0), 1)
+        return 1 - (0.08 * progress)
+    }
+    
+    private var headerOpacity: Double {
+        let collapseDistance = headerMaxHeight - headerMinHeight
+        guard collapseDistance > 0 else { return 1 }
+        let progress = min(max(-headerMinY / collapseDistance, 0), 1)
+        return 1 - (0.25 * progress)
+    }
+
     var body: some View {
         ScrollView(.vertical, showsIndicators: false) {
-            VStack(alignment: .leading, spacing: Design.Spacing.large) {
+            LazyVStack(alignment: .leading, spacing: Design.Spacing.large, pinnedViews: [.sectionHeaders]) {
-                TodayHeaderView(dateText: store.todayDisplayString)
+                Section(
-
+                    header: TodayHeaderView(dateText: store.todayDisplayString)
+                        .padding(.top, Design.Spacing.large)
+                        .padding(.bottom, Design.Spacing.small)
+                        .frame(maxWidth: .infinity, alignment: .leading)
+                        .frame(height: headerHeight, alignment: .bottom)
+                        .scaleEffect(headerScale, anchor: .leading)
+                        .opacity(headerOpacity)
+                        .background(
+                            GeometryReader { proxy in
+                                Color.clear
+                                    .preference(key: TodayHeaderMinYKey.self, value: proxy.frame(in: .named("todayScroll")).minY)
+                            }
+                        )
+                        .background(AppSurface.primary.opacity(0.9))
+                ) {
                     if todayRituals.isEmpty {
                         if hasRitualsButNotNow {
                             // Has active rituals but none for current time of day
@@ -68,9 +106,13 @@ struct TodayView: View {
                         }
                     }
                 }
-            .padding(Design.Spacing.large)
+            }
+            .padding(.horizontal, Design.Spacing.large)
+            .padding(.bottom, Design.Spacing.large)
             .adaptiveContentWidth()
         }
+        .coordinateSpace(name: "todayScroll")
+        .onPreferenceChange(TodayHeaderMinYKey.self) { headerMinY = $0 }
         .background(LinearGradient(
             colors: [AppSurface.primary, AppSurface.secondary],
             startPoint: .topLeading,
@@ -99,6 +141,14 @@ struct TodayView: View {
     }
 }
 
+private struct TodayHeaderMinYKey: PreferenceKey {
+    static var defaultValue: CGFloat = 0
+
+    static func reduce(value: inout CGFloat, nextValue: () -> CGFloat) {
+        value = nextValue()
+    }
+}
+
 #Preview {
     TodayView(store: RitualStore.preview, categoryStore: CategoryStore.preview)
 }