Merge pull request 'new pipe' (#37 ) from dev into main

Reviewed-on: #37
new pipe
2026-09-02 19:27:34 +00:00 · 2026-09-02 21:27:01 +02:00 · 2026-09-02 18:28:52 +00:00 · 2026-09-02 20:28:07 +02:00 · 2026-09-01 19:23:32 +00:00 · 2026-09-01 21:22:48 +02:00
140 changed files with 6714 additions and 2657 deletions
@@ -0,0 +1,327 @@
 name: Android Build
 on:
  push:
    branches: [main, develop]
    paths:
      - 'carry-your-live/**'
      - '.gitea/workflows/android-build.yml'
  pull_request:
    branches: [main, develop]
    paths:
      - 'carry-your-live/**'
  workflow_dispatch:
 env:
  NODE_VERSION: '20'
  JAVA_VERSION: '17'
  ANDROID_HOME: ${{ runner.tool_cache }}/android-sdk
  ANDROID_SDK_ROOT: ${{ runner.tool_cache }}/android-sdk
  GRADLE_OPTS: "-Dorg.gradle.workers.max=2 -Dorg.gradle.jvmargs=-Xmx1536m -XX:MaxMetaspaceSize=1024m"
 jobs:
  setup:
    name: Setup & Install
    runs-on: ubuntu-latest
    timeout-minutes: 20
    outputs:
      gradle-cache-key: ${{ steps.gradle-cache.outputs.cache-primary-key }}
    steps:
      - name: Checkout repository
        uses: actions/checkout@v4
        with:
          fetch-depth: 0
      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: ${{ env.NODE_VERSION }}
          cache: 'npm'
          cache-dependency-path: carry-your-live/package-lock.json
      - name: Setup Java
        uses: actions/setup-java@v4
        with:
          distribution: 'temurin'
          java-version: ${{ env.JAVA_VERSION }}
          cache: 'gradle'
          cache-dependency-path: carry-your-live/android/gradle/wrapper/gradle-wrapper.properties
      - name: Install Android SDK
        run: |
          if [ -x "$ANDROID_HOME/cmdline-tools/latest/bin/sdkmanager" ]; then
            echo "Android SDK already present in cache"
          else
            rm -rf "$ANDROID_HOME/cmdline-tools"
            mkdir -p "$ANDROID_HOME/cmdline-tools"
            wget -q https://dl.google.com/android/repository/commandlinetools-linux-11076708_latest.zip -O /tmp/cmdtools.zip
            unzip -q /tmp/cmdtools.zip -d "$ANDROID_HOME/cmdline-tools"
            mv "$ANDROID_HOME/cmdline-tools/cmdline-tools" "$ANDROID_HOME/cmdline-tools/latest"
          fi
          mkdir -p "$ANDROID_HOME/licenses"
          echo "8933bad161af4178b1185d1a37fbf41ea5269c55" > "$ANDROID_HOME/licenses/android-sdk-license"
          echo "d56f5187479451eabf01fb78af6dfcb131a6481e" >> "$ANDROID_HOME/licenses/android-sdk-license"
          echo "24333f8a63b6825ea9c5514f83c2829b004d1fee" >> "$ANDROID_HOME/licenses/android-sdk-license"
          "$ANDROID_HOME/cmdline-tools/latest/bin/sdkmanager" \
            "platform-tools" \
            "platforms;android-36" \
            "build-tools;36.0.0" \
            "ndk;27.1.12297006"
          mkdir -p carry-your-live/android/app
          echo "sdk.dir=$ANDROID_HOME" > carry-your-live/android/app/local.properties
      - name: Install dependencies
        working-directory: carry-your-live
        run: |
          for i in {1..3}; do
            npm ci && break || sleep 10
          done
      - name: Prebuild Android
        working-directory: carry-your-live
        run: |
          for i in {1..2}; do
            npx expo prebuild --platform android --clean && break || sleep 15
          done
  build-debug:
    name: Build Debug APK
    needs: setup
    runs-on: ubuntu-latest
    timeout-minutes: 30
    steps:
      - name: Checkout repository
        uses: actions/checkout@v4
        with:
          fetch-depth: 0
      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: ${{ env.NODE_VERSION }}
          cache: 'npm'
          cache-dependency-path: carry-your-live/package-lock.json
      - name: Setup Java
        uses: actions/setup-java@v4
        with:
          distribution: 'temurin'
          java-version: ${{ env.JAVA_VERSION }}
          cache: 'gradle'
          cache-dependency-path: carry-your-live/android/gradle/wrapper/gradle-wrapper.properties
      - name: Install Android SDK
        run: |
          if [ -x "$ANDROID_HOME/cmdline-tools/latest/bin/sdkmanager" ]; then
            echo "Android SDK already present in cache"
          else
            rm -rf "$ANDROID_HOME/cmdline-tools"
            mkdir -p "$ANDROID_HOME/cmdline-tools"
            wget -q https://dl.google.com/android/repository/commandlinetools-linux-11076708_latest.zip -O /tmp/cmdtools.zip
            unzip -q /tmp/cmdtools.zip -d "$ANDROID_HOME/cmdline-tools"
            mv "$ANDROID_HOME/cmdline-tools/cmdline-tools" "$ANDROID_HOME/cmdline-tools/latest"
          fi
          mkdir -p "$ANDROID_HOME/licenses"
          echo "8933bad161af4178b1185d1a37fbf41ea5269c55" > "$ANDROID_HOME/licenses/android-sdk-license"
          echo "d56f5187479451eabf01fb78af6dfcb131a6481e" >> "$ANDROID_HOME/licenses/android-sdk-license"
          echo "24333f8a63b6825ea9c5514f83c2829b004d1fee" >> "$ANDROID_HOME/licenses/android-sdk-license"
          "$ANDROID_HOME/cmdline-tools/latest/bin/sdkmanager" \
            "platform-tools" \
            "platforms;android-36" \
            "build-tools;36.0.0" \
            "ndk;27.1.12297006"
          mkdir -p carry-your-live/android/app
          echo "sdk.dir=$ANDROID_HOME" > carry-your-live/android/app/local.properties
      - name: Build Debug APK
        working-directory: carry-your-live/android
        run: |
          for i in {1..3}; do
            ./gradlew assembleDebug --no-daemon -Dorg.gradle.workers.max=2 && break || sleep 30
          done
      - name: Find Debug APK
        id: find-debug-apk
        run: |
          APK_PATH=$(find carry-your-live/android/app/build/outputs -name "*debug*.apk" -type f | head -n 1)
          echo "apk_path=$APK_PATH" >> "$GITHUB_OUTPUT"
          echo "Found Debug APK at: $APK_PATH"
      - name: Upload Debug APK
        uses: actions/upload-artifact@v4
        with:
          name: android-debug-apk
          path: ${{ steps.find-debug-apk.outputs.apk_path }}
          retention-days: 30
  build-release:
    name: Build Release APK & AAB
    needs: setup
    runs-on: ubuntu-latest
    timeout-minutes: 35
    steps:
      - name: Checkout repository
        uses: actions/checkout@v4
        with:
          fetch-depth: 0
      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: ${{ env.NODE_VERSION }}
          cache: 'npm'
          cache-dependency-path: carry-your-live/package-lock.json
      - name: Setup Java
        uses: actions/setup-java@v4
        with:
          distribution: 'temurin'
          java-version: ${{ env.JAVA_VERSION }}
          cache: 'gradle'
          cache-dependency-path: carry-your-live/android/gradle/wrapper/gradle-wrapper.properties
      - name: Install Android SDK
        run: |
          if [ -x "$ANDROID_HOME/cmdline-tools/latest/bin/sdkmanager" ]; then
            echo "Android SDK already present in cache"
          else
            rm -rf "$ANDROID_HOME/cmdline-tools"
            mkdir -p "$ANDROID_HOME/cmdline-tools"
            wget -q https://dl.google.com/android/repository/commandlinetools-linux-11076708_latest.zip -O /tmp/cmdtools.zip
            unzip -q /tmp/cmdtools.zip -d "$ANDROID_HOME/cmdline-tools"
            mv "$ANDROID_HOME/cmdline-tools/cmdline-tools" "$ANDROID_HOME/cmdline-tools/latest"
          fi
          mkdir -p "$ANDROID_HOME/licenses"
          echo "8933bad161af4178b1185d1a37fbf41ea5269c55" > "$ANDROID_HOME/licenses/android-sdk-license"
          echo "d56f5187479451eabf01fb78af6dfcb131a6481e" >> "$ANDROID_HOME/licenses/android-sdk-license"
          echo "24333f8a63b6825ea9c5514f83c2829b004d1fee" >> "$ANDROID_HOME/licenses/android-sdk-license"
          "$ANDROID_HOME/cmdline-tools/latest/bin/sdkmanager" \
            "platform-tools" \
            "platforms;android-36" \
            "build-tools;36.0.0" \
            "ndk;27.1.12297006"
          mkdir -p carry-your-live/android/app
          echo "sdk.dir=$ANDROID_HOME" > carry-your-live/android/app/local.properties
      - name: Build Release APK
        working-directory: carry-your-live/android
        run: |
          for i in {1..3}; do
            ./gradlew assembleRelease --no-daemon -Dorg.gradle.workers.max=2 && break || sleep 30
          done
      - name: Build Release Bundle (AAB)
        working-directory: carry-your-live/android
        run: |
          for i in {1..3}; do
            ./gradlew bundleRelease --no-daemon -Dorg.gradle.workers.max=2 && break || sleep 30
          done
      - name: Find Release APK
        id: find-release-apk
        run: |
          APK_PATH=$(find carry-your-live/android/app/build/outputs -name "*release*.apk" -type f | head -n 1)
          echo "apk_path=$APK_PATH" >> "$GITHUB_OUTPUT"
          echo "Found Release APK at: $APK_PATH"
      - name: Find Release Bundle (AAB)
        id: find-release-aab
        run: |
          AAB_PATH=$(find carry-your-live/android/app/build/outputs -name "*release*.aab" -type f | head -n 1)
          echo "aab_path=$AAB_PATH" >> "$GITHUB_OUTPUT"
          echo "Found Release AAB at: $AAB_PATH"
      - name: Upload Release APK
        uses: actions/upload-artifact@v4
        with:
          name: android-release-apk
          path: ${{ steps.find-release-apk.outputs.apk_path }}
          retention-days: 30
      - name: Upload Release Bundle (AAB)
        uses: actions/upload-artifact@v4
        with:
          name: android-release-aab
          path: ${{ steps.find-release-aab.outputs.aab_path }}
          retention-days: 30
  test-lint:
    name: Test & Lint
    needs: setup
    runs-on: ubuntu-latest
    timeout-minutes: 25
    steps:
      - name: Checkout repository
        uses: actions/checkout@v4
        with:
          fetch-depth: 0
      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: ${{ env.NODE_VERSION }}
          cache: 'npm'
          cache-dependency-path: carry-your-live/package-lock.json
      - name: Setup Java
        uses: actions/setup-java@v4
        with:
          distribution: 'temurin'
          java-version: ${{ env.JAVA_VERSION }}
          cache: 'gradle'
          cache-dependency-path: carry-your-live/android/gradle/wrapper/gradle-wrapper.properties
      - name: Install Android SDK
        run: |
          if [ -x "$ANDROID_HOME/cmdline-tools/latest/bin/sdkmanager" ]; then
            echo "Android SDK already present in cache"
          else
            rm -rf "$ANDROID_HOME/cmdline-tools"
            mkdir -p "$ANDROID_HOME/cmdline-tools"
            wget -q https://dl.google.com/android/repository/commandlinetools-linux-11076708_latest.zip -O /tmp/cmdtools.zip
            unzip -q /tmp/cmdtools.zip -d "$ANDROID_HOME/cmdline-tools"
            mv "$ANDROID_HOME/cmdline-tools/cmdline-tools" "$ANDROID_HOME/cmdline-tools/latest"
          fi
          mkdir -p "$ANDROID_HOME/licenses"
          echo "8933bad161af4178b1185d1a37fbf41ea5269c55" > "$ANDROID_HOME/licenses/android-sdk-license"
          echo "d56f5187479451eabf01fb78af6dfcb131a6481e" >> "$ANDROID_HOME/licenses/android-sdk-license"
          echo "24333f8a63b6825ea9c5514f83c2829b004d1fee" >> "$ANDROID_HOME/licenses/android-sdk-license"
          "$ANDROID_HOME/cmdline-tools/latest/bin/sdkmanager" \
            "platform-tools" \
            "platforms;android-36" \
            "build-tools;36.0.0" \
            "ndk;27.1.12297006"
          mkdir -p carry-your-live/android/app
          echo "sdk.dir=$ANDROID_HOME" > carry-your-live/android/app/local.properties
      - name: Run Unit Tests
        working-directory: carry-your-live/android
        run: |
          for i in {1..3}; do
            ./gradlew test --no-daemon -Dorg.gradle.workers.max=2 && break || sleep 30
          done
        continue-on-error: true
      - name: Run Lint
        working-directory: carry-your-live/android
        run: |
          for i in {1..2}; do
            ./gradlew lint --no-daemon -Dorg.gradle.workers.max=2 && break || sleep 30
          done
        continue-on-error: true
      - name: Upload Test Reports
        if: always()
        uses: actions/upload-artifact@v4
        with:
          name: android-test-reports
          path: carry-your-live/android/app/build/reports/tests/
          retention-days: 14
      - name: Upload Lint Reports
        if: always()
        uses: actions/upload-artifact@v4
        with:
          name: android-lint-reports
          path: carry-your-live/android/app/build/reports/lint-results*.html
          retention-days: 14
@@ -1,74 +0,0 @@
 name: Build APK
 on:
  push:
    branches: [main]
  workflow_dispatch:
 env:
  ANDROID_HOME: ${{ runner.tool_cache }}/android-sdk
  ANDROID_SDK_ROOT: ${{ runner.tool_cache }}/android-sdk
 jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v4
      - name: Set up Node
        uses: actions/setup-node@v4
        with:
          node-version: 22
      - name: Set up JDK
        uses: actions/setup-java@v4
        with:
          distribution: temurin
          java-version: 17
      - name: Install Android SDK
        run: |
          if [ -x "$ANDROID_HOME/cmdline-tools/latest/bin/sdkmanager" ]; then
            echo "Android SDK already present in cache"
          else
            rm -rf "$ANDROID_HOME/cmdline-tools"
            mkdir -p "$ANDROID_HOME/cmdline-tools"
            wget -q https://dl.google.com/android/repository/commandlinetools-linux-11076708_latest.zip -O /tmp/cmdtools.zip
            unzip -q /tmp/cmdtools.zip -d "$ANDROID_HOME/cmdline-tools"
            mv "$ANDROID_HOME/cmdline-tools/cmdline-tools" "$ANDROID_HOME/cmdline-tools/latest"
          fi
          printf 'y\n' | "$ANDROID_HOME/cmdline-tools/latest/bin/sdkmanager" --licenses > /dev/null
          "$ANDROID_HOME/cmdline-tools/latest/bin/sdkmanager" \
            "platform-tools" \
            "platforms;android-35" \
            "platforms;android-36" \
            "build-tools;35.0.0" \
            "build-tools;36.0.0" \
            "ndk;27.1.12297006"
          mkdir -p carry-your-live/android/app
          echo "sdk.dir=$ANDROID_HOME" > carry-your-live/android/app/local.properties
      - name: Install JS dependencies
        working-directory: carry-your-live
        run: npm ci
      - name: Generate debug keystore (signs the release APK)
        run: |
          mkdir -p carry-your-live/android/app
          keytool -genkeypair -v \
            -keystore carry-your-live/android/app/debug.keystore \
            -alias androiddebugkey -storepass android -keypass android \
            -keyalg RSA -keysize 2048 -validity 10000 \
            -dname "CN=Android Debug,O=Android,C=US"
      - name: Build release APK
        run: |
          cd carry-your-live/android
          ./gradlew assembleRelease
      - name: Upload APK
        uses: actions/upload-artifact@v4
        with:
          name: carry-your-live-release
          path: carry-your-live/android/app/build/outputs/release/app-release.apk
@@ -1,36 +0,0 @@
 name: Build Desktop (deb)
 on:
  push:
    branches: [main]
  workflow_dispatch:
 jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - name: Checkout
        uses: actions/checkout@v4
      - name: Set up Node
        uses: actions/setup-node@v4
        with:
          node-version: 22
      - name: Install JS dependencies
        working-directory: carry-your-live
        run: npm ci
      - name: Export web bundle
        working-directory: carry-your-live
        run: npx expo export --platform web
      - name: Build deb package
        working-directory: carry-your-live
        run: npx electron-builder --linux deb --config electron-builder.config.js
      - name: Upload deb
        uses: actions/upload-artifact@v4
        with:
          name: carry-your-live-desktop-deb
          path: carry-your-live/desktop-build/*.deb
@@ -1,56 +1,237 @@
-name: release
+name: Build and Release Android
 on:
  push:
-    branches:
+    tags:
-      - main
+      - 'v*'
  workflow_dispatch:
-permissions:
+env:
-  contents: write
+  NODE_VERSION: '20'
  JAVA_VERSION: '17'
  ANDROID_HOME: ${{ runner.tool_cache }}/android-sdk
  ANDROID_SDK_ROOT: ${{ runner.tool_cache }}/android-sdk
  GITEA_SERVER_URL: "https://techmos.gitea.org"
 jobs:
-  release:
+  build:
    name: Build Android
    runs-on: ubuntu-latest
    timeout-minutes: 45
    permissions:
      contents: read
    steps:
-      - name: Checkout
+      - name: Checkout repository
        uses: actions/checkout@v4
        with:
          fetch-depth: 0
-      - name: Compute next version
+      - name: Setup Node.js
-        id: version
+        uses: actions/setup-node@v4
        run: |
          latest=$(git tag --list 'v[0-9]*' --sort=-v:refname | head -n 1)
          if [ -z "$latest" ]; then
            next="v1.0.0"
          else
            latest=${latest#v}
            IFS='.' read -r major minor patch <<< "$latest"
            next="v${major}.${minor}.$((patch + 1))"
          fi
          echo "next=${next}" >> "$GITHUB_OUTPUT"
      - name: Build changelog
        id: changelog
        run: |
          prev_tag=$(git describe --tags --abbrev=0 2>/dev/null || echo "")
          if [ -z "$prev_tag" ]; then
            log=$(git log --oneline --no-merges main | head -n 40)
          else
            log=$(git log --oneline --no-merges "$prev_tag"..main | head -n 40)
          fi
          {
            echo "body<<EOF"
            echo "## What's new in this release"
            echo ""
            echo "$log" | sed 's/^/- /'
            echo "EOF"
          } >> "$GITHUB_OUTPUT"
      - name: Create release
        uses: softprops/action-gh-release@v2
        with:
-          tag_name: ${{ steps.version.outputs.next }}
+          node-version: ${{ env.NODE_VERSION }}
-          name: ${{ steps.version.outputs.next }}
+          cache: 'npm'
-          body: ${{ steps.changelog.outputs.body }}
+          cache-dependency-path: carry-your-live/package-lock.json
-          generate_release_notes: false
+
      - name: Setup Java
        uses: actions/setup-java@v4
        with:
          distribution: 'temurin'
          java-version: ${{ env.JAVA_VERSION }}
          cache: 'gradle'
          cache-dependency-path: carry-your-live/android/gradle/wrapper/gradle-wrapper.properties
      - name: Install Android SDK
        run: |
          if [ -x "$ANDROID_HOME/cmdline-tools/latest/bin/sdkmanager" ]; then
            echo "Android SDK already present in cache"
          else
            rm -rf "$ANDROID_HOME/cmdline-tools"
            mkdir -p "$ANDROID_HOME/cmdline-tools"
            wget -q https://dl.google.com/android/repository/commandlinetools-linux-11076708_latest.zip -O /tmp/cmdtools.zip
            unzip -q /tmp/cmdtools.zip -d "$ANDROID_HOME/cmdline-tools"
            mv "$ANDROID_HOME/cmdline-tools/cmdline-tools" "$ANDROID_HOME/cmdline-tools/latest"
          fi
          mkdir -p "$ANDROID_HOME/licenses"
          echo "8933bad161af4178b1185d1a37fbf41ea5269c55" > "$ANDROID_HOME/licenses/android-sdk-license"
          echo "d56f5187479451eabf01fb78af6dfcb131a6481e" >> "$ANDROID_HOME/licenses/android-sdk-license"
          echo "24333f8a63b6825ea9c5514f83c2829b004d1fee" >> "$ANDROID_HOME/licenses/android-sdk-license"
          "$ANDROID_HOME/cmdline-tools/latest/bin/sdkmanager" \
            "platform-tools" \
            "platforms;android-36" \
            "build-tools;36.0.0" \
            "ndk;27.1.12297006"
          mkdir -p carry-your-live/android/app
          echo "sdk.dir=$ANDROID_HOME" > carry-your-live/android/app/local.properties
      - name: Install dependencies
        working-directory: carry-your-live
        run: |
          for i in {1..3}; do
            npm ci && break || sleep 10
          done
      - name: Prebuild Android
        working-directory: carry-your-live
        run: npx expo prebuild --platform android --clean
      - name: Configure Release Signing
        if: env.KEYSTORE_BASE64 != ''
        working-directory: carry-your-live/android/app
        run: |
          echo "${{ secrets.KEYSTORE_BASE64 }}" | base64 -d > release.keystore
          cat > ../release-signing.properties <<EOF
          storeFile=release.keystore
          storePassword=${{ secrets.KEYSTORE_PASSWORD }}
          keyAlias=${{ secrets.KEY_ALIAS }}
          keyPassword=${{ secrets.KEY_PASSWORD }}
          EOF
      - name: Build Release APK
        working-directory: carry-your-live/android
        run: |
          if [ -f "../release-signing.properties" ]; then
            ./gradlew assembleRelease -PreleaseSigningProperties=../release-signing.properties --no-daemon
          else
            ./gradlew assembleRelease --no-daemon
          fi
      - name: Build Release Bundle (AAB)
        working-directory: carry-your-live/android
        run: |
          if [ -f "../release-signing.properties" ]; then
            ./gradlew bundleRelease -PreleaseSigningProperties=../release-signing.properties --no-daemon
          else
            ./gradlew bundleRelease --no-daemon
          fi
      - name: Run Tests
        working-directory: carry-your-live/android
        run: ./gradlew test --no-daemon
      - name: Run Lint
        working-directory: carry-your-live/android
        run: ./gradlew lint --no-daemon
      - name: Find Release APK
        id: find-release-apk
        run: |
          APK_PATH=$(find carry-your-live/android/app/build/outputs -name "*release*.apk" -type f | head -n 1)
          echo "apk_path=$APK_PATH" >> "$GITHUB_OUTPUT"
          echo "Found Release APK at: $APK_PATH"
      - name: Find Release Bundle (AAB)
        id: find-release-aab
        run: |
          AAB_PATH=$(find carry-your-live/android/app/build/outputs -name "*release*.aab" -type f | head -n 1)
          echo "aab_path=$AAB_PATH" >> "$GITHUB_OUTPUT"
          echo "Found Release AAB at: $AAB_PATH"
      - name: Upload Build Artifacts
        uses: actions/upload-artifact@v4
        with:
          name: android-release-build
          path: |
            ${{ steps.find-release-apk.outputs.apk_path }}
            ${{ steps.find-release-aab.outputs.aab_path }}
          retention-days: 90
      - name: Upload Test Reports
        if: always()
        uses: actions/upload-artifact@v4
        with:
          name: android-test-reports
          path: carry-your-live/android/app/build/reports/tests/
          retention-days: 30
      - name: Upload Lint Reports
        if: always()
        uses: actions/upload-artifact@v4
        with:
          name: android-lint-reports
          path: carry-your-live/android/app/build/reports/lint-results*.html
          retention-days: 30
  release:
    name: Create Gitea Release
    needs: build
    if: startsWith(github.ref, 'refs/tags/v')
    runs-on: ubuntu-latest
    timeout-minutes: 10
    permissions:
      contents: write
    steps:
      - name: Download Build Artifacts
        uses: actions/download-artifact@v4
        with:
          name: android-release-build
          path: artifacts
      - name: Create Gitea Release
        env:
          GITEA_TOKEN: ${{ secrets.GITEA_TOKEN }}
        run: |
          TAG_NAME="${GITHUB_REF#refs/tags/}"
          REPO_OWNER="${GITHUB_REPOSITORY%/*}"
          REPO_NAME="${GITHUB_REPOSITORY#*/}"
          # Detect Gitea server URL
          GITEA_URL="${GITEA_SERVER_URL:-https://techmos.gitea.org}"
          # Create release
          RESPONSE=$(curl -s -X POST "${GITEA_URL}/api/v1/repos/${REPO_OWNER}/${REPO_NAME}/releases" \
            -H "Authorization: token ${GITEA_TOKEN}" \
            -H "Content-Type: application/json" \
            -d "{
              \"tag_name\": \"${TAG_NAME}\",
              \"name\": \"${TAG_NAME}\",
              \"body\": \"Automated release for ${TAG_NAME}\",
              \"draft\": false,
              \"prerelease\": false
            }")
          RELEASE_ID=$(echo "$RESPONSE" | jq -r '.id')
          if [ "$RELEASE_ID" = "null" ] || [ -z "$RELEASE_ID" ]; then
            echo "Release might already exist, fetching existing release..."
            RELEASE_ID=$(curl -s -H "Authorization: token ${GITEA_TOKEN}" \
              "${GITEA_URL}/api/v1/repos/${REPO_OWNER}/${REPO_NAME}/releases/tags/${TAG_NAME}" | jq -r '.id')
          fi
          if [ "$RELEASE_ID" = "null" ] || [ -z "$RELEASE_ID" ]; then
            echo "Failed to create or find release"
            exit 1
          fi
          echo "Release ID: $RELEASE_ID"
          echo "release_id=$RELEASE_ID" >> "$GITHUB_OUTPUT"
        id: create-release
      - name: Upload APK to Release
        env:
          GITEA_TOKEN: ${{ secrets.GITEA_TOKEN }}
        run: |
          GITEA_URL="${GITEA_URL:-https://techmos.gitea.org}"
          REPO_OWNER="${GITHUB_REPOSITORY%/*}"
          REPO_NAME="${GITHUB_REPOSITORY#*/}"
          RELEASE_ID="${{ steps.create-release.outputs.release_id }}"
          TAG_NAME="${GITHUB_REF#refs/tags/}"
          for file in artifacts/*; do
            if [[ "$file" == *.apk ]]; then
              FILENAME="carry-your-live-${TAG_NAME}.apk"
            elif [[ "$file" == *.aab ]]; then
              FILENAME="carry-your-live-${TAG_NAME}.aab"
            else
              continue
            fi
            echo "Uploading $file as $FILENAME..."
            curl -s -X POST "${GITEA_URL}/api/v1/repos/${REPO_OWNER}/${REPO_NAME}/releases/${RELEASE_ID}/assets" \
              -H "Authorization: token ${GITEA_TOKEN}" \
              -F "attachment=@${file};filename=${FILENAME}"
            echo "Uploaded $FILENAME"
          done
@@ -15,3 +15,14 @@ System architecture design, technical strategy, and scalability planning.
 - Performance benchmarks
 - Technical debt ratio
 - Architecture compliance
 ## Android Design Guidelines
 - Material Design elevation patterns (0-12dp shadows)
 - Tab bar height: 56dp (standard Android)
 - Status bar: dark style for light backgrounds, light style for dark
 - System back button: router.back() or goBack() with confirmation on home screen
 - Touch ripple: opacity scaling on press (44dp touch targets, 8dp border radius)
 - Safe area insets: account for bottom navigation bar (84px + system insets)
 - Theme: primary accent color with complementary supporting colors
 - Typography: Roboto-inspired font weights (600 for labels, 400/500 for body)
 - Scaling: 8dp grid system for spacing and margins
@@ -1,6 +1,40 @@
 # Carry Your Live - Mobile To-Do & Calendar App
-A minimalist, offline-first task management app built with Expo, React Native, and WatermelonDB. Features three primary screens: To-Do List, Add New Task, and Calendar with bottom navigation.
+A minimalist, offline-first task management app built with Expo, React Native, and WatermelonDB. Features multiple screens with bottom navigation, social features, and a full-featured backend API.
 ## 📝 Recent Progress (v1.1.0 - Unreleased)
 ### Added
 - **Friends feature**: Friend requests, accept/decline/remove, user search, full backend routes
 - **Assignee field on tasks**: Schema v7, model, types, forms, sync, task actions
 - **AssigneeSelector component** and assignee display in TaskItem
 - **QuickAddBar** on tasks overview (copied from calendar)
 - **Backend**: Mounted friends route, added assigneeId to task validation and sync
 ### Changed
 - Due date prefilled from Calendar "+" button
 - 12-hour time formatting across task rows and pickers
 - Calendar strip scrolls to selected day when navigating months
 - Calendar completion toggle now handles repeating tasks and reminders
 - Task color strips now use the task's category color
 ### Fixed
 - WheelTimePicker FlatList scroll clamping - all hours (0-23) and minutes (0-59) reachable
 - WheelTimePicker selection highlight background connecting selected item with colon separator
 - WheelTimePicker number alignment in scroll list
 - Tasks without a due date no longer get overdue styling
 - `useOverdueTasks` infinite re-subscription loop (Date.now in effect deps)
 - Web/Android crashes from decorator transform ordering (babel config)
 - FormButtons crash outside FormProvider; Cancel navigation fallback
 - Task repeat settings, reminders and series info now sync to backend
 ### Removed
 - Task color picker (task color now comes from its category)
 - Drag lift popup from TaskItem (scale + shadow on drag)
 - Checkbox from task items
 - Selection bar overlapping QuickAddBar on tasks overview
 ---
 ## Features
@@ -8,97 +42,145 @@ A minimalist, offline-first task management app built with Expo, React Native, a
 - **Offline-First Architecture**: Full CRUD operations work offline with WatermelonDB + SQLite
 - **Auto-Sync**: Background synchronization with custom Postgres API when online
 - **Cross-Platform**: iOS, Android, and Web from single codebase
 - **Desktop Support**: Electron wrapper for desktop app distribution
 ### Screens
-#### 1. To-Do List Screen
+#### 1. Tasks Screen (To-Do List)
 - **Header**: App logo + "TODO" title with rounded corners
 - **Category Filter**: Horizontal scrollable chips (Work, Personal, School, Shopping, Health, Finance, All)
  - Single selection with visual feedback (thicker border, shadow, scale animation)
  - Instant task filtering
- **Task List**: Vertical scrolling with:
+- **QuickAddBar**: Quick task creation from list view
-  - Checkbox (empty/checked states with animation)
+- **Task List**: Virtualized FlatList with sections (Pending/Completed)
  - Task title (truncated with ellipsis)
  - Three-dot overflow menu (Edit, Delete, Duplicate, Mark Complete, Change Category, Change Priority)
  - Priority badges with colors
  - Due date/time with overdue/due-today highlighting
-  - Completed section (collapsible)
+  - Category color indicator strip
- **Floating Action Button**: Bottom-right, opens Add Task screen with press animation
+  - Assignee display
  - Swipe actions (left: delete, right: complete)
  - Drag-to-reorder with visual drop indicators
  - Long press → Selection mode (multi-delete, multi-complete, change category/priority)
 - **Floating Action Button**: Bottom-right, opens Add Task screen
-#### 2. Add New Task Screen
+#### 2. Calendar Screen
 - **Date Strip**: Horizontal scrollable days of current month
  - Current day highlighted, scrolls to selected day on month change
 - **Month Label**: Centered (e.g., "JAN 2026")
 - **QuickAddBar**: Quick task creation for selected date
 - **Task List**: Tasks for selected day with category color, title, time, completion status
 - **Analog Clock Widget**: Decorative analog clock display
 - **Empty State**: "No tasks scheduled."
 - **Day View**: Detailed view for selected day (pushes to stack)
 #### 3. Stats Screen
 - Client-side statistics (`useStats` hook)
 - Task completion metrics
 - Category and priority breakdowns
 #### 4. Settings Screen
 - **Account**: Login/Register/Sign Out (SyncModal)
 - **Server URL Override**: Custom API endpoint configuration
 - **Appearance**: Accent color picker (dark mode toggle planned)
 - **Task Defaults**: Default category, sort order (Date, Priority, Alphabetically, Creation Date), show completed toggle
 - **Calendar**: Days ahead to display
 - **Reminders**: Global reminder preference (stored, wiring in progress)
 - **Notifications**: Toggle (stored, wiring in progress)
 - **Legal**: Privacy Policy, Terms of Service
 - **About**: Version info
 #### 5. Add New Task Screen
 - **Category Selector**: Horizontal row of colored circles (required)
 - **Task Name**: Single-line input, 100 char max (required)
- **Subtasks**: Unlimited, add/remove individually
+- **Subtasks**: Unlimited, add/remove individually, nested subtask support
- **Date & Time**: Date picker, time picker, calendar button
+- **Date & Time**: Date picker, time picker (WheelTimePicker), calendar button
 - **Priority**: Dropdown (None, Low, Medium, High, Critical) with color indicators
 - **Repeat Profile**: Recurring task configuration
 - **Reminder**: Reminder offset selector
 - **Assignee**: Assign task to friend
 - **Description**: Multi-line text area, 1000 char max
 - **Bottom Actions**: Submit (primary) / Cancel (secondary) fixed buttons
-#### 3. Calendar Screen
+#### 6. Task Detail Screen
- **Date Strip**: Horizontal scrollable days of current month
+- Full task view with all fields
- **Month Label**: Centered (e.g., "JAN 2026")
+- Subtask management (add, complete, reorder, convert to task)
- **Task List**: Tasks for selected day with category color, title, time, completion status
+- Edit functionality
- **Empty State**: "No tasks scheduled."
+- Repeat profile configuration
-#### 4. Settings Screen
+#### 7. Subtask Detail Screen
- Dark Mode toggle
+- Nested subtask management
- Push Notifications toggle
+- Convert subtask ↔ task
- Reminder Preferences
+- Re-parent subtasks
 - Default Category selector
 - Sort Tasks By (Date, Priority, Alphabetically, Creation Date)
 - Backup & Sync
 - Version, Privacy Policy, Terms of Service
-### Task States
+#### 8. Sync Modal
- **Pending**: Empty checkbox, normal text
+- Login/Register forms
- **Completed**: Checked checkbox, strikethrough, reduced opacity
+- Forgot/Reset password flow
- **Overdue**: Red due date, warning indicator
+- Server URL configuration
- **Due Today**: Blue highlight
+- Sync status display
 - **High Priority**: Priority badge
-### Interactions
+### Task Features
- Tap task → Edit screen
+- **Nested Subtasks**: Unlimited depth, re-parenting, drag reorder
- Long press → Selection mode (multi-delete, multi-complete, change category/priority)
+- **Repeating Tasks**: Repeat profiles, series IDs, this/future/all delete scopes, undo-complete
- Swipe left → Delete
+- **Categories/Tags**: 6 default categories with colors, custom category editor
- Swipe right → Complete
+- **Priorities**: None, Low, Medium, High, Critical with color badges
- Pull down → Refresh
+- **Due Dates/Times**: With all-day option
 - **Reminders**: Per-task reminder offsets
 - **Assignees**: Assign tasks to friends
 - **Overdue/Due Today**: Visual highlighting
 ### Social Features
 - **Friends System**: Send/accept/decline/remove friend requests
 - **User Search**: Find users by username/email
 - **Task Assignment**: Assign tasks to friends (client-side, backend schema ready)
 ---
 ## Tech Stack
 | Layer | Technology |
 |-------|------------|
-| Framework | Expo (React Native) |
+| Framework | Expo (React Native) / Expo Router v3 |
-| Language | TypeScript |
+| Language | TypeScript (strict mode) |
 | Navigation | Expo Router (file-based) |
-| Database | WatermelonDB + SQLite |
+| Database | WatermelonDB + SQLite (expo-sqlite) |
-| State | WatermelonDB (reactive queries, no Redux needed) |
+| State | WatermelonDB reactive queries (no Redux) |
 | Forms | React Hook Form + Zod validation |
-| UI Components | React Native Paper + Custom SVG icons |
+| UI Components | React Native Paper + Custom components |
-| Animations | React Native Reanimated |
+| Animations | React Native Reanimated v3 |
-| Date/Time | @react-native-community/datetimepicker + date-fns |
+| Date/Time | @react-native-community/datetimepicker + date-fns + WheelTimePicker |
-| Build | EAS Build / Gradle (local APK) |
+| Build | EAS Build / Gradle (local APK) / Electron Builder (desktop) |
 | CI/CD | Gitea Actions (`.gitea/workflows/build-apk.yml`) |
 | Backend | Node.js + Express + TypeScript |
 | Backend DB | PostgreSQL + Drizzle ORM |
 | Auth | JWT (access + refresh tokens) |
 | Validation | Zod (shared with frontend) |
 ---
 ## Project Structure
 ```
 carry-your-live/
 ├── app/
-│   ├── _layout.tsx              # Root layout + DatabaseProvider
+│   ├── _layout.tsx              # Root layout + DatabaseProvider + AuthProvider
 │   ├── (tabs)/
 │   │   ├── _layout.tsx          # Bottom tab navigator
 │   │   ├── index.tsx            # Tasks screen
 │   │   ├── calendar.tsx         # Calendar screen
 │   │   ├── stats.tsx            # Stats screen
 │   │   └── settings.tsx         # Settings screen
-│   └── add-task.tsx             # Add Task screen
+│   ├── add-task.tsx             # Add Task screen
 │   ├── day-view.tsx             # Calendar day detail
 │   ├── task-detail.tsx          # Task view/edit
 │   └── subtask-detail.tsx       # Subtask view/edit
 ├── src/
-│   ├── components/              # Reusable UI components
+│   ├── components/              # Reusable UI components (30+)
 │   │   ├── Header.tsx
 │   │   ├── CategoryFilter.tsx
 │   │   ├── TaskList.tsx
 │   │   ├── TaskItem.tsx
 │   │   ├── FloatingActionButton.tsx
 │   │   ├── TabBarIcon.tsx
 │   │   ├── CategorySelector.tsx
 │   │   ├── TaskNameInput.tsx
 │   │   ├── SubtasksSection.tsx
@@ -106,24 +188,102 @@ carry-your-live/
 │   │   ├── PrioritySelector.tsx
 │   │   ├── DescriptionInput.tsx
 │   │   ├── FormButtons.tsx
-│   │   └── ListItem.tsx
+│   │   ├── ListItem.tsx
 │   │   ├── AnalogClock.tsx
 │   │   ├── AssigneeSelector.tsx
 │   │   ├── CategoryEditorModal.tsx
 │   │   ├── ColorPickerInput.tsx
 │   │   ├── ColorWheel.tsx
 │   │   ├── DateTimeInput.tsx
 │   │   ├── ForgotPasswordModal.tsx
 │   │   ├── FriendsModal.tsx
 │   │   ├── LegalModal.tsx
 │   │   ├── OptionPickerModal.tsx
 │   │   ├── QuickAddBar.tsx
 │   │   ├── ReminderSelector.tsx
 │   │   ├── RepeatSelector.tsx
 │   │   ├── ServerUrlModal.tsx
 │   │   ├── SubtaskItem.tsx
 │   │   ├── SyncModal.tsx
 │   │   ├── SyncStatus.tsx
 │   │   ├── TabBarIcon.tsx
 │   │   ├── TaskDeleteModal.tsx
 │   │   ├── TaskOverflowMenu.tsx
 │   │   ├── UpdateNotifier.tsx
 │   │   └── WheelTimePicker.tsx
 │   ├── constants/
 │   │   └── index.ts             # Categories, priorities, colors, reminder options
 │   ├── database/
-│   │   ├── schema.ts            # WatermelonDB schema
+│   │   ├── schema.ts            # WatermelonDB schema (v21)
 │   │   ├── index.ts             # Database instance + collections
-│   │   └── sync.ts              # Custom API sync adapter
+│   │   ├── sync.ts              # Custom API sync adapter (25KB)
-│   ├── models/
+│   │   ├── migrations.ts        # Schema migrations
-│   │   ├── Task.ts
+│   │   ├── adapter.ts           # Platform-specific adapters
-│   │   ├── Category.ts
+│   │   └── tombstones.ts        # Deleted record tracking
 │   │   └── Subtask.ts
 │   ├── hooks/
 │   │   ├── useDatabase.tsx      # Database context & providers
-│   │   └── useTasks.tsx         # Task queries with reactive state
+│   │   ├── useTasks.tsx         # Task queries with reactive state
-│   ├── constants/
+│   │   ├── useCategories.tsx    # Category queries
-│   │   └── index.ts             # Categories, priorities, colors
+│   │   ├── useTasksByDate.tsx   # Calendar date queries
-│   └── types/
+│   │   ├── useFriends.tsx       # Friends state & actions
-│       └── index.ts             # TypeScript interfaces
+│   │   ├── useAuth.tsx          # Authentication state
 │   │   └── useStats.tsx         # Statistics computation
 │   ├── models/
 │   │   ├── Task.ts              # Task model (assigneeId, repeat, reminders)
 │   │   ├── Category.ts
 │   │   ├── Subtask.ts
 │   │   ├── RepeatProfile.ts
 │   │   ├── Friendship.ts
 │   │   └── Tombstone.ts
 │   ├── services/
 │   │   ├── api.ts               # API client with auth
 │   │   ├── auth.ts              # Auth token management
 │   │   ├── friends.ts           # Friends API calls
 │   │   ├── notifications.ts     # Reminder scheduling (expo-notifications)
 │   │   ├── repeat.ts            # Repeat task generation
 │   │   └── taskActions.ts       # Task CRUD + sync operations
 │   ├── theme/
 │   │   ├── index.ts             # Theme context, colors, spacing
 │   │   └── theme.tsx            # Accent color picker, settings sync
 │   ├── types/
 │   │   └── index.ts             # TypeScript interfaces
 │   └── utils/
 │       ├── date.ts              # Date formatting utilities
 │       ├── format.ts            # General formatting
 │       └── validation.ts        # Zod schemas
 ├── backend/                     # Backend API (separate package)
 │   ├── src/
 │   │   ├── index.ts             # Express app entry
 │   │   ├── db/
 │   │   │   ├── schema.ts        # Drizzle schema (Postgres)
 │   │   │   └── index.ts         # DB connection
 │   │   ├── routes/
 │   │   │   ├── auth.ts          # Register, login, me, forgot/reset password
 │   │   │   ├── categories.ts    # Category CRUD
 │   │   │   ├── tasks.ts         # Task CRUD + batch
 │   │   │   ├── subtasks.ts      # Subtask CRUD
 │   │   │   ├── sync.ts          # Pull/push sync endpoints
 │   │   │   ├── users.ts         # User profile & settings
 │   │   │   ├── friends.ts       # Friend requests, search, management
 │   │   │   ├── repeatProfiles.ts# Repeat profile CRUD
 │   │   │   └── pushNotifications.ts
 │   │   ├── middleware/
 │   │   │   ├── auth.ts          # JWT verification
 │   │   │   ├── errorHandler.ts
 │   │   │   └── validation.ts    # Zod validation middleware
 │   │   ├── services/
 │   │   └── utils/
 │   ├── drizzle.config.ts
 │   └── Dockerfile
 ├── electron/                    # Desktop app entry
 ├── android/                     # Native Android project
 ├── assets/                      # Images, fonts
 ├── patches/                     # patch-package fixes
 └── plugins/                     # Expo config plugins
 ```
 ---
 ## Data Models
 ### Task
@@ -135,8 +295,14 @@ carry-your-live/
  categoryId: string;
  priority: 'none' | 'low' | 'medium' | 'high' | 'critical';
  completed: boolean;
-  dueDate: number;        // timestamp
+  dueDate: number;        // timestamp (ms)
-  dueTime: string;        // "HH:MM"
+  dueTime: string;        // "HH:MM" (24h stored, 12h displayed)
  allDay: boolean;
  assigneeId: string | null;
  repeatProfileId: string | null;
  seriesId: string | null;      // For repeating tasks
  isTemplate: boolean;          // Series template
  reminderOffset: string | null; // e.g., "5m", "1h", "1d"
  createdAt: Date;
  updatedAt: Date;
  subtasks: Subtask[];
@@ -150,6 +316,8 @@ carry-your-live/
  name: string;
  color: '#HEX';
  order: number;
  createdAt: Date;
  updatedAt: Date;
 }
 ```
@@ -158,14 +326,47 @@ carry-your-live/
 {
  id: string;
  taskId: string;
  parentSubtaskId: string | null;  // For nesting
  title: string;
  completed: boolean;
  order: number;
  assigneeId: string | null;
  createdAt: Date;
  updatedAt: Date;
 }
 ```
 ### Repeat Profile
 ```typescript
 {
  id: string;
  name: string;
  frequency: 'daily' | 'weekly' | 'monthly' | 'yearly' | 'custom';
  interval: number;
  daysOfWeek: number[];      // 0-6 for weekly
  dayOfMonth: number | null; // For monthly
  monthOfYear: number | null; // For yearly
  endDate: number | null;    // Timestamp
  occurrences: number | null;
  createdAt: Date;
  updatedAt: Date;
 }
 ```
 ### Friendship
 ```typescript
 {
  id: string;
  userId: string;        // Requester
  friendId: string;      // Recipient
  status: 'pending' | 'accepted' | 'declined' | 'blocked';
  createdAt: Date;
  updatedAt: Date;
 }
 ```
 ---
 ## Default Categories
 | Name | Color | Order |
 |------|-------|-------|
@@ -176,6 +377,8 @@ carry-your-live/
 | Health | #8E24AA (Purple) | 4 |
 | Finance | #FDD835 (Yellow) | 5 |
 ---
 ## Priority Colors
 | Priority | Color |
 |----------|-------|
@@ -185,6 +388,8 @@ carry-your-live/
 | High | #E53935 |
 | Critical | #B71C1C |
 ---
 ## Getting Started
 ### Prerequisites
@@ -192,15 +397,23 @@ carry-your-live/
 - npm or yarn
 - Expo CLI (`npm install -g expo-cli`)
 - iOS Simulator (Mac) / Android Studio for mobile testing
 - PostgreSQL 16+ (or Docker)
 ### Installation
 ```bash
 cd carry-your-live
 npm install
 cd ../backend
 npm install
 ```
 ### Development
 #### Frontend
 ```bash
 cd carry-your-live
 # Start Expo dev server
 npx expo start
@@ -210,6 +423,37 @@ npx expo start --android
 npx expo start --web
 ```
 #### Backend
 ```bash
 cd backend
 # Start PostgreSQL (Docker)
 docker-compose up -d postgres
 # Configure environment
 cp .env.example .env
 # Edit .env with your settings
 # Run migrations
 npm run db:push
 # Start dev server
 npm run dev
 ```
 Server runs at `http://localhost:3000` (health check: `GET /health`)
 #### Desktop (Electron)
 ```bash
 cd carry-your-live
 # Development with live reload
 npm run desktop:dev
 # Production build
 npm run desktop:dist
 ```
 ### Building
 #### EAS Build (cloud)
@@ -225,18 +469,16 @@ eas build --platform ios
 eas build --platform android
 eas build --platform web
 ```
-Profiles are defined in `eas.json` (`development`, `preview`, `production`; production auto-increments version code).
+Profiles defined in `eas.json` (`development`, `preview`, `production`; production auto-increments version code).
 #### Gradle (local Android APK)
 The native Android project lives in `carry-your-live/android/`. Requires JDK 17+ and the Android SDK (platform 35, build-tools 35.0.0, NDK 27.1).
 ```bash
 cd carry-your-live/android
 # Debug APK (unsigned)
 ./gradlew assembleDebug
-# Release APK (currently signed with the debug keystore)
+# Release APK (signed with debug keystore)
 ./gradlew assembleRelease
 ```
 Output:
@@ -244,24 +486,21 @@ Output:
 android/app/build/outputs/apk/debug/app-debug.apk
 android/app/build/outputs/apk/release/app-release.apk
 ```
-Key notes:
+
- The debug keystore (`android/app/debug.keystore`) is generated by the CI pipeline and must exist for release builds — create it locally with the same command used in the pipeline (see below) if it's missing.
+---
 - Release builds use `signingConfig signingConfigs.debug` until a production keystore is configured.
 - Versions are set in `android/app/build.gradle` (`versionCode`, `versionName`).
 ## CI/CD Pipeline (Gitea Actions)
-`.gitea/workflows/build-apk.yml` builds a release APK on every push to `main` (also manually triggerable via workflow_dispatch):
+`.gitea/workflows/build-apk.yml` builds a release APK on every push to `main` (also manually triggerable via `workflow_dispatch`):
 1. **Checkout** and setup Node 22, JDK 17 (Temurin)
 2. **Android SDK**: installs cmdline-tools, licenses, platform-tools, `platforms;android-35`, `build-tools;35.0.0`, `ndk;27.1.12297006`
 3. **JS deps**: `npm ci` in `carry-your-live/`
-4. **Debug keystore**: generates `carry-your-live/android/app/debug.keystore` with `keytool` (alias `androiddebugkey`, passwords `android`)
+4. **Debug keystore**: generates `carry-your-live/android/app/debug.keystore` with `keytool`
 5. **Build**: `./gradlew assembleRelease` in `carry-your-live/android/`
-6. **Upload**: the APK is saved as the `carry-your-live-release` artifact (downloadable from the run's artifacts page)
+6. **Upload**: APK saved as `carry-your-live-release` artifact
 To run the build locally exactly as CI does:
 To run locally exactly as CI does:
 ```bash
 keytool -genkeypair -v \
  -keystore carry-your-live/android/app/debug.keystore \
@@ -271,48 +510,119 @@ keytool -genkeypair -v \
 cd carry-your-live/android && ./gradlew assembleRelease
 ```
-## Sync API Specification
+---
-The app expects a custom API at `http://localhost:3000/api` (configurable in `src/database/sync.ts`):
+## Backend API Specification
-### Pull Changes
+Server runs at `http://localhost:3000/api` (configurable in `src/services/api.ts` and `src/database/sync.ts`):
-```
+
-GET /sync?since={timestamp}
+### Authentication
-```
+- `POST /api/auth/register` - Register new user
-Response:
+- `POST /api/auth/login` - Login (returns access + refresh tokens)
 - `POST /api/auth/refresh` - Refresh access token
 - `POST /api/auth/forgot-password` - Request password reset
 - `POST /api/auth/reset-password` - Reset password with token
 - `GET /api/auth/me` - Get current user
 ### Categories
 - `GET /api/categories` - List categories
 - `POST /api/categories` - Create category
 - `PATCH /api/categories/:id` - Update category
 - `DELETE /api/categories/:id` - Delete category
 ### Tasks
 - `GET /api/tasks` - List tasks (with filters: category, completed, due date range, assignee)
 - `GET /api/tasks/:id` - Get task with subtasks
 - `POST /api/tasks` - Create task
 - `PATCH /api/tasks/:id` - Update task
 - `DELETE /api/tasks/:id` - Delete task (scopes: this/future/all for repeating)
 - `POST /api/tasks/batch` - Batch operations
 ### Subtasks
 - `GET /api/subtasks/task/:taskId` - List subtasks for task
 - `POST /api/subtasks/task/:taskId` - Create subtask
 - `PATCH /api/subtasks/:id` - Update subtask
 - `DELETE /api/subtasks/:id` - Delete subtask
 ### Repeat Profiles
 - `GET /api/repeat-profiles` - List repeat profiles
 - `POST /api/repeat-profiles` - Create repeat profile
 - `PATCH /api/repeat-profiles/:id` - Update repeat profile
 - `DELETE /api/repeat-profiles/:id` - Delete repeat profile
 ### Users
 - `GET /api/users/me` - Get user with settings
 - `PATCH /api/users/me/settings` - Update settings (darkMode, defaultCategoryId, sortOrder, etc.)
 - `GET /api/users/search` - Search users (for friends)
 ### Friends
 - `GET /api/friends` - List accepted friends
 - `GET /api/friends/requests` - List pending requests (incoming/outgoing)
 - `POST /api/friends/request` - Send friend request
 - `PATCH /api/friends/request/:id/accept` - Accept request
 - `PATCH /api/friends/request/:id/decline` - Decline request
 - `DELETE /api/friends/:id` - Remove friend
 ### Sync (Offline-first)
 - `GET /api/sync?since=<timestamp>` - Pull changes since timestamp
 - `POST /api/sync/push` - Push local changes
 ---
 ## Sync Protocol
 The sync endpoint uses a cursor-based approach with tombstones:
 1. **Pull**: Client sends `since` timestamp, server returns all changes since then
   ```json
   {
-  "categories": [{ "id", "name", "color", "order", "createdAt", "updatedAt" }],
+     "categories": [...],
-  "tasks": [{ "id", "title", "description", "categoryId", "priority", "completed", "dueDate", "dueTime", "createdAt", "updatedAt" }],
+     "tasks": [...],
-  "subtasks": [{ "id", "taskId", "title", "completed", "order", "createdAt", "updatedAt" }],
+     "subtasks": [...],
     "repeatProfiles": [...],
     "friendships": [...],
     "tombstones": [...],
     "timestamp": 1234567890
   }
   ```
-### Push Changes
+2. **Push**: Client sends batched changes with `lastPulledAt`
 ```
 POST /sync/push
 ```
 Body:
   ```json
   {
     "changes": {
       "categories": [...],
       "tasks": [...],
-    "subtasks": [...]
+       "subtasks": [...],
       "repeatProfiles": [...],
       "friendships": [...]
     },
     "tombstones": [...],
     "lastPulledAt": 1234567890
   }
   ```
 3. **Conflict Resolution**: Last-write-wins based on `updatedAt` (customizable in `src/database/sync.ts`)
 ---
 ## Configuration
-### Environment Variables
+### Frontend Environment Variables
-Create `.env` file:
+Create `.env` file in `carry-your-live/`:
 ```
 EXPO_PUBLIC_API_URL=http://your-api-url/api
 ```
 ### Backend Environment Variables
 Create `.env` file in `backend/`:
 ```
 DATABASE_URL=postgresql://user:pass@localhost:5432/carry_your_live
 JWT_SECRET=your-32-char-secret
 PORT=3000
 NODE_ENV=development
 FRONTEND_URL=http://localhost:8081
 ```
 ### App Config
 Modify `app.json` for:
 - App name, slug, version
@@ -320,10 +630,12 @@ Modify `app.json` for:
 - Permissions (notifications, etc.)
 - Orientation, theme
 ---
 ## Visual Style Guide
- **Background**: White (#FFFFFF)
+- **Background**: White (#FFFFFF) / Dark mode (planned)
- **Primary Accent**: #E53935 (Pink/Red)
+- **Primary Accent**: #E53935 (Pink/Red) - customizable
 - **Typography**: Black (#212121) primary, #757575 secondary, #9E9E9E tertiary
 - **Borders**: Thin (#E0E0E0), selected #E53935
 - **Radius**: 16-20px for cards/buttons/inputs
@@ -331,11 +643,13 @@ Modify `app.json` for:
 - **Shadows**: Minimal (elevation 1-3)
 - **Animations**: 150-250ms, cubic easing
 ---
 ## Offline-First Architecture
 ```
 ┌─────────────┐     ┌──────────────┐     ┌─────────────┐
-│   Expo App  │────▶│ WatermelonDB │────▶│  Your API   │
+│   Expo App  │────▶│ WatermelonDB │────▶│  Backend    │
 │ (iOS/Android│     │  (SQLite)    │     │  (Postgres) │
 │    Web)     │◀───▶│  + Sync      │◀───▶│             │
 └─────────────┘     └──────────────┘     └─────────────┘
@@ -345,6 +659,79 @@ Modify `app.json` for:
 2. Reactive queries update UI instantly
 3. Background sync pushes/pulls changes
 4. Conflict resolution: last-write-wins (customizable)
 5. Tombstones track deletions for sync
 ---
 ## Current Implementation Status
 Based on code audit (August 2026):
 | Feature | Status | Notes |
 |---------|--------|-------|
 | Core CRUD (tasks, subtasks, categories) | ✅ Complete | |
 | Nested subtasks | ✅ Complete | Unlimited depth |
 | Repeating tasks | ✅ Complete | Profiles, series, this/future/all delete |
 | Categories & priorities | ✅ Complete | |
 | Calendar with date strip | ✅ Complete | Month nav, day detail |
 | Stats screen | ✅ Complete | Client-side only |
 | Settings screen | ✅ Complete | Most settings wired |
 | Friends system | ✅ Complete | Backend + UI |
 | Task assignees | ✅ Complete | Schema v7, UI, sync |
 | QuickAddBar | ✅ Complete | Tasks + Calendar |
 | Offline sync (WatermelonDB) | ✅ Complete | Schema v21, tombstones |
 | Backend API | ✅ Complete | Express + Drizzle + Postgres |
 | Auth (JWT) | ✅ Complete | Register, login, refresh, forgot/reset |
 | Dark mode / theme toggle | ❌ Missing | Backend column exists, UI not implemented |
 | Notifications toggle | 🟡 Partial | Stored but not respected |
 | Global reminder preference | 🟡 Partial | Stored but not applied |
 | Forgot/reset password UI | 🟡 Partial | Backend done, no client UI |
 | Pull-to-refresh → sync | 🟡 Partial | Reloads local only |
 | Client settings sync | 🟡 Partial | AsyncStorage only, not synced to backend |
 | Reminder enum mismatch | 🟡 Partial | Client uses '5m'/'1h', spec uses minutes |
 ---
 ## Roadmap Highlights
 ### v1.1.0 — Friends & Assignees (Current Unreleased)
 - Ship existing Unreleased changes
 - Fix notifications toggle, wire up `rescheduleAllReminders()`
 - Apply global reminder preference
 - Make pull-to-refresh trigger real sync
 - Add forgot/reset password UI
 - Unify reminder offset enums
 ### v1.2.0 — Theming & Findability
 - Light mode + follow-system-theme
 - Sync all settings to `PATCH /users/me/settings`
 - Task search (filter + global)
 - Friend request badges/indicators
 ### v1.3.0 — Stats & Insights
 - Persisted stats snapshots
 - Productivity trends, streaks
 - Export stats (CSV/image)
 ### v1.4.0 — Quick Capture & Calendar UX
 - Natural language quick-add
 - Drag-and-drop rescheduling in calendar
 - Month grid view
 - "Today at a glance" dashboard
 ### v1.5.0 — Power Tools & Personalization
 - Task templates, soft-archive, attachments
 - Markdown support, deep links
 - Biometric lock, haptics, reduced motion
 - Android home-screen widget
 ### v2.0.0 — Collaboration
 - Real task assignment delivery
 - Shared lists with permissions
 - Server push notifications (FCM/APNs)
 - Comments/activity feed
 ---
 ## Contributing
@@ -353,6 +740,9 @@ Modify `app.json` for:
 3. Write components with React Hook Form + Zod
 4. Use WatermelonDB decorators for models
 5. Test offline scenarios
 6. Run `npm run lint` and `npm run typecheck` before committing
 ---
 ## License
@@ -41,4 +41,3 @@ yarn-error.*
 # generated native folders
 /ios
 /android
@@ -0,0 +1,19 @@
 # OSX
 #
 .DS_Store
 # Android/IntelliJ
 #
 build/
 .idea
 .gradle
 local.properties
 *.iml
 *.hprof
 .cxx/
 # generated inline modules
 app/src/main/java/inline/
 # Bundle artifacts
 *.jsbundle
@@ -0,0 +1,194 @@
 apply plugin: "com.android.application"
 apply plugin: "org.jetbrains.kotlin.android"
 apply plugin: "com.facebook.react"
 def projectRoot = rootDir.getAbsoluteFile().getParentFile().getAbsolutePath()
 /**
 * This is the configuration block to customize your React Native Android app.
 * By default you don't need to apply any configuration, just uncomment the lines you need.
 */
 react {
    entryFile = file(["node", "-e", "require('expo/scripts/resolveAppEntry')", projectRoot, "android", "absolute"].execute(null, rootDir).text.trim())
    reactNativeDir = new File(["node", "--print", "require.resolve('react-native/package.json')"].execute(null, rootDir).text.trim()).getParentFile().getAbsoluteFile()
    hermesCommand = new File(["node", "--print", "require.resolve('hermes-compiler/package.json', { paths: [require.resolve('react-native/package.json')] })"].execute(null, rootDir).text.trim()).getParentFile().getAbsolutePath() + "/hermesc/%OS-BIN%/hermesc"
    codegenDir = new File(["node", "--print", "require.resolve('@react-native/codegen/package.json', { paths: [require.resolve('react-native/package.json')] })"].execute(null, rootDir).text.trim()).getParentFile().getAbsoluteFile()
    enableBundleCompression = (findProperty('android.enableBundleCompression') ?: false).toBoolean()
    // Use Expo CLI to bundle the app, this ensures the Metro config
    // works correctly with Expo projects.
    cliFile = new File(["node", "--print", "require.resolve('@expo/cli', { paths: [require.resolve('expo/package.json')] })"].execute(null, rootDir).text.trim())
    bundleCommand = "export:embed"
    /* Folders */
     //   The root of your project, i.e. where "package.json" lives. Default is '../..'
    // root = file("../../")
    //   The folder where the react-native NPM package is. Default is ../../node_modules/react-native
    // reactNativeDir = file("../../node_modules/react-native")
    //   The folder where the react-native Codegen package is. Default is ../../node_modules/@react-native/codegen
    // codegenDir = file("../../node_modules/@react-native/codegen")
    /* Variants */
    //   The list of variants to that are debuggable. For those we're going to
    //   skip the bundling of the JS bundle and the assets. By default is just 'debug'.
    //   If you add flavors like lite, prod, etc. you'll have to list your debuggableVariants.
    // debuggableVariants = ["liteDebug", "prodDebug"]
    /* Bundling */
    //   A list containing the node command and its flags. Default is just 'node'.
    // nodeExecutableAndArgs = ["node"]
    //
    //   The path to the CLI configuration file. Default is empty.
    // bundleConfig = file(../rn-cli.config.js)
    //
    //   The name of the generated asset file containing your JS bundle
    // bundleAssetName = "MyApplication.android.bundle"
    //
    //   The entry file for bundle generation. Default is 'index.android.js' or 'index.js'
    // entryFile = file("../js/MyApplication.android.js")
    //
    //   A list of extra flags to pass to the 'bundle' commands.
    //   See https://github.com/react-native-community/cli/blob/main/docs/commands.md#bundle
    // extraPackagerArgs = []
    /* Hermes Commands */
    //   The hermes compiler command to run. By default it is 'hermesc'
    // hermesCommand = "$rootDir/my-custom-hermesc/bin/hermesc"
    //
    //   The list of flags to pass to the Hermes compiler. By default is "-O", "-output-source-map"
    // hermesFlags = ["-O", "-output-source-map"]
    /* Autolinking */
    autolinkLibrariesWithApp()
 }
 /**
 * Set this to true in release builds to optimize the app using [R8](https://developer.android.com/topic/performance/app-optimization/enable-app-optimization).
 */
 def enableMinifyInReleaseBuilds = (findProperty('android.enableMinifyInReleaseBuilds') ?: false).toBoolean()
 /**
 * The preferred build flavor of JavaScriptCore (JSC)
 *
 * For example, to use the international variant, you can use:
 * `def jscFlavor = 'org.webkit:android-jsc-intl:+'`
 *
 * The international variant includes ICU i18n library and necessary data
 * allowing to use e.g. `Date.toLocaleString` and `String.localeCompare` that
 * give correct results when using with locales other than en-US. Note that
 * this variant is about 6MiB larger per architecture than default.
 */
 def jscFlavor = 'io.github.react-native-community:jsc-android:2026004.+'
 android {
    ndkVersion = rootProject.ext.ndkVersion
    buildToolsVersion = rootProject.ext.buildToolsVersion
    compileSdk = rootProject.ext.compileSdkVersion
    namespace = 'com.anonymous.carryyourlive'
    defaultConfig {
        applicationId = 'com.anonymous.carryyourlive'
        minSdkVersion = rootProject.ext.minSdkVersion
        targetSdkVersion = rootProject.ext.targetSdkVersion
        versionCode 1
        versionName "1.0.0"
        buildConfigField "String", "REACT_NATIVE_RELEASE_LEVEL", "\"${findProperty('reactNativeReleaseLevel') ?: 'stable'}\""
    }
    signingConfigs {
        debug {
            storeFile file('debug.keystore')
            storePassword 'android'
            keyAlias 'androiddebugkey'
            keyPassword 'android'
        }
        release {
            if (project.hasProperty('releaseSigningProperties')) {
                def propsFile = file(project.property('releaseSigningProperties'))
                if (propsFile.exists()) {
                    def props = new Properties()
                    props.load(new FileInputStream(propsFile))
                    storeFile = file(props['storeFile'])
                    storePassword = props['storePassword']
                    keyAlias = props['keyAlias']
                    keyPassword = props['keyPassword']
                }
            }
        }
    }
    buildTypes {
        debug {
            signingConfig = signingConfigs.debug
        }
        release {
            signingConfig = signingConfigs.release
            def enableShrinkResources = findProperty('android.enableShrinkResourcesInReleaseBuilds') ?: 'false'
            shrinkResources = enableShrinkResources.toBoolean()
            minifyEnabled enableMinifyInReleaseBuilds
            proguardFiles getDefaultProguardFile("proguard-android.txt"), "proguard-rules.pro"
            def enablePngCrunchInRelease = findProperty('android.enablePngCrunchInReleaseBuilds') ?: 'true'
            crunchPngs = enablePngCrunchInRelease.toBoolean()
        }
    }
    packagingOptions {
        jniLibs {
            def enableLegacyPackaging = findProperty('expo.useLegacyPackaging') ?: 'false'
            useLegacyPackaging = enableLegacyPackaging.toBoolean()
        }
    }
    androidResources {
        ignoreAssetsPattern = '!.svn:!.git:!.ds_store:!*.scc:!CVS:!thumbs.db:!picasa.ini:!*~'
    }
 }
 // Apply static values from `gradle.properties` to the `android.packagingOptions`
 // Accepts values in comma delimited lists, example:
 // android.packagingOptions.pickFirsts=/LICENSE,**/picasa.ini
 ["pickFirsts", "excludes", "merges", "doNotStrip"].each { prop ->
    // Split option: 'foo,bar' -> ['foo', 'bar']
    def options = (findProperty("android.packagingOptions.$prop") ?: "").split(",");
    // Trim all elements in place.
    for (i in 0..<options.size()) options[i] = options[i].trim();
    // `[] - ""` is essentially `[""].filter(Boolean)` removing all empty strings.
    options -= ""
    if (options.length > 0) {
        println "android.packagingOptions.$prop += $options ($options.length)"
        // Ex: android.packagingOptions.pickFirsts += '**/SCCS/**'
        options.each {
            android.packagingOptions[prop] += it
        }
    }
 }
 dependencies {
    // The version of react-native is set by the React Native Gradle Plugin
    implementation("com.facebook.react:react-android")
    def isGifEnabled = (findProperty('expo.gif.enabled') ?: "") == "true";
    def isWebpEnabled = (findProperty('expo.webp.enabled') ?: "") == "true";
    def isWebpAnimatedEnabled = (findProperty('expo.webp.animated') ?: "") == "true";
    if (isGifEnabled) {
        // For animated gif support
        implementation("com.facebook.fresco:animated-gif:${expoLibs.versions.fresco.get()}")
    }
    if (isWebpEnabled) {
        // For webp support
        implementation("com.facebook.fresco:webpsupport:${expoLibs.versions.fresco.get()}")
        if (isWebpAnimatedEnabled) {
            // Animated webp support
            implementation("com.facebook.fresco:animated-webp:${expoLibs.versions.fresco.get()}")
        }
    }
    if (hermesEnabled.toBoolean()) {
        implementation("com.facebook.react:hermes-android")
    } else {
        implementation jscFlavor
    }
 }
