1 files changed, 25 insertions, 21 deletions

diff --git a/Map/Presentation/Preferences/StagesPreferencesView.swift b/Map/Presentation/Preferences/StagesPreferencesView.swift
index 7131034..1e57cbf 100644
--- a/Map/Presentation/Preferences/StagesPreferencesView.swift
+++ b/Map/Presentation/Preferences/StagesPreferencesView.swift
@@ -20,21 +20,16 @@ struct StagesPreferencesView: View {
   @State private var customStages: [CustomStage] = []
 
   var body: some View {
-    VStack(alignment: .leading, spacing: 16) {
+    VStack(alignment: .leading, spacing: Dimensions.Spacing.regular) {
       Text("preferences.stages.title")
         .font(.Theme.Title.emphasized)
-        .lineSpacing(Dimensions.FontSize.title - Dimensions.FontSize.title)
+        .lineSpacing(Dimensions.LineHeight.title - Dimensions.FontSize.title)
       Text("preferences.stages.explanation")
-        .font(.Theme.Body.emphasized)
-        .lineSpacing(Dimensions.FontSize.body - Dimensions.FontSize.body)
-
-      HStack {
-        Spacer()
-        Button(action: addStage) {
-          Image(systemName: "plus")
-        }
-        .buttonStyle(.borderless)
-      }
+        .font(.Theme.Body.regular)
+        .kerning(Dimensions.Kerning.body)
+        .lineSpacing(Dimensions.LineHeight.body - Dimensions.FontSize.body)
+        .padding(.top, Dimensions.Spacing.loose)
+        .padding(.bottom, Dimensions.Spacing.regular)
 
       Table(customStages) {
         TableColumn("Name") { customStage in
@@ -47,7 +42,7 @@ struct StagesPreferencesView: View {
               }
             )
           )
-          .textFieldStyle(.roundedBorder)
+          .textFieldStyle(.plain)
         }
         .width(120)
 
@@ -61,7 +56,7 @@ struct StagesPreferencesView: View {
               }
             )
           )
-          .textFieldStyle(.roundedBorder)
+          .textFieldStyle(.plain)
         }
 
         TableColumn("Stage II") { customStage in
@@ -74,7 +69,7 @@ struct StagesPreferencesView: View {
               }
             )
           )
-          .textFieldStyle(.roundedBorder)
+          .textFieldStyle(.plain)
         }
 
         TableColumn("Stage III") { customStage in
@@ -87,7 +82,7 @@ struct StagesPreferencesView: View {
               }
             )
           )
-          .textFieldStyle(.roundedBorder)
+          .textFieldStyle(.plain)
         }
 
         TableColumn("Stage IV") { customStage in
@@ -100,7 +95,7 @@ struct StagesPreferencesView: View {
               }
             )
           )
-          .textFieldStyle(.roundedBorder)
+          .textFieldStyle(.plain)
         }
 
         TableColumn("") { customStage in
@@ -113,9 +108,16 @@ struct StagesPreferencesView: View {
       }
       .tableStyle(.bordered(alternatesRowBackgrounds: true))
 
-      Spacer()
+      HStack {
+        Spacer()
+        Button(action: addStage) {
+          Image(systemName: "plus")
+        }
+        .buttonStyle(.borderless)
+      }
     }
-    .padding()
+    .padding(.vertical, Dimensions.Spacing.loose)
+    .padding(.horizontal, Dimensions.Spacing.indulgent)
     .onAppear {
       loadStages()
     }
@@ -125,7 +127,9 @@ struct StagesPreferencesView: View {
     if let decoded = try? JSONDecoder().decode([CustomStage].self, from: customStagesData) {
       customStages = decoded
     } else {
-      customStages = [CustomStage()]
+      // First use - create default Cynefin stage
+      customStages = [CustomStage.cynefinDefault()]
+      saveStages() // Save the default to UserDefaults
     }
   }
 
@@ -136,7 +140,7 @@ struct StagesPreferencesView: View {
   }
 
   private func addStage() {
-    customStages.append(CustomStage())
+    customStages.append(CustomStage.placeholderDefault())
     saveStages()
   }