Make background decorations scale with window size so corner blobs stay aligned when the height changes.

Co-authored-by: Cursor <cursoragent@cursor.com>

gramora/Views/Components/BackgroundDecorations.swift

@@ -1,29 +1,65 @@
 import SwiftUI
 
 struct BackgroundDecorations: View {
+    // Proportions derived from the original 859×720 content-area layout.
+    private enum Layout {
+        static let topRightWaveSize = CGSize(width: 0.489, height: 0.444)
+        static let topRightWaveCenter = CGPoint(x: 0.896, y: 0.222)
+
+        static let bottomLeftWaveSize = CGSize(width: 0.442, height: 0.389)
+        static let bottomLeftWaveCenter = CGPoint(x: 0.081, y: 0.861)
+
+        static let bottomLeftDotsCenter = CGPoint(x: 0.034, y: 0.889)
+        static let topRightDotsCenter = CGPoint(x: 1.012, y: 0.194)
+    }
+
     var body: some View {
-        ZStack {
-            AppTheme.background
+        GeometryReader { geometry in
+            let width = geometry.size.width
+            let height = geometry.size.height
+
+            ZStack {
+                AppTheme.background
 
-            OrganicWave()
-                .fill(AppTheme.blobColor)
-                .frame(width: 420, height: 320)
-                .offset(x: 340, y: -200)
+                OrganicWave()
+                    .fill(AppTheme.blobColor)
+                    .frame(
+                        width: width * Layout.topRightWaveSize.width,
+                        height: height * Layout.topRightWaveSize.height
+                    )
+                    .position(
+                        x: width * Layout.topRightWaveCenter.x,
+                        y: height * Layout.topRightWaveCenter.y
+                    )
 
-            OrganicWave()
-                .fill(AppTheme.blobColor.opacity(0.85))
-                .frame(width: 380, height: 280)
-                .scaleEffect(x: -1, y: 1)
-                .offset(x: -360, y: 260)
+                OrganicWave()
+                    .fill(AppTheme.blobColor.opacity(0.85))
+                    .frame(
+                        width: width * Layout.bottomLeftWaveSize.width,
+                        height: height * Layout.bottomLeftWaveSize.height
+                    )
+                    .scaleEffect(x: -1, y: 1)
+                    .position(
+                        x: width * Layout.bottomLeftWaveCenter.x,
+                        y: height * Layout.bottomLeftWaveCenter.y
+                    )
 
-            DotGrid()
-                .offset(x: -400, y: 280)
-                .opacity(0.55)
+                DotGrid()
+                    .position(
+                        x: width * Layout.bottomLeftDotsCenter.x,
+                        y: height * Layout.bottomLeftDotsCenter.y
+                    )
+                    .opacity(0.55)
 
-            DotGrid()
-                .offset(x: 440, y: -220)
-                .opacity(0.45)
+                DotGrid()
+                    .position(
+                        x: width * Layout.topRightDotsCenter.x,
+                        y: height * Layout.topRightDotsCenter.y
+                    )
+                    .opacity(0.45)
+            }
         }
+        .frame(maxWidth: .infinity, maxHeight: .infinity)
         .ignoresSafeArea()
         .clipped()
     }