@@ -0,0 +1,14 @@
 # Add project specific ProGuard rules here.
 # By default, the flags in this file are appended to flags specified
 # in /usr/local/Cellar/android-sdk/24.3.3/tools/proguard/proguard-android.txt
 # You can edit the include path and order by changing the proguardFiles
 # directive in build.gradle.
 #
 # For more details, see
 #   http://developer.android.com/guide/developing/tools/proguard.html
 # react-native-reanimated
 -keep class com.swmansion.reanimated.** { *; }
 -keep class com.facebook.react.turbomodule.** { *; }
 # Add any project specific keep options here:
@@ -0,0 +1,7 @@
 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
    <application android:usesCleartextTraffic="true" tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" tools:replace="android:usesCleartextTraffic" />
 </manifest>
@@ -0,0 +1,7 @@
 <manifest xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">
    <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
    <application android:usesCleartextTraffic="true" tools:targetApi="28" tools:ignore="GoogleAppIndexingWarning" tools:replace="android:usesCleartextTraffic" />
 </manifest>
@@ -0,0 +1,36 @@
 <manifest xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools">
  <uses-permission android:name="android.permission.INTERNET"/>
  <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" android:maxSdkVersion="32" tools:replace="android:maxSdkVersion"/>
  <uses-permission android:name="android.permission.SYSTEM_ALERT_WINDOW"/>
  <uses-permission android:name="android.permission.VIBRATE"/>
  <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" android:maxSdkVersion="32" tools:replace="android:maxSdkVersion"/>
  <queries>
    <intent>
      <action android:name="android.intent.action.VIEW"/>
      <category android:name="android.intent.category.BROWSABLE"/>
      <data android:scheme="https"/>
    </intent>
  </queries>
  <application android:name=".MainApplication" android:label="@string/app_name" android:icon="@mipmap/ic_launcher" android:roundIcon="@mipmap/ic_launcher_round" android:allowBackup="true" android:theme="@style/AppTheme" android:supportsRtl="true" android:enableOnBackInvokedCallback="false" android:usesCleartextTraffic="true">
    <meta-data android:name="com.google.firebase.messaging.default_notification_color" android:resource="@color/notification_icon_color"/>
    <meta-data android:name="com.google.firebase.messaging.default_notification_icon" android:resource="@drawable/notification_icon"/>
    <meta-data android:name="expo.modules.notifications.default_notification_color" android:resource="@color/notification_icon_color"/>
    <meta-data android:name="expo.modules.notifications.default_notification_icon" android:resource="@drawable/notification_icon"/>
    <meta-data android:name="expo.modules.updates.ENABLED" android:value="false"/>
    <meta-data android:name="expo.modules.updates.ENABLE_BSDIFF_PATCH_SUPPORT" android:value="true"/>
    <meta-data android:name="expo.modules.updates.EXPO_UPDATES_CHECK_ON_LAUNCH" android:value="ALWAYS"/>
    <meta-data android:name="expo.modules.updates.EXPO_UPDATES_LAUNCH_WAIT_MS" android:value="0"/>
    <activity android:name=".MainActivity" android:configChanges="keyboard|keyboardHidden|orientation|screenSize|screenLayout|uiMode|smallestScreenSize|assetsPaths" android:launchMode="singleTask" android:windowSoftInputMode="adjustResize" android:theme="@style/Theme.App.SplashScreen" android:exported="true" android:screenOrientation="portrait">
      <intent-filter>
        <action android:name="android.intent.action.MAIN"/>
        <category android:name="android.intent.category.LAUNCHER"/>
      </intent-filter>
      <intent-filter>
        <action android:name="android.intent.action.VIEW"/>
        <category android:name="android.intent.category.DEFAULT"/>
        <category android:name="android.intent.category.BROWSABLE"/>
        <data android:scheme="exp+carry-your-live"/>
      </intent-filter>
    </activity>
  </application>
 </manifest>
