Polish Power Mode UI buttons, backgrounds, and links

VoiceInk/PowerMode/PowerModeConfigView.swift

@@ -167,7 +167,7 @@ struct ConfigurationView: View {
                     HStack {
                         Text("Applications")
                         Spacer()
-                        Button("Add…") {
+                        AddIconButton(helpText: "Add application") {
                             loadInstalledApps()
                             isShowingAppPicker = true
                         }
@@ -224,12 +224,9 @@ struct ConfigurationView: View {
                             .textFieldStyle(.roundedBorder)
                             .onSubmit { addWebsite() }
 
-                        Button {
+                        AddIconButton(helpText: "Add website", isDisabled: newWebsiteURL.isEmpty) {
                             addWebsite()
-                        } label: {
-                            Image(systemName: "plus")
                         }
-                        .disabled(newWebsiteURL.isEmpty)
                     }
 
                     if websiteConfigs.isEmpty {
@@ -451,21 +448,19 @@ struct ConfigurationView: View {
             }
         }
         .formStyle(.grouped)
+        .scrollContentBackground(.hidden)
+        .background(Color(NSColor.controlBackgroundColor))
         .navigationTitle(mode.title)
         .toolbar {
-            ToolbarItem(placement: .cancellationAction) {
-                Button("Cancel") {
-                    presentationMode.wrappedValue.dismiss()
-                }
-                .keyboardShortcut(.escape, modifiers: [])
-            }
-
             ToolbarItem(placement: .primaryAction) {
-                Button(mode.isAdding ? "Add" : "Save") {
+                Button("Save") {
                     saveConfiguration()
                 }
                 .keyboardShortcut(.defaultAction)
                 .disabled(!canSave)
+                .buttonStyle(.bordered)
+                .controlSize(.regular)
+                .padding(.horizontal, 4)
             }
 
             if case .edit = mode {
@@ -473,6 +468,9 @@ struct ConfigurationView: View {
                     Button("Delete", role: .destructive) {
                         isShowingDeleteConfirmation = true
                     }
+                    .buttonStyle(.bordered)
+                    .controlSize(.regular)
+                    .padding(.horizontal, 4)
                 }
             }
         }

VoiceInk/PowerMode/PowerModeView.swift

@@ -80,7 +80,7 @@ struct PowerModeView: View {
                                                                  InfoTip(
                                      title: "What is Power Mode?",
                                      message: "Automatically apply custom configurations based on the app/website you are using",
-                                     learnMoreURL: "https://www.youtube.com/@tryvoiceink/videos"
+                                     learnMoreURL: "https://tryvoiceink.com/docs/power-mode"
                                  )
                             }
                             

VoiceInk/PowerMode/PowerModeViewComponents.swift

@@ -69,6 +69,26 @@ struct PowerModeConfigurationsGrid: View {
     }
 }
 
+/// Small, consistent icon-only add button used across Power Mode configuration rows.
+struct AddIconButton: View {
+    let helpText: String
+    var isDisabled: Bool = false
+    let action: () -> Void
+
+    var body: some View {
+        Button(action: action) {
+            Image(systemName: "plus.circle.fill")
+                .font(.system(size: 18))
+                .symbolRenderingMode(.hierarchical)
+                .foregroundStyle(.secondary)
+        }
+        .buttonStyle(.plain)
+        .help(helpText)
+        .accessibilityLabel(helpText)
+        .disabled(isDisabled)
+    }
+}
+
 struct ConfigurationRow: View {
     @Binding var config: PowerModeConfig
     let isEditing: Bool