Updated Logo :')

android/.idea/.name

@@ -0,0 +1 @@
+MagicCounter

android/.idea/misc.xml

@@ -1,4 +1,3 @@
-<?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
   <component name="ExternalStorageConfigurationManager" enabled="true" />
   <component name="ProjectRootManager" version="2" languageLevel="JDK_17" project-jdk-name="jbr-21" project-jdk-type="JavaSDK">

android/.idea/vcs.xml

@@ -2,5 +2,6 @@
 <project version="4">
   <component name="VcsDirectoryMappings">
     <mapping directory="" vcs="Git" />
+    <mapping directory="$PROJECT_DIR$/.." vcs="Git" />
   </component>
 </project>

android/app/build.gradle.kts

@@ -15,8 +15,8 @@ android {
         applicationId = "com.atridad.magiccounter"
         minSdk = 31
         targetSdk = 36
-        versionCode = 3
-        versionName = "1.3.0"
+        versionCode = 5
+        versionName = "1.4.1"
 
         testInstrumentationRunner = "androidx.test.runner.AndroidJUnitRunner"
     }

android/app/src/main/java/com/atridad/magiccounter/ui/MagicCounterApp.kt

@@ -175,6 +175,8 @@ fun MagicCounterApp() {
                             .padding(paddingValues)
                             .fillMaxSize(),
                         state = stateForGame,
+                        matchName = record?.name ?: "Game",
+                        startedAtEpochMs = record?.startedAtEpochMs ?: System.currentTimeMillis(),
                         onProgress = { updated ->
                             val current = historyState.value
                             val idx = current.indexOfFirst { it.id == id }
@@ -392,13 +394,19 @@ private fun HomeScreen(
                                 style = MaterialTheme.typography.bodyLarge,
                                 color = MaterialTheme.colorScheme.onSurfaceVariant
                             )
-                            val status = if (rec.state.stopped) "Stopped" else "Finished"
-                            val winner = rec.winnerPlayerId?.let { " • Winner: Player ${it + 1}" } ?: ""
-                            val statusText = if (winner.isNotEmpty()) "$status$winner" else status
+                            val winnerId = rec.winnerPlayerId ?: rec.state.winnerPlayerId
+                            val winnerName = winnerId?.let { wId ->
+                                rec.state.players.find { it.id == wId }?.name
+                            }
+                            val statusText = when {
+                                winnerName != null -> "Winner: $winnerName"
+                                rec.state.stopped -> "Stopped"
+                                else -> "Finished"
+                            }
                             Text(
                                 statusText,
                                 style = MaterialTheme.typography.bodyMedium,
-                                color = MaterialTheme.colorScheme.onSurfaceVariant.copy(alpha = 0.7f)
+                                color = if (winnerName != null) Color(0xFF2E7D32) else MaterialTheme.colorScheme.onSurfaceVariant.copy(alpha = 0.7f)
                             )
                         }
                         Row(horizontalArrangement = Arrangement.spacedBy(8.dp)) {
@@ -483,5 +491,3 @@ private fun GameDuration(
         color = color.copy(alpha = 0.8f)
     )
 }
-
-

android/app/src/main/java/com/atridad/magiccounter/ui/state/GameState.kt

@@ -21,9 +21,8 @@ data class GameState(
     val startingLife: Int,
     val trackPoison: Boolean,
     val trackCommanderDamage: Boolean,
-    val stopped: Boolean = false
+    val stopped: Boolean = false,
+    val winnerPlayerId: Int? = null
 )
 
 fun defaultPlayerName(index: Int): String = "Player ${index + 1}"
-
-

android/app/src/main/java/com/atridad/magiccounter/ui/theme/CustomIcons.kt

@@ -201,6 +201,25 @@ object CustomIcons {
         close()
     }.build()
 
+    fun Droplet(color: Color = Color.Black): ImageVector = ImageVector.Builder(
+        name = "Droplet",
+        defaultWidth = 24.dp,
+        defaultHeight = 24.dp,
+        viewportWidth = 24f,
+        viewportHeight = 24f
+    ).path(
+        fill = SolidColor(color)
+    ) {
+        moveTo(12f, 2.69f)
+        lineTo(17.66f, 8.35f)
+        curveTo(19.1f, 9.79f, 20f, 11.79f, 20f, 14f)
+        curveTo(20f, 18.42f, 16.42f, 22f, 12f, 22f)
+        curveTo(7.58f, 22f, 4f, 18.42f, 4f, 14f)
+        curveTo(4f, 11.79f, 4.9f, 9.79f, 6.34f, 8.35f)
+        lineTo(12f, 2.69f)
+        close()
+    }.build()
+
     fun Sword(color: Color = Color.Black): ImageVector = ImageVector.Builder(
         name = "Sword",
         defaultWidth = 24.dp,

android/gradle/libs.versions.toml

@@ -1,23 +1,23 @@
 [versions]
 agp = "8.12.3"
-kotlin = "2.0.21"
-coreKtx = "1.10.1"
+kotlin = "2.3.0"
+coreKtx = "1.17.0"
 junit = "4.13.2"
-junitVersion = "1.1.5"
-espressoCore = "3.5.1"
-appcompat = "1.6.1"
-material = "1.10.0"
-constraintlayout = "2.1.4"
-lifecycleLivedataKtx = "2.6.1"
-lifecycleViewmodelKtx = "2.6.1"
-navigationFragmentKtx = "2.6.0"
-navigationUiKtx = "2.6.0"
-composeBom = "2024.10.01"
-activityCompose = "1.9.2"
-lifecycleRuntimeCompose = "2.8.6"
-lifecycleViewmodelCompose = "2.8.6"
-datastore = "1.1.1"
-serialization = "1.7.3"
+junitVersion = "1.3.0"
+espressoCore = "3.7.0"
+appcompat = "1.7.1"
+material = "1.13.0"
+constraintlayout = "2.2.1"
+lifecycleLivedataKtx = "2.10.0"
+lifecycleViewmodelKtx = "2.10.0"
+navigationFragmentKtx = "2.9.6"
+navigationUiKtx = "2.9.6"
+composeBom = "2025.12.01"
+activityCompose = "1.12.2"
+lifecycleRuntimeCompose = "2.10.0"
+lifecycleViewmodelCompose = "2.10.0"
+datastore = "1.2.0"
+serialization = "1.9.0"
 
 [libraries]
 androidx-core-ktx = { group = "androidx.core", name = "core-ktx", version.ref = "coreKtx" }

ios/MagicCounter.xcodeproj/project.pbxproj

@@ -411,7 +411,7 @@
 				ASSETCATALOG_COMPILER_GLOBAL_ACCENT_COLOR_NAME = AccentColor;
 				ASSETCATALOG_COMPILER_INCLUDE_ALL_APPICON_ASSETS = NO;
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 4;
+				CURRENT_PROJECT_VERSION = 6;
 				DEVELOPMENT_TEAM = 4BC9Y2LL4B;
 				ENABLE_PREVIEWS = YES;
 				GENERATE_INFOPLIST_FILE = YES;
@@ -420,14 +420,13 @@
 				INFOPLIST_KEY_UIApplicationSceneManifest_Generation = YES;
 				INFOPLIST_KEY_UIApplicationSupportsIndirectInputEvents = YES;
 				INFOPLIST_KEY_UILaunchScreen_Generation = YES;
-				INFOPLIST_KEY_UISupportedInterfaceOrientations_iPad = "UIInterfaceOrientationPortrait UIInterfaceOrientationPortraitUpsideDown UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight";
-				INFOPLIST_KEY_UISupportedInterfaceOrientations_iPhone = "UIInterfaceOrientationPortrait UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight";
+				INFOPLIST_KEY_UISupportedInterfaceOrientations = "UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight UIInterfaceOrientationPortrait UIInterfaceOrientationPortraitUpsideDown";
 				IPHONEOS_DEPLOYMENT_TARGET = 17.6;
 				LD_RUNPATH_SEARCH_PATHS = (
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 1.1.0;
+				MARKETING_VERSION = 1.2.1;
 				PRODUCT_BUNDLE_IDENTIFIER = com.atridad.MagicCounter;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				STRING_CATALOG_GENERATE_SYMBOLS = YES;
@@ -447,7 +446,7 @@
 				ASSETCATALOG_COMPILER_GLOBAL_ACCENT_COLOR_NAME = AccentColor;
 				ASSETCATALOG_COMPILER_INCLUDE_ALL_APPICON_ASSETS = NO;
 				CODE_SIGN_STYLE = Automatic;
-				CURRENT_PROJECT_VERSION = 4;
+				CURRENT_PROJECT_VERSION = 6;
 				DEVELOPMENT_TEAM = 4BC9Y2LL4B;
 				ENABLE_PREVIEWS = YES;
 				GENERATE_INFOPLIST_FILE = YES;
@@ -456,14 +455,13 @@
 				INFOPLIST_KEY_UIApplicationSceneManifest_Generation = YES;
 				INFOPLIST_KEY_UIApplicationSupportsIndirectInputEvents = YES;
 				INFOPLIST_KEY_UILaunchScreen_Generation = YES;
-				INFOPLIST_KEY_UISupportedInterfaceOrientations_iPad = "UIInterfaceOrientationPortrait UIInterfaceOrientationPortraitUpsideDown UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight";
-				INFOPLIST_KEY_UISupportedInterfaceOrientations_iPhone = "UIInterfaceOrientationPortrait UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight";
+				INFOPLIST_KEY_UISupportedInterfaceOrientations = "UIInterfaceOrientationLandscapeLeft UIInterfaceOrientationLandscapeRight UIInterfaceOrientationPortrait UIInterfaceOrientationPortraitUpsideDown";
 				IPHONEOS_DEPLOYMENT_TARGET = 17.6;
 				LD_RUNPATH_SEARCH_PATHS = (
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
-				MARKETING_VERSION = 1.1.0;
+				MARKETING_VERSION = 1.2.1;
 				PRODUCT_BUNDLE_IDENTIFIER = com.atridad.MagicCounter;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				STRING_CATALOG_GENERATE_SYMBOLS = YES;

ios/MagicCounter/Components.swift

@@ -6,46 +6,126 @@
 //
 
 import SwiftUI
+import Combine
 
 /**
  * A circular button with an icon, used for game controls.
+ * Supports optional long press to trigger a custom delta prompt.
  */
 struct CircleButton: View {
     let icon: String
     let color: Color
     let size: CGFloat
     let action: () -> Void
+    var onLongPress: (() -> Void)? = nil
 
-    init(icon: String, color: Color, size: CGFloat = 44, action: @escaping () -> Void) {
+    init(icon: String, color: Color, size: CGFloat = 44, action: @escaping () -> Void, onLongPress: (() -> Void)? = nil) {
         self.icon = icon
         self.color = color
         self.size = size
         self.action = action
+        self.onLongPress = onLongPress
     }
 
     var body: some View {
-        Button(action: action) {
-            Image(systemName: icon)
-                .font(size < 40 ? .caption : .title3)
-                .frame(width: size, height: size)
-                .background(color.opacity(0.2))
-                .clipShape(Circle())
-                .foregroundStyle(color)
+        Image(systemName: icon)
+            .font(size < 40 ? .caption : .title3)
+            .frame(width: size, height: size)
+            .background(color.opacity(0.2))
+            .clipShape(Circle())
+            .foregroundStyle(color)
+            .contentShape(Circle())
+            .onTapGesture {
+                action()
+            }
+            .onLongPressGesture(minimumDuration: 0.5) {
+                onLongPress?()
+            }
+    }
+}
+
+/**
+ * A view that shows the accumulated delta change near a counter button.
+ * Automatically fades out after a delay.
+ */
+struct DeltaIndicator: View {
+    let delta: Int
+    let alignment: HorizontalAlignment
+
+    var body: some View {
+        if delta != 0 {
+            Text(delta > 0 ? "+\(delta)" : "\(delta)")
+                .font(.system(size: 16, weight: .bold, design: .rounded))
+                .foregroundStyle(delta > 0 ? .green : .red)
+                .opacity(0.8)
+                .transition(.opacity.combined(with: .scale))
         }
     }
 }
 
+/**
+ * Observable class to manage delta accumulation and fade-out timing.
+ */
+class DeltaTracker: ObservableObject {
+    @Published var delta: Int = 0
+    private var resetTimer: Timer?
+
+    func addDelta(_ amount: Int) {
+        delta += amount
+        resetTimer?.invalidate()
+        resetTimer = Timer.scheduledTimer(withTimeInterval: 2.0, repeats: false) { [weak self] _ in
+            withAnimation(.easeOut(duration: 0.3)) {
+                self?.delta = 0
+            }
+        }
+    }
+
+    func reset() {
+        resetTimer?.invalidate()
+        delta = 0
+    }
+}
+
 /**
  * A control for adjusting a large numerical value (like Life).
+ * Shows delta indicators and supports long-press for custom delta input.
  */
 struct LifeCounterControl: View {
     let value: Int
     let onDecrease: () -> Void
     let onIncrease: () -> Void
+    var onCustomDelta: ((Int) -> Void)? = nil
+
+    @StateObject private var deltaTracker = DeltaTracker()
+    @State private var showingCustomDeltaAlert = false
+    @State private var customDeltaText = ""
+    @State private var isIncreasing = true
 
     var body: some View {
         HStack(spacing: 16) {
-            CircleButton(icon: "minus", color: .red, action: onDecrease)
+            ZStack {
+                CircleButton(
+                    icon: "minus",
+                    color: .red,
+                    action: {
+                        onDecrease()
+                        withAnimation(.easeOut(duration: 0.15)) {
+                            deltaTracker.addDelta(-1)
+                        }
+                    },
+                    onLongPress: {
+                        isIncreasing = false
+                        customDeltaText = ""
+                        showingCustomDeltaAlert = true
+                        Haptics.play(.medium)
+                    }
+                )
+
+                if deltaTracker.delta < 0 {
+                    DeltaIndicator(delta: deltaTracker.delta, alignment: .trailing)
+                        .offset(y: -35)
+                }
+            }
 
             Text("\(value)")
                 .font(.system(size: 56, weight: .bold, design: .rounded))
@@ -53,14 +133,53 @@ struct LifeCounterControl: View {
                 .lineLimit(1)
                 .foregroundStyle(.primary)
 
-            CircleButton(icon: "plus", color: .green, action: onIncrease)
+            ZStack {
+                CircleButton(
+                    icon: "plus",
+                    color: .green,
+                    action: {
+                        onIncrease()
+                        withAnimation(.easeOut(duration: 0.15)) {
+                            deltaTracker.addDelta(1)
+                        }
+                    },
+                    onLongPress: {
+                        isIncreasing = true
+                        customDeltaText = ""
+                        showingCustomDeltaAlert = true
+                        Haptics.play(.medium)
+                    }
+                )
+
+                if deltaTracker.delta > 0 {
+                    DeltaIndicator(delta: deltaTracker.delta, alignment: .leading)
+                        .offset(y: -35)
+                }
+            }
         }
         .padding(.horizontal, 16)
+        .alert("Enter Amount", isPresented: $showingCustomDeltaAlert) {
+            TextField("Amount", text: $customDeltaText)
+                .keyboardType(.numberPad)
+            Button("Cancel", role: .cancel) { }
+            Button(isIncreasing ? "Add" : "Subtract") {
+                if let amount = Int(customDeltaText), amount > 0 {
+                    let delta = isIncreasing ? amount : -amount
+                    onCustomDelta?(delta)
+                    withAnimation(.easeOut(duration: 0.15)) {
+                        deltaTracker.addDelta(delta)
+                    }
+                }
+            }
+        } message: {
+            Text(isIncreasing ? "Enter the amount to add" : "Enter the amount to subtract")
+        }
     }
 }
 
 /**
  * A smaller control for adjusting secondary values (like Poison).
+ * Shows delta indicators and supports long-press for custom delta input.
  */
 struct SmallCounterControl: View {
     let value: Int
@@ -68,10 +187,40 @@ struct SmallCounterControl: View {
     let color: Color
     let onDecrease: () -> Void
     let onIncrease: () -> Void
+    var onCustomDelta: ((Int) -> Void)? = nil
+
+    @StateObject private var deltaTracker = DeltaTracker()
+    @State private var showingCustomDeltaAlert = false
+    @State private var customDeltaText = ""
+    @State private var isIncreasing = true
 
     var body: some View {
         HStack(spacing: 4) {
-            CircleButton(icon: "minus", color: .gray, size: 24, action: onDecrease)
+            ZStack {
+                CircleButton(
+                    icon: "minus",
+                    color: .gray,
+                    size: 24,
+                    action: {
+                        onDecrease()
+                        withAnimation(.easeOut(duration: 0.15)) {
+                            deltaTracker.addDelta(-1)
+                        }
+                    },
+                    onLongPress: {
+                        isIncreasing = false
+                        customDeltaText = ""
+                        showingCustomDeltaAlert = true
+                        Haptics.play(.medium)
+                    }
+                )
+
+                if deltaTracker.delta < 0 {
+                    DeltaIndicator(delta: deltaTracker.delta, alignment: .trailing)
+                        .font(.system(size: 12, weight: .bold))
+                        .offset(y: -22)
+                }
+            }
 
             VStack(spacing: 0) {
                 Image(systemName: icon)
@@ -83,11 +232,51 @@ struct SmallCounterControl: View {
             }
             .frame(minWidth: 30)
 
-            CircleButton(icon: "plus", color: .gray, size: 24, action: onIncrease)
+            ZStack {
+                CircleButton(
+                    icon: "plus",
+                    color: .gray,
+                    size: 24,
+                    action: {
+                        onIncrease()
+                        withAnimation(.easeOut(duration: 0.15)) {
+                            deltaTracker.addDelta(1)
+                        }
+                    },
+                    onLongPress: {
+                        isIncreasing = true
+                        customDeltaText = ""
+                        showingCustomDeltaAlert = true
+                        Haptics.play(.medium)
+                    }
+                )
+
+                if deltaTracker.delta > 0 {
+                    DeltaIndicator(delta: deltaTracker.delta, alignment: .leading)
+                        .font(.system(size: 12, weight: .bold))
+                        .offset(y: -22)
+                }
+            }
         }
         .padding(6)
         .background(color.opacity(0.1))
         .cornerRadius(12)
+        .alert("Enter Amount", isPresented: $showingCustomDeltaAlert) {
+            TextField("Amount", text: $customDeltaText)
+                .keyboardType(.numberPad)
+            Button("Cancel", role: .cancel) { }
+            Button(isIncreasing ? "Add" : "Subtract") {
+                if let amount = Int(customDeltaText), amount > 0 {
+                    let delta = isIncreasing ? amount : -amount
+                    onCustomDelta?(delta)
+                    withAnimation(.easeOut(duration: 0.15)) {
+                        deltaTracker.addDelta(delta)
+                    }
+                }
+            }
+        } message: {
+            Text(isIncreasing ? "Enter the amount to add" : "Enter the amount to subtract")
+        }
     }
 }
 

ios/MagicCounter/GameView.swift

@@ -87,13 +87,12 @@ struct GameView: View {
                                     isWinner: gameState.winner?.id == player.id,
                                     onUpdate: updatePlayer,
                                     onCommanderTap: { selectedPlayerForCommander = player },
-                                    onScoop: { scoopPlayer(player) }
+                                    onScoop: { scoopPlayer(player) },
+                                    onDragStart: {
+                                        self.draggedPlayer = player
+                                    }
                                 )
                                 .frame(height: 260)
-                                .onDrag {
-                                    self.draggedPlayer = player
-                                    return NSItemProvider(object: String(player.id) as NSString)
-                                }
                                 .onDrop(of: [.text], delegate: PlayerDropDelegate(item: player, items: $gameState.players, draggedItem: $draggedPlayer))
                             }
                         }
@@ -210,6 +209,7 @@ struct PlayerCell: View {
     let onUpdate: (PlayerState) -> Void
     let onCommanderTap: () -> Void
     let onScoop: () -> Void
+    var onDragStart: (() -> Void)? = nil
 
     @State private var showScoopConfirmation = false
 
@@ -224,19 +224,25 @@ struct PlayerCell: View {
                 )
 
             VStack(spacing: 12) {
-                // Header
+                // Header - drag handle area
                 HStack {
                     Text(player.name)
-                        .font(.headline)
+                        .font(.system(size: 22, weight: .semibold, design: .rounded))
                         .lineLimit(1)
-                        .minimumScaleFactor(0.8)
+                        .minimumScaleFactor(0.7)
                         .foregroundStyle(.primary)
+                        .onDrag {
+                            onDragStart?()
+                            return NSItemProvider(object: String(player.id) as NSString)
+                        }
+
                     Spacer()
 
                     Button(action: { showScoopConfirmation = true }) {
                         Image(systemName: "flag.fill")
+                            .font(.system(size: 18))
                             .foregroundStyle(.secondary)
-                            .padding(4)
+                            .padding(8)
                     }
                 }
                 .padding(.horizontal)
@@ -246,7 +252,8 @@ struct PlayerCell: View {
                 LifeCounterControl(
                     value: player.life,
                     onDecrease: { adjustLife(by: -1) },
-                    onIncrease: { adjustLife(by: 1) }
+                    onIncrease: { adjustLife(by: 1) },
+                    onCustomDelta: { adjustLife(by: $0) }
                 )
 
                 Spacer()
@@ -259,7 +266,8 @@ struct PlayerCell: View {
                             icon: "drop.fill",
                             color: .purple,
                             onDecrease: { adjustPoison(by: -1) },
-                            onIncrease: { adjustPoison(by: 1) }
+                            onIncrease: { adjustPoison(by: 1) },
+                            onCustomDelta: { adjustPoison(by: $0) }
                         )
                     }
 
@@ -330,6 +338,103 @@ struct PlayerCell: View {
     }
 }
 
+/**
+ * A row for managing commander damage from a single attacker.
+ * Shows delta indicators and supports long-press for custom delta input.
+ */
+struct CommanderDamageRow: View {
+    let attackerName: String
+    let attackerId: Int
+    let currentDamage: Int
+    let onAdjust: (Int) -> Void
+
+    @StateObject private var deltaTracker = DeltaTracker()
+    @State private var showingCustomDeltaAlert = false
+    @State private var customDeltaText = ""
+    @State private var isIncreasing = true
+
+    var body: some View {
+        HStack {
+            Text(attackerName)
+                .font(.headline)
+            Spacer()
+            HStack(spacing: 16) {
+                ZStack {
+                    CircleButton(
+                        icon: "minus",
+                        color: .secondary,
+                        action: {
+                            onAdjust(-1)
+                            withAnimation(.easeOut(duration: 0.15)) {
+                                deltaTracker.addDelta(-1)
+                            }
+                        },
+                        onLongPress: {
+                            isIncreasing = false
+                            customDeltaText = ""
+                            showingCustomDeltaAlert = true
+                            Haptics.play(.medium)
+                        }
+                    )
+                    .buttonStyle(.borderless)
+
+                    if deltaTracker.delta < 0 {
+                        DeltaIndicator(delta: deltaTracker.delta, alignment: .trailing)
+                            .offset(y: -30)
+                    }
+                }
+
+                Text("\(currentDamage)")
+                    .font(.title.bold())
+                    .frame(minWidth: 40)
+                    .multilineTextAlignment(.center)
+
+                ZStack {
+                    CircleButton(
+                        icon: "plus",
+                        color: .primary,
+                        action: {
+                            onAdjust(1)
+                            withAnimation(.easeOut(duration: 0.15)) {
+                                deltaTracker.addDelta(1)
+                            }
+                        },
+                        onLongPress: {
+                            isIncreasing = true
+                            customDeltaText = ""
+                            showingCustomDeltaAlert = true
+                            Haptics.play(.medium)
+                        }
+                    )
+                    .buttonStyle(.borderless)
+
+                    if deltaTracker.delta > 0 {
+                        DeltaIndicator(delta: deltaTracker.delta, alignment: .leading)
+                            .offset(y: -30)
+                    }
+                }
+            }
+        }
+        .padding(.vertical, 8)
+        .alert("Enter Amount", isPresented: $showingCustomDeltaAlert) {
+            TextField("Amount", text: $customDeltaText)
+                .keyboardType(.numberPad)
+            Button("Cancel", role: .cancel) { }
+            Button(isIncreasing ? "Add" : "Subtract") {
+                if let amount = Int(customDeltaText), amount > 0 {
+                    let delta = isIncreasing ? amount : -amount
+                    onAdjust(delta)
+                    withAnimation(.easeOut(duration: 0.15)) {
+                        deltaTracker.addDelta(delta)
+                    }
+                }
+            }
+        } message: {
+            Text(isIncreasing ? "Enter the amount to add" : "Enter the amount to subtract")
+        }
+    }
+}
+
 /**
  * Sheet for managing commander damage received by a player.
  *
@@ -353,32 +458,14 @@ struct CommanderDamageView: View {
         NavigationStack {
             List {
                 ForEach(gameState.players.filter { $0.id != targetPlayer.id }) { attacker in
-                    HStack {
-                        Text(attacker.name)
-                            .font(.headline)
-                        Spacer()
-                        HStack(spacing: 16) {
-                            CircleButton(
-                                icon: "minus",
-                                color: .secondary,
-                                action: { adjustCommanderDamage(attackerId: attacker.id, by: -1) }
-                            )
-                            .buttonStyle(.borderless)
-                            
-                            Text("\(targetPlayer.commanderDamages[attacker.id] ?? 0)")
-                                .font(.title.bold())
-                                .frame(minWidth: 40)
-                                .multilineTextAlignment(.center)
-                            
-                            CircleButton(
-                                icon: "plus",
-                                color: .primary,
-                                action: { adjustCommanderDamage(attackerId: attacker.id, by: 1) }
-                            )
-                            .buttonStyle(.borderless)
+                    CommanderDamageRow(
+                        attackerName: attacker.name,
+                        attackerId: attacker.id,
+                        currentDamage: targetPlayer.commanderDamages[attacker.id] ?? 0,
+                        onAdjust: { amount in
+                            adjustCommanderDamage(attackerId: attacker.id, by: amount)
                         }
-                    }
-                    .padding(.vertical, 8)
+                    )
                 }
             }
             .navigationTitle("Commander Damage to \(targetPlayer.name)")

ios/MagicCounter/Logo.icon/icon.json

@@ -7,15 +7,63 @@
     {
       "layers" : [
         {
-          "image-name" : "logo 2.png",
-          "name" : "logo",
+          "image-name" : "MagicCounter4.png",
+          "name" : "MagicCounter4",
           "position" : {
-            "scale" : 0.85,
+            "scale" : 0.2,
+            "translation-in-points" : [
+              -280,
+              280
+            ]
+          }
+        },
+        {
+          "image-name" : "MagicCounter5.png",
+          "name" : "MagicCounter5",
+          "position" : {
+            "scale" : 0.2,
+            "translation-in-points" : [
+              280,
+              280
+            ]
+          }
+        },
+        {
+          "image-name" : "MagicCounter6.png",
+          "name" : "MagicCounter6",
+          "position" : {
+            "scale" : 0.2,
+            "translation-in-points" : [
+              -280,
+              -280
+            ]
+          }
+        },
+        {
+          "image-name" : "MagicCounter3.png",
+          "name" : "MagicCounter3",
+          "position" : {
+            "scale" : 0.2,
             "translation-in-points" : [
               0,
               0
             ]
           }
+        },
+        {
+          "image-name" : "MagicCounter2.png",
+          "name" : "MagicCounter2",
+          "position" : {
+            "scale" : 0.2,
+            "translation-in-points" : [
+              280,
+              -280
+            ]
+          }
+        },
+        {
+          "image-name" : "MagicCounter.png",
+          "name" : "MagicCounter"
         }
       ],
       "shadow" : {