@@ -0,0 +1,61 @@
 package com.anonymous.carryyourlive
 import android.os.Build
 import android.os.Bundle
 import com.facebook.react.ReactActivity
 import com.facebook.react.ReactActivityDelegate
 import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint.fabricEnabled
 import com.facebook.react.defaults.DefaultReactActivityDelegate
 import expo.modules.ReactActivityDelegateWrapper
 class MainActivity : ReactActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {
    // Set the theme to AppTheme BEFORE onCreate to support
    // coloring the background, status bar, and navigation bar.
    // This is required for expo-splash-screen.
    setTheme(R.style.AppTheme);
    super.onCreate(null)
  }
  /**
   * Returns the name of the main component registered from JavaScript. This is used to schedule
   * rendering of the component.
   */
  override fun getMainComponentName(): String = "main"
  /**
   * Returns the instance of the [ReactActivityDelegate]. We use [DefaultReactActivityDelegate]
   * which allows you to enable New Architecture with a single boolean flags [fabricEnabled]
   */
  override fun createReactActivityDelegate(): ReactActivityDelegate {
    return ReactActivityDelegateWrapper(
          this,
          BuildConfig.IS_NEW_ARCHITECTURE_ENABLED,
          object : DefaultReactActivityDelegate(
              this,
              mainComponentName,
              fabricEnabled
          ){})
  }
  /**
    * Align the back button behavior with Android S
    * where moving root activities to background instead of finishing activities.
    * @see <a href="https://developer.android.com/reference/android/app/Activity#onBackPressed()">onBackPressed</a>
    */
  override fun invokeDefaultOnBackPressed() {
      if (Build.VERSION.SDK_INT <= Build.VERSION_CODES.R) {
          if (!moveTaskToBack(false)) {
              // For non-root activities, use the default implementation to finish them.
              super.invokeDefaultOnBackPressed()
          }
          return
      }
      // Use the default back button implementation on Android S
      // because it's doing more than [Activity.moveTaskToBack] in fact.
      super.invokeDefaultOnBackPressed()
  }
 }
@@ -0,0 +1,45 @@
 package com.anonymous.carryyourlive
 import android.app.Application
 import android.content.res.Configuration
 import com.facebook.react.PackageList
 import com.facebook.react.ReactApplication
 import com.facebook.react.ReactNativeApplicationEntryPoint.loadReactNative
 import com.facebook.react.ReactPackage
 import com.facebook.react.ReactHost
 import com.facebook.react.common.ReleaseLevel
 import com.facebook.react.defaults.DefaultNewArchitectureEntryPoint
 import expo.modules.ApplicationLifecycleDispatcher
 import expo.modules.ExpoReactHostFactory
 class MainApplication : Application(), ReactApplication {
  override val reactHost: ReactHost by lazy {
    ExpoReactHostFactory.getDefaultReactHost(
      context = applicationContext,
      packageList =
        PackageList(this).packages.apply {
          // Packages that cannot be autolinked yet can be added manually here, for example:
          // add(MyReactNativePackage())
        }
    )
  }
  override fun onCreate() {
    super.onCreate()
    DefaultNewArchitectureEntryPoint.releaseLevel = try {
      ReleaseLevel.valueOf(BuildConfig.REACT_NATIVE_RELEASE_LEVEL.uppercase())
    } catch (e: IllegalArgumentException) {
      ReleaseLevel.STABLE
    }
    loadReactNative(this)
    ApplicationLifecycleDispatcher.onApplicationCreate(this)
  }
  override fun onConfigurationChanged(newConfig: Configuration) {
    super.onConfigurationChanged(newConfig)
    ApplicationLifecycleDispatcher.onConfigurationChanged(this, newConfig)
  }
 }
@@ -0,0 +1,6 @@
 <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:drawable="@color/splashscreen_background"/>
  <item>
    <bitmap android:gravity="center" android:src="@drawable/splashscreen_logo"/>
  </item>
 </layer-list>
@@ -0,0 +1,37 @@
 <?xml version="1.0" encoding="utf-8"?>
 <!-- Copyright (C) 2014 The Android Open Source Project
     Licensed under the Apache License, Version 2.0 (the "License");
     you may not use this file except in compliance with the License.
     You may obtain a copy of the License at
          http://www.apache.org/licenses/LICENSE-2.0
     Unless required by applicable law or agreed to in writing, software
     distributed under the License is distributed on an "AS IS" BASIS,
     WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
     See the License for the specific language governing permissions and
     limitations under the License.
 -->
 <inset xmlns:android="http://schemas.android.com/apk/res/android"
       android:insetLeft="@dimen/abc_edit_text_inset_horizontal_material"
       android:insetRight="@dimen/abc_edit_text_inset_horizontal_material"
       android:insetTop="@dimen/abc_edit_text_inset_top_material"
       android:insetBottom="@dimen/abc_edit_text_inset_bottom_material"
       >
    <selector>
        <!--
          This file is a copy of abc_edit_text_material (https://bit.ly/3k8fX7I).
          The item below with state_pressed="false" and state_focused="false" causes a NullPointerException.
          NullPointerException:tempt to invoke virtual method 'android.graphics.drawable.Drawable android.graphics.drawable.Drawable$ConstantState.newDrawable(android.content.res.Resources)'
          <item android:state_pressed="false" android:state_focused="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
          For more info, see https://bit.ly/3CdLStv (react-native/pull/29452) and https://bit.ly/3nxOMoR.
        -->
        <item android:state_enabled="false" android:drawable="@drawable/abc_textfield_default_mtrl_alpha"/>
        <item android:drawable="@drawable/abc_textfield_activated_mtrl_alpha"/>
    </selector>
 </inset>
@@ -0,0 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
    <background android:drawable="@mipmap/ic_launcher_background"/>
    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
    <monochrome android:drawable="@mipmap/ic_launcher_monochrome"/>
 </adaptive-icon>
@@ -0,0 +1,6 @@
 <?xml version="1.0" encoding="utf-8"?>
 <adaptive-icon xmlns:android="http://schemas.android.com/apk/res/android">
    <background android:drawable="@mipmap/ic_launcher_background"/>
    <foreground android:drawable="@mipmap/ic_launcher_foreground"/>
    <monochrome android:drawable="@mipmap/ic_launcher_monochrome"/>
 </adaptive-icon>
@@ -0,0 +1,3 @@
 <resources>
  <color name="appBackground">#121212</color>
 </resources>
@@ -0,0 +1,7 @@
 <resources>
  <color name="splashscreen_background">#FFFFFF</color>
  <color name="iconBackground">#E6F4FE</color>
  <color name="colorPrimary">#023c69</color>
  <color name="notification_icon_color">#1E88E5</color>
  <color name="appBackground">#121212</color>
 </resources>
@@ -0,0 +1,3 @@
 <resources>
  <string name="app_name">carry-your-live</string>
 </resources>
@@ -0,0 +1,12 @@
 <resources xmlns:tools="http://schemas.android.com/tools">
  <style name="AppTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
    <item name="android:editTextBackground">@drawable/rn_edit_text_material</item>
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="android:statusBarColor">@android:color/transparent</item>
    <item name="android:navigationBarColor">@android:color/transparent</item>
    <item name="android:windowBackground">@color/appBackground</item>
  </style>
  <style name="Theme.App.SplashScreen" parent="AppTheme">
    <item name="android:windowBackground">@drawable/splashscreen_logo</item>
  </style>
 </resources>
@@ -0,0 +1,37 @@
 // Top-level build file where you can add configuration options common to all sub-projects/modules.
 buildscript {
  repositories {
    google()
    mavenCentral()
  }
  dependencies {
    classpath('com.android.tools.build:gradle')
    classpath('com.facebook.react:react-native-gradle-plugin')
    classpath('org.jetbrains.kotlin:kotlin-gradle-plugin')
  }
 }
 allprojects {
  repositories {
    google()
    mavenCentral()
        maven { url = 'https://www.jitpack.io' }
  }
 }
 apply plugin: "expo-root-project"
 apply plugin: "com.facebook.react.rootproject"
 subprojects {
  plugins.withId("com.android.library") {
    extensions.configure(com.android.build.api.dsl.LibraryExtension) {
      ndkVersion = rootProject.ext.ndkVersion
    }
  }
  plugins.withId("com.android.application") {
    extensions.configure(com.android.build.api.dsl.ApplicationExtension) {
      ndkVersion = rootProject.ext.ndkVersion
    }
  }
 }
@@ -0,0 +1,66 @@
 # Project-wide Gradle settings.
 # IDE (e.g. Android Studio) users:
 # Gradle settings configured through the IDE *will override*
 # any settings specified in this file.
 # For more details on how to configure your build environment visit
 # http://www.gradle.org/docs/current/userguide/build_environment.html
 # Specifies the JVM arguments used for the daemon process.
 # The setting is particularly useful for tweaking memory settings.
 # Default value: -Xmx512m -XX:MaxMetaspaceSize=256m
 org.gradle.jvmargs=-Xmx1536m -XX:MaxMetaspaceSize=1024m --add-opens=java.base/java.lang=ALL-UNNAMED --add-opens=java.base/java.io=ALL-UNNAMED
 org.gradle.workers.max=2
 # When configured, Gradle will run in incubating parallel mode.
 # This option should only be used with decoupled projects. More details, visit
 # http://www.gradle.org/docs/current/userguide/multi_project_builds.html#sec:decoupled_projects
 org.gradle.parallel=true
 # AndroidX package structure to make it clearer which packages are bundled with the
 # Android operating system, and which packages are packaged with your app's APK
 # https://developer.android.com/topic/libraries/support-library/androidx-rn
 android.useAndroidX=true
 # Enable AAPT2 PNG crunching
 android.enablePngCrunchInReleaseBuilds=true
 # Use this property to specify which architecture you want to build.
 # You can also override it from the CLI using
 # ./gradlew <task> -PreactNativeArchitectures=x86_64
 reactNativeArchitectures=armeabi-v7a,arm64-v8a,x86,x86_64
 # Use this property to enable support to the new architecture.
 # This will allow you to use TurboModules and the Fabric render in
 # your application. You should enable this flag either if you want
 # to write custom TurboModules/Fabric components OR use libraries that
 # are providing them. React Native 0.82+ always runs with the New
 # Architecture, so this flag is no longer honored and was removed.
 # Use this property to enable or disable the Hermes JS engine.
 # If set to false, you will be using JSC instead.
 hermesEnabled=true
 # Enable edge-to-edge display support.
 # This allows your app to draw behind system bars for an immersive UI.
 # Note: Only works with ReactActivity and should not be used with custom Activity.
 edgeToEdgeEnabled=true
 # Enable GIF support in React Native images (~200 B increase)
 expo.gif.enabled=true
 # Enable webp support in React Native images (~85 KB increase)
 expo.webp.enabled=true
 # Enable animated webp support (~3.4 MB increase)
 # Disabled by default because iOS doesn't support animated webp
 expo.webp.animated=false
 # Enable network inspector
 EX_DEV_CLIENT_NETWORK_INSPECTOR=true
 # Use legacy packaging to compress native libraries in the resulting APK.
 expo.useLegacyPackaging=false
 expo.inlineModules.watchedDirectories=[]
 # Enabled parallel sync for Gradle 9.4+
 org.gradle.tooling.parallel=true
@@ -0,0 +1,2 @@
 #This file is generated by updateDaemonJvm
 toolchainVersion=17
@@ -0,0 +1,7 @@
 distributionBase=GRADLE_USER_HOME
 distributionPath=wrapper/dists
 distributionUrl=https\://services.gradle.org/distributions/gradle-9.3.1-bin.zip
 networkTimeout=10000
 validateDistributionUrl=true
 zipStoreBase=GRADLE_USER_HOME
 zipStorePath=wrapper/dists
@@ -0,0 +1,248 @@
 #!/bin/sh
 #
 # Copyright © 2015 the original authors.
 #
 # Licensed under the Apache License, Version 2.0 (the "License");
 # you may not use this file except in compliance with the License.
 # You may obtain a copy of the License at
 #
 #      https://www.apache.org/licenses/LICENSE-2.0
 #
 # Unless required by applicable law or agreed to in writing, software
 # distributed under the License is distributed on an "AS IS" BASIS,
 # WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 # See the License for the specific language governing permissions and
 # limitations under the License.
 #
 # SPDX-License-Identifier: Apache-2.0
 #
 ##############################################################################
 #
 #   Gradle start up script for POSIX generated by Gradle.
 #
 #   Important for running:
 #
 #   (1) You need a POSIX-compliant shell to run this script. If your /bin/sh is
 #       noncompliant, but you have some other compliant shell such as ksh or
 #       bash, then to run this script, type that shell name before the whole
 #       command line, like:
 #
 #           ksh Gradle
 #
 #       Busybox and similar reduced shells will NOT work, because this script
 #       requires all of these POSIX shell features:
 #         * functions;
 #         * expansions «$var», «${var}», «${var:-default}», «${var+SET}»,
 #           «${var#prefix}», «${var%suffix}», and «$( cmd )»;
 #         * compound commands having a testable exit status, especially «case»;
 #         * various built-in commands including «command», «set», and «ulimit».
 #
 #   Important for patching:
 #
 #   (2) This script targets any POSIX shell, so it avoids extensions provided
 #       by Bash, Ksh, etc; in particular arrays are avoided.
 #
 #       The "traditional" practice of packing multiple parameters into a
 #       space-separated string is a well documented source of bugs and security
 #       problems, so this is (mostly) avoided, by progressively accumulating
 #       options in "$@", and eventually passing that to Java.
 #
 #       Where the inherited environment variables (DEFAULT_JVM_OPTS, JAVA_OPTS,
 #       and GRADLE_OPTS) rely on word-splitting, this is performed explicitly;
 #       see the in-line comments for details.
 #
 #       There are tweaks for specific operating systems such as AIX, CygWin,
 #       Darwin, MinGW, and NonStop.
 #
 #   (3) This script is generated from the Groovy template
 #       https://github.com/gradle/gradle/blob/HEAD/platforms/jvm/plugins-application/src/main/resources/org/gradle/api/internal/plugins/unixStartScript.txt
 #       within the Gradle project.
 #
 #       You can find Gradle at https://github.com/gradle/gradle/.
 #
 ##############################################################################
 # Attempt to set APP_HOME
 # Resolve links: $0 may be a link
 app_path=$0
 # Need this for daisy-chained symlinks.
 while
    APP_HOME=${app_path%"${app_path##*/}"}  # leaves a trailing /; empty if no leading path
    [ -h "$app_path" ]
 do
    ls=$( ls -ld "$app_path" )
    link=${ls#*' -> '}
    case $link in             #(
      /*)   app_path=$link ;; #(
      *)    app_path=$APP_HOME$link ;;
    esac
 done
 # This is normally unused
 # shellcheck disable=SC2034
 APP_BASE_NAME=${0##*/}
 # Discard cd standard output in case $CDPATH is set (https://github.com/gradle/gradle/issues/25036)
 APP_HOME=$( cd -P "${APP_HOME:-./}" > /dev/null && printf '%s\n' "$PWD" ) || exit
 # Use the maximum available, or set MAX_FD != -1 to use that value.
 MAX_FD=maximum
 warn () {
    echo "$*"
 } >&2
 die () {
    echo
    echo "$*"
    echo
    exit 1
 } >&2
 # OS specific support (must be 'true' or 'false').
 cygwin=false
 msys=false
 darwin=false
 nonstop=false
 case "$( uname )" in                #(
  CYGWIN* )         cygwin=true  ;; #(
  Darwin* )         darwin=true  ;; #(
  MSYS* | MINGW* )  msys=true    ;; #(
  NONSTOP* )        nonstop=true ;;
 esac
 # Determine the Java command to use to start the JVM.
 if [ -n "$JAVA_HOME" ] ; then
    if [ -x "$JAVA_HOME/jre/sh/java" ] ; then
        # IBM's JDK on AIX uses strange locations for the executables
        JAVACMD=$JAVA_HOME/jre/sh/java
    else
        JAVACMD=$JAVA_HOME/bin/java
    fi
    if [ ! -x "$JAVACMD" ] ; then
        die "ERROR: JAVA_HOME is set to an invalid directory: $JAVA_HOME
 Please set the JAVA_HOME variable in your environment to match the
 location of your Java installation."
    fi
 else
    JAVACMD=java
    if ! command -v java >/dev/null 2>&1
    then
        die "ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH.
 Please set the JAVA_HOME variable in your environment to match the
 location of your Java installation."
    fi
 fi
 # Increase the maximum file descriptors if we can.
 if ! "$cygwin" && ! "$darwin" && ! "$nonstop" ; then
    case $MAX_FD in #(
      max*)
        # In POSIX sh, ulimit -H is undefined. That's why the result is checked to see if it worked.
        # shellcheck disable=SC2039,SC3045
        MAX_FD=$( ulimit -H -n ) ||
            warn "Could not query maximum file descriptor limit"
    esac
    case $MAX_FD in  #(
      '' | soft) :;; #(
      *)
        # In POSIX sh, ulimit -n is undefined. That's why the result is checked to see if it worked.
        # shellcheck disable=SC2039,SC3045
        ulimit -n "$MAX_FD" ||
            warn "Could not set maximum file descriptor limit to $MAX_FD"
    esac
 fi
 # Collect all arguments for the java command, stacking in reverse order:
 #   * args from the command line
 #   * the main class name
 #   * -classpath
 #   * -D...appname settings
 #   * --module-path (only if needed)
 #   * DEFAULT_JVM_OPTS, JAVA_OPTS, and GRADLE_OPTS environment variables.
 # For Cygwin or MSYS, switch paths to Windows format before running java
 if "$cygwin" || "$msys" ; then
    APP_HOME=$( cygpath --path --mixed "$APP_HOME" )
    JAVACMD=$( cygpath --unix "$JAVACMD" )
    # Now convert the arguments - kludge to limit ourselves to /bin/sh
    for arg do
        if
            case $arg in                                #(
              -*)   false ;;                            # don't mess with options #(
              /?*)  t=${arg#/} t=/${t%%/*}              # looks like a POSIX filepath
                    [ -e "$t" ] ;;                      #(
              *)    false ;;
            esac
        then
            arg=$( cygpath --path --ignore --mixed "$arg" )
        fi
        # Roll the args list around exactly as many times as the number of
        # args, so each arg winds up back in the position where it started, but
        # possibly modified.
        #
        # NB: a `for` loop captures its iteration list before it begins, so
        # changing the positional parameters here affects neither the number of
        # iterations, nor the values presented in `arg`.
        shift                   # remove old arg
        set -- "$@" "$arg"      # push replacement arg
    done
 fi
 # Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
 DEFAULT_JVM_OPTS='"-Xmx64m" "-Xms64m"'
 # Collect all arguments for the java command:
 #   * DEFAULT_JVM_OPTS, JAVA_OPTS, and optsEnvironmentVar are not allowed to contain shell fragments,
 #     and any embedded shellness will be escaped.
 #   * For example: A user cannot expect ${Hostname} to be expanded, as it is an environment variable and will be
 #     treated as '${Hostname}' itself on the command line.
 set -- \
        "-Dorg.gradle.appname=$APP_BASE_NAME" \
        -jar "$APP_HOME/gradle/wrapper/gradle-wrapper.jar" \
        "$@"
 # Stop when "xargs" is not available.
 if ! command -v xargs >/dev/null 2>&1
 then
    die "xargs is not available"
 fi
 # Use "xargs" to parse quoted args.
 #
 # With -n1 it outputs one arg per line, with the quotes and backslashes removed.
 #
 # In Bash we could simply go:
 #
 #   readarray ARGS < <( xargs -n1 <<<"$var" ) &&
 #   set -- "${ARGS[@]}" "$@"
 #
 # but POSIX shell has neither arrays nor command substitution, so instead we
 # post-process each arg (as a line of input to sed) to backslash-escape any
 # character that might be a shell metacharacter, then use eval to reverse
 # that process (while maintaining the separation between arguments), and wrap
 # the whole thing up as a single "set" statement.
 #
 # This will of course break if any of these variables contains a newline or
 # an unmatched quote.
 #
 eval "set -- $(
        printf '%s\n' "$DEFAULT_JVM_OPTS $JAVA_OPTS $GRADLE_OPTS" |
        xargs -n1 |
        sed ' s~[^-[:alnum:]+,./:=@_]~\\&~g; ' |
        tr '\n' ' '
    )" '"$@"'
 exec "$JAVACMD" "$@"
@@ -0,0 +1,93 @@
@rem
@rem Copyright 2015 the original author or authors.
@rem
@rem Licensed under the Apache License, Version 2.0 (the "License");
@rem you may not use this file except in compliance with the License.
@rem You may obtain a copy of the License at
@rem
@rem      https://www.apache.org/licenses/LICENSE-2.0
@rem
@rem Unless required by applicable law or agreed to in writing, software
@rem distributed under the License is distributed on an "AS IS" BASIS,
@rem WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
@rem See the License for the specific language governing permissions and
@rem limitations under the License.
@rem
@rem SPDX-License-Identifier: Apache-2.0
@rem
@if "%DEBUG%"=="" @echo off
@rem ##########################################################################
@rem
@rem  Gradle startup script for Windows
@rem
@rem ##########################################################################
@rem Set local scope for the variables with windows NT shell
 if "%OS%"=="Windows_NT" setlocal
 set DIRNAME=%~dp0
 if "%DIRNAME%"=="" set DIRNAME=.
@rem This is normally unused
 set APP_BASE_NAME=%~n0
 set APP_HOME=%DIRNAME%
@rem Resolve any "." and ".." in APP_HOME to make it shorter.
 for %%i in ("%APP_HOME%") do set APP_HOME=%%~fi
@rem Add default JVM options here. You can also use JAVA_OPTS and GRADLE_OPTS to pass JVM options to this script.
 set DEFAULT_JVM_OPTS="-Xmx64m" "-Xms64m"
@rem Find java.exe
 if defined JAVA_HOME goto findJavaFromJavaHome
 set JAVA_EXE=java.exe
 %JAVA_EXE% -version >NUL 2>&1
 if %ERRORLEVEL% equ 0 goto execute
 echo. 1>&2
 echo ERROR: JAVA_HOME is not set and no 'java' command could be found in your PATH. 1>&2
 echo. 1>&2
 echo Please set the JAVA_HOME variable in your environment to match the 1>&2
 echo location of your Java installation. 1>&2
 goto fail
 :findJavaFromJavaHome
 set JAVA_HOME=%JAVA_HOME:"=%
 set JAVA_EXE=%JAVA_HOME%/bin/java.exe
 if exist "%JAVA_EXE%" goto execute
 echo. 1>&2
 echo ERROR: JAVA_HOME is set to an invalid directory: %JAVA_HOME% 1>&2
 echo. 1>&2
 echo Please set the JAVA_HOME variable in your environment to match the 1>&2
 echo location of your Java installation. 1>&2
 goto fail
 :execute
@rem Setup the command line
@rem Execute Gradle
 "%JAVA_EXE%" %DEFAULT_JVM_OPTS% %JAVA_OPTS% %GRADLE_OPTS% "-Dorg.gradle.appname=%APP_BASE_NAME%" -jar "%APP_HOME%\gradle\wrapper\gradle-wrapper.jar" %*
 :end
@rem End local scope for the variables with windows NT shell
 if %ERRORLEVEL% equ 0 goto mainEnd
 :fail
 rem Set variable GRADLE_EXIT_CONSOLE if you need the _script_ return code instead of
 rem the _cmd.exe /c_ return code!
 set EXIT_CODE=%ERRORLEVEL%
 if %EXIT_CODE% equ 0 set EXIT_CODE=1
 if not ""=="%GRADLE_EXIT_CONSOLE%" exit %EXIT_CODE%
 exit /b %EXIT_CODE%
 :mainEnd
 if "%OS%"=="Windows_NT" endlocal
 :omega
@@ -0,0 +1,42 @@
 pluginManagement {
  repositories {
    gradlePluginPortal()
  }
  def reactNativeGradlePlugin = new File(
    providers.exec {
      workingDir(rootDir)
      commandLine("node", "--print", "require.resolve('@react-native/gradle-plugin/package.json', { paths: [require.resolve('react-native/package.json')] })")
    }.standardOutput.asText.get().trim()
  ).getParentFile().absolutePath
  includeBuild(reactNativeGradlePlugin)
  def expoPluginsPath = new File(
    providers.exec {
      workingDir(rootDir)
      commandLine("node", "--print", "require.resolve('expo-modules-autolinking/package.json', { paths: [require.resolve('expo/package.json')] })")
    }.standardOutput.asText.get().trim(),
    "../android/expo-gradle-plugin"
  ).absolutePath
  includeBuild(expoPluginsPath)
 }
 plugins {
  id("com.facebook.react.settings")
  id("expo-autolinking-settings")
 }
 extensions.configure(com.facebook.react.ReactSettingsExtension) { ex ->
  if (System.getenv('EXPO_USE_COMMUNITY_AUTOLINKING') == '1') {
    ex.autolinkLibrariesFromCommand()
  } else {
    ex.autolinkLibrariesFromCommand(expoAutolinking.rnConfigCommand)
  }
 }
 expoAutolinking.useExpoModules()
 rootProject.name = 'carry-your-live'
 expoAutolinking.useExpoVersionCatalog()
 include ':app'
 includeBuild(expoAutolinking.reactNativeGradlePlugin)
@@ -34,7 +34,9 @@
          "color": "#1E88E5"
        }
      ],
-      "./plugins/withQuickAddWidget"
+      "./plugins/withQuickAddWidget",
      "expo-router",
      "expo-sqlite"
    ],
    "extra": {
      "eas": {
@@ -1,7 +1,7 @@
 import { Tabs } from 'expo-router';
 import React from 'react';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
-import { View, StyleSheet, TouchableOpacity } from 'react-native';
+import { View, StyleSheet, TouchableOpacity, Animated } from 'react-native';
 import { TabBarIcon } from '@/components/TabBarIcon';
 import { useSettings } from '@/theme';
 import { setLastVisitedTab } from '@/utils/tabHistory';
@@ -18,28 +18,29 @@ export default function TabLayout() {
        tabBarStyle: {
          backgroundColor: theme.tabBarBg,
          borderTopWidth: 0,
-          height: 84 + insets.bottom,
+          height: 56,
          paddingBottom: insets.bottom,
-          paddingTop: 12,
+          paddingTop: insets.top,
          paddingHorizontal: 16,
-          elevation: 0,
+          elevation: 4,
          shadowColor: '#000',
-          shadowOffset: { width: 0, height: -4 },
+          shadowOffset: { width: 0, height: 2 },
-          shadowOpacity: 0.12,
+          shadowOpacity: 0.1,
-          shadowRadius: 20,
+          shadowRadius: 8,
        },
        tabBarItemStyle: {
-          paddingVertical: 0,
+          paddingVertical: 6,
          paddingHorizontal: 12,
        },
        tabBarLabelStyle: {
-          fontSize: 11,
+          fontSize: 12,
-          fontWeight: '700',
+          fontWeight: '600',
-          marginTop: 4,
+          marginTop: 2,
        },
        headerShown: false,
        sceneStyle: { backgroundColor: theme.background },
      }}
-      tabBar={(props) => {
+      tabBar={props => {
        return (
          <View
            style={[
@@ -48,34 +49,49 @@ export default function TabLayout() {
                backgroundColor: theme.tabBarBg,
                paddingBottom: Math.max(props.insets.bottom, 8),
                shadowColor: '#000',
-              shadowOffset: { width: 0, height: -4 },
+                shadowOffset: { width: 0, height: 4 },
-              shadowOpacity: 0.12,
+                shadowOpacity: 0.1,
-              shadowRadius: 20,
+                shadowRadius: 8,
-              elevation: 8,
+                elevation: 4,
              },
            ]}
          >
-            {props.navigation.getState().routes.map((route) => {
+            {props.navigation.getState().routes.map(route => {
-              const focused = props.navigation.getState().index === props.navigation.getState().routes.indexOf(route);
+              const focused =
                props.navigation.getState().index ===
                props.navigation.getState().routes.indexOf(route);
              return (
                <TouchableOpacity
                  key={route.name}
                  style={[
                    styles.tabItem,
                    focused && styles.tabItemActive,
                    { backgroundColor: focused ? theme.accentSoft : 'transparent' },
                  ]}
                  onPress={() => props.navigation.navigate(route.name as never)}
                  accessibilityRole="button"
-                  accessibilityLabel={route.name === 'index' ? 'ToDo' : route.name.charAt(0).toUpperCase() + route.name.slice(1)}
+                  accessibilityLabel={
                    route.name === 'index'
                      ? 'ToDo'
                      : route.name.charAt(0).toUpperCase() + route.name.slice(1)
                  }
                  accessibilityState={{ selected: focused }}
                >
                  <Animated.View style={[styles.rippleContainer, { opacity: focused ? 1 : 0.5 }]}>
                    <TabBarIcon
-                    name={route.name === 'index' ? 'checklist' : route.name === 'calendar' ? 'calendar' : route.name === 'stats' ? 'stats' : 'gear'}
+                      name={
                        route.name === 'index'
                          ? 'checklist'
                          : route.name === 'calendar'
                            ? 'calendar'
                            : route.name === 'stats'
                              ? 'stats'
                              : 'gear'
                      }
                      focused={focused}
                      color={focused ? theme.accent : theme.textSecondary}
                      size={24}
                    />
                  </Animated.View>
                </TouchableOpacity>
              );
            })}
@@ -103,22 +119,23 @@ const styles = StyleSheet.create({
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-around',
-    paddingTop: 10,
+    paddingTop: 6,
    paddingHorizontal: 16,
  },
  tabItem: {
    flex: 1,
    alignItems: 'center',
-    paddingVertical: 8,
+    paddingVertical: 6,
-    paddingHorizontal: 8,
+    paddingHorizontal: 12,
-    borderRadius: 16,
+    borderRadius: 8,
    minWidth: 70,
  },
-  tabItemActive: {
+  rippleContainer: {
-    shadowColor: '#000',
+    width: 44,
-    shadowOffset: { width: 0, height: 2 },
+    height: 44,
-    shadowOpacity: 0.1,
+    borderRadius: 22,
-    shadowRadius: 8,
+    alignItems: 'center',
-    elevation: 4,
+    justifyContent: 'center',
    position: 'relative',
  },
 });
@@ -1,5 +1,15 @@
 import React, { useMemo, useRef, useState, useCallback, useEffect } from 'react';
-import { View, Text, StyleSheet, SafeAreaView, ScrollView, TouchableOpacity, Animated, Dimensions, KeyboardAvoidingView } from 'react-native';
+import {
  View,
  Text,
  StyleSheet,
  SafeAreaView,
  ScrollView,
  TouchableOpacity,
  Animated,
  Dimensions,
  KeyboardAvoidingView,
 } from 'react-native';
 import { useRouter, useFocusEffect } from 'expo-router';
 import { Gesture, GestureDetector } from 'react-native-gesture-handler';
 import { Header } from '@/components/Header';
@@ -15,7 +25,15 @@ import { OptionPickerModal } from '@/components/OptionPickerModal';
 import { TaskItem } from '@/components/TaskItem';
 import { SubtaskItem } from '@/components/SubtaskItem';
 import Task from '@/models/Task';
-import { format, addMonths, addDays, startOfMonth, isSameDay, isSameMonth, isToday } from 'date-fns';
+import {
  format,
  addMonths,
  addDays,
  startOfMonth,
  isSameDay,
  isSameMonth,
  isToday,
 } from 'date-fns';
 import Svg, { Path } from 'react-native-svg';
 import type { ThemeColors } from '@/theme';
 import type { TaskData, SubtaskData } from '@/types';
@@ -24,8 +42,18 @@ const WIDTH = Dimensions.get('window').width;
 const GERMAN_WEEKDAYS = ['mo', 'di', 'mi', 'do', 'fr', 'sa', 'so'];
 const PRIORITY_RANK: Record<string, number> = { none: 0, low: 1, medium: 2, high: 3, critical: 4 };
 const MONTH_NAMES = [
-  'January', 'February', 'March', 'April', 'May', 'June',
+  'January',
-  'July', 'August', 'September', 'October', 'November', 'December',
+  'February',
  'March',
  'April',
  'May',
  'June',
  'July',
  'August',
  'September',
  'October',
  'November',
  'December',
 ];
 export default function CalendarScreen() {
@@ -70,7 +98,9 @@ export default function CalendarScreen() {
    const sorted = [...selectedDayTasks];
    switch (sortBy) {
      case 'date':
-        sorted.sort((a, b) => (a.dueDate || Number.MAX_SAFE_INTEGER) - (b.dueDate || Number.MAX_SAFE_INTEGER));
+        sorted.sort(
          (a, b) => (a.dueDate || Number.MAX_SAFE_INTEGER) - (b.dueDate || Number.MAX_SAFE_INTEGER)
        );
        break;
      case 'priority':
        sorted.sort((a, b) => PRIORITY_RANK[b.priority] - PRIORITY_RANK[a.priority]);
@@ -118,10 +148,18 @@ export default function CalendarScreen() {
      animatingRef.current = true;
      const w = gridWidthRef.current || WIDTH;
      const target = dir === 1 ? -w : w;
-      Animated.timing(translateX.current, { toValue: target, duration: 220, useNativeDriver: false }).start(() => {
+      Animated.timing(translateX.current, {
        toValue: target,
        duration: 220,
        useNativeDriver: false,
      }).start(() => {
        setVisibleMonth(next);
        translateX.current.setValue(-target);
-        Animated.timing(translateX.current, { toValue: 0, duration: 180, useNativeDriver: false }).start(() => {
+        Animated.timing(translateX.current, {
          toValue: 0,
          duration: 180,
          useNativeDriver: false,
        }).start(() => {
          animatingRef.current = false;
        });
      });
@@ -148,11 +186,11 @@ export default function CalendarScreen() {
        .minDistance(6)
        .runOnJS(true)
        // eslint-disable-next-line react-hooks/refs
-        .onUpdate((e) => {
+        .onUpdate(e => {
          if (!animatingRef.current) translateX.current.setValue(e.translationX);
        })
        // eslint-disable-next-line react-hooks/refs
-        .onEnd((e) => {
+        .onEnd(e => {
          if (animatingRef.current) return;
          const w = gridWidthRef.current || WIDTH;
          const dx = e.translationX;
@@ -183,22 +221,26 @@ export default function CalendarScreen() {
  const monthOptions = MONTH_NAMES.map((label, i) => ({ value: String(i), label }));
  const yearOptions = useMemo(() => {
    const options: { value: string; label: string }[] = [];
-    for (let y = currentYear - 20; y <= currentYear + 10; y++) options.push({ value: String(y), label: String(y) });
+    for (let y = currentYear - 20; y <= currentYear + 10; y++)
      options.push({ value: String(y), label: String(y) });
    return options;
  }, [currentYear]);
-  const handleToggleComplete = useCallback(async (taskId: string) => {
+  const handleToggleComplete = useCallback(
    async (taskId: string) => {
      await confirmAndToggleTaskComplete(taskId, () => {
        refreshDayTasks();
        refreshMonthTasks();
        refreshSubtasks();
      });
-  }, [refreshDayTasks, refreshMonthTasks, refreshSubtasks]);
+    },
    [refreshDayTasks, refreshMonthTasks, refreshSubtasks]
  );
  const [expandedTasks, setExpandedTasks] = useState<Set<string>>(new Set());
  const toggleExpand = useCallback((taskId: string) => {
-    setExpandedTasks((prev) => {
+    setExpandedTasks(prev => {
      const next = new Set(prev);
      if (next.has(taskId)) {
        next.delete(taskId);
@@ -209,12 +251,15 @@ export default function CalendarScreen() {
    });
  }, []);
-  const handleSubtaskToggle = useCallback(async (subtaskId: string) => {
+  const handleSubtaskToggle = useCallback(
    async (subtaskId: string) => {
      await toggleSubtaskComplete(subtaskId);
      refreshDayTasks();
      refreshMonthTasks();
      refreshSubtasks();
-  }, [refreshDayTasks, refreshMonthTasks, refreshSubtasks]);
+    },
    [refreshDayTasks, refreshMonthTasks, refreshSubtasks]
  );
  return (
    <SafeAreaView style={[styles.container, { backgroundColor: theme.background }]}>
@@ -229,17 +274,28 @@ export default function CalendarScreen() {
            accessibilityLabel="Back"
          >
            <Svg width={20} height={20} viewBox="0 0 24 24">
-              <Path d="M15 18l-6-6 6-6" stroke="currentColor" strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+              <Path
                d="M15 18l-6-6 6-6"
                stroke="currentColor"
                strokeWidth={2.5}
                strokeLinecap="round"
                strokeLinejoin="round"
                fill="none"
              />
            </Svg>
          </TouchableOpacity>
        }
      />
      <KeyboardAvoidingView style={styles.kbAvoid} behavior="padding">
-      <ScrollView style={styles.scrollBody} showsVerticalScrollIndicator={false} contentContainerStyle={styles.scrollContent}>
+        <ScrollView
          style={styles.scrollBody}
          showsVerticalScrollIndicator={false}
          contentContainerStyle={styles.scrollContent}
        >
          <GestureDetector gesture={pan}>
            <Animated.View
-            onLayout={(e) => {
+              onLayout={e => {
                gridWidthRef.current = e.nativeEvent.layout.width;
              }}
              // eslint-disable-next-line react-hooks/refs
@@ -248,34 +304,73 @@ export default function CalendarScreen() {
              <View style={styles.monthRow}>
                <TouchableOpacity
                  onPress={() => transitionTo(-1)}
-                  style={[styles.monthNav, { borderColor: theme.borderStrong, backgroundColor: theme.card }]}
+                  style={[
                    styles.monthNav,
                    { borderColor: theme.borderStrong, backgroundColor: theme.card },
                  ]}
                  activeOpacity={0.7}
                >
                  <Svg width={20} height={20} viewBox="0 0 24 24">
-                    <Path d="M15 18l-6-6 6-6" stroke={theme.textSecondary} strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+                    <Path
                      d="M15 18l-6-6 6-6"
                      stroke={theme.textSecondary}
                      strokeWidth={2.5}
                      strokeLinecap="round"
                      strokeLinejoin="round"
                      fill="none"
                    />
                  </Svg>
                </TouchableOpacity>
                <View style={styles.monthSelectorGroup}>
-                  <TouchableOpacity onPress={() => setMonthPickerVisible(true)} activeOpacity={0.7} style={styles.monthButton}>
+                  <TouchableOpacity
-                    <Text style={[styles.monthLabel, { color: theme.text }]}>{format(visibleMonth, 'MMMM')}</Text>
+                    onPress={() => setMonthPickerVisible(true)}
                    activeOpacity={0.7}
                    style={styles.monthButton}
                  >
                    <Text style={[styles.monthLabel, { color: theme.text }]}>
                      {format(visibleMonth, 'MMMM')}
                    </Text>
                    <Svg width={14} height={14} viewBox="0 0 24 24">
-                      <Path d="M6 9l6 6 6-6" stroke={theme.textSecondary} strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+                      <Path
                        d="M6 9l6 6 6-6"
                        stroke={theme.textSecondary}
                        strokeWidth={2.5}
                        strokeLinecap="round"
                        strokeLinejoin="round"
                        fill="none"
                      />
                    </Svg>
                  </TouchableOpacity>
                </View>
-                <TouchableOpacity onPress={() => setYearPickerVisible(true)} activeOpacity={0.7} style={styles.yearButton}>
+                <TouchableOpacity
-                  <Text style={[styles.yearLabel, { color: theme.textMuted }]}>{format(visibleMonth, 'yyyy')}</Text>
+                  onPress={() => setYearPickerVisible(true)}
                  activeOpacity={0.7}
                  style={styles.yearButton}
                >
                  <Text style={[styles.yearLabel, { color: theme.textMuted }]}>
                    {format(visibleMonth, 'yyyy')}
                  </Text>
                </TouchableOpacity>
                <TouchableOpacity
                  onPress={() => transitionTo(1)}
-                  style={[styles.monthNav, { borderColor: theme.borderStrong, backgroundColor: theme.card }]}
+                  style={[
                    styles.monthNav,
                    { borderColor: theme.borderStrong, backgroundColor: theme.card },
                  ]}
                  activeOpacity={0.7}
                >
                  <Svg width={20} height={20} viewBox="0 0 24 24">
-                    <Path d="M9 6l6 6-6 6" stroke={theme.textSecondary} strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+                    <Path
                      d="M9 6l6 6-6 6"
                      stroke={theme.textSecondary}
                      strokeWidth={2.5}
                      strokeLinecap="round"
                      strokeLinejoin="round"
                      fill="none"
                    />
                  </Svg>
                </TouchableOpacity>
              </View>
@@ -290,7 +385,7 @@ export default function CalendarScreen() {
              {weeks.map((week, wi) => (
                <View key={wi} style={styles.weekRow}>
-                  {week.map((day) => (
+                  {week.map(day => (
                    <DayCell
                      key={day.toISOString()}
                      day={day}
@@ -309,7 +404,9 @@ export default function CalendarScreen() {
          </GestureDetector>
          <View style={styles.panelHeader}>
-              <Text style={[styles.panelDate, { color: theme.text }]}>{format(selectedDate, 'EEEE, MMMM d')}</Text>
+            <Text style={[styles.panelDate, { color: theme.text }]}>
              {format(selectedDate, 'EEEE, MMMM d')}
            </Text>
            {sortedDayTasks.length > 0 && (
              <Text style={[styles.panelCount, { color: theme.textFaint }]}>
                {sortedDayTasks.length} event{sortedDayTasks.length === 1 ? '' : 's'}
@@ -319,11 +416,15 @@ export default function CalendarScreen() {
          {sortedDayTasks.length === 0 ? (
            <View style={styles.emptyState}>
-                <Text style={[styles.emptyText, { color: theme.textSecondary }]}>No events on this day</Text>
+              <Text style={[styles.emptyText, { color: theme.textSecondary }]}>
-                <Text style={[styles.emptySubtext, { color: theme.textMuted }]}>Tap a date or use the bar below</Text>
+                No events on this day
              </Text>
              <Text style={[styles.emptySubtext, { color: theme.textMuted }]}>
                Tap a date or use the bar below
              </Text>
            </View>
          ) : (
-              sortedDayTasks.map((task) => {
+            sortedDayTasks.map(task => {
              const isExpanded = expandedTasks.has(task.id);
              const itemSubtasks = subtasksByTask.get(task.id) ?? [];
              return (
@@ -334,12 +435,12 @@ export default function CalendarScreen() {
                    subtasks={itemSubtasks}
                    categoryColor={categoryColors.get(task.categoryId)}
                    onToggle={() => handleToggleComplete(task.id)}
-                      onPress={(id) =>
+                    onPress={id =>
                      expandedTasks.has(id)
                        ? router.push({ pathname: '/task-detail', params: { id } })
                        : toggleExpand(id)
                    }
-                      onMenuOpen={(id) => openTaskEdit(id)}
+                    onMenuOpen={id => openTaskEdit(id)}
                    onSubtaskToggle={handleSubtaskToggle}
                  />
                </View>
@@ -419,7 +520,7 @@ const CalendarTaskRow = React.memo(function CalendarTaskRow({
      />
      {expanded && sortedSubtasks.length > 0 && (
        <View style={styles.subtaskList}>
-          {sortedSubtasks.map((sub) => (
+          {sortedSubtasks.map(sub => (
            <SubtaskItem
              key={sub.id}
              subtask={sub}
@@ -440,7 +541,11 @@ function cellTitle(tasks: Task[]): string | null {
  return `${tasks[0].title} +${tasks.length - 1}`;
 }
-function cellColor(tasks: Task[], categories: { id: string; color: string }[], theme: ThemeColors): string {
+function cellColor(
  tasks: Task[],
  categories: { id: string; color: string }[],
  theme: ThemeColors
 ): string {
  if (tasks.length === 0) return theme.textMuted;
  return theme.accent;
 }
@@ -456,11 +561,23 @@ interface DayCellProps {
  onPress: (day: Date) => void;
 }
-const DayCell = React.memo(function DayCell({ day, label, dotColor, selected, today, inMonth, theme, onPress }: DayCellProps) {
+const DayCell = React.memo(function DayCell({
  day,
  label,
  dotColor,
  selected,
  today,
  inMonth,
  theme,
  onPress,
 }: DayCellProps) {
  const styles = React.useMemo(() => createStyles(theme), [theme]);
  return (
    <TouchableOpacity
-      style={[styles.dayCell, selected && { backgroundColor: theme.accentSoft, borderColor: theme.accentBorder }]}
+      style={[
        styles.dayCell,
        selected && { backgroundColor: theme.accentSoft, borderColor: theme.accentBorder },
      ]}
      onPress={() => onPress(day)}
      activeOpacity={0.7}
    >
@@ -488,7 +605,8 @@ const DayCell = React.memo(function DayCell({ day, label, dotColor, selected, to
  );
 });
-const createStyles = (theme: ThemeColors) => StyleSheet.create({
+const createStyles = (theme: ThemeColors) =>
  StyleSheet.create({
    container: {
      flex: 1,
    },
@@ -1,5 +1,13 @@
 import React, { useCallback, useMemo, useState } from 'react';
-import { View, Text, StyleSheet, SafeAreaView, KeyboardAvoidingView, TouchableOpacity, BackHandler } from 'react-native';
+import {
  View,
  Text,
  StyleSheet,
  SafeAreaView,
  KeyboardAvoidingView,
  TouchableOpacity,
  BackHandler,
 } from 'react-native';
 import { useFocusEffect } from 'expo-router';
 import { Header } from '@/components/Header';
 import { CategoryFilter } from '@/components/CategoryFilter';
@@ -39,7 +47,10 @@ export default function TasksScreen() {
        <TouchableOpacity
          style={[
            styles.completedToggle,
-            { backgroundColor: theme.card, borderColor: showCompleted ? theme.accent : theme.borderStrong },
+            {
              backgroundColor: theme.card,
              borderColor: showCompleted ? theme.accent : theme.borderStrong,
            },
          ]}
          onPress={() => setShowCompleted(!showCompleted)}
          activeOpacity={0.8}
@@ -57,18 +68,27 @@ export default function TasksScreen() {
              fill="none"
            />
            {showCompleted && (
-              <Path d="M7 12.5l3.5 3.5 6.5-7" stroke={theme.accent} strokeWidth={2.2} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+              <Path
                d="M7 12.5l3.5 3.5 6.5-7"
                stroke={theme.accent}
                strokeWidth={2.2}
                strokeLinecap="round"
                strokeLinejoin="round"
                fill="none"
              />
            )}
          </Svg>
-          <Text style={[styles.completedToggleText, { color: showCompleted ? theme.text : theme.textMuted }]}>
+          <Text
            style={[
              styles.completedToggleText,
              { color: showCompleted ? theme.text : theme.textMuted },
            ]}
          >
            Completed
          </Text>
        </TouchableOpacity>
      </View>
-      <KeyboardAvoidingView
+      <KeyboardAvoidingView style={styles.kbAvoid} behavior="padding">
        style={styles.kbAvoid}
        behavior="padding"
      >
        <TaskList categoryIds={categoryIds} showCompleted={showCompleted} />
        <QuickAddBar />
      </KeyboardAvoidingView>
@@ -1,5 +1,18 @@
 import React, { useState, useCallback } from 'react';
-import { View, Text, StyleSheet, SafeAreaView, ScrollView, Switch, TouchableOpacity, Alert, Linking, Modal, Pressable, BackHandler } from 'react-native';
+import {
  View,
  Text,
  StyleSheet,
  SafeAreaView,
  ScrollView,
  Switch,
  TouchableOpacity,
  Alert,
  Linking,
  Modal,
  Pressable,
  BackHandler,
 } from 'react-native';
 import { useFocusEffect, useRouter } from 'expo-router';
 import { Header } from '@/components/Header';
 import { ListItem } from '@/components/ListItem';
@@ -10,7 +23,15 @@ import { FriendsModal } from '@/components/FriendsModal';
 import { LegalModal } from '@/components/LegalModal';
 import { ServerUrlModal } from '@/components/ServerUrlModal';
 import SyncStatus from '@/components/SyncStatus';
-import { useSettings, SORT_OPTIONS, REMINDER_OPTIONS, ACCENT_PRESETS, DEFAULT_ACCENT } from '@/theme';
+import {
  useSettings,
  SORT_OPTIONS,
  REMINDER_OPTIONS,
  ACCENT_PRESETS,
  DEFAULT_ACCENT,
  DEFAULT_ACCENT_OPACITY,
  ThemeMode,
 } from '@/theme';
 import { useCategories } from '@/hooks/useDatabase';
 import { getAuthUser, getAuthToken } from '@/services/auth';
 import { checkForUpdates, getCurrentAppVersion } from '@/services/updates';
@@ -24,9 +45,38 @@ import { getLastVisitedTab, tabHref } from '@/utils/tabHistory';
 export default function SettingsScreen() {
  const router = useRouter();
-  const { theme, notifications, setNotifications, defaultCategoryId, setDefaultCategoryId, sortBy, setSortBy, reminderPreference, setReminderPreference, tagReminderPreferences, setTagReminderPreferences, apiUrl, accentColor, setAccentColor, accentOpacity, setAccentOpacity, todoAheadDays, setTodoAheadDays, showCompleted, setShowCompleted, deleteBySwipe, setDeleteBySwipe } = useSettings();
+  const {
    theme,
    notifications,
    setNotifications,
    defaultCategoryId,
    setDefaultCategoryId,
    sortBy,
    setSortBy,
    reminderPreference,
    setReminderPreference,
    tagReminderPreferences,
    setTagReminderPreferences,
    apiUrl,
    accentColor,
    setAccentColor,
    accentOpacity,
    setAccentOpacity,
    todoAheadDays,
    setTodoAheadDays,
    showCompleted,
    setShowCompleted,
    deleteBySwipe,
    setDeleteBySwipe,
    themeMode,
    setThemeMode,
    syncSettingsToServer,
    loadSettingsFromServer,
  } = useSettings();
  const categories = useCategories();
-  const [picker, setPicker] = useState<null | 'category' | 'sort' | 'reminder' | 'todoAhead'>(null);
+  const [picker, setPicker] = useState<
    null | 'category' | 'sort' | 'reminder' | 'todoAhead' | 'themeMode'
  >(null);
  const [reminderTagPicker, setReminderTagPicker] = useState<Category | null>(null);
  const [editingCategory, setEditingCategory] = useState<Category | null | 'new'>(null);
  const [syncVisible, setSyncVisible] = useState(false);
@@ -38,16 +88,19 @@ export default function SettingsScreen() {
  const [draftAccentOpacity, setDraftAccentOpacity] = useState(accentOpacity);
  const [syncSubtitle, setSyncSubtitle] = useState('Checking...');
  const [updateSubtitle, setUpdateSubtitle] = useState('Tap to check');
  const [lastUpdateCheck, setLastUpdateCheck] = useState<string | null>(null);
  const handleCheckUpdates = async () => {
    setUpdateSubtitle('Checking...');
    const update = await checkForUpdates();
    if (!update) {
      setUpdateSubtitle('Up to date');
      setLastUpdateCheck(new Date().toLocaleString());
      Alert.alert('Up to date', `You're running the latest version (${getCurrentAppVersion()}).`);
      return;
    }
    setUpdateSubtitle(`${update.version} available`);
    setLastUpdateCheck(new Date().toLocaleString());
    const url = update.apkUrl ?? update.releaseUrl;
    Alert.alert('Update available', `Version ${update.version} is available for download.`, [
      { text: 'Later', style: 'cancel' },
@@ -60,6 +113,17 @@ export default function SettingsScreen() {
    ]);
  };
  const checkForUpdatesOnLoad = async () => {
    const update = await checkForUpdates();
    if (!update) {
      setUpdateSubtitle('Up to date');
      setLastUpdateCheck(new Date().toLocaleString());
      return;
    }
    setUpdateSubtitle(`${update.version} available`);
    setLastUpdateCheck(new Date().toLocaleString());
  };
  const refreshSyncStatus = async () => {
    const token = await getAuthToken();
    if (!token) {
@@ -70,7 +134,9 @@ export default function SettingsScreen() {
    const lastSync = await getLastSyncTime();
    if (user) {
      setSyncSubtitle(
-        lastSync ? `Signed in · synced ${formatSyncTime(lastSync)}` : `Signed in as ${user.username}`
+        lastSync
          ? `Signed in · synced ${formatSyncTime(lastSync)}`
          : `Signed in as ${user.username}`
      );
    } else {
      setSyncSubtitle('Not signed in');
@@ -84,6 +150,8 @@ export default function SettingsScreen() {
  useFocusEffect(
    useCallback(() => {
      refreshSyncStatus();
      checkForUpdatesOnLoad();
      const sub = BackHandler.addEventListener('hardwareBackPress', () => {
        const target = getLastVisitedTab();
        if (target && target !== 'settings') {
@@ -92,19 +160,18 @@ export default function SettingsScreen() {
        return true;
      });
      return () => sub.remove();
-    }, [router])
+    }, [refreshSyncStatus, router])
  );
-  const defaultCategory = categories.find((c) => c.id === defaultCategoryId);
+  const defaultCategory = categories.find(c => c.id === defaultCategoryId);
  const defaultCategoryLabel = defaultCategory?.name ?? 'None';
-  const reminderLabel = REMINDER_OPTIONS.find((o) => o.value === reminderPreference)?.label ?? 'No reminder';
+  const reminderLabel =
    REMINDER_OPTIONS.find(o => o.value === reminderPreference)?.label ?? 'No reminder';
  const tagReminderLabel = (categoryId: string) => {
    const selected = tagReminderPreferences[categoryId] ?? [];
    if (selected.length === 0) return `Default (${reminderLabel})`;
-    return selected
+    return selected.map(v => REMINDER_OPTIONS.find(o => o.value === v)?.label ?? v).join(', ');
      .map((v) => REMINDER_OPTIONS.find((o) => o.value === v)?.label ?? v)
      .join(', ');
  };
  const openCustomAccent = () => {
@@ -146,14 +213,12 @@ export default function SettingsScreen() {
      <Header title="Settings" showLogo={false} />
      <ScrollView contentContainerStyle={styles.content} showsVerticalScrollIndicator={false}>
        <Text style={[styles.sectionTitle, { color: theme.textMuted }]}>Tags</Text>
-        {categories.map((category) => (
+        {categories.map(category => (
          <ListItem
            key={category.id}
            title={category.name}
            subtitle={category.id === defaultCategoryId ? 'Default tag' : undefined}
-            leftElement={
+            leftElement={<View style={[styles.categoryDot, { backgroundColor: category.color }]} />}
              <View style={[styles.categoryDot, { backgroundColor: category.color }]} />
            }
            onPress={() => setEditingCategory(category)}
            showChevron
          />
@@ -165,7 +230,12 @@ export default function SettingsScreen() {
        >
          <View style={[styles.addIcon, { backgroundColor: theme.accentSoft }]}>
            <Svg width={16} height={16} viewBox="0 0 24 24">
-              <Path d="M12 5v14M5 12h14" stroke={theme.accentText} strokeWidth={2} strokeLinecap="round" />
+              <Path
                d="M12 5v14M5 12h14"
                stroke={theme.accentText}
                strokeWidth={2}
                strokeLinecap="round"
              />
            </Svg>
          </View>
          <Text style={[styles.addCategoryText, { color: theme.accent }]}>Add Tag</Text>
@@ -177,7 +247,18 @@ export default function SettingsScreen() {
          rightElement={
            <Switch
              value={notifications}
-              onValueChange={setNotifications}
+              onValueChange={async value => {
                setNotifications(value);
                if (!value) {
                  const { cancelAllReminders } = await import('@/services/notifications');
                  await cancelAllReminders();
                } else {
                  const { rescheduleAllReminders } = await import('@/services/notifications');
                  const { collections } = await import('@/database');
                  const tasks = await collections.tasks.query().fetch();
                  await rescheduleAllReminders(tasks, true, reminderPreference);
                }
              }}
              thumbColor="#FFFFFF"
              trackColor={{ false: theme.borderStrong, true: theme.accent }}
            />
@@ -189,14 +270,12 @@ export default function SettingsScreen() {
          onPress={() => notifications && setPicker('reminder')}
          showChevron
        />
-        {categories.map((category) => (
+        {categories.map(category => (
          <ListItem
            key={`tag-reminder-${category.id}`}
            title={category.name}
            subtitle={notifications ? tagReminderLabel(category.id) : 'Enable notifications first'}
-            leftElement={
+            leftElement={<View style={[styles.categoryDot, { backgroundColor: category.color }]} />}
              <View style={[styles.categoryDot, { backgroundColor: category.color }]} />
            }
            onPress={() => notifications && setReminderTagPicker(category)}
            showChevron
          />
@@ -210,7 +289,7 @@ export default function SettingsScreen() {
        />
        <ListItem
          title="Sort Tasks By"
-          subtitle={SORT_OPTIONS.find((o) => o.value === sortBy)?.label ?? 'Date'}
+          subtitle={SORT_OPTIONS.find(o => o.value === sortBy)?.label ?? 'Date'}
          onPress={() => setPicker('sort')}
          showChevron
        />
@@ -248,7 +327,7 @@ export default function SettingsScreen() {
        <Text style={[styles.sectionTitle, { color: theme.textMuted }]}>Appearance</Text>
        <Text style={[styles.sectionHint, { color: theme.textFaint }]}>Accent color</Text>
        <View style={styles.accentPresets}>
-          {ACCENT_PRESETS.map((c) => (
+          {ACCENT_PRESETS.map(c => (
            <TouchableOpacity
              key={c}
              style={[
@@ -261,7 +340,14 @@ export default function SettingsScreen() {
            >
              {accentColor.toUpperCase() === c && (
                <Svg width={16} height={16} viewBox="0 0 24 24">
-                  <Path d="M5 12l5 5 9-10" stroke={contrastOnSwatch(c)} strokeWidth={3} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+                  <Path
                    d="M5 12l5 5 9-10"
                    stroke={contrastOnSwatch(c)}
                    strokeWidth={3}
                    strokeLinecap="round"
                    strokeLinejoin="round"
                    fill="none"
                  />
                </Svg>
              )}
            </TouchableOpacity>
@@ -274,6 +360,15 @@ export default function SettingsScreen() {
          onPress={openCustomAccent}
          showChevron
        />
        <Text style={[styles.sectionHint, { color: theme.textFaint }]}>Theme</Text>
        <ListItem
          title="Theme Mode"
          subtitle={
            themeMode === 'system' ? 'System default' : themeMode === 'dark' ? 'Dark' : 'Light'
          }
          onPress={() => setPicker('themeMode')}
          showChevron
        />
        <Text style={[styles.sectionTitle, { color: theme.textMuted }]}>Data</Text>
        <SyncStatus />
        <ListItem
@@ -282,6 +377,32 @@ export default function SettingsScreen() {
          onPress={() => setSyncVisible(true)}
          showChevron
        />
        <ListItem
          title="Sync Settings to Server"
          subtitle="Push local settings to backend"
          onPress={async () => {
            try {
              await syncSettingsToServer();
              Alert.alert('Success', 'Settings synced to server');
            } catch {
              Alert.alert('Error', 'Failed to sync settings');
            }
          }}
          showChevron
        />
        <ListItem
          title="Load Settings from Server"
          subtitle="Pull settings from backend"
          onPress={async () => {
            try {
              await loadSettingsFromServer();
              Alert.alert('Success', 'Settings loaded from server');
            } catch {
              Alert.alert('Error', 'Failed to load settings');
            }
          }}
          showChevron
        />
        <ListItem
          title="Friends"
          subtitle="Manage friends and requests"
@@ -302,26 +423,19 @@ export default function SettingsScreen() {
          onPress={handleCheckUpdates}
          showChevron
        />
-        <ListItem
+        <ListItem title="Last checked" subtitle={lastUpdateCheck ?? 'Never'} />
-          title="Version"
+        <ListItem title="Version" subtitle={getCurrentAppVersion()} />
-          subtitle={getCurrentAppVersion()}
+        <ListItem title="Privacy Policy" onPress={() => setLegalVisible('privacy')} showChevron />
-        />
+        <ListItem title="Terms of Service" onPress={() => setLegalVisible('terms')} showChevron />
        <ListItem
          title="Privacy Policy"
          onPress={() => setLegalVisible('privacy')}
          showChevron
        />
        <ListItem
          title="Terms of Service"
          onPress={() => setLegalVisible('terms')}
          showChevron
        />
      </ScrollView>
      <OptionPickerModal
        visible={picker === 'category'}
        title="Default Tag"
-        options={[{ value: '', label: 'None', color: theme.textMuted }, ...categories.map((c) => ({ value: c.id, label: c.name, color: c.color }))]}
+        options={[
          { value: '', label: 'None', color: theme.textMuted },
          ...categories.map(c => ({ value: c.id, label: c.name, color: c.color })),
        ]}
        selectedValue={defaultCategoryId}
        onSelect={handleDefaultCategory}
        onClose={() => setPicker(null)}
@@ -332,7 +446,7 @@ export default function SettingsScreen() {
        title="Sort Tasks By"
        options={SORT_OPTIONS}
        selectedValue={sortBy}
-        onSelect={(value) => setSortBy(value as typeof sortBy)}
+        onSelect={value => setSortBy(value as typeof sortBy)}
        onClose={() => setPicker(null)}
      />
@@ -345,15 +459,15 @@ export default function SettingsScreen() {
        onClose={() => setPicker(null)}
      />
-      {categories.map((category) => (
+      {categories.map(category => (
        <OptionPickerModal
          key={`tag-reminder-picker-${category.id}`}
          visible={reminderTagPicker?.id === category.id}
          title={`Reminders · ${category.name}`}
-          options={REMINDER_OPTIONS.filter((o) => o.value !== 'none')}
+          options={REMINDER_OPTIONS.filter(o => o.value !== 'none')}
          selectedValue={tagReminderPreferences[category.id] ?? []}
          multiSelect
-          onSelect={(value) => handleTagReminderPreference(category.id, value)}
+          onSelect={value => handleTagReminderPreference(category.id, value)}
          onClose={() => setReminderTagPicker(null)}
        />
      ))}
@@ -367,6 +481,15 @@ export default function SettingsScreen() {
        onClose={() => setPicker(null)}
      />
      <OptionPickerModal
        visible={picker === 'themeMode'}
        title="Theme Mode"
        options={THEME_MODE_OPTIONS}
        selectedValue={themeMode}
        onSelect={value => setThemeMode(value as ThemeMode)}
        onClose={() => setPicker(null)}
      />
      <CategoryEditorModal
        visible={editorVisible}
        category={editorCategory}
@@ -374,41 +497,86 @@ export default function SettingsScreen() {
        onClose={() => setEditingCategory(null)}
      />
-      <SyncModal visible={syncVisible} onClose={() => { setSyncVisible(false); refreshSyncStatus(); }} />
+      <SyncModal
        visible={syncVisible}
        onClose={() => {
          setSyncVisible(false);
          refreshSyncStatus();
        }}
      />
      <FriendsModal visible={friendsVisible} onClose={() => setFriendsVisible(false)} />
      <ServerUrlModal visible={serverUrlVisible} onClose={() => setServerUrlVisible(false)} />
-      <Modal visible={customAccentVisible} transparent animationType="fade" onRequestClose={() => setCustomAccentVisible(false)}>
+      <Modal
        visible={customAccentVisible}
        transparent
        animationType="fade"
        onRequestClose={() => setCustomAccentVisible(false)}
      >
        <Pressable style={styles.accentModalOverlay} onPress={() => setCustomAccentVisible(false)}>
          <Pressable
-          style={styles.accentModalOverlay}
+            style={[styles.accentModalSheet, { backgroundColor: theme.sheetBg }]}
-          onPress={() => setCustomAccentVisible(false)}
+            onPress={() => {}}
          >
          <Pressable style={[styles.accentModalSheet, { backgroundColor: theme.sheetBg }]} onPress={() => {}}>
            <View style={styles.accentModalHeader}>
-              <Text style={[styles.accentModalTitle, { color: theme.text }]}>Custom Accent Color</Text>
+              <Text style={[styles.accentModalTitle, { color: theme.text }]}>
-              <TouchableOpacity onPress={() => setCustomAccentVisible(false)} hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}>
+                Custom Accent Color
              </Text>
              <TouchableOpacity
                onPress={() => setCustomAccentVisible(false)}
                hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}
              >
                <Svg width={18} height={18} viewBox="0 0 24 24">
-                  <Path d="M18 6L6 18M6 6l12 12" stroke={theme.textSecondary} strokeWidth={2.2} strokeLinecap="round" />
+                  <Path
                    d="M18 6L6 18M6 6l12 12"
                    stroke={theme.textSecondary}
                    strokeWidth={2.2}
                    strokeLinecap="round"
                  />
                </Svg>
              </TouchableOpacity>
            </View>
-            <ColorWheel color={draftAccent} opacity={draftAccentOpacity} onChange={(color, opacity) => { setDraftAccent(color); setDraftAccentOpacity(opacity); }} />
+            <ColorWheel
              color={draftAccent}
              opacity={draftAccentOpacity}
              onChange={(color, opacity) => {
                setDraftAccent(color);
                setDraftAccentOpacity(opacity);
              }}
            />
            <View style={styles.accentModalActions}>
              <TouchableOpacity
                style={[styles.accentModalButton, { borderColor: theme.borderStrong }]}
-                onPress={() => { setDraftAccent(DEFAULT_ACCENT); setDraftAccentOpacity(DEFAULT_ACCENT_OPACITY); setAccentColor(DEFAULT_ACCENT); setAccentOpacity(DEFAULT_ACCENT_OPACITY); }}
+                onPress={() => {
                  setDraftAccent(DEFAULT_ACCENT);
                  setDraftAccentOpacity(DEFAULT_ACCENT_OPACITY);
                  setAccentColor(DEFAULT_ACCENT);
                  setAccentOpacity(DEFAULT_ACCENT_OPACITY);
                }}
                activeOpacity={0.7}
              >
-                <Text style={[styles.accentModalButtonText, { color: theme.textSecondary }]}>Reset</Text>
+                <Text style={[styles.accentModalButtonText, { color: theme.textSecondary }]}>
                  Reset
                </Text>
              </TouchableOpacity>
              <TouchableOpacity
-                style={[styles.accentModalButton, styles.accentModalButtonPrimary, { backgroundColor: theme.accent }]}
+                style={[
-                onPress={() => { setAccentColor(draftAccent); setAccentOpacity(draftAccentOpacity); setCustomAccentVisible(false); }}
+                  styles.accentModalButton,
                  styles.accentModalButtonPrimary,
                  { backgroundColor: theme.accent },
                ]}
                onPress={() => {
                  setAccentColor(draftAccent);
                  setAccentOpacity(draftAccentOpacity);
                  setCustomAccentVisible(false);
                }}
                activeOpacity={0.8}
              >
-                <Text style={[styles.accentModalButtonText, { color: theme.accentText }]}>Apply</Text>
+                <Text style={[styles.accentModalButtonText, { color: theme.accentText }]}>
                  Apply
                </Text>
              </TouchableOpacity>
            </View>
          </Pressable>
@@ -429,6 +597,12 @@ const AHEAD_OPTIONS: { value: string; label: string }[] = Array.from({ length: 2
  label: i === 0 ? 'Only today' : `${i} day${i === 1 ? '' : 's'}`,
 }));
 const THEME_MODE_OPTIONS: { value: ThemeMode; label: string }[] = [
  { value: 'light', label: 'Light' },
  { value: 'dark', label: 'Dark' },
  { value: 'system', label: 'System default' },
 ];
 function formatSyncTime(timestamp: number): string {
  const seconds = Math.floor((Date.now() - timestamp) / 1000);
  if (seconds < 60) return 'just now';
@@ -15,7 +15,7 @@ export default function StatsScreen() {
    }, [])
  );
-  const maxDaily = Math.max(1, ...stats.daily.map((d) => d.count));
+  const maxDaily = Math.max(1, ...stats.daily.map(d => d.count));
  return (
    <SafeAreaView style={[styles.container, { backgroundColor: theme.background }]}>
@@ -25,27 +25,42 @@ export default function StatsScreen() {
          <Text style={[styles.cardTitle, { color: theme.textMuted }]}>Overview</Text>
          <View style={styles.summaryGrid}>
            <View style={styles.summaryItem}>
-              <Text style={[styles.summaryValue, { color: theme.accent }]}>{stats.totalCompleted}</Text>
+              <Text style={[styles.summaryValue, { color: theme.accent }]}>
                {stats.totalCompleted}
              </Text>
              <Text style={[styles.summaryLabel, { color: theme.textMuted }]}>Completed</Text>
            </View>
            <View style={styles.summaryItem}>
-              <Text style={[styles.summaryValue, { color: theme.text }]}>{stats.completedLast7}</Text>
+              <Text style={[styles.summaryValue, { color: theme.text }]}>
                {stats.completedLast7}
              </Text>
              <Text style={[styles.summaryLabel, { color: theme.textMuted }]}>Last 7 days</Text>
            </View>
            <View style={styles.summaryItem}>
-              <Text style={[styles.summaryValue, { color: theme.text }]}>{stats.completedLast30}</Text>
+              <Text style={[styles.summaryValue, { color: theme.text }]}>
                {stats.completedLast30}
              </Text>
              <Text style={[styles.summaryLabel, { color: theme.textMuted }]}>Last 30 days</Text>
            </View>
            <View style={styles.summaryItem}>
-              <Text style={[styles.summaryValue, { color: theme.text }]}>{stats.completionRate}%</Text>
+              <Text style={[styles.summaryValue, { color: theme.text }]}>
                {stats.completionRate}%
              </Text>
              <Text style={[styles.summaryLabel, { color: theme.textMuted }]}>Success rate</Text>
            </View>
            <View style={styles.summaryItem}>
-              <Text style={[styles.summaryValue, { color: theme.text }]}>{stats.currentStreak}</Text>
+              <Text style={[styles.summaryValue, { color: theme.text }]}>
                {stats.currentStreak}
              </Text>
              <Text style={[styles.summaryLabel, { color: theme.textMuted }]}>Day streak</Text>
            </View>
            <View style={styles.summaryItem}>
-              <Text style={[styles.summaryValue, { color: stats.overdueCount > 0 ? theme.accent : theme.text }]}>
+              <Text
                style={[
                  styles.summaryValue,
                  { color: stats.overdueCount > 0 ? theme.accent : theme.text },
                ]}
              >
                {stats.overdueCount}
              </Text>
              <Text style={[styles.summaryLabel, { color: theme.textMuted }]}>Overdue</Text>
@@ -64,7 +79,10 @@ export default function StatsScreen() {
                    <View
                      style={[
                        styles.chartBar,
-                        { height: Math.max(4, height), backgroundColor: d.count > 0 ? theme.accent : theme.cardAlt },
+                        {
                          height: Math.max(4, height),
                          backgroundColor: d.count > 0 ? theme.accent : theme.cardAlt,
                        },
                      ]}
                    />
                  </View>
@@ -78,9 +96,11 @@ export default function StatsScreen() {
        <View style={[styles.card, { backgroundColor: theme.card }]}>
          <Text style={[styles.cardTitle, { color: theme.textMuted }]}>By tags</Text>
          {stats.byCategory.length === 0 ? (
-            <Text style={[styles.emptyText, { color: theme.textFaint }]}>No completed tasks yet</Text>
+            <Text style={[styles.emptyText, { color: theme.textFaint }]}>
              No completed tasks yet
            </Text>
          ) : (
-            stats.byCategory.map((c) => (
+            stats.byCategory.map(c => (
              <View key={c.id} style={styles.row}>
                <View style={[styles.dot, { backgroundColor: c.color }]} />
                <Text style={[styles.rowLabel, { color: theme.text }]}>{c.name}</Text>
@@ -93,9 +113,11 @@ export default function StatsScreen() {
        <View style={[styles.card, { backgroundColor: theme.card }]}>
          <Text style={[styles.cardTitle, { color: theme.textMuted }]}>By priority</Text>
          {stats.byPriority.length === 0 ? (
-            <Text style={[styles.emptyText, { color: theme.textFaint }]}>No completed tasks yet</Text>
+            <Text style={[styles.emptyText, { color: theme.textFaint }]}>
              No completed tasks yet
            </Text>
          ) : (
-            stats.byPriority.map((p) => (
+            stats.byPriority.map(p => (
              <View key={p.priority} style={styles.row}>
                <View style={[styles.dot, { backgroundColor: priorityColor(theme, p.priority) }]} />
                <Text style={[styles.rowLabel, { color: theme.text }]}>{p.label}</Text>
@@ -8,9 +8,13 @@ import { UpdateNotifier } from '@/components/UpdateNotifier';
 import { Linking } from 'react-native';
 import { useEffect } from 'react';
 import { requestQuickAddFocus } from '@/utils/quickAddFocus';
-import { registerForPushNotificationsAsync, setupNotificationChannels, addNotificationResponseReceivedListener, removeNotificationSubscription } from '@/services/pushNotifications';
+import {
  registerForPushNotificationsAsync,
  setupNotificationChannels,
  addNotificationResponseReceivedListener,
  removeNotificationSubscription,
 } from '@/services/pushNotifications';
 import * as Notifications from 'expo-notifications';
 import { Platform } from 'react-native';
 Notifications.setNotificationHandler({
  handleNotification: async () => ({
@@ -29,7 +33,7 @@ function RootNavigator() {
    setupNotificationChannels();
    registerForPushNotificationsAsync().catch(() => {});
-    const responseListener = addNotificationResponseReceivedListener((response) => {
+    const responseListener = addNotificationResponseReceivedListener(response => {
      const data = response.notification.request.content.data as Record<string, any> | undefined;
      if (!data) return;
@@ -54,18 +58,29 @@ function RootNavigator() {
      requestQuickAddFocus();
    };
-    Linking.getInitialURL().then(handleUrl).catch(() => {});
+    Linking.getInitialURL()
      .then(handleUrl)
      .catch(() => {});
    const subscription = Linking.addEventListener('url', ({ url }) => handleUrl(url));
    const handleKeyDown = (event: KeyboardEvent) => {
      if (event.key === 'Escape') {
        router.back();
      }
    };
    window.addEventListener('keydown', handleKeyDown);
    return () => {
      subscription.remove();
      removeNotificationSubscription(responseListener);
      window.removeEventListener('keydown', handleKeyDown);
    };
  }, [router]);
  return (
    <GestureHandlerRootView style={{ flex: 1 }}>
-      <StatusBar style="light" />
+      <StatusBar style="dark" />
      <Stack screenOptions={{ headerShown: false }}>
        <Stack.Screen name="(tabs)" />
        <Stack.Screen name="add-task" />
@@ -1,5 +1,14 @@
 import React, { useMemo, useRef } from 'react';
-import { View, Text, StyleSheet, SafeAreaView, ScrollView, KeyboardAvoidingView, Platform, Keyboard } from 'react-native';
+import {
  View,
  Text,
  StyleSheet,
  SafeAreaView,
  ScrollView,
  KeyboardAvoidingView,
  Platform,
  Keyboard,
 } from 'react-native';
 import { Header } from '@/components/Header';
 import { CategorySelector } from '@/components/CategorySelector';
 import { TaskNameInput } from '@/components/TaskNameInput';
@@ -112,7 +121,8 @@ export default function AddTaskScreen() {
    const now = new Date();
    const dueDateTimestamp = data.dueDate ? data.dueDate.getTime() : 0;
-    const seriesId = data.repeat !== 'none'
+    const seriesId =
      data.repeat !== 'none'
        ? `series_${Math.random().toString(36).slice(2, 10)}${Date.now().toString(36)}`
        : '';
    const resolvedCategoryId = (data.tags && data.tags[0]) || '';
@@ -120,7 +130,7 @@ export default function AddTaskScreen() {
    let createdTask: any = null;
    await database.write(async () => {
-      const task = await collections.tasks.create((t) => {
+      const task = await collections.tasks.create(t => {
        t.title = data.title.trim();
        t.description = data.description || '';
        t.categoryId = resolvedCategoryId;
@@ -146,7 +156,7 @@ export default function AddTaskScreen() {
        for (let i = 0; i < data.subtasks.length; i++) {
          const subtask = data.subtasks[i];
          if (subtask.title.trim()) {
-            await collections.subtasks.create((s) => {
+            await collections.subtasks.create(s => {
              s.taskId = task.id;
              s.title = subtask.title.trim();
              s.description = '';
@@ -198,7 +208,7 @@ export default function AddTaskScreen() {
          >
            <CategorySelector
              value={tags}
-              onChange={(value) => setValue('tags', value)}
+              onChange={value => setValue('tags', value)}
              error={errors.categoryId?.message}
            />
            <Controller
@@ -214,10 +224,7 @@ export default function AddTaskScreen() {
              )}
            />
            <SubtasksSection control={control} />
-            <PrioritySelector
+            <PrioritySelector value={priority} onChange={value => setValue('priority', value)} />
              value={priority}
              onChange={(value) => setValue('priority', value)}
            />
            <DateTimePickerComponent control={control} />
            <RepeatSelector
              value={repeat}
@@ -232,12 +239,12 @@ export default function AddTaskScreen() {
            <ReminderSelector
              value={reminders}
              hasDueDate={!!dueDate}
-              onChange={(value) => setValue('reminders', value)}
+              onChange={value => setValue('reminders', value)}
            />
            <AssigneeSelector
              value={assigneeId}
              onChange={(value: string | null) => setValue('assigneeId', value)}
-              friends={friends.map((f) => f.username)}
+              friends={friends.map(f => f.username)}
            />
            <Controller
              control={control}
@@ -1,5 +1,14 @@
 import React, { useCallback, useMemo } from 'react';
-import { View, Text, StyleSheet, SafeAreaView, ScrollView, TouchableOpacity, KeyboardAvoidingView, BackHandler } from 'react-native';
+import {
  View,
  Text,
  StyleSheet,
  SafeAreaView,
  ScrollView,
  TouchableOpacity,
  KeyboardAvoidingView,
  BackHandler,
 } from 'react-native';
 import { useRouter, useLocalSearchParams, useFocusEffect } from 'expo-router';
 import { useSafeAreaInsets } from 'react-native-safe-area-context';
 import { Header } from '@/components/Header';
@@ -17,7 +26,11 @@ import { desaturate, type ThemeColors } from '@/theme';
 function isDayMatch(timestamp: number, day: Date): boolean {
  const d = new Date(timestamp);
-  return d.getFullYear() === day.getFullYear() && d.getMonth() === day.getMonth() && d.getDate() === day.getDate();
+  return (
    d.getFullYear() === day.getFullYear() &&
    d.getMonth() === day.getMonth() &&
    d.getDate() === day.getDate()
  );
 }
 export default function DayViewScreen() {
@@ -53,45 +66,68 @@ export default function DayViewScreen() {
  const subtasksOnDay = useMemo(() => {
    const map = new Map<string, SubtaskData[]>();
    for (const [taskId, roots] of subtasksByTask) {
-      const due = roots.filter((s) => s.dueDate && isDayMatch(s.dueDate, day));
+      const due = roots.filter(s => s.dueDate && isDayMatch(s.dueDate, day));
      if (due.length > 0) map.set(taskId, due);
    }
    return map;
  }, [subtasksByTask, day]);
-  const handleToggleComplete = useCallback(async (taskId: string) => {
+  const handleToggleComplete = useCallback(
    async (taskId: string) => {
      await confirmAndToggleTaskComplete(taskId, () => {
        refresh();
        refreshSubtasks();
      });
-  }, [refresh, refreshSubtasks]);
+    },
    [refresh, refreshSubtasks]
  );
-  const handleToggleSubtask = useCallback(async (subtaskId: string) => {
+  const handleToggleSubtask = useCallback(
    async (subtaskId: string) => {
      await toggleSubtaskComplete(subtaskId);
      refreshSubtasks();
-  }, [refreshSubtasks]);
+    },
    [refreshSubtasks]
  );
  return (
-    <SafeAreaView style={[styles.container, { backgroundColor: theme.background, paddingBottom: insets.bottom }]}>
+    <SafeAreaView
      style={[
        styles.container,
        { backgroundColor: theme.background, paddingBottom: insets.bottom },
      ]}
    >
      <Header title={format(day, 'EEEE, MMM d')} showLogo={false} rightAction="Back" />
      <KeyboardAvoidingView style={styles.kbAvoid} behavior="padding">
-        <ScrollView style={styles.scrollBody} contentContainerStyle={styles.scrollContent} showsVerticalScrollIndicator={false}>
+        <ScrollView
          style={styles.scrollBody}
          contentContainerStyle={styles.scrollContent}
          showsVerticalScrollIndicator={false}
        >
          {loading ? (
            <View style={styles.emptyState}>
              <Text style={[styles.emptyText, { color: theme.textSecondary }]}>Loading...</Text>
            </View>
          ) : dayTasks.length === 0 && subtasksOnDay.size === 0 ? (
            <View style={styles.emptyState}>
-              <Text style={[styles.emptyText, { color: theme.textSecondary }]}>No tasks on this day</Text>
+              <Text style={[styles.emptyText, { color: theme.textSecondary }]}>
                No tasks on this day
              </Text>
            </View>
          ) : (
            <>
-              {dayTasks.map((task) => {
+              {dayTasks.map(task => {
                const subs = subtasksOnDay.get(task.id) ?? [];
-                const openCount = subs.filter((s) => !s.completed).length;
+                const openCount = subs.filter(s => !s.completed).length;
-                const cat = categories.find((c) => c.id === task.categoryId);
+                const cat = categories.find(c => c.id === task.categoryId);
                return (
-                  <View key={task.id} style={[styles.eventCard, { backgroundColor: theme.card, borderColor: theme.border }]}>
+                  <View
                    key={task.id}
                    style={[
                      styles.eventCard,
                      { backgroundColor: theme.card, borderColor: theme.border },
                    ]}
                  >
                    <View style={styles.eventRow}>
                      <TouchableOpacity
                        style={styles.checkCircle}
@@ -104,41 +140,76 @@ export default function DayViewScreen() {
                          {task.completed ? (
                            <>
                              <Circle cx={12} cy={12} r={10} fill={theme.accent} />
-                              <Path d="M7 12l3 3 7-7" stroke="#FFFFFF" strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+                              <Path
                                d="M7 12l3 3 7-7"
                                stroke="#FFFFFF"
                                strokeWidth={2.5}
                                strokeLinecap="round"
                                strokeLinejoin="round"
                                fill="none"
                              />
                            </>
                          ) : (
-                            <Circle cx={12} cy={12} r={10} stroke={theme.textSecondary} strokeWidth={2.5} fill="none" />
+                            <Circle
                              cx={12}
                              cy={12}
                              r={10}
                              stroke={theme.textSecondary}
                              strokeWidth={2.5}
                              fill="none"
                            />
                          )}
                        </Svg>
                      </TouchableOpacity>
                      <TouchableOpacity
                        style={styles.eventTouch}
-                        onPress={() => router.push({ pathname: '/task-detail', params: { id: task.id } })}
+                        onPress={() =>
                          router.push({ pathname: '/task-detail', params: { id: task.id } })
                        }
                        activeOpacity={0.7}
                      >
                        <Text
-                          style={[styles.eventTitle, { color: theme.text }, task.completed && styles.eventCompleted]}
+                          style={[
                            styles.eventTitle,
                            { color: theme.text },
                            task.completed && styles.eventCompleted,
                          ]}
                          numberOfLines={1}
                        >
                          {task.title}
                        </Text>
                        {openCount > 0 && (
-                          <Text style={[styles.eventSub, { color: theme.textMuted }]} numberOfLines={1}>
+                          <Text
                            style={[styles.eventSub, { color: theme.textMuted }]}
                            numberOfLines={1}
                          >
                            {openCount} open subtask{openCount === 1 ? '' : 's'}
                          </Text>
                        )}
                        {!task.completed && (
                          <View style={styles.metaRow}>
                            {cat && (
-                              <View style={[styles.tagChip, { backgroundColor: desaturate(cat.color, 0.3) }]}>
+                              <View
-                                <Text style={styles.tagText} numberOfLines={1}>{cat.name}</Text>
+                                style={[
                                  styles.tagChip,
                                  { backgroundColor: desaturate(cat.color, 0.3) },
                                ]}
                              >
                                <Text style={styles.tagText} numberOfLines={1}>
                                  {cat.name}
                                </Text>
                              </View>
                            )}
                            {task.dueTime ? (
-                              <Text style={[styles.timeText, { color: theme.textSecondary }]}>{task.dueTime}{task.endTime ? `–${task.endTime}` : ''}</Text>
+                              <Text style={[styles.timeText, { color: theme.textSecondary }]}>
                                {task.dueTime}
                                {task.endTime ? `–${task.endTime}` : ''}
                              </Text>
                            ) : task.dueDate ? (
-                              <Text style={[styles.timeText, { color: theme.textSecondary }]}>{format(task.dueDate, 'HH:mm')}</Text>
+                              <Text style={[styles.timeText, { color: theme.textSecondary }]}>
                                {format(task.dueDate, 'HH:mm')}
                              </Text>
                            ) : null}
                          </View>
                        )}
@@ -152,7 +223,14 @@ export default function DayViewScreen() {
                        accessibilityLabel={`Edit ${task.title}`}
                      >
                        <Svg width={20} height={20} viewBox="0 0 24 24">
-                          <Path d="M9 6l6 6-6 6" stroke={theme.textSecondary} strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+                          <Path
                            d="M9 6l6 6-6 6"
                            stroke={theme.textSecondary}
                            strokeWidth={2.5}
                            strokeLinecap="round"
                            strokeLinejoin="round"
                            fill="none"
                          />
                        </Svg>
                      </TouchableOpacity>
                    </View>
@@ -160,10 +238,16 @@ export default function DayViewScreen() {
                );
              })}
              {Array.from(subtasksOnDay.entries()).flatMap(([taskId, subs]) => {
-                const parent = dayTasks.find((t) => t.id === taskId);
+                const parent = dayTasks.find(t => t.id === taskId);
                if (parent) return [];
-                return subs.map((sub) => (
+                return subs.map(sub => (
-                  <View key={sub.id} style={[styles.eventCard, { backgroundColor: theme.card, borderColor: theme.border }]}>
+                  <View
                    key={sub.id}
                    style={[
                      styles.eventCard,
                      { backgroundColor: theme.card, borderColor: theme.border },
                    ]}
                  >
                    <View style={styles.eventRow}>
                      <TouchableOpacity
                        style={styles.checkCircle}
@@ -176,26 +260,49 @@ export default function DayViewScreen() {
                          {sub.completed ? (
                            <>
                              <Circle cx={12} cy={12} r={10} fill={theme.accent} />
-                              <Path d="M7 12l3 3 7-7" stroke="#FFFFFF" strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+                              <Path
                                d="M7 12l3 3 7-7"
                                stroke="#FFFFFF"
                                strokeWidth={2.5}
                                strokeLinecap="round"
                                strokeLinejoin="round"
                                fill="none"
                              />
                            </>
                          ) : (
-                            <Circle cx={12} cy={12} r={10} stroke={theme.textSecondary} strokeWidth={2.5} fill="none" />
+                            <Circle
                              cx={12}
                              cy={12}
                              r={10}
                              stroke={theme.textSecondary}
                              strokeWidth={2.5}
                              fill="none"
                            />
                          )}
                        </Svg>
                      </TouchableOpacity>
                      <TouchableOpacity
                        style={styles.eventTouch}
-                        onPress={() => router.push({ pathname: '/subtask-detail', params: { id: sub.id } })}
+                        onPress={() =>
                          router.push({ pathname: '/subtask-detail', params: { id: sub.id } })
                        }
                        activeOpacity={0.7}
                      >
                        <Text
-                          style={[styles.eventTitle, { color: theme.text }, sub.completed && styles.eventCompleted]}
+                          style={[
                            styles.eventTitle,
                            { color: theme.text },
                            sub.completed && styles.eventCompleted,
                          ]}
                          numberOfLines={1}
                        >
                          {sub.title}
                        </Text>
                        {sub.dueTime ? (
-                          <Text style={[styles.timeText, { color: theme.textSecondary }]}>{sub.dueTime}{sub.endTime ? `–${sub.endTime}` : ''}</Text>
+                          <Text style={[styles.timeText, { color: theme.textSecondary }]}>
                            {sub.dueTime}
                            {sub.endTime ? `–${sub.endTime}` : ''}
                          </Text>
                        ) : null}
                      </TouchableOpacity>
                    </View>
@@ -205,14 +312,18 @@ export default function DayViewScreen() {
            </>
          )}
        </ScrollView>
-        <QuickAddBar dueDate={dayStart.getTime()} placeholder={`Add event for ${format(day, 'MMM d')}`} />
+        <QuickAddBar
          dueDate={dayStart.getTime()}
          placeholder={`Add event for ${format(day, 'MMM d')}`}
        />
      </KeyboardAvoidingView>
      {modals(() => {})}
    </SafeAreaView>
  );
 }
-const createStyles = (theme: ThemeColors) => StyleSheet.create({
+const createStyles = (theme: ThemeColors) =>
  StyleSheet.create({
    container: {
      flex: 1,
    },
@@ -1,5 +1,15 @@
 import React from 'react';
-import { View, Text, StyleSheet, SafeAreaView, ScrollView, KeyboardAvoidingView, Platform, TouchableOpacity, Alert } from 'react-native';
+import {
  View,
  Text,
  StyleSheet,
  SafeAreaView,
  ScrollView,
  KeyboardAvoidingView,
  Platform,
  TouchableOpacity,
  Alert,
 } from 'react-native';
 import { useLocalSearchParams, useRouter } from 'expo-router';
 import { Header } from '@/components/Header';
 import { TaskNameInput } from '@/components/TaskNameInput';
@@ -15,7 +25,14 @@ import { zodResolver } from '@hookform/resolvers/zod';
 import { z } from 'zod';
 import { useDatabase } from '@/hooks/useDatabase';
 import { collections } from '@/database';
-import { SubtaskFormData, Reminder, parseReminders, toRemindersString, parseTaskTags, tagsToString } from '@/types';
+import {
  SubtaskFormData,
  Reminder,
  parseReminders,
  toRemindersString,
  parseTaskTags,
  tagsToString,
 } from '@/types';
 import { useSettings } from '@/theme';
 import { updateSubtask, deleteSubtask } from '@/utils/taskActions';
 import { CategorySelector } from '@/components/CategorySelector';
@@ -68,7 +85,14 @@ export default function SubtaskDetailScreen() {
    },
  });
-  const { handleSubmit, watch, setValue, control, reset, formState: { errors } } = methods;
+  const {
    handleSubmit,
    watch,
    setValue,
    control,
    reset,
    formState: { errors },
  } = methods;
  const priority = watch('priority');
  const tags = watch('tags') ?? [];
@@ -98,7 +122,10 @@ export default function SubtaskDetailScreen() {
          allDay: subtask.allDay ?? false,
          repeat: subtask.repeat,
          repeatInterval: subtask.repeatInterval || 1,
-          repeatDays: ((subtask.repeatDays || '') as string).split(',').map(Number).filter((d) => !Number.isNaN(d)),
+          repeatDays: ((subtask.repeatDays || '') as string)
            .split(',')
            .map(Number)
            .filter(d => !Number.isNaN(d)),
          reminder: (subtask.reminder || 'none') as Reminder,
          reminders: subtask.reminders || '',
          assigneeId: subtask.assigneeId ?? null,
@@ -160,7 +187,9 @@ export default function SubtaskDetailScreen() {
  if (!isReady || !loaded) {
    return (
      <View style={[styles.loadingContainer, { backgroundColor: theme.background }]}>
-        <Text style={{ color: theme.textFaint }}>{notFound ? 'Subtask not found' : 'Loading...'}</Text>
+        <Text style={{ color: theme.textFaint }}>
          {notFound ? 'Subtask not found' : 'Loading...'}
        </Text>
      </View>
    );
  }
@@ -171,9 +200,23 @@ export default function SubtaskDetailScreen() {
        title="Edit Subtask"
        showLogo={true}
        rightAction={
-          <TouchableOpacity onPress={confirmDelete} activeOpacity={0.7} style={[styles.deleteButton, { borderColor: theme.accentBorder, backgroundColor: theme.accentSoft }]}>
+          <TouchableOpacity
            onPress={confirmDelete}
            activeOpacity={0.7}
            style={[
              styles.deleteButton,
              { borderColor: theme.accentBorder, backgroundColor: theme.accentSoft },
            ]}
          >
            <Svg width={22} height={22} viewBox="0 0 24 24">
-              <Path d="M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13" stroke={theme.accent} strokeWidth={2.2} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+              <Path
                d="M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13"
                stroke={theme.accent}
                strokeWidth={2.2}
                strokeLinecap="round"
                strokeLinejoin="round"
                fill="none"
              />
            </Svg>
          </TouchableOpacity>
        }
@@ -201,14 +244,8 @@ export default function SubtaskDetailScreen() {
                />
              )}
            />
-            <CategorySelector
+            <CategorySelector value={tags} onChange={value => setValue('tags', value)} />
-              value={tags}
+            <PrioritySelector value={priority} onChange={value => setValue('priority', value)} />
              onChange={(value) => setValue('tags', value)}
            />
            <PrioritySelector
              value={priority}
              onChange={(value) => setValue('priority', value)}
            />
            <DateTimePickerComponent control={control as any} />
            <RepeatSelector
              value={repeat}
@@ -223,12 +260,12 @@ export default function SubtaskDetailScreen() {
            <ReminderSelector
              value={reminders}
              hasDueDate={!!dueDate}
-              onChange={(value) => setValue('reminders', value)}
+              onChange={value => setValue('reminders', value)}
            />
            <AssigneeSelector
              value={assigneeId}
              onChange={(value: string | null) => setValue('assigneeId', value)}
-              friends={friends.map((f) => f.username)}
+              friends={friends.map(f => f.username)}
            />
            <Controller
              control={control}
@@ -1,5 +1,15 @@
 import React, { useRef } from 'react';
-import { View, Text, StyleSheet, SafeAreaView, ScrollView, KeyboardAvoidingView, Platform, TouchableOpacity, Keyboard } from 'react-native';
+import {
  View,
  Text,
  StyleSheet,
  SafeAreaView,
  ScrollView,
  KeyboardAvoidingView,
  Platform,
  TouchableOpacity,
  Keyboard,
 } from 'react-native';
 import { useLocalSearchParams, useRouter } from 'expo-router';
 import { Header } from '@/components/Header';
 import { CategorySelector } from '@/components/CategorySelector';
@@ -47,13 +57,27 @@ const taskSchema = z.object({
  subtasks: z.array(z.object({ title: z.string(), _key: z.string().optional() })).optional(),
 });
-function CollapsibleSection({ title, children, defaultExpanded = false, icon }: { title: string; children: React.ReactNode; defaultExpanded?: boolean; icon: React.ReactNode }) {
+function CollapsibleSection({
  title,
  children,
  defaultExpanded = false,
  icon,
 }: {
  title: string;
  children: React.ReactNode;
  defaultExpanded?: boolean;
  icon: React.ReactNode;
 }) {
  const { theme } = useSettings();
  const [expanded, setExpanded] = React.useState(defaultExpanded);
  return (
    <View style={styles.section}>
-      <TouchableOpacity style={[styles.sectionHeader, { backgroundColor: theme.card, borderColor: theme.border }]} onPress={() => setExpanded(!expanded)} activeOpacity={0.8}>
+      <TouchableOpacity
        style={[styles.sectionHeader, { backgroundColor: theme.card, borderColor: theme.border }]}
        onPress={() => setExpanded(!expanded)}
        activeOpacity={0.8}
      >
        <View style={styles.sectionHeaderLeft}>
          {icon}
          <Text style={[styles.sectionTitle, { color: theme.text }]}>{title}</Text>
@@ -106,7 +130,14 @@ export default function TaskDetailScreen() {
    },
  });
-  const { handleSubmit, watch, setValue, control, reset, formState: { errors } } = methods;
+  const {
    handleSubmit,
    watch,
    setValue,
    control,
    reset,
    formState: { errors },
  } = methods;
  const tags = watch('tags') ?? [];
  const priority = watch('priority');
@@ -129,7 +160,8 @@ export default function TaskDetailScreen() {
        const subtasks = await collections.subtasks.query(Q.where('task_id', id)).fetch();
        if (!mounted) return;
-        const remindersValue = task.reminders || (task.reminder && task.reminder !== 'none' ? task.reminder : '');
+        const remindersValue =
          task.reminders || (task.reminder && task.reminder !== 'none' ? task.reminder : '');
        reset({
          title: task.title,
@@ -143,11 +175,14 @@ export default function TaskDetailScreen() {
          allDay: task.allDay ?? false,
          repeat: task.repeat,
          repeatInterval: task.repeatInterval || 1,
-          repeatDays: (task.repeatDays || '').split(',').map(Number).filter((d) => !Number.isNaN(d)),
+          repeatDays: (task.repeatDays || '')
            .split(',')
            .map(Number)
            .filter(d => !Number.isNaN(d)),
          reminder: (task.reminder || 'none') as TaskFormData['reminder'],
          reminders: remindersValue,
          assigneeId: task.assigneeId ?? null,
-          subtasks: subtasks.map((s) => ({ title: s.title, _key: s.id })),
+          subtasks: subtasks.map(s => ({ title: s.title, _key: s.id })),
        });
        setLoaded(true);
      } catch {
@@ -155,7 +190,9 @@ export default function TaskDetailScreen() {
      }
    })();
-    return () => { mounted = false; };
+    return () => {
      mounted = false;
    };
  }, [id, isReady, reset]);
  const onSubmit = async (data: TaskFormData) => {
@@ -174,7 +211,7 @@ export default function TaskDetailScreen() {
      savedTask = task;
      const existingSubtasks = await collections.subtasks.query(Q.where('task_id', id)).fetch();
-      await task.update((t) => {
+      await task.update(t => {
        t.title = data.title.trim();
        t.description = data.description || '';
        t.categoryId = (data.tags && data.tags[0]) || task.categoryId || '';
@@ -202,10 +239,10 @@ export default function TaskDetailScreen() {
        const trimmed = formItem.title.trim();
        if (!trimmed) continue;
        if (formItem._key) {
-          const existing = existingSubtasks.find((s) => s.id === formItem._key && !s.parentSubtaskId);
+          const existing = existingSubtasks.find(s => s.id === formItem._key && !s.parentSubtaskId);
          if (existing) {
            keptIds.add(existing.id);
-            await existing.update((s) => {
+            await existing.update(s => {
              s.title = trimmed;
              s.order = order;
              s.updatedAt = now;
@@ -214,7 +251,7 @@ export default function TaskDetailScreen() {
            continue;
          }
        }
-        await collections.subtasks.create((s) => {
+        await collections.subtasks.create(s => {
          s.taskId = task.id;
          s.categoryId = task.categoryId || '';
          s.tags = task.tags || '';
@@ -244,9 +281,11 @@ export default function TaskDetailScreen() {
        if (existing.parentSubtaskId) continue;
        if (keptIds.has(existing.id)) continue;
        removedIds.push(existing.id);
-        const children = await collections.subtasks.query(Q.where('parent_subtask_id', existing.id)).fetch();
+        const children = await collections.subtasks
          .query(Q.where('parent_subtask_id', existing.id))
          .fetch();
        for (const child of children) {
-          await child.update((c) => {
+          await child.update(c => {
            c.parentSubtaskId = null;
            c.updatedAt = now;
          });
@@ -288,9 +327,23 @@ export default function TaskDetailScreen() {
        title="Edit Task"
        showLogo={true}
        rightAction={
-          <TouchableOpacity onPress={handleDelete} activeOpacity={0.7} style={[styles.deleteButton, { borderColor: theme.accentBorder, backgroundColor: theme.accentSoft }]}>
+          <TouchableOpacity
            onPress={handleDelete}
            activeOpacity={0.7}
            style={[
              styles.deleteButton,
              { borderColor: theme.accentBorder, backgroundColor: theme.accentSoft },
            ]}
          >
            <Svg width={22} height={22} viewBox="0 0 24 24">
-              <Path d="M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13" stroke={theme.accent} strokeWidth={2.2} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+              <Path
                d="M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13"
                stroke={theme.accent}
                strokeWidth={2.2}
                strokeLinecap="round"
                strokeLinejoin="round"
                fill="none"
              />
            </Svg>
          </TouchableOpacity>
        }
@@ -310,7 +363,7 @@ export default function TaskDetailScreen() {
          >
            <CategorySelector
              value={tags}
-              onChange={(value) => setValue('tags', value)}
+              onChange={value => setValue('tags', value)}
              error={errors.categoryId?.message}
            />
            <Controller
@@ -326,21 +379,36 @@ export default function TaskDetailScreen() {
              )}
            />
            <SubtasksSection control={control} />
-            <PrioritySelector
+            <PrioritySelector value={priority} onChange={value => setValue('priority', value)} />
              value={priority}
              onChange={(value) => setValue('priority', value)}
            />
-            <CollapsibleSection title="Date & Time" icon={
+            <CollapsibleSection
              title="Date & Time"
              icon={
                <Svg width={20} height={20} viewBox="0 0 24 24">
-                <Circle cx={12} cy={12} r={10} stroke={theme.accent} strokeWidth={1.8} fill="none" />
+                  <Circle
-                <Path d="M12 6v6l4 2" stroke={theme.accent} strokeWidth={1.8} strokeLinecap="round" />
+                    cx={12}
                    cy={12}
                    r={10}
                    stroke={theme.accent}
                    strokeWidth={1.8}
                    fill="none"
                  />
                  <Path
                    d="M12 6v6l4 2"
                    stroke={theme.accent}
                    strokeWidth={1.8}
                    strokeLinecap="round"
                  />
                </Svg>
-            } defaultExpanded={!!dueDate}>
+              }
              defaultExpanded={!!dueDate}
            >
              <DateTimePickerComponent control={control} />
            </CollapsibleSection>
-            <CollapsibleSection title="Repeat" icon={
+            <CollapsibleSection
              title="Repeat"
              icon={
                <Svg width={20} height={20} viewBox="0 0 24 24">
                  <Path
                    d="M17 2l4 4-4 4M3 11v-1a4 4 0 0 1 4-4h14M7 22l-4-4 4-4M21 13v1a4 4 0 0 1-4 4H3"
@@ -351,7 +419,9 @@ export default function TaskDetailScreen() {
                    fill="none"
                  />
                </Svg>
-            } defaultExpanded={repeat !== 'none'}>
+              }
              defaultExpanded={repeat !== 'none'}
            >
              <RepeatSelector
                value={repeat}
                interval={repeatInterval}
@@ -364,7 +434,9 @@ export default function TaskDetailScreen() {
              />
            </CollapsibleSection>
-            <CollapsibleSection title="Reminder" icon={
+            <CollapsibleSection
              title="Reminder"
              icon={
                <Svg width={20} height={20} viewBox="0 0 24 24">
                  <Path
                    d="M6 8a6 6 0 0 1 12 0c0 7 3 9 3 9H3s3-2 3-9M10.3 21a1.94 1.94 0 0 0 3.4 0"
@@ -375,32 +447,61 @@ export default function TaskDetailScreen() {
                    fill="none"
                  />
                </Svg>
-            } defaultExpanded={!!reminders && reminders !== ''}>
+              }
              defaultExpanded={!!reminders && reminders !== ''}
            >
              <ReminderSelector
                value={reminders}
                hasDueDate={!!dueDate}
-                onChange={(value) => setValue('reminders', value)}
+                onChange={value => setValue('reminders', value)}
              />
            </CollapsibleSection>
-            <CollapsibleSection title="Assignee" icon={
+            <CollapsibleSection
              title="Assignee"
              icon={
                <Svg width={20} height={20} viewBox="0 0 24 24">
-                <Circle cx={12} cy={12} r={10} stroke={theme.accent} strokeWidth={1.8} fill="none" />
+                  <Circle
-                <Path d="M12 10v6M12 19v1" stroke={theme.accent} strokeWidth={1.8} strokeLinecap="round" />
+                    cx={12}
                    cy={12}
                    r={10}
                    stroke={theme.accent}
                    strokeWidth={1.8}
                    fill="none"
                  />
                  <Path
                    d="M12 10v6M12 19v1"
                    stroke={theme.accent}
                    strokeWidth={1.8}
                    strokeLinecap="round"
                  />
                </Svg>
-            } defaultExpanded={!!assigneeId}>
+              }
              defaultExpanded={!!assigneeId}
            >
              <AssigneeSelector
                value={assigneeId}
                onChange={(value: string | null) => setValue('assigneeId', value)}
-                friends={friends.map((f) => f.username)}
+                friends={friends.map(f => f.username)}
              />
            </CollapsibleSection>
-            <CollapsibleSection title="Description" icon={
+            <CollapsibleSection
              title="Description"
              icon={
                <Svg width={20} height={20} viewBox="0 0 24 24">
-                <Path d="M4 6h16M4 12h16M4 18h10" stroke={theme.accent} strokeWidth={1.8} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+                  <Path
                    d="M4 6h16M4 12h16M4 18h10"
                    stroke={theme.accent}
                    strokeWidth={1.8}
                    strokeLinecap="round"
                    strokeLinejoin="round"
                    fill="none"
                  />
                </Svg>
-            } defaultExpanded={!!methods.getValues('description')}>
+              }
              defaultExpanded={!!methods.getValues('description')}
            >
              <Controller
                control={control}
                name="description"
@@ -9,22 +9,23 @@
    "@react-native-async-storage/async-storage": "2.2.0",
    "@react-native-community/datetimepicker": "9.1.0",
    "date-fns": "^3.6.0",
-    "expo": "~57.0.10",
+    "expo": "~57.0.18",
    "expo-blur": "~57.0.2",
    "expo-constants": "~57.0.9",
-    "expo-dev-client": "~57.0.1",
+    "expo-dev-client": "~57.0.16",
    "expo-device": "^57.0.1",
-    "expo-linking": "~57.0.5",
+    "expo-intent-launcher": "~57.0.1",
-    "expo-notifications": "~57.0.8",
+    "expo-linking": "~57.0.8",
-    "expo-router": "~57.0.10",
+    "expo-notifications": "~57.0.15",
-    "expo-sqlite": "~57.0.1",
+    "expo-router": "~57.0.17",
    "expo-sqlite": "~57.0.2",
    "expo-status-bar": "~57.0.1",
-    "expo-system-ui": "~57.0.2",
+    "expo-system-ui": "~57.0.3",
-    "expo-updates": "~57.0.12",
+    "expo-updates": "~57.0.19",
    "react": "19.2.3",
    "react-dom": "19.2.3",
    "react-hook-form": "^7.51.5",
-    "react-native": "0.86.2",
+    "react-native": "0.86.3",
    "react-native-gesture-handler": "2.32.0",
    "react-native-keyboard-controller": "1.21.9",
    "react-native-safe-area-context": "5.7.0",
@@ -40,7 +41,7 @@
    "electron": "^41.7.1",
    "electron-builder": "^26.15.3",
    "eslint": "^9.0.0",
-    "eslint-config-expo": "~57.0.1",
+    "eslint-config-expo": "~57.0.2",
    "patch-package": "^8.0.1",
    "prettier": "^3.9.6",
    "typescript": "~6.0.3"
@@ -0,0 +1,78 @@
 diff --git a/node_modules/react-native/src/private/webapis/dom/events/Event.js b/node_modules/react-native/src/private/webapis/dom/events/Event.js
 index f918f97..5deab46 100644
 --- a/node_modules/react-native/src/private/webapis/dom/events/Event.js
 +++ b/node_modules/react-native/src/private/webapis/dom/events/Event.js
@@ -70,7 +70,7 @@ export default class Event {
   [CURRENT_TARGET_KEY]: EventTarget | null = null;
   // $FlowExpectedError[unsupported-syntax]
 -  [EVENT_PHASE_KEY]: boolean = Event.NONE;
 +  [EVENT_PHASE_KEY]: boolean = 0;
   // $FlowExpectedError[unsupported-syntax]
   [IN_PASSIVE_LISTENER_FLAG_KEY]: boolean = false;
@@ -193,48 +193,64 @@ export default class Event {
 // $FlowExpectedError[cannot-write]
 Object.defineProperty(Event, 'NONE', {
 +  writable: true,
 +  configurable: true,
   enumerable: true,
   value: 0,
 });
 // $FlowExpectedError[cannot-write]
 Object.defineProperty(Event.prototype, 'NONE', {
 +  writable: true,
 +  configurable: true,
   enumerable: true,
   value: 0,
 });
 // $FlowExpectedError[cannot-write]
 Object.defineProperty(Event, 'CAPTURING_PHASE', {
 +  writable: true,
 +  configurable: true,
   enumerable: true,
   value: 1,
 });
 // $FlowExpectedError[cannot-write]
 Object.defineProperty(Event.prototype, 'CAPTURING_PHASE', {
 +  writable: true,
 +  configurable: true,
   enumerable: true,
   value: 1,
 });
 // $FlowExpectedError[cannot-write]
 Object.defineProperty(Event, 'AT_TARGET', {
 +  writable: true,
 +  configurable: true,
   enumerable: true,
   value: 2,
 });
 // $FlowExpectedError[cannot-write]
 Object.defineProperty(Event.prototype, 'AT_TARGET', {
 +  writable: true,
 +  configurable: true,
   enumerable: true,
   value: 2,
 });
 // $FlowExpectedError[cannot-write]
 Object.defineProperty(Event, 'BUBBLING_PHASE', {
 +  writable: true,
 +  configurable: true,
   enumerable: true,
   value: 3,
 });
 // $FlowExpectedError[cannot-write]
 Object.defineProperty(Event.prototype, 'BUBBLING_PHASE', {
 +  writable: true,
 +  configurable: true,
   enumerable: true,
   value: 3,
 });
@@ -161,7 +161,7 @@ export function CategoryEditorModal({
                  </TouchableOpacity>
                ))}
              </View>
-              <ColorWheel color={color} onChange={setColor} />
+              <ColorWheel color={color} opacity={1} onChange={setColor} />
              <View style={styles.actions}>
                {category && (
@@ -1,7 +1,17 @@
 import React from 'react';
 import { View, Text, TouchableOpacity, StyleSheet, Switch } from 'react-native';
-export const ListItem = ({ title, subtitle, onPress, leftIcon, rightIcon, disabled, leftElement, rightElement, showChevron }: {
+export const ListItem = ({
  title,
  subtitle,
  onPress,
  leftIcon,
  rightIcon,
  disabled,
  leftElement,
  rightElement,
  showChevron,
 }: {
  title: string;
  subtitle?: string | undefined;
  onPress?: () => void;
@@ -19,10 +19,22 @@ interface OptionPickerModalProps {
  multiSelect?: boolean;
 }
-export function OptionPickerModal({ visible, title, options, selectedValue, onSelect, onClose, multiSelect = false }: OptionPickerModalProps) {
+export function OptionPickerModal({
  visible,
  title,
  options,
  selectedValue,
  onSelect,
  onClose,
  multiSelect = false,
 }: OptionPickerModalProps) {
  const { theme } = useSettings();
-  const selectedValues = Array.isArray(selectedValue) ? selectedValue : selectedValue == null ? [] : [selectedValue];
+  const selectedValues = Array.isArray(selectedValue)
    ? selectedValue
    : selectedValue == null
      ? []
      : [selectedValue];
  return (
    <Modal visible={visible} transparent animationType="fade" onRequestClose={onClose}>
@@ -31,7 +43,7 @@ export function OptionPickerModal({ visible, title, options, selectedValue, onSe
          <Text style={[styles.title, { color: theme.text }]}>{title}</Text>
          <FlatList
            data={options}
-            keyExtractor={(item) => item.value}
+            keyExtractor={item => item.value}
            renderItem={({ item }) => {
              const selected = selectedValues.includes(item.value);
              return (
@@ -44,7 +56,7 @@ export function OptionPickerModal({ visible, title, options, selectedValue, onSe
                  onPress={() => {
                    if (multiSelect) {
                      const newValues = selected
-                        ? selectedValues.filter((v) => v !== item.value)
+                        ? selectedValues.filter(v => v !== item.value)
                        : [...selectedValues, item.value];
                      onSelect(newValues);
                    } else {
@@ -57,23 +69,49 @@ export function OptionPickerModal({ visible, title, options, selectedValue, onSe
                  accessibilityLabel={item.label}
                  accessibilityState={multiSelect ? { checked: selected } : { selected }}
                >
-                  {item.color && (
+                  {item.color && <View style={[styles.dot, { backgroundColor: item.color }]} />}
-                    <View style={[styles.dot, { backgroundColor: item.color }]} />
+                  <Text
-                  )}
+                    style={[
-                  <Text style={[styles.optionText, { color: selected ? theme.accent : theme.textSecondary }]}>
+                      styles.optionText,
                      { color: selected ? theme.accent : theme.textSecondary },
                    ]}
                  >
                    {item.label}
                  </Text>
                  {multiSelect ? (
                    <Svg width={22} height={22} viewBox="0 0 24 24">
-                      <Circle cx={12} cy={12} r={10} stroke={selected ? theme.accent : theme.borderStrong} strokeWidth={2} fill={selected ? theme.accent : 'transparent'} />
+                      <Circle
                        cx={12}
                        cy={12}
                        r={10}
                        stroke={selected ? theme.accent : theme.borderStrong}
                        strokeWidth={2}
                        fill={selected ? theme.accent : 'transparent'}
                      />
                      {selected && (
-                        <Path d="M8 12l3 3 6-6" stroke="#FFFFFF" strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+                        <Path
                          d="M8 12l3 3 6-6"
                          stroke="#FFFFFF"
                          strokeWidth={2.5}
                          strokeLinecap="round"
                          strokeLinejoin="round"
                          fill="none"
                        />
                      )}
                    </Svg>
-                  ) : selected && (
+                  ) : (
                    selected && (
                      <Svg width={18} height={18} viewBox="0 0 24 24">
-                      <Path d="M5 12l5 5 9-10" stroke={theme.accent} strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+                        <Path
                          d="M5 12l5 5 9-10"
                          stroke={theme.accent}
                          strokeWidth={2.5}
                          strokeLinecap="round"
                          strokeLinejoin="round"
                          fill="none"
                        />
                      </Svg>
                    )
                  )}
                </TouchableOpacity>
              );
@@ -24,13 +24,17 @@ export function PrioritySelector({ value, onChange }: PrioritySelectorProps) {
    <View style={styles.container}>
      <Text style={[styles.label, { color: theme.text }]}>Priority</Text>
      <View style={styles.options} accessibilityRole="radiogroup" accessibilityLabel="Priority">
-        {priorities.map((priority) => (
+        {priorities.map(priority => (
          <TouchableOpacity
            key={priority.value}
            style={[
              styles.option,
              { backgroundColor: theme.card, borderColor: theme.borderStrong },
-              value === priority.value && { borderColor: theme.accent, backgroundColor: theme.accentSoft, borderWidth: 2 },
+              value === priority.value && {
                borderColor: theme.accent,
                backgroundColor: theme.accentSoft,
                borderWidth: 2,
              },
            ]}
            onPress={() => onChange(priority.value)}
            activeOpacity={0.8}
@@ -38,16 +42,20 @@ export function PrioritySelector({ value, onChange }: PrioritySelectorProps) {
            accessibilityLabel={`${priority.label} priority`}
            accessibilityState={{ selected: value === priority.value }}
          >
-            <View style={[
+            <View
              style={[
                styles.colorIndicator,
                { backgroundColor: PRIORITY_COLORS[priority.value] },
                value === priority.value && styles.colorIndicatorSelected,
-            ]} />
+              ]}
-            <Text style={[
+            />
            <Text
              style={[
                styles.optionText,
                { color: theme.textFaint },
                value === priority.value && { color: theme.accentStrong, fontWeight: '600' },
-            ]}>
+              ]}
            >
              {priority.label}
            </Text>
          </TouchableOpacity>
@@ -1,5 +1,13 @@
 import React, { useState, useEffect, useMemo, useRef } from 'react';
-import { View, StyleSheet, TextInput, TouchableOpacity, Keyboard, Text, Platform } from 'react-native';
+import {
  View,
  StyleSheet,
  TextInput,
  TouchableOpacity,
  Keyboard,
  Text,
  Platform,
 } from 'react-native';
 import { BlurView } from 'expo-blur';
 import { database, collections } from '@/database';
 import { useCategories } from '@/hooks/useDatabase';
@@ -14,10 +22,20 @@ interface QuickAddBarProps {
  placeholder?: string;
 }
-const BlurContainer = ({ children, style, theme }: { children: React.ReactNode; style: any; theme: any }) => {
+const BlurContainer = ({
  children,
  style,
  theme,
 }: {
  children: React.ReactNode;
  style: any;
  theme: any;
 }) => {
  if (Platform.OS === 'web') {
    return (
-      <View style={[style, { backgroundColor: theme.card, borderWidth: 1, borderColor: theme.border }]}>
+      <View
        style={[style, { backgroundColor: theme.card, borderWidth: 1, borderColor: theme.border }]}
      >
        {children}
      </View>
    );
@@ -38,10 +56,10 @@ export function QuickAddBar({ dueDate = 0, placeholder }: QuickAddBarProps) {
  const inputRef = useRef<TextInput>(null);
  const visibleCategories = useMemo(
-    () => categories.filter((c) => c.name.toLowerCase() !== 'calendar'),
+    () => categories.filter(c => c.name.toLowerCase() !== 'calendar'),
    [categories]
  );
-  const categoryColor = visibleCategories.find((c) => c.id === categoryId)?.color ?? theme.textMuted;
+  const categoryColor = visibleCategories.find(c => c.id === categoryId)?.color ?? theme.textMuted;
  useEffect(() => {
    return subscribeToQuickAdd(() => {
@@ -57,7 +75,7 @@ export function QuickAddBar({ dueDate = 0, placeholder }: QuickAddBarProps) {
    const now = new Date();
    await database.write(async () => {
-      await collections.tasks.create((t) => {
+      await collections.tasks.create(t => {
        t.title = trimmed;
        t.description = '';
        t.categoryId = categoryId || '';
@@ -83,16 +101,31 @@ export function QuickAddBar({ dueDate = 0, placeholder }: QuickAddBarProps) {
  return (
    <View style={styles.wrapper}>
      <BlurContainer theme={theme} style={styles.blurContainer}>
-        <View style={[styles.bar, { backgroundColor: 'rgba(255,255,255,0.05)', borderColor: 'rgba(255,255,255,0.1)' }]}>
+        <View
          style={[
            styles.bar,
            { backgroundColor: 'rgba(255,255,255,0.05)', borderColor: 'rgba(255,255,255,0.1)' },
          ]}
        >
          <TouchableOpacity
-            style={[styles.categoryButton, { borderColor: theme.borderStrong, backgroundColor: theme.cardAlt }]}
+            style={[
              styles.categoryButton,
              { borderColor: theme.borderStrong, backgroundColor: theme.cardAlt },
            ]}
            onPress={() => setCategoryPickerVisible(true)}
            activeOpacity={0.7}
            accessibilityLabel="Select tags"
          >
            <View style={[styles.categoryButtonDot, { backgroundColor: categoryColor }]} />
            <Svg width={12} height={12} viewBox="0 0 24 24">
-              <Path d="M6 9l6 6 6-6" stroke={theme.textSecondary} strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+              <Path
                d="M6 9l6 6 6-6"
                stroke={theme.textSecondary}
                strokeWidth={2.5}
                strokeLinecap="round"
                strokeLinejoin="round"
                fill="none"
              />
            </Svg>
          </TouchableOpacity>
          <TextInput
@@ -108,7 +141,11 @@ export function QuickAddBar({ dueDate = 0, placeholder }: QuickAddBarProps) {
            accessibilityHint="Enter a task name and press the add button"
          />
          <TouchableOpacity
-            style={[styles.submit, { backgroundColor: theme.accent }, title.trim() ? {} : styles.submitDisabled]}
+            style={[
              styles.submit,
              { backgroundColor: theme.accent },
              title.trim() ? {} : styles.submitDisabled,
            ]}
            onPress={title.trim() ? handleAdd : undefined}
            disabled={!title.trim()}
            activeOpacity={0.8}
@@ -132,9 +169,12 @@ export function QuickAddBar({ dueDate = 0, placeholder }: QuickAddBarProps) {
      <OptionPickerModal
        visible={categoryPickerVisible}
        title="Select Tags"
-        options={[{ value: '', label: 'None', color: theme.textMuted }, ...visibleCategories.map((c) => ({ value: c.id, label: c.name, color: c.color }))]}
+        options={[
          { value: '', label: 'None', color: theme.textMuted },
          ...visibleCategories.map(c => ({ value: c.id, label: c.name, color: c.color })),
        ]}
        selectedValue={categoryId}
-        onSelect={(value) => setCategoryId(Array.isArray(value) ? value[0] : value)}
+        onSelect={value => setCategoryId(Array.isArray(value) ? value[0] : value)}
        onClose={() => setCategoryPickerVisible(false)}
      />
    </View>
@@ -162,7 +202,7 @@ const styles = StyleSheet.create({
    borderBottomWidth: 1,
    shadowColor: '#000',
    shadowOffset: { width: 0, height: -2 },
-    shadowOpacity: 0.10,
+    shadowOpacity: 0.1,
    shadowRadius: 6,
    elevation: 6,
    minHeight: 56,
@@ -18,8 +18,12 @@ export function ReminderSelector({ value, onChange, hasDueDate }: ReminderSelect
  const selectedReminders = parseReminders(value);
  const disabled = !hasDueDate;
-  const reminderLabels = selectedReminders.length > 0
+  const reminderLabels =
-    ? selectedReminders.map(r => REMINDER_OPTIONS.find(o => o.value === r)?.label).filter(Boolean).join(', ')
+    selectedReminders.length > 0
      ? selectedReminders
          .map(r => REMINDER_OPTIONS.find(o => o.value === r)?.label)
          .filter(Boolean)
          .join(', ')
      : 'No reminder';
  return (
@@ -29,7 +33,10 @@ export function ReminderSelector({ value, onChange, hasDueDate }: ReminderSelect
        style={[
          styles.row,
          { backgroundColor: theme.card, borderColor: theme.borderStrong },
-          selectedReminders.length > 0 && { borderColor: theme.accent, backgroundColor: theme.accentSoft },
+          selectedReminders.length > 0 && {
            borderColor: theme.accent,
            backgroundColor: theme.accentSoft,
          },
          disabled && { opacity: 0.5 },
        ]}
        onPress={() => setShowPicker(true)}
@@ -49,7 +56,14 @@ export function ReminderSelector({ value, onChange, hasDueDate }: ReminderSelect
            strokeLinejoin="round"
            fill="none"
          />
-          <Circle cx={18.5} cy={5.5} r={3.5} fill={selectedReminders.length > 0 ? theme.accent : 'transparent'} stroke={selectedReminders.length > 0 ? theme.accentText : theme.textSecondary} strokeWidth={1.8} />
+          <Circle
            cx={18.5}
            cy={5.5}
            r={3.5}
            fill={selectedReminders.length > 0 ? theme.accent : 'transparent'}
            stroke={selectedReminders.length > 0 ? theme.accentText : theme.textSecondary}
            strokeWidth={1.8}
          />
        </Svg>
        <Text
          style={[
@@ -62,20 +76,32 @@ export function ReminderSelector({ value, onChange, hasDueDate }: ReminderSelect
        </Text>
        <View style={styles.chevron}>
          <Svg width={16} height={16} viewBox="0 0 24 24">
-            <Path d="M9 18l6-6-6-6" stroke={theme.textSecondary} strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+            <Path
              d="M9 18l6-6-6-6"
              stroke={theme.textSecondary}
              strokeWidth={2.5}
              strokeLinecap="round"
              strokeLinejoin="round"
              fill="none"
            />
          </Svg>
        </View>
      </TouchableOpacity>
      {!hasDueDate && (
-        <Text style={[styles.hint, { color: theme.textMuted }]}>Set a due date to add reminders.</Text>
+        <Text style={[styles.hint, { color: theme.textMuted }]}>
          Set a due date to add reminders.
        </Text>
      )}
      <OptionPickerModal
        visible={showPicker}
        title="Reminders"
-        options={REMINDER_OPTIONS.filter((o) => o.value !== 'none').map((o) => ({ value: o.value, label: o.label }))}
+        options={REMINDER_OPTIONS.filter(o => o.value !== 'none').map(o => ({
          value: o.value,
          label: o.label,
        }))}
        selectedValue={selectedReminders}
-        onSelect={(v) => onChange(toRemindersString(v as Reminder[]))}
+        onSelect={v => onChange(toRemindersString(v as Reminder[]))}
        onClose={() => setShowPicker(false)}
        multiSelect
      />
@@ -1,6 +1,22 @@
 import React from 'react';
-import { View, Text, StyleSheet, TouchableOpacity, Modal, TextInput, Pressable, KeyboardAvoidingView } from 'react-native';
+import {
-import { Repeat, REPEAT_OPTIONS, WEEKDAY_LABELS, WEEKDAY_ORDER, weekdaysInDisplayOrder, repeatDaysFromString } from '@/types';
+  View,
  Text,
  StyleSheet,
  TouchableOpacity,
  Modal,
  TextInput,
  Pressable,
  KeyboardAvoidingView,
 } from 'react-native';
 import {
  Repeat,
  REPEAT_OPTIONS,
  WEEKDAY_LABELS,
  WEEKDAY_ORDER,
  weekdaysInDisplayOrder,
  repeatDaysFromString,
 } from '@/types';
 import { useSettings } from '@/theme';
 import { useRepeatProfiles } from '@/hooks/useDatabase';
 import { createRepeatProfile, deleteRepeatProfile } from '@/utils/repeatProfileActions';
@@ -43,7 +59,15 @@ function RepeatIcon({ repeat, color }: { repeat: Repeat; color: string }) {
  );
 }
-const WEEKDAY_NAMES = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'];
+const WEEKDAY_NAMES = [
  'Sunday',
  'Monday',
  'Tuesday',
  'Wednesday',
  'Thursday',
  'Friday',
  'Saturday',
 ];
 function unitLabel(value: Repeat): string {
  switch (value) {
@@ -77,12 +101,16 @@ export function RepeatSelector({ value, interval, days, onChange }: RepeatSelect
  };
  const toggleDay = (day: number) => {
-    const nextDays = days.includes(day) ? days.filter((d) => d !== day) : [...days, day].sort();
+    const nextDays = days.includes(day) ? days.filter(d => d !== day) : [...days, day].sort();
    if (value === 'custom' && nextDays.length === 0) return;
    onChange(value, interval, nextDays);
  };
-  const applyProfile = (profile: { repeat: Repeat; repeatInterval: number; repeatDays: string }) => {
+  const applyProfile = (profile: {
    repeat: Repeat;
    repeatInterval: number;
    repeatDays: string;
  }) => {
    onChange(profile.repeat, profile.repeatInterval, repeatDaysFromString(profile.repeatDays));
  };
@@ -116,7 +144,7 @@ export function RepeatSelector({ value, interval, days, onChange }: RepeatSelect
        <View style={styles.profileRow}>
          <Text style={[styles.profileLabel, { color: theme.textFaint }]}>Profiles</Text>
          <View style={styles.profileChips}>
-            {profiles.map((profile) => (
+            {profiles.map(profile => (
              <View
                key={profile.id}
                style={[
@@ -131,8 +159,15 @@ export function RepeatSelector({ value, interval, days, onChange }: RepeatSelect
                    },
                ]}
              >
-                <TouchableOpacity onPress={() => applyProfile(profile)} activeOpacity={0.8} accessibilityRole="button" accessibilityLabel={`Apply repeat profile ${profile.name}`}>
+                <TouchableOpacity
-                  <Text style={[styles.profileChipText, { color: theme.textSecondary }]}>{profile.name}</Text>
+                  onPress={() => applyProfile(profile)}
                  activeOpacity={0.8}
                  accessibilityRole="button"
                  accessibilityLabel={`Apply repeat profile ${profile.name}`}
                >
                  <Text style={[styles.profileChipText, { color: theme.textSecondary }]}>
                    {profile.name}
                  </Text>
                </TouchableOpacity>
                <TouchableOpacity
                  onPress={() => handleDeleteProfile(profile.id, profile.name)}
@@ -149,13 +184,17 @@ export function RepeatSelector({ value, interval, days, onChange }: RepeatSelect
      )}
      <View style={styles.chipRow} accessibilityRole="radiogroup" accessibilityLabel="Repeat">
-        {REPEAT_OPTIONS.map((option) => (
+        {REPEAT_OPTIONS.map(option => (
          <TouchableOpacity
            key={option.value}
            style={[
              styles.chip,
              { backgroundColor: theme.card, borderColor: theme.borderStrong },
-              value === option.value && { borderColor: theme.accent, backgroundColor: theme.accentSoft, borderWidth: 2 },
+              value === option.value && {
                borderColor: theme.accent,
                backgroundColor: theme.accentSoft,
                borderWidth: 2,
              },
            ]}
            onPress={() => selectRepeat(option.value)}
            activeOpacity={0.8}
@@ -163,7 +202,10 @@ export function RepeatSelector({ value, interval, days, onChange }: RepeatSelect
            accessibilityLabel={`Repeat ${option.label.replace('No Repeat', 'none')}`}
            accessibilityState={{ selected: value === option.value }}
          >
-            <RepeatIcon repeat={option.value} color={value === option.value ? theme.accent : theme.textFaint} />
+            <RepeatIcon
              repeat={option.value}
              color={value === option.value ? theme.accent : theme.textFaint}
            />
            <Text
              style={[
                styles.chipText,
@@ -179,7 +221,12 @@ export function RepeatSelector({ value, interval, days, onChange }: RepeatSelect
      {value !== 'none' && (
        <View style={styles.settings}>
-          <View style={[styles.intervalRow, { backgroundColor: theme.card, borderColor: theme.borderStrong }]}>
+          <View
            style={[
              styles.intervalRow,
              { backgroundColor: theme.card, borderColor: theme.borderStrong },
            ]}
          >
            <Text style={[styles.intervalLabel, { color: theme.textSecondary }]}>Every</Text>
            <TouchableOpacity
              style={[styles.stepButton, { borderColor: theme.borderStrong }]}
@@ -190,7 +237,14 @@ export function RepeatSelector({ value, interval, days, onChange }: RepeatSelect
              accessibilityLabel="Decrease repeat interval"
              accessibilityState={{ disabled: interval <= 1 }}
            >
-              <Text style={[styles.stepButtonText, { color: interval <= 1 ? theme.textMuted : theme.text }]}>−</Text>
+              <Text
                style={[
                  styles.stepButtonText,
                  { color: interval <= 1 ? theme.textMuted : theme.text },
                ]}
              >
                −
              </Text>
            </TouchableOpacity>
            <Text style={[styles.intervalValue, { color: theme.text }]}>{interval}</Text>
            <TouchableOpacity
@@ -202,7 +256,14 @@ export function RepeatSelector({ value, interval, days, onChange }: RepeatSelect
              accessibilityLabel="Increase repeat interval"
              accessibilityState={{ disabled: interval >= 30 }}
            >
-              <Text style={[styles.stepButtonText, { color: interval >= 30 ? theme.textMuted : theme.text }]}>+</Text>
+              <Text
                style={[
                  styles.stepButtonText,
                  { color: interval >= 30 ? theme.textMuted : theme.text },
                ]}
              >
                +
              </Text>
            </TouchableOpacity>
            <Text style={[styles.intervalLabel, { color: theme.textSecondary }]}>
              {unitLabel(value)}
@@ -212,14 +273,20 @@ export function RepeatSelector({ value, interval, days, onChange }: RepeatSelect
          {isDaysBased(value) && (
            <View style={styles.dayRow}>
-              {WEEKDAY_ORDER.map((day) => (
+              {WEEKDAY_ORDER.map(day => (
                <TouchableOpacity
                  key={`${WEEKDAY_LABELS[day]}-${day}`}
                  style={[
                    styles.dayChip,
                    { backgroundColor: theme.card, borderColor: theme.borderStrong },
-                    days.includes(day) && { backgroundColor: theme.accent, borderColor: theme.accent },
+                    days.includes(day) && {
-                    value === 'custom' && days.length === 1 && days.includes(day) && styles.dayChipLast,
+                      backgroundColor: theme.accent,
                      borderColor: theme.accent,
                    },
                    value === 'custom' &&
                      days.length === 1 &&
                      days.includes(day) &&
                      styles.dayChipLast,
                  ]}
                  onPress={() => toggleDay(day)}
                  activeOpacity={0.8}
@@ -250,9 +317,16 @@ export function RepeatSelector({ value, interval, days, onChange }: RepeatSelect
          activeOpacity={0.8}
        >
          <Svg width={13} height={13} viewBox="0 0 24 24">
-            <Path d="M12 5v14M5 12h14" stroke={theme.accent} strokeWidth={2.5} strokeLinecap="round" />
+            <Path
              d="M12 5v14M5 12h14"
              stroke={theme.accent}
              strokeWidth={2.5}
              strokeLinecap="round"
            />
          </Svg>
-          <Text style={[styles.saveProfileText, { color: theme.accentStrong }]}>Save as profile</Text>
+          <Text style={[styles.saveProfileText, { color: theme.accentStrong }]}>
            Save as profile
          </Text>
        </TouchableOpacity>
      )}
@@ -262,19 +336,29 @@ export function RepeatSelector({ value, interval, days, onChange }: RepeatSelect
        animationType="fade"
        onRequestClose={() => setSaveModalVisible(false)}
      >
-        <KeyboardAvoidingView
+        <KeyboardAvoidingView style={styles.modalBackdrop} behavior="padding">
          style={styles.modalBackdrop}
          behavior="padding"
        >
          <Pressable style={styles.modalBackdrop} onPress={() => setSaveModalVisible(false)}>
-            <Pressable style={[styles.modalCard, { backgroundColor: theme.card, borderColor: theme.border }]}>
+            <Pressable
              style={[styles.modalCard, { backgroundColor: theme.card, borderColor: theme.border }]}
            >
              <Text style={[styles.modalTitle, { color: theme.text }]}>Save repeat profile</Text>
              <Text style={[styles.modalHint, { color: theme.textFaint }]}>
-                {`${REPEAT_OPTIONS.find((o) => o.value === value)?.label.replace('No Repeat', 'None')}, every ${interval} ${unitLabel(value)}${interval > 1 ? 's' : ''}`}
+                {`${REPEAT_OPTIONS.find(o => o.value === value)?.label.replace('No Repeat', 'None')}, every ${interval} ${unitLabel(value)}${interval > 1 ? 's' : ''}`}
-                {isDaysBased(value) && days.length > 0 ? ` · ${weekdaysInDisplayOrder(days).map((d) => WEEKDAY_LABELS[d]).join(' ')}` : ''}
+                {isDaysBased(value) && days.length > 0
                  ? ` · ${weekdaysInDisplayOrder(days)
                      .map(d => WEEKDAY_LABELS[d])
                      .join(' ')}`
                  : ''}
              </Text>
              <TextInput
-                style={[styles.modalInput, { backgroundColor: theme.cardAlt, borderColor: theme.borderStrong, color: theme.text }]}
+                style={[
                  styles.modalInput,
                  {
                    backgroundColor: theme.cardAlt,
                    borderColor: theme.borderStrong,
                    color: theme.text,
                  },
                ]}
                value={profileName}
                onChangeText={setProfileName}
                placeholder="Profile name (e.g. Every weekday)"
@@ -290,15 +374,25 @@ export function RepeatSelector({ value, interval, days, onChange }: RepeatSelect
                  onPress={() => setSaveModalVisible(false)}
                  activeOpacity={0.8}
                >
-                  <Text style={[styles.modalButtonText, { color: theme.textSecondary }]}>Cancel</Text>
+                  <Text style={[styles.modalButtonText, { color: theme.textSecondary }]}>
                    Cancel
                  </Text>
                </TouchableOpacity>
                <TouchableOpacity
-                  style={[styles.modalButton, styles.modalButtonPrimary, { backgroundColor: theme.accent }]}
+                  style={[
                    styles.modalButton,
                    styles.modalButtonPrimary,
                    { backgroundColor: theme.accent },
                  ]}
                  onPress={handleSaveProfile}
                  disabled={!profileName.trim()}
                  activeOpacity={0.8}
                >
-                  <Text style={[styles.modalButtonText, { color: theme.accentText, fontWeight: '600' }]}>Save</Text>
+                  <Text
                    style={[styles.modalButtonText, { color: theme.accentText, fontWeight: '600' }]}
                  >
                    Save
                  </Text>
                </TouchableOpacity>
              </View>
            </Pressable>
@@ -1,5 +1,13 @@
 import React, { useState } from 'react';
-import { Modal, View, Text, StyleSheet, TextInput, TouchableOpacity, KeyboardAvoidingView } from 'react-native';
+import {
  Modal,
  View,
  Text,
  StyleSheet,
  TextInput,
  TouchableOpacity,
  KeyboardAvoidingView,
 } from 'react-native';
 import { useSettings } from '@/theme';
 import { DEFAULT_API_BASE_URL } from '@/services/auth';
 import Svg, { Path } from 'react-native-svg';
@@ -33,16 +41,22 @@ export function ServerUrlModal({ visible, onClose }: ServerUrlModalProps) {
  return (
    <Modal visible={visible} transparent animationType="fade" onRequestClose={onClose}>
-      <KeyboardAvoidingView
+      <KeyboardAvoidingView style={styles.overlay} behavior="padding">
        style={styles.overlay}
        behavior="padding"
      >
        <View style={[styles.sheet, { backgroundColor: theme.sheetBg }]}>
          <View style={styles.header}>
            <Text style={[styles.title, { color: theme.text }]}>Backend URL</Text>
-            <TouchableOpacity onPress={onClose} style={styles.closeButton} hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}>
+            <TouchableOpacity
              onPress={onClose}
              style={styles.closeButton}
              hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}
            >
              <Svg width={18} height={18} viewBox="0 0 24 24">
-                <Path d="M18 6L6 18M6 6l12 12" stroke={theme.textSecondary} strokeWidth={2.2} strokeLinecap="round" />
+                <Path
                  d="M18 6L6 18M6 6l12 12"
                  stroke={theme.textSecondary}
                  strokeWidth={2.2}
                  strokeLinecap="round"
                />
              </Svg>
            </TouchableOpacity>
          </View>
@@ -51,7 +65,11 @@ export function ServerUrlModal({ visible, onClose }: ServerUrlModalProps) {
          <TextInput
            style={[
              styles.input,
-              { backgroundColor: theme.inputBg, borderColor: theme.borderStrong, color: theme.text },
+              {
                backgroundColor: theme.inputBg,
                borderColor: theme.borderStrong,
                color: theme.text,
              },
            ]}
            placeholder={DEFAULT_API_BASE_URL}
            placeholderTextColor={theme.textMuted}
@@ -75,7 +93,11 @@ export function ServerUrlModal({ visible, onClose }: ServerUrlModalProps) {
              <Text style={[styles.cancelButtonText, { color: theme.textSecondary }]}>Cancel</Text>
            </TouchableOpacity>
            <TouchableOpacity
-              style={[styles.saveButton, { backgroundColor: theme.accent }, !isValid && styles.saveButtonDisabled]}
+              style={[
                styles.saveButton,
                { backgroundColor: theme.accent },
                !isValid && styles.saveButtonDisabled,
              ]}
              onPress={handleSave}
              disabled={!isValid}
              activeOpacity={0.8}
@@ -46,7 +46,7 @@ export const SubtaskItem = React.memo(function SubtaskItem({
  const hasChildren = subtask.subtasks && subtask.subtasks.length > 0;
  const hovered = hoveredId === subtask.id;
  const effectiveColor = subtask.categoryId
-    ? categoryColorResolver?.(subtask.categoryId) ?? categoryColor
+    ? (categoryColorResolver?.(subtask.categoryId) ?? categoryColor)
    : categoryColor;
  const handleExpand = () => setExpanded(!expanded);
@@ -59,7 +59,7 @@ export const SubtaskItem = React.memo(function SubtaskItem({
  return (
    <View>
-      <View ref={(ref) => registerRef?.(subtask.id, subtask.taskId, ref)}>
+      <View ref={ref => registerRef?.(subtask.id, subtask.taskId, ref)}>
        <TaskItem
          task={subtask}
          indented
@@ -86,7 +86,7 @@ export const SubtaskItem = React.memo(function SubtaskItem({
          {subtask.subtasks
            .slice()
            .sort((a, b) => a.order - b.order)
-            .map((child) => (
+            .map(child => (
              <SubtaskItem
                key={child.id}
                subtask={child}
@@ -48,7 +48,9 @@ export function SubtasksSection({ control }: SubtasksSectionProps) {
                <Text style={[styles.label, { color: theme.text }]}>Subtasks</Text>
                {items.length > 0 && (
                  <View style={[styles.badge, { backgroundColor: theme.accentSoft }]}>
-                    <Text style={[styles.badgeText, { color: theme.accentStrong }]}>{items.length}</Text>
+                    <Text style={[styles.badgeText, { color: theme.accentStrong }]}>
                      {items.length}
                    </Text>
                  </View>
                )}
              </View>
@@ -92,20 +94,30 @@ export function SubtasksSection({ control }: SubtasksSectionProps) {
                    key={item._key ?? `subtask-${index}`}
                    index={index}
                    value={item.title}
-                    onChange={(value) => updateSubtask(index, value)}
+                    onChange={value => updateSubtask(index, value)}
                    onRemove={() => removeSubtask(index)}
                  />
                ))}
              </View>
              <TouchableOpacity
-                style={[styles.addButton, { backgroundColor: theme.accentSoft, borderColor: theme.accentBorder }]}
+                style={[
                  styles.addButton,
                  { backgroundColor: theme.accentSoft, borderColor: theme.accentBorder },
                ]}
                onPress={addSubtask}
                activeOpacity={0.8}
              >
                <Svg width={16} height={16} viewBox="0 0 24 24">
-                  <Path d="M12 5v14M5 12h14" stroke={theme.accent} strokeWidth={2} strokeLinecap="round" />
+                  <Path
                    d="M12 5v14M5 12h14"
                    stroke={theme.accent}
                    strokeWidth={2}
                    strokeLinecap="round"
                  />
                </Svg>
-                <Text style={[styles.addButtonText, { color: theme.accentStrong }]}>Add Subtask</Text>
+                <Text style={[styles.addButtonText, { color: theme.accentStrong }]}>
                  Add Subtask
                </Text>
              </TouchableOpacity>
            </Animated.View>
          </View>
@@ -150,7 +162,12 @@ function SubtaskItem({ index, value, onChange, onRemove }: SubtaskItemProps) {
      />
      <TouchableOpacity style={styles.removeButton} onPress={onRemove} activeOpacity={0.7}>
        <Svg width={20} height={20} viewBox="0 0 24 24">
-          <Path d="M18 6L6 18M6 6l12 12" stroke={theme.textSecondary} strokeWidth={2.2} strokeLinecap="round" />
+          <Path
            d="M18 6L6 18M6 6l12 12"
            stroke={theme.textSecondary}
            strokeWidth={2.2}
            strokeLinecap="round"
          />
        </Svg>
      </TouchableOpacity>
    </View>
@@ -11,9 +11,18 @@ import {
 } from 'react-native';
 import { useSettings } from '@/theme';
 import { AuthUser, getAuthToken, getAuthUser, login, register, signOutAuth } from '@/services/auth';
-import { runSyncGuarded, startAutoSync, stopAutoSync, getLastSyncTime, SyncResult } from '@/database/sync';
+import {
  runSyncGuarded,
  startAutoSync,
  stopAutoSync,
  getLastSyncTime,
  SyncResult,
 } from '@/database/sync';
 import { ForgotPasswordModal } from './ForgotPasswordModal';
-import { registerForPushNotificationsAsync, unregisterForPushNotificationsAsync } from '@/services/pushNotifications';
+import {
  registerForPushNotificationsAsync,
  unregisterForPushNotificationsAsync,
 } from '@/services/pushNotifications';
 interface SyncModalProps {
  visible: boolean;
@@ -81,7 +90,8 @@ export function SyncModal({ visible, onClose }: SyncModalProps) {
    }
    setBusy(true);
    try {
-      const authedUser = mode === 'register'
+      const authedUser =
        mode === 'register'
          ? await register(username.trim(), password)
          : await login(username.trim(), password);
      setUser(authedUser);
@@ -128,10 +138,7 @@ export function SyncModal({ visible, onClose }: SyncModalProps) {
  return (
    <Modal visible={visible} transparent animationType="fade" onRequestClose={onClose}>
-      <KeyboardAvoidingView
+      <KeyboardAvoidingView style={styles.overlay} behavior="padding">
        style={styles.overlay}
        behavior="padding"
      >
        <TouchableOpacity style={styles.backdrop} activeOpacity={1} onPress={onClose} />
        <View style={[styles.sheet, { backgroundColor: theme.sheetBg }]}>
          <View style={[styles.handle, { backgroundColor: theme.borderStrong }]} />
@@ -159,7 +166,9 @@ export function SyncModal({ visible, onClose }: SyncModalProps) {
                {status === 'syncing' ? (
                  <ActivityIndicator color={theme.accentText} />
                ) : (
-                  <Text style={[styles.primaryButtonText, { color: theme.accentText }]}>Sync Now</Text>
+                  <Text style={[styles.primaryButtonText, { color: theme.accentText }]}>
                    Sync Now
                  </Text>
                )}
              </TouchableOpacity>
@@ -181,7 +190,9 @@ export function SyncModal({ visible, onClose }: SyncModalProps) {
                onPress={handleSignOut}
                activeOpacity={0.7}
              >
-                <Text style={[styles.secondaryButtonText, { color: theme.dangerStrong }]}>Sign Out</Text>
+                <Text style={[styles.secondaryButtonText, { color: theme.dangerStrong }]}>
                  Sign Out
                </Text>
              </TouchableOpacity>
            </View>
          ) : (
@@ -191,13 +202,10 @@ export function SyncModal({ visible, onClose }: SyncModalProps) {
              </Text>
              <View style={[styles.segmentRow, { backgroundColor: theme.inputBg }]}>
-                {(['login', 'register'] as const).map((m) => (
+                {(['login', 'register'] as const).map(m => (
                  <TouchableOpacity
                    key={m}
-                    style={[
+                    style={[styles.segment, mode === m && { backgroundColor: theme.accent }]}
                      styles.segment,
                      mode === m && { backgroundColor: theme.accent },
                    ]}
                    onPress={() => {
                      setMode(m);
                      setError(null);
@@ -222,7 +230,14 @@ export function SyncModal({ visible, onClose }: SyncModalProps) {
                </Text>
              )}
              <TextInput
-                style={[styles.input, { backgroundColor: theme.inputBg, borderColor: theme.borderStrong, color: theme.text }]}
+                style={[
                  styles.input,
                  {
                    backgroundColor: theme.inputBg,
                    borderColor: theme.borderStrong,
                    color: theme.text,
                  },
                ]}
                placeholder="Username"
                placeholderTextColor={theme.textMuted}
                value={username}
@@ -231,7 +246,14 @@ export function SyncModal({ visible, onClose }: SyncModalProps) {
                autoCorrect={false}
              />
              <TextInput
-                style={[styles.input, { backgroundColor: theme.inputBg, borderColor: theme.borderStrong, color: theme.text }]}
+                style={[
                  styles.input,
                  {
                    backgroundColor: theme.inputBg,
                    borderColor: theme.borderStrong,
                    color: theme.text,
                  },
                ]}
                placeholder="Password (min 8 chars)"
                placeholderTextColor={theme.textMuted}
                value={password}
@@ -245,11 +267,15 @@ export function SyncModal({ visible, onClose }: SyncModalProps) {
                  onPress={() => setShowForgotPassword(true)}
                  activeOpacity={0.7}
                >
-                  <Text style={[styles.forgotPasswordText, { color: theme.accent }]}>Forgot Password?</Text>
+                  <Text style={[styles.forgotPasswordText, { color: theme.accent }]}>
                    Forgot Password?
                  </Text>
                </TouchableOpacity>
              )}
-              {error && <Text style={[styles.errorText, { color: theme.dangerStrong }]}>{error}</Text>}
+              {error && (
                <Text style={[styles.errorText, { color: theme.dangerStrong }]}>{error}</Text>
              )}
              <TouchableOpacity
                style={[styles.primaryButton, { backgroundColor: theme.accent }]}
@@ -268,7 +294,10 @@ export function SyncModal({ visible, onClose }: SyncModalProps) {
            </View>
          )}
-          <ForgotPasswordModal visible={showForgotPassword} onClose={() => setShowForgotPassword(false)} />
+          <ForgotPasswordModal
            visible={showForgotPassword}
            onClose={() => setShowForgotPassword(false)}
          />
          <TouchableOpacity
            style={[styles.secondaryButton, { borderColor: theme.borderStrong }]}
@@ -66,20 +66,37 @@ export default function SyncStatus({ compact = false }: SyncStatusProps) {
      case 'success':
        return (
          <Svg width={16} height={16} viewBox="0 0 24 24">
-            <Path d="M5 12l5 5 9-10" stroke={theme.success} strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+            <Path
              d="M5 12l5 5 9-10"
              stroke={theme.success}
              strokeWidth={2.5}
              strokeLinecap="round"
              strokeLinejoin="round"
              fill="none"
            />
          </Svg>
        );
      case 'error':
        return (
          <Svg width={16} height={16} viewBox="0 0 24 24">
            <Circle cx={12} cy={12} r={10} stroke={theme.danger} strokeWidth={2} fill="none" />
-            <Path d="M12 8v4M12 16h.01" stroke={theme.danger} strokeWidth={2} strokeLinecap="round" />
+            <Path
              d="M12 8v4M12 16h.01"
              stroke={theme.danger}
              strokeWidth={2}
              strokeLinecap="round"
            />
          </Svg>
        );
      default:
        return (
          <Svg width={16} height={16} viewBox="0 0 24 24">
-            <Path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z" stroke={theme.textFaint} strokeWidth={1.8} fill="none" />
+            <Path
              d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"
              stroke={theme.textFaint}
              strokeWidth={1.8}
              fill="none"
            />
            <Path d="M12 22V12" stroke={theme.textFaint} strokeWidth={1.8} strokeLinecap="round" />
          </Svg>
        );
@@ -88,16 +105,25 @@ export default function SyncStatus({ compact = false }: SyncStatusProps) {
  const getStatusText = () => {
    switch (status) {
-      case 'syncing': return 'Syncing...';
+      case 'syncing':
-      case 'success': return 'Synced';
+        return 'Syncing...';
-      case 'error': return 'Sync failed';
+      case 'success':
-      default: return lastSync ? `Last sync: ${formatTime(lastSync)}` : 'Not synced';
+        return 'Synced';
      case 'error':
        return 'Sync failed';
      default:
        return lastSync ? `Last sync: ${formatTime(lastSync)}` : 'Not synced';
    }
  };
  if (compact) {
    return (
-      <TouchableOpacity style={[styles.compact, { backgroundColor: theme.sheetBg }]} onPress={handleSync} disabled={status === 'syncing'} activeOpacity={0.7}>
+      <TouchableOpacity
        style={[styles.compact, { backgroundColor: theme.sheetBg }]}
        onPress={handleSync}
        disabled={status === 'syncing'}
        activeOpacity={0.7}
      >
        <View style={styles.compactRow}>
          {getStatusIcon()}
          <Text style={[styles.compactText, { color: theme.textMuted }]}>
@@ -116,12 +142,20 @@ export default function SyncStatus({ compact = false }: SyncStatusProps) {
          <Text style={[styles.statusText, { color: theme.text }]}>{getStatusText()}</Text>
        </View>
        <TouchableOpacity
-          style={[styles.syncButton, { backgroundColor: status === 'syncing' ? theme.accentSoft : theme.accent }]}
+          style={[
            styles.syncButton,
            { backgroundColor: status === 'syncing' ? theme.accentSoft : theme.accent },
          ]}
          onPress={handleSync}
          disabled={status === 'syncing'}
          activeOpacity={0.8}
        >
-          <Text style={[styles.syncButtonText, { color: status === 'syncing' ? theme.accent : theme.accentText }]}>
+          <Text
            style={[
              styles.syncButtonText,
              { color: status === 'syncing' ? theme.accent : theme.accentText },
            ]}
          >
            {status === 'syncing' ? 'Syncing...' : 'Sync Now'}
          </Text>
        </TouchableOpacity>
@@ -56,7 +56,14 @@ export function TabBarIcon({ name, focused, color, size = 24 }: TabBarIconProps)
      )}
      {name === 'gear' && (
        <>
-          <Circle cx={12} cy={12} r={3.5} stroke={color} strokeWidth={focused ? 3.5 : 3} fill="none" />
+          <Circle
            cx={12}
            cy={12}
            r={3.5}
            stroke={color}
            strokeWidth={focused ? 3.5 : 3}
            fill="none"
          />
          <Path
            d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"
            stroke={color}
@@ -76,9 +83,7 @@ export function TabBarIcon({ name, focused, color, size = 24 }: TabBarIconProps)
            strokeLinecap="round"
            strokeLinejoin="round"
          />
-          {focused && (
+          {focused && <Circle cx={4} cy={10} r={2} fill={color} />}
            <Circle cx={4} cy={10} r={2} fill={color} />
          )}
        </>
      )}
    </Svg>
@@ -14,7 +14,15 @@ interface TaskDeleteModalProps {
  onDelete: (scope: TaskDeleteScope) => void;
 }
-export function TaskDeleteModal({ visible, taskId, taskTitle, isRepeating, subtask, onClose, onDelete }: TaskDeleteModalProps) {
+export function TaskDeleteModal({
  visible,
  taskId,
  taskTitle,
  isRepeating,
  subtask,
  onClose,
  onDelete,
 }: TaskDeleteModalProps) {
  const { theme } = useSettings();
  const [counts, setCounts] = useState({ future: 1, all: 1 });
@@ -22,11 +30,13 @@ export function TaskDeleteModal({ visible, taskId, taskTitle, isRepeating, subta
    if (!visible || !taskId || subtask) return;
    let mounted = true;
    getSeriesOccurrenceCounts(taskId)
-      .then((c) => {
+      .then(c => {
        if (mounted) setCounts(c);
      })
      .catch(() => {});
-    return () => { mounted = false; };
+    return () => {
      mounted = false;
    };
  }, [visible, taskId, subtask]);
  const options: { scope: TaskDeleteScope; label: string; hint?: string }[] = subtask
@@ -34,7 +44,11 @@ export function TaskDeleteModal({ visible, taskId, taskTitle, isRepeating, subta
    : [{ scope: 'this', label: 'This task only' }];
  if (isRepeating) {
-    options.push({ scope: 'future', label: 'This and future tasks', hint: counts.future > 1 ? `${counts.future} occurrences` : undefined });
+    options.push({
      scope: 'future',
      label: 'This and future tasks',
      hint: counts.future > 1 ? `${counts.future} occurrences` : undefined,
    });
    options.push({ scope: 'all', label: 'All tasks in series', hint: `${counts.all} occurrences` });
  }
@@ -43,10 +57,21 @@ export function TaskDeleteModal({ visible, taskId, taskTitle, isRepeating, subta
      <View style={styles.overlay}>
        <View style={[styles.sheet, { backgroundColor: theme.sheetBg }]}>
          <View style={styles.header}>
-            <Text style={[styles.title, { color: theme.text }]}>{subtask ? 'Delete Subtask' : 'Delete Task'}</Text>
+            <Text style={[styles.title, { color: theme.text }]}>
-            <TouchableOpacity onPress={onClose} style={styles.closeButton} hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}>
+              {subtask ? 'Delete Subtask' : 'Delete Task'}
            </Text>
            <TouchableOpacity
              onPress={onClose}
              style={styles.closeButton}
              hitSlop={{ top: 8, bottom: 8, left: 8, right: 8 }}
            >
              <Svg width={18} height={18} viewBox="0 0 24 24">
-                <Path d="M18 6L6 18M6 6l12 12" stroke={theme.textSecondary} strokeWidth={2.2} strokeLinecap="round" />
+                <Path
                  d="M18 6L6 18M6 6l12 12"
                  stroke={theme.textSecondary}
                  strokeWidth={2.2}
                  strokeLinecap="round"
                />
              </Svg>
            </TouchableOpacity>
          </View>
@@ -64,19 +89,26 @@ export function TaskDeleteModal({ visible, taskId, taskTitle, isRepeating, subta
          )}
          <View style={styles.actions}>
-            {options.map((option) => (
+            {options.map(option => (
              <TouchableOpacity
                key={option.scope}
                style={[styles.actionButton, { borderColor: theme.accentBorder }]}
                onPress={() => onDelete(option.scope)}
                activeOpacity={0.7}
              >
-                <Text style={[styles.actionLabel, { color: theme.accentStrong }]}>{option.label}</Text>
+                <Text style={[styles.actionLabel, { color: theme.accentStrong }]}>
-                {option.hint && <Text style={[styles.actionHint, { color: theme.textMuted }]}>{option.hint}</Text>}
+                  {option.label}
                </Text>
                {option.hint && (
                  <Text style={[styles.actionHint, { color: theme.textMuted }]}>{option.hint}</Text>
                )}
              </TouchableOpacity>
            ))}
            <TouchableOpacity
-              style={[styles.cancelButton, { borderColor: theme.borderStrong, backgroundColor: theme.card }]}
+              style={[
                styles.cancelButton,
                { borderColor: theme.borderStrong, backgroundColor: theme.card },
              ]}
              onPress={onClose}
              activeOpacity={0.7}
            >
@@ -1,6 +1,19 @@
 import React from 'react';
-import { View, Text, StyleSheet, TouchableOpacity, Animated, Platform, Dimensions } from 'react-native';
+import {
-import { Swipeable, Gesture, GestureDetector, PanGestureHandler } from 'react-native-gesture-handler';
+  View,
  Text,
  StyleSheet,
  TouchableOpacity,
  Animated,
  Platform,
  Dimensions,
 } from 'react-native';
 import {
  Swipeable,
  Gesture,
  GestureDetector,
  PanGestureHandler,
 } from 'react-native-gesture-handler';
 import { TaskData, SubtaskData, Priority, Repeat, Reminder } from '@/types';
 import { PRIORITY_COLORS } from '@/constants';
 import { useSettings, mixHex } from '@/theme';
@@ -46,7 +59,30 @@ interface TaskItemProps {
  categoryColors?: (string | undefined)[];
 }
-export const TaskItem = React.memo(function TaskItem({ task, onToggle, onDelete, onPress, onLongPress, onMenuOpen, selected, selectionMode, completedSection, draggable, hovered, onDragStart, onDragUpdate, onDragEnd, onReorderStart, onReorderUpdate, onReorderEnd, expanded, indented, depth = 0, categoryColor, categoryColors }: TaskItemProps) {
+export const TaskItem = React.memo(function TaskItem({
  task,
  onToggle,
  onDelete,
  onPress,
  onLongPress,
  onMenuOpen,
  selected,
  selectionMode,
  completedSection,
  draggable,
  hovered,
  onDragStart,
  onDragUpdate,
  onDragEnd,
  onReorderStart,
  onReorderUpdate,
  onReorderEnd,
  expanded,
  indented,
  depth = 0,
  categoryColor,
  categoryColors,
 }: TaskItemProps) {
  const { theme, deleteBySwipe } = useSettings();
  const styles = React.useMemo(() => createStyles(theme), [theme]);
  const [opacityAnim] = React.useState(new Animated.Value(task.completed ? 0.5 : 1));
@@ -73,17 +109,17 @@ export const TaskItem = React.memo(function TaskItem({ task, onToggle, onDelete,
        .activateAfterLongPress(400)
        .minDistance(5)
        .runOnJS(true)
-        .onStart((e) => {
+        .onStart(e => {
          setDragging(true);
          setDragStartY(e.absoluteY);
          onReorderStart?.();
        })
-        .onUpdate((e) => {
+        .onUpdate(e => {
          dragTranslateX.setValue(e.translationX);
          dragTranslateY.setValue(e.translationY);
          onReorderUpdate?.(e.absoluteY);
        })
-        .onEnd((e) => {
+        .onEnd(e => {
          onReorderEnd?.(e.absoluteY, e.translationY);
        })
        .onFinalize(() => {
@@ -104,12 +140,12 @@ export const TaskItem = React.memo(function TaskItem({ task, onToggle, onDelete,
          setDragging(true);
          onDragStart?.();
        })
-        .onUpdate((e) => {
+        .onUpdate(e => {
          dragTranslateX.setValue(e.translationX);
          dragTranslateY.setValue(e.translationY);
          onDragUpdate?.(e.absoluteY);
        })
-        .onEnd((e) => {
+        .onEnd(e => {
          onDragEnd?.(e.absoluteY);
        })
        .onFinalize(() => {
@@ -135,7 +171,11 @@ export const TaskItem = React.memo(function TaskItem({ task, onToggle, onDelete,
    endOfToday.setHours(23, 59, 59, 999);
    const hasDueDate = task.dueDate > 0;
    const isOverdue = hasDueDate && !task.completed && task.dueDate < startOfToday.getTime();
-    const isDueToday = hasDueDate && !task.completed && task.dueDate >= startOfToday.getTime() && task.dueDate <= endOfToday.getTime();
+    const isDueToday =
      hasDueDate &&
      !task.completed &&
      task.dueDate >= startOfToday.getTime() &&
      task.dueDate <= endOfToday.getTime();
    return { hasDueDate, isOverdue, isDueToday };
  }, [task.dueDate, task.completed]);
@@ -149,9 +189,18 @@ export const TaskItem = React.memo(function TaskItem({ task, onToggle, onDelete,
  const renderRightActions = (progress: Animated.AnimatedInterpolation<number>) => {
    const translateX = progress.interpolate({ inputRange: [0, 1], outputRange: [80, 0] });
    return (
-      <Animated.View style={[styles.swipeAction, styles.swipeDelete, { transform: [{ translateX }] }]}>
+      <Animated.View
        style={[styles.swipeAction, styles.swipeDelete, { transform: [{ translateX }] }]}
      >
        <Svg width={24} height={24} viewBox="0 0 24 24">
-          <Path d="M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13" stroke="#FFFFFF" strokeWidth={2} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+          <Path
            d="M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13"
            stroke="#FFFFFF"
            strokeWidth={2}
            strokeLinecap="round"
            strokeLinejoin="round"
            fill="none"
          />
        </Svg>
        <Text style={styles.swipeActionText}>Delete</Text>
      </Animated.View>
@@ -161,9 +210,18 @@ export const TaskItem = React.memo(function TaskItem({ task, onToggle, onDelete,
  const renderLeftActions = (progress: Animated.AnimatedInterpolation<number>) => {
    const translateX = progress.interpolate({ inputRange: [0, 1], outputRange: [-80, 0] });
    return (
-      <Animated.View style={[styles.swipeAction, styles.swipeComplete, { transform: [{ translateX }] }]}>
+      <Animated.View
        style={[styles.swipeAction, styles.swipeComplete, { transform: [{ translateX }] }]}
      >
        <Svg width={24} height={24} viewBox="0 0 24 24">
-          <Path d="M5 12l5 5 9-10" stroke="#FFFFFF" strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+          <Path
            d="M5 12l5 5 9-10"
            stroke="#FFFFFF"
            strokeWidth={2.5}
            strokeLinecap="round"
            strokeLinejoin="round"
            fill="none"
          />
        </Svg>
        <Text style={styles.swipeActionText}>{task.completed ? 'Undo' : 'Done'}</Text>
      </Animated.View>
@@ -188,7 +246,9 @@ const renderLeftActions = (progress: Animated.AnimatedInterpolation<number>) =>
      overshootRight={false}
      overshootLeft={false}
    >
-      <GestureDetector gesture={draggable ? (onReorderStart ? reorderGesture : dragGesture) : Gesture.Native()}>
+      <GestureDetector
        gesture={draggable ? (onReorderStart ? reorderGesture : dragGesture) : Gesture.Native()}
      >
        <Animated.View
          style={[
            styles.container,
@@ -236,10 +296,24 @@ const renderLeftActions = (progress: Animated.AnimatedInterpolation<number>) =>
                    {task.completed ? (
                      <>
                        <Circle cx={12} cy={12} r={10} fill={theme.accent} />
-                        <Path d="M7 12l3 3 7-7" stroke="#FFFFFF" strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" />
+                        <Path
                          d="M7 12l3 3 7-7"
                          stroke="#FFFFFF"
                          strokeWidth={2.5}
                          strokeLinecap="round"
                          strokeLinejoin="round"
                          fill="none"
                        />
                      </>
                    ) : (
-                      <Circle cx={12} cy={12} r={10} stroke={isOverdue ? theme.danger : theme.textSecondary} strokeWidth={2.5} fill="none" />
+                      <Circle
                        cx={12}
                        cy={12}
                        r={10}
                        stroke={isOverdue ? theme.danger : theme.textSecondary}
                        strokeWidth={2.5}
                        fill="none"
                      />
                    )}
                  </Svg>
                </TouchableOpacity>
@@ -260,9 +334,7 @@ const renderLeftActions = (progress: Animated.AnimatedInterpolation<number>) =>
                      { backgroundColor: PRIORITY_COLORS[task.priority] },
                    ]}
                  >
-                  <Text style={styles.priorityText}>
+                    <Text style={styles.priorityText}>{task.priority.charAt(0).toUpperCase()}</Text>
                    {task.priority.charAt(0).toUpperCase()}
                  </Text>
                  </View>
                )}
                {task.assigneeId && (
@@ -296,7 +368,14 @@ const renderLeftActions = (progress: Animated.AnimatedInterpolation<number>) =>
                        strokeLinecap="round"
                        fill="none"
                      />
-                    <Circle cx={12} cy={12} r={4} stroke={theme.accent} strokeWidth={1.5} fill="none" />
+                      <Circle
                        cx={12}
                        cy={12}
                        r={4}
                        stroke={theme.accent}
                        strokeWidth={1.5}
                        fill="none"
                      />
                    </Svg>
                    <Text style={styles.allDayText}>All Day</Text>
                  </View>
@@ -317,8 +396,20 @@ const renderLeftActions = (progress: Animated.AnimatedInterpolation<number>) =>
              {hasDueDate && (
                <View style={styles.dueRow}>
                  <Svg width={14} height={14} viewBox="0 0 24 24">
-                  <Circle cx={12} cy={12} r={10} stroke={theme.textSecondary} strokeWidth={2} fill="none" />
+                    <Circle
-                  <Path d="M12 6v6l4 2" stroke={theme.textSecondary} strokeWidth={2} strokeLinecap="round" />
+                      cx={12}
                      cy={12}
                      r={10}
                      stroke={theme.textSecondary}
                      strokeWidth={2}
                      fill="none"
                    />
                    <Path
                      d="M12 6v6l4 2"
                      stroke={theme.textSecondary}
                      strokeWidth={2}
                      strokeLinecap="round"
                    />
                  </Svg>
                  <Animated.Text
                    style={[
@@ -400,7 +491,8 @@ function formatTime12(time: string): string {
  return `${h}:${String(minutes).padStart(2, '0')} ${period}`;
 }
-const createStyles = (theme: ThemeColors) => StyleSheet.create({
+const createStyles = (theme: ThemeColors) =>
  StyleSheet.create({
    container: {
      flexDirection: 'row',
      alignItems: 'center',
@@ -1,5 +1,13 @@
 import React, { useState, useCallback, useMemo, useRef } from 'react';
-import { View, Text, StyleSheet, Animated, RefreshControl, Alert, TouchableOpacity } from 'react-native';
+import {
  View,
  Text,
  StyleSheet,
  Animated,
  RefreshControl,
  Alert,
  TouchableOpacity,
 } from 'react-native';
 import { useTasks } from '@/hooks/useTasks';
 import { useSubtasks } from '@/hooks/useSubtasks';
 import { useCategories } from '@/hooks/useDatabase';
@@ -42,10 +50,18 @@ const DropIndicator = ({ theme }: { theme: any }) => (
  </View>
 );
-export function TaskList({ categoryIds = [], showCompleted = false, onSelectionChange }: TaskListProps) {
+export function TaskList({
  categoryIds = [],
  showCompleted = false,
  onSelectionChange,
 }: TaskListProps) {
  const { theme, sortBy, todoAheadDays } = useSettings();
-  const { tasks, loading, refresh: refreshTasks } = useTasks(categoryIds, showCompleted ? 'all' : false, todoAheadDays);
+  const {
    tasks,
    loading,
    refresh: refreshTasks,
  } = useTasks(categoryIds, showCompleted ? 'all' : false, todoAheadDays);
  const categories = useCategories();
  const categoryColors = useMemo(() => {
@@ -62,18 +78,30 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
  const [hoverTaskId, setHoverTaskId] = useState<string | null>(null);
  const [expandedTasks, setExpandedTasks] = useState<Set<string>>(new Set());
  const { map: subtasksMap, refresh: refreshSubtasks } = useSubtasks();
-  const [dropIndicator, setDropIndicator] = useState<{ targetId: string | null; position: 'above' | 'below' } | null>(null);
+  const [dropIndicator, setDropIndicator] = useState<{
    targetId: string | null;
    position: 'above' | 'below';
  } | null>(null);
  const itemRefs = useRef<Map<string, View>>(new Map());
  const subtaskRefs = useRef<Map<string, { ref: View; parentTaskId: string }>>(new Map());
-  const dragStateRef = useRef<{ taskId: string; positions: Record<string, { top: number; bottom: number }>; subPositions: Record<string, { top: number; bottom: number }> } | null>(null);
+  const dragStateRef = useRef<{
-  const subtaskDragRef = useRef<{ subtaskId: string; parentTaskId: string; parentSubtaskId: string | null; positions: Record<string, { top: number; bottom: number }>; subPositions: Record<string, { top: number; bottom: number }> } | null>(null);
+    taskId: string;
-   const {
+    positions: Record<string, { top: number; bottom: number }>;
-      modals,
+    subPositions: Record<string, { top: number; bottom: number }>;
-      openTaskDelete,
+  } | null>(null);
-      openSubtaskDelete,
+  const subtaskDragRef = useRef<{
-      openSubtaskEdit,
+    subtaskId: string;
-      openTaskEdit,
+    parentTaskId: string;
-    } = useTaskModals();
+    parentSubtaskId: string | null;
    positions: Record<string, { top: number; bottom: number }>;
    subPositions: Record<string, { top: number; bottom: number }>;
  } | null>(null);
  const taskDragRef = useRef<{
    taskId: string;
    positions: Record<string, { top: number; bottom: number }>;
  } | null>(null);
  const { modals, openTaskDelete, openSubtaskDelete, openSubtaskEdit, openTaskEdit } =
    useTaskModals();
  const registerRef = useCallback((taskId: string, ref: View | null) => {
    if (ref) {
@@ -83,13 +111,16 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
    }
  }, []);
-  const registerSubtaskRef = useCallback((subtaskId: string, parentTaskId: string, ref: View | null) => {
+  const registerSubtaskRef = useCallback(
    (subtaskId: string, parentTaskId: string, ref: View | null) => {
      if (ref) {
        subtaskRefs.current.set(subtaskId, { ref, parentTaskId });
      } else {
        subtaskRefs.current.delete(subtaskId);
      }
-  }, []);
+    },
    []
  );
  const categoryColorResolver = useCallback(
    (categoryId: string | undefined) => (categoryId ? categoryColors.get(categoryId) : undefined),
@@ -100,7 +131,9 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
    const sorted = [...tasks];
    switch (sortBy) {
      case 'date':
-        sorted.sort((a, b) => (a.dueDate || Number.MAX_SAFE_INTEGER) - (b.dueDate || Number.MAX_SAFE_INTEGER));
+        sorted.sort(
          (a, b) => (a.dueDate || Number.MAX_SAFE_INTEGER) - (b.dueDate || Number.MAX_SAFE_INTEGER)
        );
        break;
      case 'priority':
        sorted.sort((a, b) => PRIORITY_RANK[b.priority] - PRIORITY_RANK[a.priority]);
@@ -145,14 +178,18 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
    onSelectionChange?.(false);
  }, [onSelectionChange]);
-  const enterSelection = useCallback((taskId: string) => {
+  const enterSelection = useCallback(
    (taskId: string) => {
      setSelectionMode(true);
      setSelectedIds(new Set([taskId]));
      onSelectionChange?.(true);
-  }, [onSelectionChange]);
+    },
    [onSelectionChange]
  );
-  const toggleSelect = useCallback((taskId: string) => {
+  const toggleSelect = useCallback(
-    setSelectedIds((prev) => {
+    (taskId: string) => {
      setSelectedIds(prev => {
        const next = new Set(prev);
        if (next.has(taskId)) {
          next.delete(taskId);
@@ -165,14 +202,19 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
        }
        return next;
      });
-  }, [onSelectionChange]);
+    },
    [onSelectionChange]
  );
-  const handleToggle = useCallback(async (taskId: string) => {
+  const handleToggle = useCallback(
    async (taskId: string) => {
      await confirmAndToggleTaskComplete(taskId, () => refreshTasks());
-  }, [refreshTasks]);
+    },
    [refreshTasks]
  );
  const toggleExpand = useCallback(async (taskId: string) => {
-    setExpandedTasks((prev) => {
+    setExpandedTasks(prev => {
      const next = new Set(prev);
      if (next.has(taskId)) {
        next.delete(taskId);
@@ -183,14 +225,20 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
    });
  }, []);
-  const handleSubtaskToggle = useCallback(async (subtaskId: string) => {
+  const handleSubtaskToggle = useCallback(
    async (subtaskId: string) => {
      await toggleSubtaskComplete(subtaskId);
      refreshTasks();
      refreshSubtasks();
-  }, [refreshTasks, refreshSubtasks]);
+    },
    [refreshTasks, refreshSubtasks]
  );
  const handleBulkDelete = useCallback(() => {
-    Alert.alert(`Delete ${selectedIds.size} task${selectedIds.size > 1 ? 's' : ''}?`, 'This cannot be undone.', [
+    Alert.alert(
      `Delete ${selectedIds.size} task${selectedIds.size > 1 ? 's' : ''}?`,
      'This cannot be undone.',
      [
        { text: 'Cancel', style: 'cancel' },
        {
          text: 'Delete',
@@ -200,7 +248,8 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
            exitSelection();
          },
        },
-    ]);
+      ]
    );
  }, [selectedIds, exitSelection]);
  const handleBulkComplete = useCallback(async () => {
@@ -211,14 +260,16 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
  const measureItems = useCallback(async () => {
    const positions: Record<string, { top: number; bottom: number }> = {};
    const entries = Array.from(itemRefs.current.entries());
-    await Promise.all(entries.map(([id, ref]) => {
+    await Promise.all(
-      return new Promise<void>((resolve) => {
+      entries.map(([id, ref]) => {
        return new Promise<void>(resolve => {
          ref?.measureInWindow((_x, y, _w, h) => {
            positions[id] = { top: y, bottom: y + h };
            resolve();
          });
        });
-    }));
+      })
    );
    return positions;
  }, []);
@@ -226,18 +277,49 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
    const positions = await measureItems();
    const subPositions: Record<string, { top: number; bottom: number }> = {};
    const entries = Array.from(subtaskRefs.current.entries());
-    await Promise.all(entries.map(([id, entry]) => {
+    await Promise.all(
-      return new Promise<void>((resolve) => {
+      entries.map(([id, entry]) => {
        return new Promise<void>(resolve => {
          entry.ref?.measureInWindow((_x, y, _w, h) => {
            subPositions[id] = { top: y, bottom: y + h };
            resolve();
          });
        });
-    }));
+      })
    );
    return { positions, subPositions };
  }, [measureItems]);
-  const findHoverTarget = useCallback((absoluteY: number, draggedId: string, positions: Record<string, { top: number; bottom: number }>, subPositions: Record<string, { top: number; bottom: number }>) => {
+  const findHoverTask = useCallback(
    (
      absoluteY: number,
      draggedId: string,
      positions: Record<string, { top: number; bottom: number }>
    ) => {
      const entries = Object.entries(positions);
      for (let i = entries.length - 1; i >= 0; i--) {
        const [id, p] = entries[i];
        if (id === draggedId) continue;
        if (absoluteY >= p.top && absoluteY <= p.bottom) {
          return id;
        }
      }
      return null;
    },
    []
  );
  const updateHoverTaskTarget = useCallback((target: string | null) => {
    setHoverTaskId(target ?? null);
  }, []);
  const findHoverTarget = useCallback(
    (
      absoluteY: number,
      draggedId: string,
      positions: Record<string, { top: number; bottom: number }>,
      subPositions: Record<string, { top: number; bottom: number }>
    ) => {
      const subEntries = Object.entries(subPositions);
      for (let i = subEntries.length - 1; i >= 0; i--) {
        const [id, p] = subEntries[i];
@@ -253,21 +335,33 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
        }
      }
      return null;
-  }, []);
+    },
    []
  );
-  const calculateDropPosition = useCallback((absoluteY: number, targetId: string, positions: Record<string, { top: number; bottom: number }>) => {
+  const calculateDropPosition = useCallback(
    (
      absoluteY: number,
      targetId: string,
      positions: Record<string, { top: number; bottom: number }>
    ) => {
      const target = positions[targetId];
      if (!target) return 'below' as const;
      const middle = (target.top + target.bottom) / 2;
      return absoluteY < middle ? 'above' : 'below';
-  }, []);
+    },
    []
  );
-  const handleDragStart = useCallback(async (taskId: string) => {
+  const handleDragStart = useCallback(
    async (taskId: string) => {
      dragStateRef.current = { taskId, ...(await measureAll()) };
-  }, [measureAll]);
+    },
    [measureAll]
  );
  const refreshDragPositions = useCallback(() => {
-    measureAll().then((m) => {
+    measureAll().then(m => {
      if (subtaskDragRef.current) {
        subtaskDragRef.current = { ...subtaskDragRef.current, ...m };
      } else if (dragStateRef.current) {
@@ -276,9 +370,10 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
    });
  }, [measureAll]);
-  const updateHoverTarget = useCallback((target: string | null) => {
+  const updateHoverTarget = useCallback(
    (target: string | null) => {
      let changed = false;
-    setHoverTaskId((prev) => {
+      setHoverTaskId(prev => {
        if (prev === target) return prev;
        changed = true;
        return target;
@@ -286,9 +381,12 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
      if (changed && target) {
        setTimeout(refreshDragPositions, 80);
      }
-  }, [refreshDragPositions]);
+    },
    [refreshDragPositions]
  );
-  const handleDragUpdate = useCallback((absoluteY: number) => {
+  const handleDragUpdate = useCallback(
    (absoluteY: number) => {
      const state = dragStateRef.current;
      if (!state) return;
      const target = findHoverTarget(absoluteY, state.taskId, state.positions, state.subPositions);
@@ -303,16 +401,22 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
      } else {
        // Check if below last item
        const positions = state.positions;
-      const lastItem = Object.values(positions).reduce((max, p) => p.bottom > max.bottom ? p : max, { bottom: 0 });
+        const lastItem = Object.values(positions).reduce(
          (max, p) => (p.bottom > max.bottom ? p : max),
          { bottom: 0 }
        );
        if (absoluteY > lastItem.bottom) {
          setDropIndicator({ targetId: null, position: 'below' });
        } else {
          setDropIndicator(null);
        }
      }
-  }, [findHoverTarget, calculateDropPosition, updateHoverTarget]);
+    },
    [findHoverTarget, calculateDropPosition, updateHoverTarget]
  );
-  const handleDragEnd = useCallback((absoluteY: number) => {
+  const handleDragEnd = useCallback(
    (absoluteY: number) => {
      const state = dragStateRef.current;
      dragStateRef.current = null;
      setHoverTaskId(null);
@@ -332,16 +436,32 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
          })();
        }
      }
-  }, [findHoverTarget]);
+    },
    [findHoverTarget]
  );
-  const handleSubtaskDragStart = useCallback(async (subtaskId: string, parentTaskId: string, parentSubtaskId: string | null = null) => {
+  const handleSubtaskDragStart = useCallback(
-    subtaskDragRef.current = { subtaskId, parentTaskId, parentSubtaskId, ...(await measureAll()) };
+    async (subtaskId: string, parentTaskId: string, parentSubtaskId: string | null = null) => {
-  }, [measureAll]);
+      subtaskDragRef.current = {
        subtaskId,
        parentTaskId,
        parentSubtaskId,
        ...(await measureAll()),
      };
    },
    [measureAll]
  );
-  const handleSubtaskDragUpdate = useCallback((absoluteY: number) => {
+  const handleSubtaskDragUpdate = useCallback(
    (absoluteY: number) => {
      const state = subtaskDragRef.current;
      if (!state) return;
-    const target = findHoverTarget(absoluteY, state.subtaskId, state.positions, state.subPositions);
+      const target = findHoverTarget(
        absoluteY,
        state.subtaskId,
        state.positions,
        state.subPositions
      );
      updateHoverTarget(target);
      if (target) {
        if (state.subPositions[target]) {
@@ -352,23 +472,34 @@ export function TaskList({ categoryIds = [], showCompleted = false, onSelectionC
        }
      } else {
        const positions = state.positions;
-      const lastItem = Object.values(positions).reduce((max, p) => p.bottom > max.bottom ? p : max, { bottom: 0 });
+        const lastItem = Object.values(positions).reduce(
          (max, p) => (p.bottom > max.bottom ? p : max),
          { bottom: 0 }
        );
        if (absoluteY > lastItem.bottom) {
          setDropIndicator({ targetId: null, position: 'below' });
        } else {
          setDropIndicator(null);
        }
      }
-  }, [findHoverTarget, calculateDropPosition, updateHoverTarget]);
+    },
    [findHoverTarget, calculateDropPosition, updateHoverTarget]
  );
-const handleSubtaskDragEnd = useCallback(async (absoluteY: number) => {
+  const handleSubtaskDragEnd = useCallback(
    async (absoluteY: number) => {
      const state = subtaskDragRef.current;
      subtaskDragRef.current = null;
      setHoverTaskId(null);
      setDropIndicator(null);
      if (!state) return;
-    const target = findHoverTarget(absoluteY, state.subtaskId, state.positions, state.subPositions);
+      const target = findHoverTarget(
        absoluteY,
        state.subtaskId,
        state.positions,
        state.subPositions
      );
      if (target === state.subtaskId) return;
      // Only allow dropping on tasks (not subtasks) to match task behavior
@@ -379,15 +510,77 @@ const handleSubtaskDragEnd = useCallback(async (absoluteY: number) => {
        // If no target or target is a subtask: do nothing (matches task behavior)
        await moveSubtaskToTask(state.subtaskId, target);
      }
-  }, [findHoverTarget, moveSubtaskToTask]);
+    },
    [findHoverTarget, moveSubtaskToTask]
  );
  const handleTaskDragStart = useCallback(
    async (taskId: string) => {
      const positions = (await measureItems()) as Record<string, { top: number; bottom: number }>;
      taskDragRef.current = { taskId, positions };
    },
    [measureItems]
  );
  const handleTaskDragUpdate = useCallback(
    (absoluteY: number) => {
      const state = taskDragRef.current;
      if (!state) return;
      const target = findHoverTask(absoluteY, state.taskId, state.positions);
      updateHoverTaskTarget(target);
      if (target) {
        setDropIndicator({ targetId: target, position: 'below' });
      } else {
        const lastItem = Object.values(state.positions).reduce(
          (max, p) => (p.bottom > max.bottom ? p : max),
          { bottom: 0 }
        );
        if (absoluteY > lastItem.bottom) {
          setDropIndicator({ targetId: null, position: 'below' });
        } else {
          setDropIndicator(null);
        }
      }
    },
    [findHoverTask, updateHoverTaskTarget]
  );
  const handleTaskDragEnd = useCallback(
    async (absoluteY: number) => {
      const state = taskDragRef.current;
      taskDragRef.current = null;
      setHoverTaskId(null);
      setDropIndicator(null);
      if (!state) return;
      const target = findHoverTask(absoluteY, state.taskId, state.positions);
      if (target === state.taskId) return;
      // Set drop indicator based on target position
      if (target) {
        setDropIndicator({ targetId: target, position: 'below' });
      } else {
        const lastItem = Object.values(state.positions).reduce(
          (max, p) => (p.bottom > max.bottom ? p : max),
          { bottom: 0 }
        );
        if (absoluteY > lastItem.bottom) {
          setDropIndicator({ targetId: null, position: 'below' });
        }
      }
    },
    [findHoverTask]
  );
  const renderItem = useCallback(
    ({ item, index }: { item: Task; index: number }) => {
      const isExpanded = expandedTasks.has(item.id);
      const itemSubtasks = subtasksMap.get(item.id) ?? [];
-      const showDropAbove = dropIndicator?.targetId === item.id && dropIndicator?.position === 'above';
+      const showDropAbove =
-      const showDropBelow = dropIndicator?.targetId === item.id && dropIndicator?.position === 'below';
+        dropIndicator?.targetId === item.id && dropIndicator?.position === 'above';
-      const tagColors = parseTaskTags(item.tags, item.categoryId).map((id) => categoryColors.get(id));
+      const showDropBelow =
        dropIndicator?.targetId === item.id && dropIndicator?.position === 'below';
      const tagColors = parseTaskTags(item.tags, item.categoryId).map(id => categoryColors.get(id));
      return (
        <View>
          {showDropAbove && <DropIndicator theme={theme} />}
@@ -406,10 +599,10 @@ const handleSubtaskDragEnd = useCallback(async (absoluteY: number) => {
            onExpand={toggleExpand}
            onSelect={toggleSelect}
            onEnterSelection={enterSelection}
-            onMenuOpen={(task) => openTaskEdit(task.id)}
+            onMenuOpen={task => openTaskEdit(task.id)}
            onSubtaskToggle={handleSubtaskToggle}
            onSubtaskDelete={openSubtaskDelete}
-            onSubtaskMenuOpen={(subtask) => openSubtaskEdit(subtask.id)}
+            onSubtaskMenuOpen={subtask => openSubtaskEdit(subtask.id)}
            onDragStart={handleDragStart}
            onDragUpdate={handleDragUpdate}
            onDragEnd={handleDragEnd}
@@ -463,7 +656,9 @@ const handleSubtaskDragEnd = useCallback(async (absoluteY: number) => {
    return (
      <View style={styles.emptyState}>
        <Text style={[styles.emptyText, { color: theme.textSecondary }]}>No tasks yet</Text>
-        <Text style={[styles.emptySubtext, { color: theme.textMuted }]}>Tap + to add your first task</Text>
+        <Text style={[styles.emptySubtext, { color: theme.textMuted }]}>
          Tap + to add your first task
        </Text>
      </View>
    );
  }, [sortedTasks.length, theme.textSecondary, theme.textMuted]);
@@ -485,9 +680,16 @@ const handleSubtaskDragEnd = useCallback(async (absoluteY: number) => {
    <View style={styles.container}>
      <Animated.FlatList
        data={sortedTasks}
-        keyExtractor={(item) => item.id}
+        keyExtractor={item => item.id}
        renderItem={renderItem}
-        extraData={{ expandedTasks, subtasksMap, selectedIds, selectionMode, hoverTaskId, dropIndicator }}
+        extraData={{
          expandedTasks,
          subtasksMap,
          selectedIds,
          selectionMode,
          hoverTaskId,
          dropIndicator,
        }}
        ItemSeparatorComponent={MemoSeparator}
        ListHeaderComponent={listHeader}
        ListFooterComponent={listFooter}
@@ -506,16 +708,36 @@ const handleSubtaskDragEnd = useCallback(async (absoluteY: number) => {
      {modals(() => {})}
      {selectionMode && (
-        <View style={[styles.selectionBar, { backgroundColor: theme.sheetBg, borderTopColor: theme.border }]}>
+        <View
-          <TouchableOpacity onPress={exitSelection} style={styles.selectionCancel} activeOpacity={0.7}>
+          style={[
            styles.selectionBar,
            { backgroundColor: theme.sheetBg, borderTopColor: theme.border },
          ]}
        >
          <TouchableOpacity
            onPress={exitSelection}
            style={styles.selectionCancel}
            activeOpacity={0.7}
          >
            <Svg width={20} height={20} viewBox="0 0 24 24">
-              <Path d="M18 6L6 18M6 6l12 12" stroke={theme.textSecondary} strokeWidth={2.2} strokeLinecap="round" />
+              <Path
                d="M18 6L6 18M6 6l12 12"
                stroke={theme.textSecondary}
                strokeWidth={2.2}
                strokeLinecap="round"
              />
            </Svg>
            <Text style={[styles.selectionCancelText, { color: theme.textFaint }]}>Cancel</Text>
          </TouchableOpacity>
-          <Text style={[styles.selectionCount, { color: theme.text }]}>{selectedIds.size} selected</Text>
+          <Text style={[styles.selectionCount, { color: theme.text }]}>
            {selectedIds.size} selected
          </Text>
          <View style={styles.selectionActions}>
-            <SelectionButton label="Complete" color={theme.successStrong} onPress={handleBulkComplete} />
+            <SelectionButton
              label="Complete"
              color={theme.successStrong}
              onPress={handleBulkComplete}
            />
            <SelectionButton label="Delete" color={theme.dangerStrong} onPress={handleBulkDelete} />
          </View>
        </View>
@@ -524,7 +746,15 @@ const handleSubtaskDragEnd = useCallback(async (absoluteY: number) => {
  );
 }
-const SelectionButton = React.memo(function SelectionButton({ label, color, onPress }: { label: string; color: string; onPress: () => void }) {
+const SelectionButton = React.memo(function SelectionButton({
  label,
  color,
  onPress,
 }: {
  label: string;
  color: string;
  onPress: () => void;
 }) {
  return (
    <TouchableOpacity
      style={[styles.selectionButton, { backgroundColor: color }]}
@@ -608,10 +838,7 @@ const TaskRow = React.memo(function TaskRow({
    [subtasks]
  );
  return (
-    <View
+    <View ref={ref => registerRef(task.id, ref)} style={styles.dragContainer}>
      ref={(ref) => registerRef(task.id, ref)}
      style={styles.dragContainer}
    >
      <TaskItem
        task={task as unknown as TaskData}
        onToggle={() => onToggle(task.id)}
@@ -635,19 +862,19 @@ const TaskRow = React.memo(function TaskRow({
      />
      {expanded && subtasks.length > 0 && (
        <View style={styles.subtaskList}>
-          {sortedSubtasks.map((sub) => (
+          {sortedSubtasks.map(sub => (
            <SubtaskItem
              key={sub.id}
              subtask={sub}
              hoveredId={hoverTaskId}
              registerRef={registerSubtaskRef}
-                onToggle={(sub) => onSubtaskToggle(sub.id, task.id)}
+              onToggle={sub => onSubtaskToggle(sub.id, task.id)}
              onDelete={() => onSubtaskDelete(sub)}
              onMenuOpen={() => onSubtaskMenuOpen(sub)}
              selected={selectedIds.has(sub.id)}
              selectionMode={selectionMode}
              draggable
-              onDragStart={(sub) => onSubtaskDragStart(sub.id, task.id)}
+              onDragStart={sub => onSubtaskDragStart(sub.id, task.id)}
              onDragUpdate={onSubtaskDragUpdate}
              onDragEnd={onSubtaskDragEnd}
              categoryColor={categoryColor}
@@ -691,8 +918,7 @@ const styles = StyleSheet.create({
    paddingTop: 4,
    marginBottom: 4,
  },
-  dragContainer: {
+  dragContainer: {},
  },
  dropIndicatorContainer: {
    height: 8,
    justifyContent: 'center',
@@ -35,7 +35,8 @@ export function TaskNameInput({ error, ...props }: TaskNameInputProps) {
  );
 }
-const createStyles = (theme: ThemeColors) => StyleSheet.create({
+const createStyles = (theme: ThemeColors) =>
  StyleSheet.create({
    container: {
      gap: 5,
    },
@@ -49,19 +49,45 @@ export function TaskOverflowMenu({
    {
      key: 'edit',
      label: 'Edit',
-      icon: <Svg width={20} height={20} viewBox="0 0 24 24"><Path d="M4 20h4L19.5 8.5a2.1 2.1 0 0 0-3-3L5 17v3z" stroke={theme.text} strokeWidth={2.2} strokeLinecap="round" strokeLinejoin="round" fill="none" /></Svg>,
+      icon: (
        <Svg width={20} height={20} viewBox="0 0 24 24">
          <Path
            d="M4 20h4L19.5 8.5a2.1 2.1 0 0 0-3-3L5 17v3z"
            stroke={theme.text}
            strokeWidth={2.2}
            strokeLinecap="round"
            strokeLinejoin="round"
            fill="none"
          />
        </Svg>
      ),
      onPress: onEdit,
    },
    {
      key: 'complete',
      label: task.completed ? 'Mark Incomplete' : 'Mark Complete',
-      icon: <Svg width={20} height={20} viewBox="0 0 24 24"><Path d="M5 12l5 5 9-10" stroke={theme.text} strokeWidth={2.5} strokeLinecap="round" strokeLinejoin="round" fill="none" /></Svg>,
+      icon: (
        <Svg width={20} height={20} viewBox="0 0 24 24">
          <Path
            d="M5 12l5 5 9-10"
            stroke={theme.text}
            strokeWidth={2.5}
            strokeLinecap="round"
            strokeLinejoin="round"
            fill="none"
          />
        </Svg>
      ),
      onPress: onToggleComplete,
    },
    {
      key: 'duplicate',
      label: 'Duplicate',
-      icon: <Svg width={20} height={20} viewBox="0 0 24 24"><Path d="M8 8h12v12H8zM4 16V4h12" stroke={theme.text} strokeWidth={2.2} fill="none" /></Svg>,
+      icon: (
        <Svg width={20} height={20} viewBox="0 0 24 24">
          <Path d="M8 8h12v12H8zM4 16V4h12" stroke={theme.text} strokeWidth={2.2} fill="none" />
        </Svg>
      ),
      onPress: onDuplicate,
    },
  ];
@@ -70,7 +96,11 @@ export function TaskOverflowMenu({
    actions.push({
      key: 'category',
      label: 'Change Tags',
-      icon: <Svg width={20} height={20} viewBox="0 0 24 24"><Circle2 /></Svg>,
+      icon: (
        <Svg width={20} height={20} viewBox="0 0 24 24">
          <Circle2 />
        </Svg>
      ),
      onPress: onChangeCategory ?? (() => {}),
    });
  }
@@ -79,23 +109,49 @@ export function TaskOverflowMenu({
    {
      key: 'priority',
      label: 'Change Priority',
-      icon: <Svg width={20} height={20} viewBox="0 0 24 24"><Path d="M5 3v18M5 5h14l-3 4 3 4H5" stroke={theme.text} strokeWidth={2.2} strokeLinecap="round" strokeLinejoin="round" fill="none" /></Svg>,
+      icon: (
        <Svg width={20} height={20} viewBox="0 0 24 24">
          <Path
            d="M5 3v18M5 5h14l-3 4 3 4H5"
            stroke={theme.text}
            strokeWidth={2.2}
            strokeLinecap="round"
            strokeLinejoin="round"
            fill="none"
          />
        </Svg>
      ),
      onPress: onChangePriority,
    },
    {
      key: 'delete',
      label: 'Delete',
      destructive: true,
-      icon: <Svg width={20} height={20} viewBox="0 0 24 24"><Path d="M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13" stroke={theme.danger} strokeWidth={2.2} strokeLinecap="round" strokeLinejoin="round" fill="none" /></Svg>,
+      icon: (
        <Svg width={20} height={20} viewBox="0 0 24 24">
          <Path
            d="M4 7h16M9 7V4h6v3M6 7l1 13h10l1-13"
            stroke={theme.danger}
            strokeWidth={2.2}
            strokeLinecap="round"
            strokeLinejoin="round"
            fill="none"
          />
        </Svg>
      ),
      onPress: onDelete,
-    },
+    }
  );
  if (subtask && onAddSubtask) {
    actions.push({
      key: 'addSubtask',
      label: 'Add Subtask',
-      icon: <Svg width={20} height={20} viewBox="0 0 24 24"><Path d="M12 5v14M5 12h14" stroke={theme.text} strokeWidth={2.5} strokeLinecap="round" /></Svg>,
+      icon: (
        <Svg width={20} height={20} viewBox="0 0 24 24">
          <Path d="M12 5v14M5 12h14" stroke={theme.text} strokeWidth={2.5} strokeLinecap="round" />
        </Svg>
      ),
      onPress: onAddSubtask,
    });
  }
@@ -112,7 +168,7 @@ export function TaskOverflowMenu({
          <Text style={[styles.title, { color: theme.text }]} numberOfLines={1}>
            {task.title}
          </Text>
-          {actions.map((action) => (
+          {actions.map(action => (
            <TouchableOpacity
              key={action.key}
              style={[styles.action, { borderColor: theme.border }]}
@@ -125,7 +181,12 @@ export function TaskOverflowMenu({
              accessibilityLabel={`${action.label}${action.destructive ? ' (dangerous)' : ''}`}
            >
              {action.icon}
-              <Text style={[styles.actionText, action.destructive ? styles.destructiveText : { color: theme.textSecondary }]}>
+              <Text
                style={[
                  styles.actionText,
                  action.destructive ? styles.destructiveText : { color: theme.textSecondary },
                ]}
              >
                {action.label}
              </Text>
            </TouchableOpacity>
@@ -140,13 +201,19 @@ function Circle2() {
  const { theme } = useSettings();
  return (
    <Svg width={20} height={20} viewBox="0 0 24 24">
-      <Path d="M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20z" stroke={theme.text} strokeWidth={2.2} fill="none" />
+      <Path
        d="M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20z"
        stroke={theme.text}
        strokeWidth={2.2}
        fill="none"
      />
      <Path d="M12 2a10 10 0 0 1 0 20z" fill={theme.text} opacity={0.35} />
    </Svg>
  );
 }
-const createStyles = (theme: ThemeColors) => StyleSheet.create({
+const createStyles = (theme: ThemeColors) =>
  StyleSheet.create({
    overlay: {
      flex: 1,
      justifyContent: 'flex-end',
@@ -1,30 +1,295 @@
-import { useEffect } from 'react';
+import { useEffect, useState, useCallback } from 'react';
-import { Alert, Linking } from 'react-native';
+import { Modal, View, Text, StyleSheet, Pressable, ScrollView, Platform } from 'react-native';
-import { checkForUpdates, wasPromptedFor, markPrompted } from '@/services/updates';
+import {
  checkForUpdates,
  wasPromptedFor,
  markPrompted,
  downloadAPK,
  installAPK,
  openReleaseUrl,
  AppUpdate,
 } from '@/services/updates';
 import { useSettings } from '@/theme';
 export function UpdateNotifier() {
-  useEffect(() => {
+  const { theme } = useSettings();
-    const run = async () => {
+  const [update, setUpdate] = useState<AppUpdate | null>(null);
-      const update = await checkForUpdates();
+  const [visible, setVisible] = useState(false);
-      if (!update || (await wasPromptedFor(update.tagName))) return;
+  const [downloading, setDownloading] = useState(false);
-      await markPrompted(update.tagName);
+  const [downloadProgress, setDownloadProgress] = useState(0);
-      const url = update.apkUrl ?? update.releaseUrl;
+  const [downloadError, setDownloadError] = useState<string | null>(null);
-      Alert.alert(
+
-        'Update available',
+  const checkUpdate = useCallback(async () => {
-        `A new version (${update.version}) is available for download.`,
+    const available = await checkForUpdates();
-        [
+    if (!available) return;
-          { text: 'Later', style: 'cancel' },
+
-          {
+    const prompted = await wasPromptedFor(available.tagName);
-            text: 'Download',
+    if (prompted && !available.mandatory) return;
-            onPress: () => {
+
-              if (url) Linking.openURL(url).catch(() => {});
+    setUpdate(available);
-            },
+    setVisible(true);
          },
        ],
      );
    };
    run();
  }, []);
-  return null;
+  useEffect(() => {
    checkUpdate();
  }, [checkUpdate]);
  const handleDownload = async () => {
    if (!update?.apkUrl) {
      await openReleaseUrl(update?.releaseUrl ?? '');
      return;
    }
    setDownloading(true);
    setDownloadProgress(0);
    setDownloadError(null);
    try {
      const uri = await downloadAPK(update.apkUrl, setDownloadProgress);
      if (uri) {
        const installed = await installAPK(uri);
        if (!installed) {
          setDownloadError('Failed to open installer. Please install manually from Downloads.');
        }
      } else {
        setDownloadError('Download failed. Please try again or download from the release page.');
      }
    } catch (error) {
      setDownloadError('An error occurred during download.');
    } finally {
      setDownloading(false);
    }
  };
  const handleLater = async () => {
    if (update) {
      await markPrompted(update.tagName);
    }
    setVisible(false);
  };
  const handleReleasePage = async () => {
    if (update) {
      await openReleaseUrl(update.releaseUrl);
    }
  };
  if (!visible || !update) return null;
  const isMandatory = update.mandatory;
  return (
    <Modal
      visible={visible}
      transparent
      animationType="fade"
      onRequestClose={isMandatory ? () => {} : handleLater}
    >
      <View style={[styles.overlay, { backgroundColor: theme.overlay }]}>
        <View style={[styles.modal, { backgroundColor: theme.card }]}>
          <View style={[styles.header, { borderBottomColor: theme.border }]}>
            <Text style={[styles.title, { color: theme.text }]}>Update Available</Text>
            <Text style={[styles.version, { color: theme.textSecondary }]}>
              Version {update.version}
            </Text>
          </View>
          <ScrollView style={styles.content} contentContainerStyle={styles.contentContainer}>
            <Text style={[styles.sectionTitle, { color: theme.text }]}>What's New</Text>
            <Text style={[styles.notes, { color: theme.textSecondary }]}>
              {update.notes || 'No release notes provided.'}
            </Text>
            {isMandatory && (
              <View style={styles.mandatoryBadge}>
                <Text style={styles.mandatoryText}>Mandatory Update</Text>
              </View>
            )}
            {downloading && (
              <View style={styles.progressContainer}>
                <View style={[styles.progressBar, { backgroundColor: theme.border }]}>
                  <View
                    style={[
                      styles.progressFill,
                      { backgroundColor: theme.accent, width: `${downloadProgress * 100}%` },
                    ]}
                  />
                </View>
                <Text style={[styles.progressText, { color: theme.textSecondary }]}>
                  Downloading... {Math.round(downloadProgress * 100)}%
                </Text>
              </View>
            )}
            {downloadError && (
              <View style={styles.errorContainer}>
                <Text style={styles.errorText}>{downloadError}</Text>
                <Pressable style={styles.errorAction} onPress={handleDownload}>
                  <Text style={styles.errorActionText}>Retry Download</Text>
                </Pressable>
              </View>
            )}
          </ScrollView>
          <View style={[styles.actions, { borderTopColor: theme.border }]}>
            {!isMandatory && (
              <Pressable
                style={[styles.button, styles.buttonSecondary, { backgroundColor: theme.cardAlt }]}
                onPress={handleLater}
              >
                <Text style={[styles.buttonText, { color: theme.textSecondary }]}>Later</Text>
              </Pressable>
            )}
            <Pressable
              style={[
                styles.button,
                styles.buttonPrimary,
                { backgroundColor: theme.accent, opacity: downloading ? 0.7 : 1 },
              ]}
              onPress={handleDownload}
              disabled={downloading}
            >
              <Text style={[styles.buttonText, { color: theme.accentText }]}>
                {downloading
                  ? 'Downloading...'
                  : update.apkUrl
                    ? 'Download & Install'
                    : 'View Release'}
              </Text>
            </Pressable>
            <Pressable
              style={[styles.button, styles.buttonGhost, { backgroundColor: 'transparent' }]}
              onPress={handleReleasePage}
            >
              <Text style={[styles.buttonText, { color: theme.textSecondary }]}>Release Notes</Text>
            </Pressable>
          </View>
        </View>
      </View>
    </Modal>
  );
 }
 const styles = StyleSheet.create({
  overlay: {
    flex: 1,
    justifyContent: 'center',
    alignItems: 'center',
    padding: 20,
  },
  modal: {
    width: '100%',
    maxWidth: 480,
    borderRadius: 20,
    overflow: 'hidden',
    maxHeight: '85%',
  },
  header: {
    padding: 20,
    borderBottomWidth: 1,
  },
  title: {
    fontSize: 20,
    fontWeight: '700',
    marginBottom: 4,
  },
  version: {
    fontSize: 14,
  },
  content: {
    maxHeight: 300,
  },
  contentContainer: {
    padding: 20,
    paddingBottom: 12,
  },
  sectionTitle: {
    fontSize: 14,
    fontWeight: '600',
    marginBottom: 8,
    textTransform: 'uppercase',
    letterSpacing: 0.5,
  },
  notes: {
    fontSize: 14,
    lineHeight: 22,
  },
  mandatoryBadge: {
    marginTop: 12,
    paddingHorizontal: 12,
    paddingVertical: 6,
    borderRadius: 8,
    backgroundColor: '#FFEBEE',
    alignSelf: 'flex-start',
  },
  mandatoryText: {
    fontSize: 12,
    fontWeight: '600',
    color: '#C62828',
  },
  progressContainer: {
    marginTop: 16,
  },
  progressBar: {
    height: 6,
    borderRadius: 3,
    overflow: 'hidden',
  },
  progressFill: {
    height: '100%',
    borderRadius: 3,
  },
  progressText: {
    fontSize: 12,
    marginTop: 6,
    textAlign: 'center',
  },
  errorContainer: {
    marginTop: 16,
    padding: 12,
    borderRadius: 8,
    backgroundColor: '#FFF3E0',
  },
  errorText: {
    fontSize: 13,
    color: '#E65100',
    marginBottom: 8,
  },
  errorAction: {
    paddingVertical: 8,
    paddingHorizontal: 16,
    borderRadius: 6,
    backgroundColor: '#FF9800',
    alignSelf: 'flex-start',
  },
  errorActionText: {
    fontSize: 13,
    fontWeight: '600',
    color: '#FFF',
  },
  actions: {
    flexDirection: 'row',
    flexWrap: 'wrap',
    justifyContent: 'flex-end',
    gap: 8,
    padding: 16,
    borderTopWidth: 1,
  },
  button: {
    paddingVertical: 10,
    paddingHorizontal: 20,
    borderRadius: 10,
    minWidth: 100,
    alignItems: 'center',
  },
  buttonPrimary: {},
  buttonSecondary: {},
  buttonGhost: {},
  buttonText: {
    fontSize: 14,
    fontWeight: '600',
  },
 });
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
tech08mag	b5ae2ee0b4	Merge pull request 'new pipe' (#37 ) from dev into main Android Build / Setup & Install (push) Successful in 8m18s Details Android Build / Build Debug APK (push) Failing after 12m21s Details Android Build / Build Release APK & AAB (push) Failing after 21m56s Details Android Build / Test & Lint (push) Successful in 15m15s Details Reviewed-on: #37	2026-09-02 19:27:34 +00:00
tech08mag	61d08f8a34	new pipe	2026-09-02 21:27:01 +02:00
tech08mag	b8e88bca6d	Merge pull request 'new pipe' (#36 ) from dev into main Android Build / Build Android (push) Failing after 46m26s Details Reviewed-on: #36	2026-09-02 18:28:52 +00:00
tech08mag	41eaef92b0	new pipe Android Build / Build Android (pull_request) Failing after 50m22s Details	2026-09-02 20:28:07 +02:00
tech08mag	93738a07ac	Merge pull request 'Dev' (#35 ) from dev into main Reviewed-on: #35	2026-09-01 19:23:32 +00:00
tech08mag	55e21c06d9	new pipe	2026-09-01 21:22:48 +02:00
tech08mag	eeab4d1221	- src/theme.tsx - Added light/dark themes, themeMode, settings sync functions - src/services/notifications.ts - Added useNotificationSettings hook, respects notifications toggle - app/(tabs)/settings.tsx - Added theme mode picker, fixed notifications toggle, added settings sync buttons	2026-08-28 23:45:36 +02:00
tech08mag	c5f129bb42	Merge pull request 'Fixed - Gitea doesn't support actions/upload-artifact@v4 or download-artifact@v4. Switched both to v3.' (#34 ) from dev into main Build and Release APK / build (push) Successful in 14m54s Details Build and Release APK / release (push) Failing after 9m4s Details Reviewed-on: #34	2026-08-28 21:34:01 +00:00
tech08mag	4d3d741563	Fixed - Gitea doesn't support actions/upload-artifact@v4 or download-artifact@v4. Switched both to v3.	2026-08-28 23:33:04 +02:00
tech08mag	95c69d35e2	Merge pull request 'Fixed the APK output path - the build outputs to outputs/release/app-release.apk not outputs/apk/release/app-release.apk' (#33 ) from dev into main Build and Release APK / build (push) Successful in 14m59s Details Build and Release APK / release (push) Failing after 5m46s Details Reviewed-on: #33	2026-08-28 21:11:08 +00:00
tech08mag	bc4903e3b8	Fixed the APK output path - the build outputs to outputs/release/app-release.apk not outputs/apk/release/app-release.apk	2026-08-28 23:10:34 +02:00
tech08mag	beb6cc5715	Merge pull request 'Fixed the artifact path from outputs/release/ to outputs/apk/release/ in the workflow' (#32 ) from dev into main Build and Release APK / build (push) Failing after 20m49s Details Build and Release APK / release (push) Skipped Details Reviewed-on: #32	2026-08-28 20:40:49 +00:00
tech08mag	4c6adc7117	Fixed the artifact path from outputs/release/ to outputs/apk/release/ in the workflow	2026-08-28 22:40:18 +02:00
tech08mag	c787b87cc5	Merge pull request 'Removed the yes \| sdkmanager --licenses that caused SIGPIPE' (#31 ) from dev into main Build and Release APK / build (push) Successful in 19m59s Details Build and Release APK / release (push) Failing after 6m41s Details Reviewed-on: #31	2026-08-28 20:09:13 +00:00
tech08mag	0685735c74	Removed the yes \| sdkmanager --licenses that caused SIGPIPE	2026-08-28 22:08:16 +02:00
tech08mag	064650a585	Merge pull request 'added explicit NDK license acceptance by writing the known license hashes to $ANDROID_HOME/licenses/android-sdk-license' (#30 ) from dev into main Build and Release APK / build (push) Failing after 7s Details Build and Release APK / release (push) Skipped Details Reviewed-on: #30	2026-08-28 20:06:58 +00:00
tech08mag	bdfe53fa83	added explicit NDK license acceptance by writing the known license hashes to $ANDROID_HOME/licenses/android-sdk-license	2026-08-28 22:06:00 +02:00
tech08mag	f6abf628e3	Merge pull request 'new release pipe' (#29 ) from dev into main Build and Release APK / build (push) Failing after 3m48s Details Build and Release APK / release (push) Skipped Details Reviewed-on: #29	2026-08-28 20:00:40 +00:00
tech08mag	40077da57f	new release pipe	2026-08-28 22:00:13 +02:00
tech08mag	aa57d07dc0	Merge pull request 'gradle update' (#28 ) from dev into main Build APK / build (push) Successful in 17m50s Details release / release (push) Canceled after 0s Details Reviewed-on: #28	2026-08-28 19:39:21 +00:00
tech08mag	89c85ed7c0	gradle update	2026-08-28 21:38:23 +02:00
tech08mag	ee6af8fb26	Merge pull request 'fixxing pipe dependencies' (#27 ) from dev into main Build APK / build (push) Failing after 1m36s Details release / release (push) Canceled after 0s Details Reviewed-on: #27	2026-08-28 19:35:16 +00:00
tech08mag	c6e441d449	fixxing pipe dependencies	2026-08-28 21:34:14 +02:00
tech08mag	5043d9cdff	Merge pull request 'fixxing android pipe' (#26 ) from dev into main Build APK / build (push) Failing after 48s Details release / release (push) Canceled after 0s Details Reviewed-on: #26	2026-08-28 19:30:31 +00:00
tech08mag	7e36244478	fixxing android pipe	2026-08-28 21:29:12 +02:00
tech08mag	157fc8d95b	Merge pull request 'pipe' (#24 ) from dev into main Build APK / build (push) Failing after 2m55s Details release / release (push) Canceled after 0s Details Reviewed-on: #24	2026-08-27 18:42:32 +00:00
tech08mag	4d2f92b144	pipe	2026-08-27 20:41:31 +02:00
tech08mag	8e805316fb	Merge pull request 'new pipe' (#23 ) from dev into main Build Desktop (deb) / build (push) Failing after 5m18s Details Build APK / build (push) Successful in 15m35s Details release / release (push) Canceled after 0s Details Reviewed-on: #23	2026-08-27 18:04:54 +00:00
tech08mag	77051e5206	new pipe	2026-08-27 20:03:05 +02:00
tech08mag	7e06415db4	Merge pull request 'Dev' (#22 ) from dev into main Build Desktop (deb) / build (push) Failing after 5m27s Details release / release (push) Successful in 6m5s Details Build APK / build (push) Successful in 15m43s Details Reviewed-on: #22	2026-08-27 04:42:02 +00:00
tech08mag	cfb987a305	Fix OutOfMemoryError: increase MaxMetaspaceSize from 384m to 1024m	2026-08-27 06:35:06 +02:00
tech08mag	3dad9e93ec	layout	2026-08-26 23:48:42 +02:00
tech08mag	2be4d5aa4e	Merge pull request 'keystore key' (#21 ) from dev into main Build Desktop (deb) / build (push) Failing after 5m14s Details release / release (push) Successful in 6m7s Details Build APK / build (push) Failing after 3h0m11s Details Reviewed-on: #21	2026-08-26 21:21:00 +00:00
tech08mag	e91251759b	keystore key	2026-08-26 23:20:19 +02:00
tech08mag	0093c4aec2	Merge pull request 'fix: remove existing debug keystore before generation in CI' (#20 ) from dev into main Build APK / build (push) Failing after 3m21s Details Build Desktop (deb) / build (push) Successful in 2m22s Details release / release (push) Successful in 6m15s Details Reviewed-on: #20	2026-08-26 21:11:54 +00:00
tech08mag	0563521887	fix: remove existing debug keystore before generation in CI	2026-08-26 23:09:15 +02:00
tech08mag	9ade0fa0ca	Merge pull request 'keystore key' (#19 ) from dev into main Build APK / build (push) Failing after 51s Details Build Desktop (deb) / build (push) Failing after 5m5s Details release / release (push) Successful in 6m55s Details Reviewed-on: #19	2026-08-26 21:04:21 +00:00
tech08mag	3ec934a54c	keystore key	2026-08-26 23:03:29 +02:00
tech08mag	39fd491d24	Merge pull request 'include android directory' (#18 ) from dev into main Build APK / build (push) Failing after 35s Details Build Desktop (deb) / build (push) Successful in 2m9s Details release / release (push) Successful in 7m52s Details Reviewed-on: #18	2026-08-26 20:56:30 +00:00
tech08mag	381fef8502	include android directory	2026-08-26 22:55:52 +02:00
tech08mag	c4cc2712ee	Merge pull request 'feat: remove /android from .gitignore to allow Gradle build in CI' (#17 ) from dev into main Build APK / build (push) Failing after 1m7s Details Build Desktop (deb) / build (push) Successful in 2m12s Details release / release (push) Successful in 8m0s Details Reviewed-on: #17	2026-08-26 20:52:22 +00:00
tech08mag	152d07f21e	feat: remove /android from .gitignore to allow Gradle build in CI	2026-08-26 22:49:07 +02:00
		`@@ -0,0 +1,2 @@`
							`#This file is generated by updateDaemonJvm`
							`toolchainVersion=17`