File browser improvements

.githooks/pre-commit

@@ -1,66 +0,0 @@
-#!/usr/bin/env bash
-set -euo pipefail
-
-HOOK_DIR="$(cd "$(dirname "${BASH_SOURCE[0]}")" && pwd)"
-REPO_ROOT="$(cd "$HOOK_DIR/.." && pwd)"
-
-cd "$REPO_ROOT"
-
-# =============================================================================
-# Go CI checks (when core/ files are staged)
-# =============================================================================
-STAGED_CORE_FILES=$(git diff --cached --name-only --diff-filter=ACMR | grep '^core/' || true)
-
-if [[ -n "$STAGED_CORE_FILES" ]]; then
-  echo "Go files staged in core/, running CI checks..."
-  cd "$REPO_ROOT/core"
-
-  # Format check
-  echo "  Checking gofmt..."
-  UNFORMATTED=$(gofmt -s -l . 2>/dev/null || true)
-  if [[ -n "$UNFORMATTED" ]]; then
-    echo "The following files are not formatted:"
-    echo "$UNFORMATTED"
-    echo ""
-    echo "Run: cd core && gofmt -s -w ."
-    exit 1
-  fi
-
-  # golangci-lint
-  if command -v golangci-lint &>/dev/null; then
-    echo "  Running golangci-lint..."
-    golangci-lint run ./...
-  else
-    echo "  Warning: golangci-lint not installed, skipping lint"
-    echo "  Install: go install github.com/golangci/golangci-lint/cmd/golangci-lint@latest"
-  fi
-
-  # Tests
-  echo "  Running tests..."
-  go test ./... >/dev/null
-
-  # Build checks
-  echo "  Building..."
-  mkdir -p bin
-  go build -buildvcs=false -o bin/dms ./cmd/dms
-  go build -buildvcs=false -o bin/dms-distro -tags distro_binary ./cmd/dms
-  go build -buildvcs=false -o bin/dankinstall ./cmd/dankinstall
-
-  echo "All Go CI checks passed!"
-  cd "$REPO_ROOT"
-fi
-
-# =============================================================================
-# i18n sync check (DISABLED for now)
-# =============================================================================
-# if [[ -n "${POEDITOR_API_TOKEN:-}" ]] && [[ -n "${POEDITOR_PROJECT_ID:-}" ]]; then
-#     if command -v python3 &>/dev/null; then
-#         if ! python3 scripts/i18nsync.py check &>/dev/null; then
-#             echo "Translations out of sync"
-#             echo "Run: python3 scripts/i18nsync.py sync"
-#             exit 1
-#         fi
-#     fi
-# fi
-
-exit 0

.github/FUNDING.yml

@@ -1,15 +0,0 @@
-# These are supported funding model platforms
-
-github: [avengemedia]
-patreon: # Replace with a single Patreon username
-open_collective: # Replace with a single Open Collective username
-ko_fi: danklinux
-tidelift: # Replace with a single Tidelift platform-name/package-name e.g., npm/babel
-community_bridge: # Replace with a single Community Bridge project-name e.g., cloud-foundry
-liberapay: # Replace with a single Liberapay username
-issuehunt: # Replace with a single IssueHunt username
-lfx_crowdfunding: # Replace with a single LFX Crowdfunding project-name e.g., cloud-foundry
-polar: # Replace with a single Polar username
-buy_me_a_coffee: # Replace with a single Buy Me a Coffee username
-thanks_dev: # Replace with a single thanks.dev username
-custom: # Replace with up to 4 custom sponsorship URLs e.g., ['link1', 'link2']

.github/ISSUE_TEMPLATE/bug_report.md

@@ -9,15 +9,21 @@ assignees: ""
 <!-- If your issue is related to ICONS 
 - Purple and black checkerboards are QT's way of signalling an icon doesn't exist
   - FIX: Configure a QT6 or Icon Pack in DMS Settings that has the icon you want
-  - Follow the [THEMING](https://danklinux.com/docs/dankmaterialshell/icon-theming) section to ensure your QT environment variable is configured correctly for themes.
+  - Follow the [THEMING](https://github.com/AvengeMedia/DankMaterialShell/tree/master?tab=readme-ov-file#theming) section to ensure your QT environment variable is configured correctl for themes.
   - Once done, configure an icon theme - either however you normally do with gtk3 or qt6ct, or through the built-in settings modal. -->
 
+<!-- If your issue is related to APP LAUNCHER/DOCK/Running Apps being stale
+ Quickshell does not ever update its DesktopEntires.
+ There is an open PR for it, that has been stuck unmerged over there to fix it.
+ We unfortunately are at the mercy of quickshell to merge it.
+ Until then, newly installed and removed apps will not react until the
+ shell is restarted.
+  -->
+
 ## Compositor
 
 - [ ] niri
 - [ ] Hyprland
-- [ ] dwl (MangoWC)
-- [ ] sway
 - [ ] Other (specify)
 
 ## Distribution

.github/ISSUE_TEMPLATE/feature_request.md

@@ -21,8 +21,6 @@ Is this feature specific to one compositor?
 - [ ] All compositors
 - [ ] niri
 - [ ] Hyprland
-- [ ] dwl (MangoWC)
-- [ ] sway
 
 ## Proposed Solution
 

.github/ISSUE_TEMPLATE/support_request.md

@@ -10,8 +10,6 @@ assignees: ""
 
 - [ ] niri
 - [ ] Hyprland
-- [ ] dwl (MangoWC)
-- [ ] sway
 - [ ] other
 
 ## Distribution

.github/workflows/copr-release.yml

@@ -1,21 +1,22 @@
 name: DMS Copr Stable Release
 
 on:
+  push:
+    tags:
+      - 'v*'
+  release:
+    types: [published]
   workflow_dispatch:
     inputs:
       version:
         description: 'Versioning (e.g., 0.1.14, leave empty for latest release)'
         required: false
         default: ''
-      release:
-        description: 'Release number (e.g., 1, 2, 3 for hotfixes)'
-        required: false
-        default: '1'
 
 jobs:
   build-and-upload:
     runs-on: ubuntu-latest
-
+    
     steps:
       - name: Checkout repository
         uses: actions/checkout@v4
@@ -23,23 +24,25 @@ jobs:
       - name: Determine version
         id: version
         run: |
-          # Get version from manual input or latest release
           if [ -n "${{ github.event.inputs.version }}" ]; then
             VERSION="${{ github.event.inputs.version }}"
             echo "Using manual version: $VERSION"
+          elif [ "${{ github.event_name }}" = "release" ]; then
+            VERSION="${{ github.event.release.tag_name }}"
+            VERSION="${VERSION#v}"
+            echo "Using release version: $VERSION"
+          elif [ "${{ github.event_name }}" = "push" ] && [[ "${{ github.ref }}" == refs/tags/* ]]; then
+            VERSION="${{ github.ref_name }}"
+            VERSION="${VERSION#v}"
+            echo "Using tag version: $VERSION"
           else
-            VERSION=$(curl -s https://api.github.com/repos/${{ github.repository }}/releases/latest | jq -r '.tag_name' | sed 's/^v//')
+            # Fallback to latest release
+            VERSION=$(curl -s https://api.github.com/repos/AvengeMedia/DankMaterialShell/releases/latest | jq -r '.tag_name' | sed 's/^v//')
             echo "Using latest release version: $VERSION"
           fi
-
-          RELEASE="${{ github.event.inputs.release }}"
-          if [ -z "$RELEASE" ]; then
-            RELEASE="1"
-          fi
-
+          
           echo "version=$VERSION" >> $GITHUB_OUTPUT
-          echo "release=$RELEASE" >> $GITHUB_OUTPUT
-          echo "✅ Building DMS hotfix version: $VERSION-$RELEASE"
+          echo "✅ Building DMS stable version: $VERSION"
       
       - name: Setup build environment
         run: |
@@ -68,7 +71,6 @@ jobs:
       - name: Generate stable spec file
         run: |
           VERSION="${{ steps.version.outputs.version }}"
-          RELEASE="${{ steps.version.outputs.release }}"
           CHANGELOG_DATE="$(date '+%a %b %d %Y')"
 
           cat > ~/rpmbuild/SPECS/dms.spec <<'SPECEOF'
@@ -80,29 +82,31 @@ jobs:
 
           Name:           dms
           Version:        %{version}
-          Release:        RELEASE_PLACEHOLDER%{?dist}
+          Release:        1%{?dist}
           Summary:        %{pkg_summary}
 
-          License:        MIT
+          License:        GPL-3.0-only
           URL:            https://github.com/AvengeMedia/DankMaterialShell
 
           Source0:        dms-qml.tar.gz
 
           BuildRequires:  gzip
           BuildRequires:  wget
-          BuildRequires:  systemd-rpm-macros
 
           Requires:       (quickshell or quickshell-git)
-          Requires:       accountsservice
           Requires:       dms-cli
           Requires:       dgop
+          Requires:       fira-code-fonts
+          Requires:       material-symbols-fonts
+          Requires:       rsms-inter-fonts
 
+          Recommends:     brightnessctl
           Recommends:     cava
           Recommends:     cliphist
-          Recommends:     danksearch
           Recommends:     hyprpicker
           Recommends:     matugen
           Recommends:     wl-clipboard
+          Recommends:     gammastep
           Recommends:     NetworkManager
           Recommends:     qt6-qtmultimedia
           Suggests:       qt6ct
@@ -118,8 +122,8 @@ jobs:
 
           %package -n dms-cli
           Summary:        DankMaterialShell CLI tool
-          License:        MIT
-          URL:            https://github.com/AvengeMedia/DankMaterialShell
+          License:        GPL-3.0-only
+          URL:            https://github.com/AvengeMedia/danklinux
 
           %description -n dms-cli
           Command-line interface for DankMaterialShell configuration and management.
@@ -155,7 +159,7 @@ jobs:
           esac
 
           # Download dms-cli for target architecture
-          wget -O %{_builddir}/dms-cli.gz "https://github.com/AvengeMedia/DankMaterialShell/releases/latest/download/dms-distropkg-${ARCH_SUFFIX}.gz" || {
+          wget -O %{_builddir}/dms-cli.gz "https://github.com/AvengeMedia/danklinux/releases/latest/download/dms-distropkg-${ARCH_SUFFIX}.gz" || {
             echo "Failed to download dms-cli for architecture %{_arch}"
             exit 1
           }
@@ -176,65 +180,36 @@ jobs:
           install -Dm755 %{_builddir}/dms-cli %{buildroot}%{_bindir}/dms
           install -Dm755 %{_builddir}/dgop %{buildroot}%{_bindir}/dgop
 
-          # Shell completions
-          install -d %{buildroot}%{_datadir}/bash-completion/completions
-          install -d %{buildroot}%{_datadir}/zsh/site-functions
-          install -d %{buildroot}%{_datadir}/fish/vendor_completions.d
-          %{_builddir}/dms-cli completion bash > %{buildroot}%{_datadir}/bash-completion/completions/dms || :
-          %{_builddir}/dms-cli completion zsh > %{buildroot}%{_datadir}/zsh/site-functions/_dms || :
-          %{_builddir}/dms-cli completion fish > %{buildroot}%{_datadir}/fish/vendor_completions.d/dms.fish || :
+          install -dm755 %{buildroot}%{_sysconfdir}/xdg/quickshell/dms
+          cp -r %{_builddir}/dms-qml/* %{buildroot}%{_sysconfdir}/xdg/quickshell/dms/
 
-          install -Dm644 %{_builddir}/dms-qml/assets/systemd/dms.service %{buildroot}%{_userunitdir}/dms.service
-
-          install -dm755 %{buildroot}%{_datadir}/quickshell/dms
-          cp -r %{_builddir}/dms-qml/* %{buildroot}%{_datadir}/quickshell/dms/
-
-          rm -rf %{buildroot}%{_datadir}/quickshell/dms/.git*
-          rm -f %{buildroot}%{_datadir}/quickshell/dms/.gitignore
-          rm -rf %{buildroot}%{_datadir}/quickshell/dms/.github
-          rm -rf %{buildroot}%{_datadir}/quickshell/dms/distro
-
-          %posttrans
-          # Clean up old installation path from previous versions (only if empty)
-          if [ -d "%{_sysconfdir}/xdg/quickshell/dms" ]; then
-              # Remove directories only if empty (preserves any user-added files)
-              rmdir "%{_sysconfdir}/xdg/quickshell/dms" 2>/dev/null || true
-              rmdir "%{_sysconfdir}/xdg/quickshell" 2>/dev/null || true
-              rmdir "%{_sysconfdir}/xdg" 2>/dev/null || true
-          fi
-
-          # Restart DMS for active users after upgrade
-          if [ "$1" -ge 2 ]; then
-            pkill -USR1 -x dms >/dev/null 2>&1 || true
-          fi
+          rm -rf %{buildroot}%{_sysconfdir}/xdg/quickshell/dms/.git*
+          rm -f %{buildroot}%{_sysconfdir}/xdg/quickshell/dms/.gitignore
+          rm -rf %{buildroot}%{_sysconfdir}/xdg/quickshell/dms/.github
+          rm -f %{buildroot}%{_sysconfdir}/xdg/quickshell/dms/*.spec
 
           %files
           %license LICENSE
           %doc README.md CONTRIBUTING.md
-          %{_datadir}/quickshell/dms/
-          %{_userunitdir}/dms.service
+          %{_sysconfdir}/xdg/quickshell/dms/
 
           %files -n dms-cli
           %{_bindir}/dms
-          %{_datadir}/bash-completion/completions/dms
-          %{_datadir}/zsh/site-functions/_dms
-          %{_datadir}/fish/vendor_completions.d/dms.fish
 
           %files -n dgop
           %{_bindir}/dgop
 
           %changelog
-          * CHANGELOG_DATE_PLACEHOLDER AvengeMedia <contact@avengemedia.com> - VERSION_PLACEHOLDER-RELEASE_PLACEHOLDER
+          * CHANGELOG_DATE_PLACEHOLDER AvengeMedia <contact@avengemedia.com> - VERSION_PLACEHOLDER-1
           - Stable release VERSION_PLACEHOLDER
           - Built from GitHub release
           - Includes latest dms-cli and dgop binaries
           SPECEOF
 
           sed -i "s/VERSION_PLACEHOLDER/${VERSION}/g" ~/rpmbuild/SPECS/dms.spec
-          sed -i "s/RELEASE_PLACEHOLDER/${RELEASE}/g" ~/rpmbuild/SPECS/dms.spec
           sed -i "s/CHANGELOG_DATE_PLACEHOLDER/${CHANGELOG_DATE}/g" ~/rpmbuild/SPECS/dms.spec
-
-          echo "✅ Spec file generated for v${VERSION}-${RELEASE}"
+          
+          echo "✅ Spec file generated for v${VERSION}"
           echo ""
           echo "=== Spec file preview ==="
           head -40 ~/rpmbuild/SPECS/dms.spec
@@ -308,7 +283,7 @@ jobs:
         run: |
           echo "### 🎉 DMS Stable Build Summary" >> $GITHUB_STEP_SUMMARY
           echo "" >> $GITHUB_STEP_SUMMARY
-          echo "- **Version:** ${{ steps.version.outputs.version }}-${{ steps.version.outputs.release }}" >> $GITHUB_STEP_SUMMARY
+          echo "- **Version:** ${{ steps.version.outputs.version }}" >> $GITHUB_STEP_SUMMARY
           echo "- **SRPM:** ${{ steps.build.outputs.srpm_name }}" >> $GITHUB_STEP_SUMMARY
           echo "- **Project:** https://copr.fedorainfracloud.org/coprs/avengemedia/dms/" >> $GITHUB_STEP_SUMMARY
           echo "" >> $GITHUB_STEP_SUMMARY

.github/workflows/go-ci.yml

@@ -1,60 +0,0 @@
-name: Go CI
-
-on:
-  push:
-    branches:
-      - "**"
-    paths:
-      - "core/**"
-      - ".github/workflows/go-ci.yml"
-  pull_request:
-    branches: [master, main]
-    paths:
-      - "core/**"
-      - ".github/workflows/go-ci.yml"
-
-concurrency:
-  group: go-ci-${{ github.ref }}
-  cancel-in-progress: true
-
-jobs:
-  lint-and-test:
-    runs-on: ubuntu-latest
-    defaults:
-      run:
-        working-directory: core
-
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-
-      - name: Set up Go
-        uses: actions/setup-go@v5
-        with:
-          go-version-file: ./core/go.mod
-
-      - name: Format check
-        run: |
-          if [ "$(gofmt -s -l . | wc -l)" -gt 0 ]; then
-            echo "The following files are not formatted:"
-            gofmt -s -l .
-            exit 1
-          fi
-
-      - name: Run golangci-lint
-        uses: golangci/golangci-lint-action@v9
-        with:
-          version: v2.6
-          working-directory: core
-
-      - name: Test
-        run: go test -v ./...
-
-      - name: Build dms
-        run: go build -v ./cmd/dms
-
-      - name: Build dms (distropkg)
-        run: go build -v -tags distro_binary ./cmd/dms
-
-      - name: Build dankinstall
-        run: go build -v ./cmd/dankinstall

.github/workflows/poeditor-export.yml

@@ -0,0 +1,107 @@
+name: POEditor Diff & Sync
+
+on:
+  push:
+    branches: [ master ]
+  workflow_dispatch: {}
+
+concurrency:
+  group: poeditor-sync
+  cancel-in-progress: false
+
+jobs:
+  sync-translations:
+    runs-on: ubuntu-latest
+    timeout-minutes: 20
+
+    steps:
+      - uses: actions/checkout@v4
+
+      - name: Install jq
+        run: sudo apt-get update && sudo apt-get install -y jq
+
+      - name: Export and update translations from POEditor
+        env:
+          API_TOKEN: ${{ secrets.POEDITOR_API_TOKEN }}
+          PROJECT_ID: ${{ secrets.POEDITOR_PROJECT_ID }}
+        run: |
+          set -euo pipefail
+
+          LANGUAGES=(
+            "ja:translations/poexports/ja.json"
+            "zh-Hans:translations/poexports/zh_CN.json"
+            "pt-br:translations/poexports/pt.json"
+          )
+
+          ANY_CHANGED=false
+
+          for lang_pair in "${LANGUAGES[@]}"; do
+            IFS=':' read -r PO_LANG REPO_FILE <<< "$lang_pair"
+
+            echo "::group::Processing $PO_LANG"
+
+            RESP=$(curl -sS -X POST https://api.poeditor.com/v2/projects/export \
+              -d api_token="$API_TOKEN" \
+              -d id="$PROJECT_ID" \
+              -d language="$PO_LANG" \
+              -d type="key_value_json")
+
+            STATUS=$(echo "$RESP" | jq -r '.response.status')
+            if [[ "$STATUS" != "success" ]]; then
+              echo "POEditor export request failed for $PO_LANG: $RESP" >&2
+              continue
+            fi
+
+            URL=$(echo "$RESP" | jq -r '.result.url')
+            if [[ -z "$URL" || "$URL" == "null" ]]; then
+              echo "No export URL returned for $PO_LANG" >&2
+              continue
+            fi
+
+            curl -sS -L "$URL" -o "/tmp/po_export_${PO_LANG}.json"
+            jq -S . "/tmp/po_export_${PO_LANG}.json" > "/tmp/po_export_${PO_LANG}.norm.json"
+
+            if [[ -f "$REPO_FILE" ]]; then
+              jq -S . "$REPO_FILE" > "/tmp/repo_${PO_LANG}.norm.json" || echo "{}" > "/tmp/repo_${PO_LANG}.norm.json"
+            else
+              echo "{}" > "/tmp/repo_${PO_LANG}.norm.json"
+            fi
+
+            if diff -q "/tmp/po_export_${PO_LANG}.norm.json" "/tmp/repo_${PO_LANG}.norm.json" >/dev/null; then
+              echo "No changes for $PO_LANG"
+            else
+              echo "Detected changes for $PO_LANG"
+              mkdir -p "$(dirname "$REPO_FILE")"
+              cp "/tmp/po_export_${PO_LANG}.norm.json" "$REPO_FILE"
+              ANY_CHANGED=true
+            fi
+
+            echo "::endgroup::"
+          done
+
+          echo "any_changed=$ANY_CHANGED" >> "$GITHUB_OUTPUT"
+        id: export
+
+      - name: Commit and push translation updates
+        if: steps.export.outputs.any_changed == 'true'
+        run: |
+          set -euo pipefail
+
+          git config user.name "github-actions[bot]"
+          git config user.email "github-actions[bot]@users.noreply.github.com"
+
+          git add translations/poexports/*.json
+          git commit -m "i18n: update translations"
+
+          for attempt in 1 2 3; do
+            if git push; then
+              echo "Successfully pushed translation updates"
+              exit 0
+            fi
+            echo "Push attempt $attempt failed, pulling and retrying..."
+            git pull --rebase
+            sleep $((attempt*2))
+          done
+
+          echo "Failed to push after retries" >&2
+          exit 1

.github/workflows/release.yml

@@ -1,194 +1,46 @@
-name: Release
+# Release from a dispatch event from the danklinux repo
+name: Create Release from DMS
 
 on:
-  push:
-    tags:
-      - 'v*'
+  repository_dispatch:
+    types: [dms_release]
 
 permissions:
   contents: write
-  actions: write
 
 concurrency:
-  group: release-${{ github.ref_name }}
+  group: release-${{ github.event.client_payload.tag }}
   cancel-in-progress: true
 
 jobs:
-  build-core:
-    runs-on: ubuntu-latest
-    strategy:
-      matrix:
-        arch: [amd64, arm64]
-
-    defaults:
-      run:
-        working-directory: core
-
+  create_release_from_dms:
+    runs-on: ubuntu-24.04
+    env:
+      TAG: ${{ github.event.client_payload.tag }}
+      DMS_REPO: ${{ github.event.client_payload.dms_repo }}
     steps:
-      - name: Checkout
-        uses: actions/checkout@v4
+      - uses: actions/checkout@v4
         with:
           fetch-depth: 0
 
-      - name: Set up Go
-        uses: actions/setup-go@v5
-        with:
-          go-version-file: ./core/go.mod
-
-      - name: Format check
+      - name: Ensure VERSION and tag
         run: |
-          if [ "$(gofmt -s -l . | wc -l)" -gt 0 ]; then
-            echo "The following files are not formatted:"
-            gofmt -s -l .
-            exit 1
-          fi
+          set -euxo pipefail
+          git config user.name  "github-actions[bot]"
+          git config user.email "github-actions[bot]@users.noreply.github.com"
 
-      - name: Run tests
-        run: go test -v ./...
+          echo "${TAG}" > VERSION
 
-      - name: Build dankinstall (${{ matrix.arch }})
-        env:
-          GOOS: linux
-          CGO_ENABLED: 0
-          GOARCH: ${{ matrix.arch }}
-        run: |
-          set -eux
-          cd cmd/dankinstall
-          go build -trimpath -ldflags "-s -w -X main.Version=${GITHUB_REF#refs/tags/}" \
-            -o ../../dankinstall-${{ matrix.arch }}
-          cd ../..
-          gzip -9 -k dankinstall-${{ matrix.arch }}
-          sha256sum dankinstall-${{ matrix.arch }}.gz > dankinstall-${{ matrix.arch }}.gz.sha256
-
-      - name: Build dms (${{ matrix.arch }})
-        env:
-          GOOS: linux
-          CGO_ENABLED: 0
-          GOARCH: ${{ matrix.arch }}
-        run: |
-          set -eux
-          cd cmd/dms
-          go build -trimpath -ldflags "-s -w -X main.Version=${GITHUB_REF#refs/tags/}" \
-            -o ../../dms-${{ matrix.arch }}
-          cd ../..
-          gzip -9 -k dms-${{ matrix.arch }}
-          sha256sum dms-${{ matrix.arch }}.gz > dms-${{ matrix.arch }}.gz.sha256
-
-      - name: Generate shell completions
-        if: matrix.arch == 'amd64'
-        run: |
-          set -eux
-          chmod +x dms-amd64
-          ./dms-amd64 completion bash > completion.bash
-          ./dms-amd64 completion fish > completion.fish
-          ./dms-amd64 completion zsh > completion.zsh
-
-      - name: Build dms-distropkg (${{ matrix.arch }})
-        env:
-          GOOS: linux
-          CGO_ENABLED: 0
-          GOARCH: ${{ matrix.arch }}
-        run: |
-          set -eux
-          cd cmd/dms
-          go build -trimpath -tags distro_binary -ldflags "-s -w -X main.Version=${GITHUB_REF#refs/tags/}" \
-            -o ../../dms-distropkg-${{ matrix.arch }}
-          cd ../..
-          gzip -9 -k dms-distropkg-${{ matrix.arch }}
-          sha256sum dms-distropkg-${{ matrix.arch }}.gz > dms-distropkg-${{ matrix.arch }}.gz.sha256
-
-      - name: Upload artifacts (${{ matrix.arch }})
-        if: matrix.arch == 'arm64'
-        uses: actions/upload-artifact@v4
-        with:
-          name: core-assets-${{ matrix.arch }}
-          path: |
-            core/dankinstall-${{ matrix.arch }}.gz
-            core/dankinstall-${{ matrix.arch }}.gz.sha256
-            core/dms-${{ matrix.arch }}.gz
-            core/dms-${{ matrix.arch }}.gz.sha256
-            core/dms-distropkg-${{ matrix.arch }}.gz
-            core/dms-distropkg-${{ matrix.arch }}.gz.sha256
-          if-no-files-found: error
-
-      - name: Upload artifacts with completions
-        if: matrix.arch == 'amd64'
-        uses: actions/upload-artifact@v4
-        with:
-          name: core-assets-${{ matrix.arch }}
-          path: |
-            core/dankinstall-${{ matrix.arch }}.gz
-            core/dankinstall-${{ matrix.arch }}.gz.sha256
-            core/dms-${{ matrix.arch }}.gz
-            core/dms-${{ matrix.arch }}.gz.sha256
-            core/dms-distropkg-${{ matrix.arch }}.gz
-            core/dms-distropkg-${{ matrix.arch }}.gz.sha256
-            core/completion.bash
-            core/completion.fish
-            core/completion.zsh
-          if-no-files-found: error
-
-  update-versions:
-    runs-on: ubuntu-latest
-    needs: build-core
-    steps:
-      - name: Create GitHub App token
-        id: app_token
-        uses: actions/create-github-app-token@v1
-        with:
-          app-id: ${{ secrets.APP_ID }}
-          private-key: ${{ secrets.APP_PRIVATE_KEY }}
-
-      - name: Checkout
-        uses: actions/checkout@v4
-        with:
-          token: ${{ steps.app_token.outputs.token }}
-          fetch-depth: 0
-
-      - name: Update VERSION
-        env:
-          GH_TOKEN: ${{ steps.app_token.outputs.token }}
-        run: |
-          set -euo pipefail
-          git config user.name "dms-ci[bot]"
-          git config user.email "dms-ci[bot]@users.noreply.github.com"
-
-          version="${GITHUB_REF#refs/tags/}"
-          echo "Updating to version: $version"
-          echo "${version}" > quickshell/VERSION
-          git add quickshell/VERSION
+          git add -A VERSION
 
           if ! git diff --cached --quiet; then
-            git commit -m "chore: bump version to $version"
-            git pull --rebase origin master
-            git push https://x-access-token:${GH_TOKEN}@github.com/${{ github.repository }}.git HEAD:master
+            git commit -m "Update VERSION to ${TAG} (from DMS)"
           fi
 
-          git tag -f "${version}"
-          git push -f https://x-access-token:${GH_TOKEN}@github.com/${{ github.repository }}.git "${version}"
+          git tag -f "${TAG}"
 
-  release:
-    runs-on: ubuntu-24.04
-    needs: [build-core, update-versions]
-    env:
-      TAG: ${{ github.ref_name }}
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-
-      - name: Fetch updated tag after version bump
-        run: |
-          git fetch origin --force tag ${{ github.ref_name }}
-          git checkout ${{ github.ref_name }}
-
-      - name: Download core artifacts
-        uses: actions/download-artifact@v4
-        with:
-          pattern: core-assets-*
-          merge-multiple: true
-          path: ./_core_assets
+          git push origin HEAD
+          git push -f origin "${TAG}"
 
       - name: Generate Changelog
         id: changelog
@@ -196,31 +48,23 @@ jobs:
           set -e
           PREVIOUS_TAG=$(git describe --tags --abbrev=0 "${TAG}^" 2>/dev/null || echo "")
           if [ -z "$PREVIOUS_TAG" ]; then
-            CHANGELOG=$(git log --oneline --pretty=format:"%an|%s (%h)" | grep -v "^github-actions\[bot\]|" | sed 's/^[^|]*|/- /' | head -50)
+            CHANGELOG=$(git log --oneline --pretty=format:"- %s (%h)" | head -50)
           else
-            CHANGELOG=$(git log --oneline --pretty=format:"%an|%s (%h)" "${PREVIOUS_TAG}..${TAG}" | grep -v "^github-actions\[bot\]|" | sed 's/^[^|]*|/- /')
+            CHANGELOG=$(git log --oneline --pretty=format:"- %s (%h)" "${PREVIOUS_TAG}..${TAG}")
           fi
 
           cat > RELEASE_BODY.md << 'EOF'
-          ## Installation
-
-          ```bash
-          curl -fsSL https://install.danklinux.com | sh
-          ```
-
           ## Assets
 
           ### Complete Packages
-          - **`dms-full-amd64.tar.gz`** - Complete package for x86_64 systems (CLI binaries + QML source + shell completions + installation guide)
-          - **`dms-full-arm64.tar.gz`** - Complete package for ARM64 systems (CLI binaries + QML source + shell completions + installation guide)
+          - **`dms-full-amd64.tar.gz`** - Complete package for x86_64 systems (CLI binaries + QML source + installation guide)
+          - **`dms-full-arm64.tar.gz`** - Complete package for ARM64 systems (CLI binaries + QML source + installation guide)
 
           ### Individual Components
           - **`dms-cli-amd64.gz`** - DMS CLI binary for x86_64 systems
           - **`dms-cli-arm64.gz`** - DMS CLI binary for ARM64 systems
           - **`dms-distropkg-amd64.gz`** - DMS CLI binary built with distro_package tag for AMD64 systems
           - **`dms-distropkg-arm64.gz`** - DMS CLI binary built with distro_package tag for ARM64 systems
-          - **`dankinstall-amd64.gz`** - Installer binary for x86_64 systems
-          - **`dankinstall-arm64.gz`** - Installer binary for ARM64 systems
           - **`dms-qml.tar.gz`** - QML source code only
 
           ### Checksums
@@ -244,14 +88,30 @@ jobs:
           cat RELEASE_BODY.md >> $GITHUB_OUTPUT
           echo "EOF" >> $GITHUB_OUTPUT
 
-      - name: Prepare release assets
+      - name: Create/Update DankMaterialShell Release
+        uses: softprops/action-gh-release@v2
+        with:
+          tag_name: ${{ env.TAG }}
+          name: Release ${{ env.TAG }}
+          body: ${{ steps.changelog.outputs.changelog }}
+          draft: false
+          prerelease: ${{ contains(env.TAG, '-') }}
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+
+      - name: Download and prepare release assets
+        env:
+          GH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
         run: |
           set -euxo pipefail
 
           mkdir -p _release_assets
 
-          # Copy core binaries and rename dms-*.gz to dms-cli-*.gz
-          for file in _core_assets/dms-*.gz*; do
+          # Download DMS CLI binaries from the danklinux repo
+          gh release download "${TAG}" -R "${DMS_REPO}" --dir ./_dms_assets
+
+          # Rename CLI binaries to dms-cli-* format and copy distropkg binaries
+          for file in _dms_assets/dms-*.gz*; do
             if [ -f "$file" ]; then
               basename=$(basename "$file")
               if [[ "$basename" == dms-distropkg-* ]]; then
@@ -263,21 +123,13 @@ jobs:
             fi
           done
 
-          # Copy dankinstall binaries
-          cp _core_assets/dankinstall-*.gz* _release_assets/
-
-          # Copy completions
-          cp _core_assets/completion.* _release_assets/ 2>/dev/null || true
-
-          # Create QML source package (exclude build artifacts and git files)
-          # Copy root LICENSE and CONTRIBUTING.md to quickshell/ for packaging
-          cp LICENSE CONTRIBUTING.md quickshell/
-
-          # Tar the CONTENTS of quickshell/, not the directory itself
-          (cd quickshell && tar --exclude='.git' \
+          # Create QML source package (exclude .git, .github, build artifacts)
+          tar --exclude='.git' \
               --exclude='.github' \
+              --exclude='_dms_assets' \
+              --exclude='_release_assets' \
               --exclude='*.tar.gz' \
-              -czf ../_release_assets/dms-qml.tar.gz .)
+              -czf _release_assets/dms-qml.tar.gz .
 
           # Generate checksum for QML package
           (cd _release_assets && sha256sum dms-qml.tar.gz > dms-qml.tar.gz.sha256)
@@ -286,36 +138,24 @@ jobs:
           for arch in amd64 arm64; do
             mkdir -p _temp_full/dms
             mkdir -p _temp_full/bin
-            mkdir -p _temp_full/completions
 
-            # Extract QML source
+            # Extract QML source to temp directory
             tar -xzf _release_assets/dms-qml.tar.gz -C _temp_full/dms
 
-            # Add CLI binaries
-            if [ -f "_core_assets/dms-${arch}.gz" ]; then
-              gunzip -c "_core_assets/dms-${arch}.gz" > _temp_full/bin/dms
+            # Copy CLI binary if it exists
+            if [ -f "_dms_assets/dms-${arch}.gz" ]; then
+              gunzip -c "_dms_assets/dms-${arch}.gz" > _temp_full/bin/dms
               chmod +x _temp_full/bin/dms
             fi
 
-            if [ -f "_core_assets/dms-distropkg-${arch}.gz" ]; then
-              gunzip -c "_core_assets/dms-distropkg-${arch}.gz" > _temp_full/bin/dms-distropkg
+            # Copy distropkg binary if it exists
+            if [ -f "_dms_assets/dms-distropkg-${arch}.gz" ]; then
+              gunzip -c "_dms_assets/dms-distropkg-${arch}.gz" > _temp_full/bin/dms-distropkg
               chmod +x _temp_full/bin/dms-distropkg
             fi
 
-            # Add shell completions
-            for completion in _core_assets/completion.*; do
-              if [ -f "$completion" ]; then
-                cp "$completion" _temp_full/completions/
-              fi
-            done
-
-            # Copy docs directory
-            if [ -d "docs" ]; then
-              cp -r docs _temp_full/
-            fi
-
-            # Create installation guide
-            cat > _temp_full/INSTALL.md << 'EOFINSTALL'
+            # Create INSTALL.md
+            cat > _temp_full/INSTALL.md << 'EOF'
           # DankMaterialShell Installation
 
           ## Requirements
@@ -335,23 +175,16 @@ jobs:
           2. **Install the DMS CLI binaries:**
              ```bash
              sudo install -m 755 bin/dms /usr/local/bin/dms
+             # or install to a local directory:
+             mkdir -p ~/.local/bin
+             install -m 755 bin/dms ~/.local/bin/dms
              ```
 
-          3. **Install shell completions (optional):**
-             ```bash
-             # Bash
-             sudo install -m 644 completions/completion.bash /usr/share/bash-completion/completions/dms
-
-             # Fish
-             sudo install -m 644 completions/completion.fish /usr/share/fish/vendor_completions.d/dms.fish
-
-             # Zsh
-             sudo install -m 644 completions/completion.zsh /usr/share/zsh/site-functions/_dms
-             ```
-
-          4. **Start the shell:**
+          3. **Start the shell:**
              ```bash
              dms run
+             # or directly with quickshell (will lack some dbus integrations & plugin management):
+             quickshell -p ~/.config/quickshell/dms
              ```
 
           ## Configuration
@@ -362,9 +195,10 @@ jobs:
 
           ## Troubleshooting
 
-          - Run with verbose output: `DMS_LOG_LEVEL=debug dms run`
+          - Run with verbose output: `quickshell -v -p ~/.config/quickshell/dms`
+          - Check logs in `~/.local/state/DankMaterialShell/`
           - Ensure all dependencies are installed
-          EOFINSTALL
+          EOF
 
             # Create the full package
             (cd _temp_full && tar -czf "../_release_assets/dms-full-${arch}.tar.gz" .)
@@ -376,324 +210,10 @@ jobs:
             rm -rf _temp_full
           done
 
-      - name: Create GitHub Release
+      - name: Attach all assets to release
         uses: softprops/action-gh-release@v2
         with:
           tag_name: ${{ env.TAG }}
-          name: Release ${{ env.TAG }}
-          body: ${{ steps.changelog.outputs.changelog }}
           files: _release_assets/**
-          draft: false
-          prerelease: ${{ contains(env.TAG, '-') }}
         env:
-          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
-
-  trigger-obs-update:
-    runs-on: ubuntu-latest
-    needs: release
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-      
-      - name: Install OSC
-        run: |
-          sudo apt-get update
-          sudo apt-get install -y osc
-          
-          mkdir -p ~/.config/osc
-          cat > ~/.config/osc/oscrc << EOF
-          [general]
-          apiurl = https://api.opensuse.org
-          
-          [https://api.opensuse.org]
-          user = ${{ secrets.OBS_USERNAME }}
-          pass = ${{ secrets.OBS_PASSWORD }}
-          EOF
-          chmod 600 ~/.config/osc/oscrc
-      
-      - name: Update OBS packages
-        run: |
-          VERSION="${{ github.ref_name }}"
-          cd distro
-          bash scripts/obs-upload.sh dms "Update to $VERSION"
-
-  trigger-ppa-update:
-    runs-on: ubuntu-latest
-    needs: release
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-      
-      - name: Install build dependencies
-        run: |
-          sudo apt-get update
-          sudo apt-get install -y \
-            debhelper \
-            devscripts \
-            dput \
-            lftp \
-            build-essential \
-            fakeroot \
-            dpkg-dev
-      
-      - name: Configure GPG
-        env:
-          GPG_KEY: ${{ secrets.GPG_PRIVATE_KEY }}
-        run: |
-          echo "$GPG_KEY" | gpg --import
-          GPG_KEY_ID=$(gpg --list-secret-keys --keyid-format LONG | grep sec | awk '{print $2}' | cut -d'/' -f2)
-          echo "DEBSIGN_KEYID=$GPG_KEY_ID" >> $GITHUB_ENV
-      
-      - name: Upload to PPA
-        run: |
-          VERSION="${{ github.ref_name }}"
-          cd distro/ubuntu/ppa
-          bash create-and-upload.sh ../dms dms questing
-
-  copr-build:
-    runs-on: ubuntu-latest
-    needs: release
-    env:
-      TAG: ${{ github.ref_name }}
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@v4
-
-      - name: Determine version
-        id: version
-        run: |
-          VERSION="${TAG#v}"
-          echo "version=$VERSION" >> $GITHUB_OUTPUT
-          echo "Building DMS stable version: $VERSION"
-
-      - name: Setup build environment
-        run: |
-          sudo apt-get update
-          sudo apt-get install -y rpm wget curl jq gzip
-          mkdir -p ~/rpmbuild/{BUILD,BUILDROOT,RPMS,SOURCES,SPECS,SRPMS}
-
-      - name: Download release assets
-        run: |
-          VERSION="${{ steps.version.outputs.version }}"
-          cd ~/rpmbuild/SOURCES
-
-          wget "https://github.com/AvengeMedia/DankMaterialShell/releases/download/v${VERSION}/dms-qml.tar.gz" || {
-            echo "Failed to download dms-qml.tar.gz for v${VERSION}"
-            exit 1
-          }
-
-      - name: Generate stable spec file
-        run: |
-          VERSION="${{ steps.version.outputs.version }}"
-          CHANGELOG_DATE="$(date '+%a %b %d %Y')"
-
-          cat > ~/rpmbuild/SPECS/dms.spec <<'SPECEOF'
-          # Spec for DMS stable releases - Generated by GitHub Actions
-
-          %global debug_package %{nil}
-          %global version VERSION_PLACEHOLDER
-          %global pkg_summary DankMaterialShell - Material 3 inspired shell for Wayland compositors
-
-          Name:           dms
-          Version:        %{version}
-          Release:        1%{?dist}
-          Summary:        %{pkg_summary}
-
-          License:        MIT
-          URL:            https://github.com/AvengeMedia/DankMaterialShell
-
-          Source0:        dms-qml.tar.gz
-
-          BuildRequires:  gzip
-          BuildRequires:  wget
-          BuildRequires:  systemd-rpm-macros
-
-          Requires:       (quickshell or quickshell-git)
-          Requires:       accountsservice
-          Requires:       dms-cli
-          Requires:       dgop
-
-          Recommends:     cava
-          Recommends:     cliphist
-          Recommends:     danksearch
-          Recommends:     hyprpicker
-          Recommends:     matugen
-          Recommends:     wl-clipboard
-          Recommends:     NetworkManager
-          Recommends:     qt6-qtmultimedia
-          Suggests:       qt6ct
-
-          %description
-          DankMaterialShell (DMS) is a modern Wayland desktop shell built with Quickshell
-          and optimized for the niri and hyprland compositors. Features notifications,
-          app launcher, wallpaper customization, and fully customizable with plugins.
-
-          Includes auto-theming for GTK/Qt apps with matugen, 20+ customizable widgets,
-          process monitoring, notification center, clipboard history, dock, control center,
-          lock screen, and comprehensive plugin system.
-
-          %package -n dms-cli
-          Summary:        DankMaterialShell CLI tool
-          License:        MIT
-          URL:            https://github.com/AvengeMedia/DankMaterialShell
-
-          %description -n dms-cli
-          Command-line interface for DankMaterialShell configuration and management.
-          Provides native DBus bindings, NetworkManager integration, and system utilities.
-
-          %package -n dgop
-          Summary:        Stateless CPU/GPU monitor for DankMaterialShell
-          License:        MIT
-          URL:            https://github.com/AvengeMedia/dgop
-          Provides:       dgop
-
-          %description -n dgop
-          DGOP is a stateless system monitoring tool that provides CPU, GPU, memory, and
-          network statistics. Designed for integration with DankMaterialShell but can be
-          used standalone. This package always includes the latest stable dgop release.
-
-          %prep
-          %setup -q -c -n dms-qml
-
-          # Download architecture-specific binaries during build
-          case "%{_arch}" in
-            x86_64)
-              ARCH_SUFFIX="amd64"
-              ;;
-            aarch64)
-              ARCH_SUFFIX="arm64"
-              ;;
-            *)
-              echo "Unsupported architecture: %{_arch}"
-              exit 1
-              ;;
-          esac
-
-          wget -O %{_builddir}/dms-cli.gz "https://github.com/AvengeMedia/DankMaterialShell/releases/latest/download/dms-distropkg-${ARCH_SUFFIX}.gz" || {
-            echo "Failed to download dms-cli for architecture %{_arch}"
-            exit 1
-          }
-          gunzip -c %{_builddir}/dms-cli.gz > %{_builddir}/dms-cli
-          chmod +x %{_builddir}/dms-cli
-
-          wget -O %{_builddir}/dgop.gz "https://github.com/AvengeMedia/dgop/releases/latest/download/dgop-linux-${ARCH_SUFFIX}.gz" || {
-            echo "Failed to download dgop for architecture %{_arch}"
-            exit 1
-          }
-          gunzip -c %{_builddir}/dgop.gz > %{_builddir}/dgop
-          chmod +x %{_builddir}/dgop
-
-          %build
-
-          %install
-          install -Dm755 %{_builddir}/dms-cli %{buildroot}%{_bindir}/dms
-          install -Dm755 %{_builddir}/dgop %{buildroot}%{_bindir}/dgop
-
-          install -d %{buildroot}%{_datadir}/bash-completion/completions
-          install -d %{buildroot}%{_datadir}/zsh/site-functions
-          install -d %{buildroot}%{_datadir}/fish/vendor_completions.d
-          %{_builddir}/dms-cli completion bash > %{buildroot}%{_datadir}/bash-completion/completions/dms || :
-          %{_builddir}/dms-cli completion zsh > %{buildroot}%{_datadir}/zsh/site-functions/_dms || :
-          %{_builddir}/dms-cli completion fish > %{buildroot}%{_datadir}/fish/vendor_completions.d/dms.fish || :
-
-          install -Dm644 assets/systemd/dms.service %{buildroot}%{_userunitdir}/dms.service
-
-          install -Dm644 assets/dms-open.desktop %{buildroot}%{_datadir}/applications/dms-open.desktop
-          install -Dm644 assets/danklogo.svg %{buildroot}%{_datadir}/icons/hicolor/scalable/apps/danklogo.svg
-
-          install -dm755 %{buildroot}%{_datadir}/quickshell/dms
-          cp -r %{_builddir}/dms-qml/* %{buildroot}%{_datadir}/quickshell/dms/
-
-          rm -rf %{buildroot}%{_datadir}/quickshell/dms/.git*
-          rm -f %{buildroot}%{_datadir}/quickshell/dms/.gitignore
-          rm -rf %{buildroot}%{_datadir}/quickshell/dms/.github
-          rm -rf %{buildroot}%{_datadir}/quickshell/dms/distro
-
-          %posttrans
-          if [ -d "%{_sysconfdir}/xdg/quickshell/dms" ]; then
-              rmdir "%{_sysconfdir}/xdg/quickshell/dms" 2>/dev/null || true
-              rmdir "%{_sysconfdir}/xdg/quickshell" 2>/dev/null || true
-              rmdir "%{_sysconfdir}/xdg" 2>/dev/null || true
-          fi
-
-          if [ "$1" -ge 2 ]; then
-            pkill -USR1 -x dms >/dev/null 2>&1 || true
-          fi
-
-          %files
-          %license LICENSE
-          %doc README.md CONTRIBUTING.md
-          %{_datadir}/quickshell/dms/
-          %{_userunitdir}/dms.service
-          %{_datadir}/applications/dms-open.desktop
-          %{_datadir}/icons/hicolor/scalable/apps/danklogo.svg
-
-          %files -n dms-cli
-          %{_bindir}/dms
-          %{_datadir}/bash-completion/completions/dms
-          %{_datadir}/zsh/site-functions/_dms
-          %{_datadir}/fish/vendor_completions.d/dms.fish
-
-          %files -n dgop
-          %{_bindir}/dgop
-
-          %changelog
-          * CHANGELOG_DATE_PLACEHOLDER AvengeMedia <contact@avengemedia.com> - VERSION_PLACEHOLDER-1
-          - Stable release VERSION_PLACEHOLDER
-          - Built from GitHub release
-          - Includes latest dms-cli and dgop binaries
-          SPECEOF
-
-          sed -i "s/VERSION_PLACEHOLDER/${VERSION}/g" ~/rpmbuild/SPECS/dms.spec
-          sed -i "s/CHANGELOG_DATE_PLACEHOLDER/${CHANGELOG_DATE}/g" ~/rpmbuild/SPECS/dms.spec
-
-      - name: Build SRPM
-        id: build
-        run: |
-          cd ~/rpmbuild/SPECS
-          rpmbuild -bs dms.spec
-
-          SRPM=$(ls ~/rpmbuild/SRPMS/*.src.rpm | tail -n 1)
-          SRPM_NAME=$(basename "$SRPM")
-
-          echo "srpm_path=$SRPM" >> $GITHUB_OUTPUT
-          echo "srpm_name=$SRPM_NAME" >> $GITHUB_OUTPUT
-          echo "SRPM built: $SRPM_NAME"
-
-      - name: Upload SRPM artifact
-        uses: actions/upload-artifact@v4
-        with:
-          name: dms-stable-srpm-${{ steps.version.outputs.version }}
-          path: ${{ steps.build.outputs.srpm_path }}
-          retention-days: 90
-
-      - name: Install Copr CLI
-        run: |
-          sudo apt-get install -y python3-pip
-          pip3 install copr-cli
-
-          mkdir -p ~/.config
-          cat > ~/.config/copr << EOF
-          [copr-cli]
-          login = ${{ secrets.COPR_LOGIN }}
-          username = avengemedia
-          token = ${{ secrets.COPR_TOKEN }}
-          copr_url = https://copr.fedorainfracloud.org
-          EOF
-          chmod 600 ~/.config/copr
-
-      - name: Upload to Copr
-        run: |
-          SRPM="${{ steps.build.outputs.srpm_path }}"
-          VERSION="${{ steps.version.outputs.version }}"
-
-          echo "Uploading SRPM to avengemedia/dms..."
-          BUILD_OUTPUT=$(copr-cli build avengemedia/dms "$SRPM" --nowait 2>&1)
-          echo "$BUILD_OUTPUT"
-
-          BUILD_ID=$(echo "$BUILD_OUTPUT" | grep -oP 'Build was added to.*\K[0-9]+' || echo "unknown")
-
-          if [ "$BUILD_ID" != "unknown" ]; then
-            echo "Build submitted: https://copr.fedorainfracloud.org/coprs/avengemedia/dms/build/$BUILD_ID/"
-          fi
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.github/workflows/run-obs.yml

@@ -1,288 +0,0 @@
-name: Update OBS Packages
-
-on:
-  workflow_dispatch:
-    inputs:
-      package:
-        description: 'Package to update (dms, dms-git, or all)'
-        required: false
-        default: 'all'
-      rebuild_release:
-        description: 'Release number for rebuilds (e.g., 2, 3, 4 to increment spec Release)'
-        required: false
-        default: ''
-  push:
-    tags:
-      - 'v*'
-  schedule:
-    - cron: '0 */3 * * *'  # Every 3 hours for dms-git builds
-
-jobs:
-  check-updates:
-    name: Check for updates
-    runs-on: ubuntu-latest
-    
-    outputs:
-      has_updates: ${{ steps.check.outputs.has_updates }}
-      packages: ${{ steps.check.outputs.packages }}
-      version: ${{ steps.check.outputs.version }}
-    
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-      
-      - name: Install OSC
-        run: |
-          sudo apt-get update
-          sudo apt-get install -y osc
-          
-          mkdir -p ~/.config/osc
-          cat > ~/.config/osc/oscrc << EOF
-          [general]
-          apiurl = https://api.opensuse.org
-          
-          [https://api.opensuse.org]
-          user = ${{ secrets.OBS_USERNAME }}
-          pass = ${{ secrets.OBS_PASSWORD }}
-          EOF
-          chmod 600 ~/.config/osc/oscrc
-      
-      - name: Check for updates
-        id: check
-        run: |
-          if [[ "${{ github.event_name }}" == "push" && "${{ github.ref }}" =~ ^refs/tags/ ]]; then
-            echo "packages=dms" >> $GITHUB_OUTPUT
-            VERSION="${GITHUB_REF#refs/tags/}"
-            echo "version=$VERSION" >> $GITHUB_OUTPUT
-            echo "has_updates=true" >> $GITHUB_OUTPUT
-            echo "Triggered by tag: $VERSION (always update)"
-          elif [[ "${{ github.event_name }}" == "schedule" ]]; then
-            echo "packages=dms-git" >> $GITHUB_OUTPUT
-            echo "Checking if dms-git source has changed..."
-            
-            # Get latest commit hash from master branch
-            LATEST_COMMIT=$(git rev-parse origin/master 2>/dev/null || git rev-parse master 2>/dev/null || echo "")
-            
-            if [[ -z "$LATEST_COMMIT" ]]; then
-              echo "has_updates=true" >> $GITHUB_OUTPUT
-              echo "Could not determine git commit, proceeding with update"
-            else
-              # Check OBS for last uploaded commit
-              OBS_BASE="$HOME/.cache/osc-checkouts"
-              mkdir -p "$OBS_BASE"
-              OBS_PROJECT="home:AvengeMedia:dms-git"
-              
-              if [[ -d "$OBS_BASE/$OBS_PROJECT/dms-git" ]]; then
-                cd "$OBS_BASE/$OBS_PROJECT/dms-git"
-                osc up -q 2>/dev/null || true
-                
-                # Check tarball age - if older than 3 hours, update needed
-                if [[ -f "dms-git-source.tar.gz" ]]; then
-                  TARBALL_MTIME=$(stat -c%Y "dms-git-source.tar.gz" 2>/dev/null || echo "0")
-                  CURRENT_TIME=$(date +%s)
-                  AGE_SECONDS=$((CURRENT_TIME - TARBALL_MTIME))
-                  AGE_HOURS=$((AGE_SECONDS / 3600))
-                  
-                  # If tarball is older than 3 hours, check for new commits
-                  if [[ $AGE_HOURS -ge 3 ]]; then
-                    # Check if there are new commits in the last 3 hours
-                    cd "${{ github.workspace }}"
-                    NEW_COMMITS=$(git log --since="3 hours ago" --oneline origin/master 2>/dev/null | wc -l)
-                    
-                    if [[ $NEW_COMMITS -gt 0 ]]; then
-                      echo "has_updates=true" >> $GITHUB_OUTPUT
-                      echo "📋 New commits detected in last 3 hours, update needed"
-                    else
-                      echo "has_updates=false" >> $GITHUB_OUTPUT
-                      echo "📋 No new commits in last 3 hours, skipping update"
-                    fi
-                  else
-                    echo "has_updates=false" >> $GITHUB_OUTPUT
-                    echo "📋 Recent upload exists (< 3 hours), skipping update"
-                  fi
-                else
-                  echo "has_updates=true" >> $GITHUB_OUTPUT
-                  echo "📋 No existing tarball in OBS, update needed"
-                fi
-                cd "${{ github.workspace }}"
-              else
-                echo "has_updates=true" >> $GITHUB_OUTPUT
-                echo "📋 First upload to OBS, update needed"
-              fi
-            fi
-          elif [[ -n "${{ github.event.inputs.package }}" ]]; then
-            echo "packages=${{ github.event.inputs.package }}" >> $GITHUB_OUTPUT
-            echo "has_updates=true" >> $GITHUB_OUTPUT
-            echo "Manual trigger: ${{ github.event.inputs.package }}"
-          else
-            echo "packages=all" >> $GITHUB_OUTPUT
-            echo "has_updates=true" >> $GITHUB_OUTPUT
-          fi
-
-  update-obs:
-    name: Upload to OBS
-    needs: check-updates
-    runs-on: ubuntu-latest
-    if: |
-      github.event_name == 'workflow_dispatch' ||
-      needs.check-updates.outputs.has_updates == 'true'
-    
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-      
-      - name: Determine packages to update
-        id: packages
-        run: |
-          if [[ "${{ github.event_name }}" == "push" && "${{ github.ref }}" =~ ^refs/tags/ ]]; then
-            echo "packages=dms" >> $GITHUB_OUTPUT
-            VERSION="${GITHUB_REF#refs/tags/}"
-            echo "version=$VERSION" >> $GITHUB_OUTPUT
-            echo "Triggered by tag: $VERSION"
-          elif [[ "${{ github.event_name }}" == "schedule" ]]; then
-            echo "packages=${{ needs.check-updates.outputs.packages }}" >> $GITHUB_OUTPUT
-            echo "Triggered by schedule: updating git package"
-          elif [[ -n "${{ github.event.inputs.package }}" ]]; then
-            echo "packages=${{ github.event.inputs.package }}" >> $GITHUB_OUTPUT
-            echo "Manual trigger: ${{ github.event.inputs.package }}"
-          else
-            echo "packages=${{ needs.check-updates.outputs.packages }}" >> $GITHUB_OUTPUT
-          fi
-      
-      - name: Update dms-git spec version
-        if: contains(steps.packages.outputs.packages, 'dms-git') || steps.packages.outputs.packages == 'all'
-        run: |
-          # Get commit info for dms-git versioning
-          COMMIT_HASH=$(git rev-parse --short=8 HEAD)
-          COMMIT_COUNT=$(git rev-list --count HEAD)
-          BASE_VERSION=$(grep -oP '^Version:\s+\K[0-9.]+' distro/opensuse/dms.spec | head -1 || echo "0.6.2")
-          
-          NEW_VERSION="${BASE_VERSION}+git${COMMIT_COUNT}.${COMMIT_HASH}"
-          echo "📦 Updating dms-git.spec to version: $NEW_VERSION"
-          
-          # Update version in spec
-          sed -i "s/^Version:.*/Version:        $NEW_VERSION/" distro/opensuse/dms-git.spec
-          
-          # Add changelog entry
-          DATE_STR=$(date "+%a %b %d %Y")
-          CHANGELOG_ENTRY="* $DATE_STR Avenge Media <AvengeMedia.US@gmail.com> - ${NEW_VERSION}-1\n- Git snapshot (commit $COMMIT_COUNT: $COMMIT_HASH)"
-          sed -i "/%changelog/a\\$CHANGELOG_ENTRY" distro/opensuse/dms-git.spec
-
-      - name: Update Debian dms-git changelog version
-        if: contains(steps.packages.outputs.packages, 'dms-git') || steps.packages.outputs.packages == 'all'
-        run: |
-          # Get commit info for dms-git versioning 
-          COMMIT_HASH=$(git rev-parse --short=8 HEAD)
-          COMMIT_COUNT=$(git rev-list --count HEAD)
-          BASE_VERSION=$(grep -oP '^Version:\s+\K[0-9.]+' distro/opensuse/dms.spec | head -1 || echo "0.6.2")
-
-          # Debian version format: 0.6.2+git2256.9162e314 
-          NEW_VERSION="${BASE_VERSION}+git${COMMIT_COUNT}.${COMMIT_HASH}"
-          echo "📦 Updating Debian dms-git changelog to version: $NEW_VERSION"
-
-          CHANGELOG_DATE=$(date -R)
-
-          CHANGELOG_FILE="distro/debian/dms-git/debian/changelog"
-
-          # Get current version from changelog
-          CURRENT_VERSION=$(head -1 "$CHANGELOG_FILE" | sed 's/.*(\([^)]*\)).*/\1/')
-
-          echo "Current Debian version: $CURRENT_VERSION"
-          echo "New version: $NEW_VERSION"
-
-          # Only update if version changed 
-          if [ "$CURRENT_VERSION" != "$NEW_VERSION" ]; then
-            # Create new changelog entry at top
-            TEMP_CHANGELOG=$(mktemp)
-
-            cat > "$TEMP_CHANGELOG" << EOF
-          dms-git ($NEW_VERSION) nightly; urgency=medium
-
-            * Git snapshot (commit $COMMIT_COUNT: $COMMIT_HASH)
-
-           -- Avenge Media <AvengeMedia.US@gmail.com>  $CHANGELOG_DATE
-
-          EOF
-
-            # Prepend to existing changelog
-            cat "$CHANGELOG_FILE" >> "$TEMP_CHANGELOG"
-            mv "$TEMP_CHANGELOG" "$CHANGELOG_FILE"
-
-            echo "✓ Updated Debian changelog: $CURRENT_VERSION → $NEW_VERSION"
-          else
-            echo "✓ Debian changelog already at version $NEW_VERSION"
-          fi
-
-      - name: Update dms stable version
-        if: steps.packages.outputs.version != ''
-        run: |
-          VERSION="${{ steps.packages.outputs.version }}"
-          VERSION_NO_V="${VERSION#v}"
-          echo "Updating packaging to version $VERSION_NO_V"
-          
-          # Update openSUSE dms spec (stable only)
-          sed -i "s/^Version:.*/Version:        $VERSION_NO_V/" distro/opensuse/dms.spec
-          
-          # Update Debian _service files
-          for service in distro/debian/*/_service; do
-            if [[ -f "$service" ]]; then
-              sed -i "s|<param name=\"revision\">v[0-9.]*</param>|<param name=\"revision\">$VERSION</param>|" "$service"
-            fi
-          done
-
-      - name: Install Go
-        uses: actions/setup-go@v5
-        with:
-          go-version: '1.24'
-
-      - name: Install OSC
-        run: |
-          sudo apt-get update
-          sudo apt-get install -y osc
-
-          mkdir -p ~/.config/osc
-          cat > ~/.config/osc/oscrc << EOF
-          [general]
-          apiurl = https://api.opensuse.org
-
-          [https://api.opensuse.org]
-          user = ${{ secrets.OBS_USERNAME }}
-          pass = ${{ secrets.OBS_PASSWORD }}
-          EOF
-          chmod 600 ~/.config/osc/oscrc
-
-      - name: Upload to OBS
-        env:
-          FORCE_REBUILD: ${{ github.event_name == 'workflow_dispatch' && 'true' || '' }}
-          REBUILD_RELEASE: ${{ github.event.inputs.rebuild_release }}
-        run: |
-          PACKAGES="${{ steps.packages.outputs.packages }}"
-          MESSAGE="Automated update from GitHub Actions"
-          
-          if [[ -n "${{ steps.packages.outputs.version }}" ]]; then
-            MESSAGE="Update to ${{ steps.packages.outputs.version }}"
-          fi
-          
-          if [[ "$PACKAGES" == "all" ]]; then
-            bash distro/scripts/obs-upload.sh dms "$MESSAGE"
-            bash distro/scripts/obs-upload.sh dms-git "Automated git update"
-          else
-            bash distro/scripts/obs-upload.sh "$PACKAGES" "$MESSAGE"
-          fi
-      
-      - name: Summary
-        run: |
-          echo "### OBS Package Update Complete" >> $GITHUB_STEP_SUMMARY
-          echo "" >> $GITHUB_STEP_SUMMARY
-          echo "- **Packages**: ${{ steps.packages.outputs.packages }}" >> $GITHUB_STEP_SUMMARY
-          if [[ -n "${{ steps.packages.outputs.version }}" ]]; then
-            echo "- **Version**: ${{ steps.packages.outputs.version }}" >> $GITHUB_STEP_SUMMARY
-          fi
-          if [[ "${{ needs.check-updates.outputs.has_updates }}" == "false" ]]; then
-            echo "- **Status**: Skipped (no changes detected)" >> $GITHUB_STEP_SUMMARY
-          fi
-          echo "- **Project**: https://build.opensuse.org/project/show/home:AvengeMedia" >> $GITHUB_STEP_SUMMARY

.github/workflows/run-ppa.yml

@@ -1,123 +0,0 @@
-name: Update PPA Packages
-
-on:
-  workflow_dispatch:
-    inputs:
-      package:
-        description: 'Package to upload (dms, dms-git, dms-greeter, or all)'
-        required: false
-        default: 'dms-git'
-      rebuild_release:
-        description: 'Release number for rebuilds (e.g., 2, 3, 4 for ppa2, ppa3, ppa4)'
-        required: false
-        default: ''
-  schedule:
-    - cron: '0 */3 * * *'  # Every 3 hours for dms-git builds
-
-jobs:
-  upload-ppa:
-    runs-on: ubuntu-latest
-    
-    steps:
-      - name: Checkout
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-      
-      - name: Set up Go
-        uses: actions/setup-go@v5
-        with:
-          go-version: '1.24'
-          cache: false  
-
-      - name: Install build dependencies
-        run: |
-          sudo apt-get update
-          sudo apt-get install -y \
-            debhelper \
-            devscripts \
-            dput \
-            lftp \
-            build-essential \
-            fakeroot \
-            dpkg-dev
-      
-      - name: Configure GPG
-        env:
-          GPG_KEY: ${{ secrets.GPG_PRIVATE_KEY }}
-        run: |
-          echo "$GPG_KEY" | gpg --import
-          GPG_KEY_ID=$(gpg --list-secret-keys --keyid-format LONG | grep sec | awk '{print $2}' | cut -d'/' -f2)
-          echo "DEBSIGN_KEYID=$GPG_KEY_ID" >> $GITHUB_ENV
-      
-      - name: Determine packages to upload
-        id: packages
-        run: |
-          if [[ "${{ github.event_name }}" == "schedule" ]]; then
-            echo "packages=dms-git" >> $GITHUB_OUTPUT
-            echo "Triggered by schedule: uploading git package"
-          elif [[ -n "${{ github.event.inputs.package }}" ]]; then
-            echo "packages=${{ github.event.inputs.package }}" >> $GITHUB_OUTPUT
-            echo "Manual trigger: ${{ github.event.inputs.package }}"
-          else
-            echo "packages=dms-git" >> $GITHUB_OUTPUT
-          fi
-      
-      - name: Upload to PPA
-        env:
-          REBUILD_RELEASE: ${{ github.event.inputs.rebuild_release }}
-        run: |
-          PACKAGES="${{ steps.packages.outputs.packages }}"
-          
-          if [[ "$PACKAGES" == "all" ]]; then
-            echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"
-            echo "Uploading dms to PPA..."
-            if [ -n "$REBUILD_RELEASE" ]; then
-              echo "🔄 Using rebuild release number: ppa$REBUILD_RELEASE"
-            fi
-            echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"
-            bash distro/scripts/ppa-upload.sh "distro/ubuntu/dms" dms questing
-            
-            echo ""
-            echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"
-            echo "Uploading dms-git to PPA..."
-            echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"
-            bash distro/scripts/ppa-upload.sh "distro/ubuntu/dms-git" dms-git questing
-            
-            echo ""
-            echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"
-            echo "Uploading dms-greeter to PPA..."
-            echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"
-            bash distro/scripts/ppa-upload.sh "distro/ubuntu/dms-greeter" danklinux questing
-          else
-            PPA_NAME="$PACKAGES"
-            echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"
-            echo "Uploading $PACKAGES to PPA..."
-            echo "━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━"
-            bash distro/scripts/ppa-upload.sh "distro/ubuntu/$PACKAGES" "$PPA_NAME" questing
-          fi
-      
-      - name: Summary
-        run: |
-          echo "### PPA Package Upload Complete" >> $GITHUB_STEP_SUMMARY
-          echo "" >> $GITHUB_STEP_SUMMARY
-          echo "- **Packages**: ${{ steps.packages.outputs.packages }}" >> $GITHUB_STEP_SUMMARY
-          
-          PACKAGES="${{ steps.packages.outputs.packages }}"
-          if [[ "$PACKAGES" == "all" ]]; then
-            echo "- **PPA dms**: https://launchpad.net/~avengemedia/+archive/ubuntu/dms/+packages" >> $GITHUB_STEP_SUMMARY
-            echo "- **PPA dms-git**: https://launchpad.net/~avengemedia/+archive/ubuntu/dms-git/+packages" >> $GITHUB_STEP_SUMMARY
-            echo "- **PPA danklinux**: https://launchpad.net/~avengemedia/+archive/ubuntu/danklinux/+packages" >> $GITHUB_STEP_SUMMARY
-          elif [[ "$PACKAGES" == "dms" ]]; then
-            echo "- **PPA**: https://launchpad.net/~avengemedia/+archive/ubuntu/dms/+packages" >> $GITHUB_STEP_SUMMARY
-          elif [[ "$PACKAGES" == "dms-git" ]]; then
-            echo "- **PPA**: https://launchpad.net/~avengemedia/+archive/ubuntu/dms-git/+packages" >> $GITHUB_STEP_SUMMARY
-          elif [[ "$PACKAGES" == "dms-greeter" ]]; then
-            echo "- **PPA**: https://launchpad.net/~avengemedia/+archive/ubuntu/danklinux/+packages" >> $GITHUB_STEP_SUMMARY
-          fi
-          
-          if [[ -n "${{ steps.packages.outputs.version }}" ]]; then
-            echo "- **Version**: ${{ steps.packages.outputs.version }}" >> $GITHUB_STEP_SUMMARY
-          fi
-          echo "" >> $GITHUB_STEP_SUMMARY
-          echo "Builds will appear once Launchpad processes the uploads." >> $GITHUB_STEP_SUMMARY

.github/workflows/update-vendor-hash.yml

@@ -1,66 +0,0 @@
-name: Update Vendor Hash
-
-on:
-  workflow_dispatch:
-  push:
-    paths:
-      - "core/go.mod"
-      - "core/go.sum"
-    branches:
-      - master
-
-permissions:
-  contents: write
-
-jobs:
-  update-vendor-hash:
-    runs-on: ubuntu-latest
-    steps:
-      - name: Create GitHub App token
-        id: app_token
-        uses: actions/create-github-app-token@v1
-        with:
-          app-id: ${{ secrets.APP_ID }}
-          private-key: ${{ secrets.APP_PRIVATE_KEY }}
-
-      - name: Checkout
-        uses: actions/checkout@v4
-        with:
-          fetch-depth: 0
-          token: ${{ steps.app_token.outputs.token }}
-
-      - name: Install Nix
-        uses: cachix/install-nix-action@v31
-
-      - name: Update vendorHash in flake.nix
-        run: |
-          set -euo pipefail
-          echo "Attempting nix build to get new vendorHash..."
-          if output=$(nix build .#dmsCli 2>&1); then
-            echo "Build succeeded, no hash update needed"
-            exit 0
-          fi
-          new_hash=$(echo "$output" | grep -oP "got:\s+\K\S+" | head -n1)
-          [ -n "$new_hash" ] || { echo "Could not extract new vendorHash"; echo "$output"; exit 1; }
-          current_hash=$(grep -oP 'vendorHash = "\K[^"]+' flake.nix)
-          [ "$current_hash" = "$new_hash" ] && { echo "vendorHash already up to date"; exit 0; }
-          sed -i "s|vendorHash = \"$current_hash\"|vendorHash = \"$new_hash\"|" flake.nix
-          echo "Verifying build with new vendorHash..."
-          nix build .#dmsCli
-          echo "vendorHash updated successfully!"
-
-      - name: Commit and push vendorHash update
-        env:
-          GH_TOKEN: ${{ steps.app_token.outputs.token }}
-        run: |
-          set -euo pipefail
-          if ! git diff --quiet flake.nix; then
-            git config user.name "dms-ci[bot]"
-            git config user.email "dms-ci[bot]@users.noreply.github.com"
-            git add flake.nix
-            git commit -m "nix: update vendorHash for go.mod changes" || exit 0
-            git pull --rebase origin master
-            git push https://x-access-token:${GH_TOKEN}@github.com/${{ github.repository }}.git HEAD:master
-          else
-            echo "No changes to flake.nix"
-          fi

.gitignore

@@ -27,6 +27,7 @@ qrc_*.cpp
 ui_*.h
 *.qmlc
 *.jsc
+Makefile*
 *build-*
 *.qm
 *.prl
@@ -100,45 +101,4 @@ go.work.sum
 
 # Editor/IDE
 # .idea/
-# .vscode/
-
-# If you prefer the allow list template instead of the deny list, see community template:
-# https://github.com/github/gitignore/blob/main/community/Golang/Go.AllowList.gitignore
-#
-# Binaries for programs and plugins
-*.exe
-*.exe~
-*.dll
-*.so
-*.dylib
-
-# Test binary, built with `go test -c`
-*.test
-
-# Code coverage profiles and other test artifacts
-*.out
-coverage.*
-*.coverprofile
-profile.cov
-
-# Dependency directories (remove the comment below to include it)
-# vendor/
-
-# Go workspace file
-go.work
-go.work.sum
-
-# env file
-.env
-
-# Editor/IDE
-# .idea/
-# .vscode/
-
-bin/
-
-# Extracted source trees in Ubuntu package directories  
-distro/ubuntu/*/dms-git-repo/
-distro/ubuntu/*/DankMaterialShell-*/
-distro/ubuntu/danklinux/*/dsearch-*/
-distro/ubuntu/danklinux/*/dgop-*/
+# .vscode/

CLAUDE.md

@@ -191,9 +191,9 @@ shell.qml           # Main entry point (minimal orchestration)
 
    Singleton {
        id: root
-
+       
        property type value: defaultValue
-
+       
        function performAction() { /* implementation */ }
    }
    ```
@@ -251,23 +251,23 @@ shell.qml           # Main entry point (minimal orchestration)
    // For regular components
    Item {
        id: root
-
+       
        property type name: value
-
+       
        signal customSignal(type param)
-
+       
        onSignal: { /* handler */ }
-
+       
        Component { /* children */ }
    }
-
+   
    // For services (singletons)
    Singleton {
        id: root
-
+       
        property bool featureAvailable: false
        property type currentValue: defaultValue
-
+       
        function performAction(param) { /* implementation */ }
    }
    ```
@@ -305,7 +305,7 @@ shell.qml           # Main entry point (minimal orchestration)
    ```qml
    // In services - detect capabilities
    property bool brightnessAvailable: false
-
+   
    // In modules - adapt UI accordingly
    DankSlider {
        visible: DisplayService.brightnessAvailable
@@ -335,7 +335,7 @@ shell.qml           # Main entry point (minimal orchestration)
    console.log("Info message")           // General info
    console.warn("Warning message")       // Warnings
    console.error("Error message")        // Errors
-
+   
    // Include context in service operations
    onExited: (exitCode) => {
        if (exitCode !== 0) {

CONTRIBUTING.md

@@ -2,50 +2,28 @@
 
 Contributions are welcome and encouraged.
 
-To contribute fork this repository, make your changes, and open a pull request.
+## Formatting
 
-## Setup
+The preferred tool for formatting files is [qmlfmt](https://github.com/jesperhh/qmlfmt) (also available on aur as qmlfmt-git). It actually kinda sucks, but `qmlformat` doesn't work with null safe operators and ternarys and pragma statements and a bunch of other things that are supported.
 
-Enable pre-commit hooks to catch CI failures before pushing:
+We need some consistent style, so this at least gives the same formatter that Qt Creator uses.
 
-```bash
-git config core.hooksPath .githooks
-```
-
-## VSCode Setup
-
-This is a monorepo, the easiest thing to do is to open an editor in either `quickshell`, `core`, or both depending on which part of the project you are working on.
-
-### QML (`quickshell` directory)
-
-1. Install the [QML Extension](https://doc.qt.io/vscodeext/)
-2. Configure `ctrl+shift+p` -> user preferences (json) with qmlls path
+You can configure it to format on save in vscode by configuring the "custom local formatters" extension then adding this to settings json.
 
 ```json
-{
-  "qt-qml.doNotAskForQmllsDownload": true,
-  "qt-qml.qmlls.customExePath": "/usr/lib/qt6/bin/qmlls"
-}
+  "customLocalFormatters.formatters": [
+    {
+      "command": "sh -c \"qmlfmt -t 4 -i 4 -b 250 | sed 's/pragma ComponentBehavior$/pragma ComponentBehavior: Bound/g'\"",
+      "languages": ["qml"]
+    }
+  ],
+  "[qml]": {
+    "editor.defaultFormatter": "jkillian.custom-local-formatters",
+    "editor.formatOnSave": true
+  },
 ```
 
-3. Create empty `.qmlls.ini` file in `quickshell/` directory
-
-```bash
-cd quickshell
-touch .qmlls.ini
-```
-
-4. Restart dms to generate the `.qmlls.ini` file
-
-5. Make your changes, test, and open a pull request.
-
-### GO (`core` directory)
-
-1. Install the [Go Extension](https://code.visualstudio.com/docs/languages/go)
-2. Ensure code is formatted with `make fmt`
-3. Add appropriate test coverage and ensure tests pass with `make test`
-4. Run `go mod tidy`
-5. Open pull request
+Sometimes it just breaks code though. Like turning `"_\""` into `"_""`, so you may not want to do formatOnSave.
 
 ## Pull request
 

Common/CacheData.qml

@@ -0,0 +1,122 @@
+pragma Singleton
+
+pragma ComponentBehavior: Bound
+
+import QtCore
+import QtQuick
+import Quickshell
+import Quickshell.Io
+
+Singleton {
+    id: root
+
+    readonly property int cacheConfigVersion: 1
+
+    readonly property bool isGreeterMode: Quickshell.env("DMS_RUN_GREETER") === "1" || Quickshell.env("DMS_RUN_GREETER") === "true"
+
+    readonly property string _stateUrl: StandardPaths.writableLocation(StandardPaths.GenericCacheLocation)
+    readonly property string _stateDir: Paths.strip(_stateUrl)
+
+    property bool _loading: false
+
+    property string wallpaperLastPath: ""
+    property string profileLastPath: ""
+
+    Component.onCompleted: {
+        if (!isGreeterMode) {
+            loadCache()
+        }
+    }
+
+    function loadCache() {
+        _loading = true
+        parseCache(cacheFile.text())
+        _loading = false
+    }
+
+    function parseCache(content) {
+        _loading = true
+        try {
+            if (content && content.trim()) {
+                const cache = JSON.parse(content)
+
+                wallpaperLastPath = cache.wallpaperLastPath !== undefined ? cache.wallpaperLastPath : ""
+                profileLastPath = cache.profileLastPath !== undefined ? cache.profileLastPath : ""
+
+                if (cache.configVersion === undefined) {
+                    migrateFromUndefinedToV1(cache)
+                    cleanupUnusedKeys()
+                    saveCache()
+                }
+            }
+        } catch (e) {
+            console.warn("CacheData: Failed to parse cache:", e.message)
+        } finally {
+            _loading = false
+        }
+    }
+
+    function saveCache() {
+        if (_loading)
+            return
+        cacheFile.setText(JSON.stringify({
+                                             "wallpaperLastPath": wallpaperLastPath,
+                                             "profileLastPath": profileLastPath,
+                                             "configVersion": cacheConfigVersion
+                                         }, null, 2))
+    }
+
+    function migrateFromUndefinedToV1(cache) {
+        console.log("CacheData: Migrating configuration from undefined to version 1")
+    }
+
+    function cleanupUnusedKeys() {
+        const validKeys = [
+            "wallpaperLastPath",
+            "profileLastPath",
+            "configVersion"
+        ]
+
+        try {
+            const content = cacheFile.text()
+            if (!content || !content.trim()) return
+
+            const cache = JSON.parse(content)
+            let needsSave = false
+
+            for (const key in cache) {
+                if (!validKeys.includes(key)) {
+                    console.log("CacheData: Removing unused key:", key)
+                    delete cache[key]
+                    needsSave = true
+                }
+            }
+
+            if (needsSave) {
+                cacheFile.setText(JSON.stringify(cache, null, 2))
+            }
+        } catch (e) {
+            console.warn("CacheData: Failed to cleanup unused keys:", e.message)
+        }
+    }
+
+    FileView {
+        id: cacheFile
+
+        path: isGreeterMode ? "" : _stateDir + "/DankMaterialShell/cache.json"
+        blockLoading: true
+        blockWrites: true
+        atomicWrites: true
+        watchChanges: !isGreeterMode
+        onLoaded: {
+            if (!isGreeterMode) {
+                parseCache(cacheFile.text())
+            }
+        }
+        onLoadFailed: error => {
+            if (!isGreeterMode) {
+                console.log("CacheData: No cache file found, starting fresh")
+            }
+        }
+    }
+}

Common/CacheUtils.qml

@@ -1,24 +1,28 @@
-pragma Singleton
-pragma ComponentBehavior: Bound
 import Quickshell
+pragma Singleton
 
 Singleton {
     id: root
 
     // Clear all image cache
     function clearImageCache() {
-        Quickshell.execDetached(["rm", "-rf", Paths.stringify(Paths.imagecache)]);
-        Paths.mkdir(Paths.imagecache);
+        Quickshell.execDetached(["rm", "-rf", Paths.stringify(
+                                     Paths.imagecache)])
+        Paths.mkdir(Paths.imagecache)
     }
 
     // Clear cache older than specified minutes
     function clearOldCache(ageInMinutes) {
-        Quickshell.execDetached(["find", Paths.stringify(Paths.imagecache), "-name", "*.png", "-mmin", `+${ageInMinutes}`, "-delete"]);
+        Quickshell.execDetached(
+                    ["find", Paths.stringify(
+                         Paths.imagecache), "-name", "*.png", "-mmin", `+${ageInMinutes}`, "-delete"])
     }
 
     // Clear cache for specific size
     function clearCacheForSize(size) {
-        Quickshell.execDetached(["find", Paths.stringify(Paths.imagecache), "-name", `*@${size}x${size}.png`, "-delete"]);
+        Quickshell.execDetached(
+                    ["find", Paths.stringify(
+                         Paths.imagecache), "-name", `*@${size}x${size}.png`, "-delete"])
     }
 
     // Get cache size in MB
@@ -26,7 +30,8 @@ Singleton {
         var process = Qt.createQmlObject(`
                                          import Quickshell.Io
                                          Process {
-                                         command: ["du", "-sm", "${Paths.stringify(Paths.imagecache)}"]
+                                         command: ["du", "-sm", "${Paths.stringify(
+                                             Paths.imagecache)}"]
                                          running: true
                                          stdout: StdioCollector {
                                          onStreamFinished: {
@@ -35,6 +40,6 @@ Singleton {
                                          }
                                          }
                                          }
-                                         `, root);
+                                         `, root)
     }
 }

Common/I18n.qml

@@ -0,0 +1,113 @@
+import QtQuick
+import Qt.labs.folderlistmodel
+import Quickshell
+import Quickshell.Io
+pragma Singleton
+pragma ComponentBehavior: Bound
+
+Singleton {
+    id: root
+
+    readonly property string _rawLocale: Qt.locale().name
+    readonly property string _lang: _rawLocale.split(/[_-]/)[0]
+    readonly property var    _candidates: {
+        const fullUnderscore = _rawLocale;
+        const fullHyphen     = _rawLocale.replace("_", "-");
+        return [fullUnderscore, fullHyphen, _lang].filter(c => c && c !== "en");
+    }
+
+  
+    readonly property url translationsFolder: Qt.resolvedUrl("../translations/poexports")
+
+    property string currentLocale: "en"
+    property var    translations: ({})
+    property bool   translationsLoaded: false
+
+    property url _selectedPath: ""
+
+    FolderListModel {
+        id: dir
+        folder: root.translationsFolder
+        nameFilters: ["*.json"]
+        showDirs: false
+        showDotAndDotDot: false
+
+        onStatusChanged: if (status === FolderListModel.Ready) root._pickTranslation()
+    }
+
+    FileView {
+        id: translationLoader
+        path: root._selectedPath
+
+        onLoaded: {
+            try {
+                root.translations = JSON.parse(text())
+                root.translationsLoaded = true
+                console.log(`I18n: Loaded translations for '${root.currentLocale}' ` +
+                            `(${Object.keys(root.translations).length} contexts)`)
+            } catch (e) {
+                console.warn(`I18n: Error parsing '${root.currentLocale}':`, e,
+                             "- falling back to English")
+                root._fallbackToEnglish()
+            }
+        }
+
+        onLoadFailed: (error) => {
+            console.warn(`I18n: Failed to load '${root.currentLocale}' (${error}), ` +
+                         "falling back to English")
+            root._fallbackToEnglish()
+        }
+    }
+
+    function _pickTranslation() {
+        const present = new Set()
+        for (let i = 0; i < dir.count; i++) {
+            const name = dir.get(i, "fileName") // e.g. "zh_CN.json"
+            if (name && name.endsWith(".json")) {
+                present.add(name.slice(0, -5))
+            }
+        }
+
+        for (let i = 0; i < _candidates.length; i++) {
+            const cand = _candidates[i]
+            if (present.has(cand)) {
+                _useLocale(cand, dir.folder + "/" + cand + ".json")
+                return
+            }
+        }
+
+        _fallbackToEnglish()
+    }
+
+    function _useLocale(localeTag, fileUrl) {
+        currentLocale = localeTag
+        _selectedPath = fileUrl
+        translationsLoaded = false
+        translations = ({})
+        console.log(`I18n: Using locale '${localeTag}' from ${fileUrl}`)
+    }
+
+    function _fallbackToEnglish() {
+        currentLocale = "en"
+        _selectedPath = ""
+        translationsLoaded = false
+        translations = ({})
+        console.warn("I18n: Falling back to built-in English strings")
+    }
+
+    function tr(term, context) {
+        if (!translationsLoaded || !translations) return term
+        const ctx = context || term
+        if (translations[ctx] && translations[ctx][term]) return translations[ctx][term]
+        for (const c in translations) {
+            if (translations[c] && translations[c][term]) return translations[c][term]
+        }
+        return term
+    }
+
+    function trContext(context, term) {
+        if (!translationsLoaded || !translations) return term
+        if (translations[context] && translations[context][term]) return translations[context][term]
+        return term
+    }
+}

Common/ModalManager.qml

@@ -1,5 +1,4 @@
 pragma Singleton
-pragma ComponentBehavior: Bound
 
 import Quickshell
 import QtQuick
@@ -11,11 +10,7 @@ Singleton {
 
     function openModal(modal) {
         if (!modal.allowStacking) {
-            closeAllModalsExcept(modal);
+            closeAllModalsExcept(modal)
         }
-        if (!modal.keepPopoutsOpen) {
-            PopoutManager.closeAllPopouts();
-        }
-        TrayMenuManager.closeAllMenus();
     }
 }

Common/Paths.qml

@@ -0,0 +1,65 @@
+pragma Singleton
+
+import Quickshell
+import QtCore
+
+Singleton {
+    id: root
+
+    readonly property url home: StandardPaths.standardLocations(
+                                    StandardPaths.HomeLocation)[0]
+    readonly property url pictures: StandardPaths.standardLocations(
+                                        StandardPaths.PicturesLocation)[0]
+
+    readonly property url data: `${StandardPaths.standardLocations(
+                                    StandardPaths.GenericDataLocation)[0]}/DankMaterialShell`
+    readonly property url state: `${StandardPaths.standardLocations(
+                                     StandardPaths.GenericStateLocation)[0]}/DankMaterialShell`
+    readonly property url cache: `${StandardPaths.standardLocations(
+                                     StandardPaths.GenericCacheLocation)[0]}/DankMaterialShell`
+    readonly property url config: `${StandardPaths.standardLocations(
+                                      StandardPaths.GenericConfigLocation)[0]}/DankMaterialShell`
+
+    readonly property url imagecache: `${cache}/imagecache`
+
+    function stringify(path: url): string {
+        return path.toString().replace(/%20/g, " ")
+    }
+
+    function expandTilde(path: string): string {
+        return strip(path.replace("~", stringify(root.home)))
+    }
+
+    function shortenHome(path: string): string {
+        return path.replace(strip(root.home), "~")
+    }
+
+    function strip(path: url): string {
+        return stringify(path).replace("file://", "")
+    }
+
+    function toFileUrl(path: string): string {
+        return path.startsWith("file://") ? path : "file://" + path
+    }
+
+    function mkdir(path: url): void {
+        Quickshell.execDetached(["mkdir", "-p", strip(path)])
+    }
+
+    function copy(from: url, to: url): void {
+        Quickshell.execDetached(["cp", strip(from), strip(to)])
+    }
+
+    // ! Spotify and maybe some other apps report the wrong app id in toplevels, hardcode special case
+    function moddedAppId(appId: string): string {
+        if (appId === "Spotify")
+            return "spotify-launcher"
+        if (appId === "beepertexts")
+            return "beeper"
+        if (appId === "home assistant desktop")
+            return "homeassistant-desktop"
+        if (appId.includes("com.transmissionbt.transmission"))
+            return "transmission-gtk"
+        return appId
+    }
+}

Common/Proc.qml

@@ -0,0 +1,70 @@
+pragma Singleton
+pragma ComponentBehavior: Bound
+
+import QtQuick
+import Quickshell
+import Quickshell.Io
+
+Singleton {
+    id: root
+
+    property int defaultDebounceMs: 50
+    property var _procDebouncers: ({}) // id -> { timer, command, callback, waitMs }
+
+    function runCommand(id, command, callback, debounceMs) {
+        const wait = (typeof debounceMs === "number" && debounceMs >= 0) ? debounceMs : defaultDebounceMs
+        let procId = id ? id : Math.random()        
+
+        if (!_procDebouncers[procId]) {
+            const t = Qt.createQmlObject('import QtQuick; Timer { repeat: false }', root)
+            t.triggered.connect(function() { _launchProc(procId) })
+            _procDebouncers[procId] = { timer: t, command: command, callback: callback, waitMs: wait }
+        } else {
+            _procDebouncers[procId].command = command
+            _procDebouncers[procId].callback = callback
+            _procDebouncers[procId].waitMs = wait
+        }
+
+        const entry = _procDebouncers[procId]
+        entry.timer.interval = entry.waitMs
+        entry.timer.restart()
+    }
+
+    function _launchProc(id) {
+        const entry = _procDebouncers[id]
+        if (!entry) return
+
+        const proc = Qt.createQmlObject('import Quickshell.Io; Process { running: false }', root)
+        const out = Qt.createQmlObject('import Quickshell.Io; StdioCollector {}', proc)
+        const err = Qt.createQmlObject('import Quickshell.Io; StdioCollector {}', proc)
+
+        proc.stdout = out
+        proc.stderr = err
+        proc.command = entry.command
+
+        let capturedOut = ""
+        let exitSeen = false
+        let exitCodeValue = -1
+
+        out.streamFinished.connect(function() {
+            capturedOut = out.text || ""
+            maybeComplete()
+        })
+
+        proc.exited.connect(function(code) {
+            exitSeen = true
+            exitCodeValue = code
+            maybeComplete()
+        })
+
+        function maybeComplete() {
+            if (!exitSeen) return
+            if (typeof entry.callback === "function") {
+                try { entry.callback(capturedOut, exitCodeValue) } catch (e) { console.warn("runCommand callback error:", e) }
+            }
+            try { proc.destroy() } catch (_) {}
+        }
+
+        proc.running = true
+    }
+}

Common/SessionData.qml

@@ -0,0 +1,844 @@
+pragma Singleton
+pragma ComponentBehavior: Bound
+
+import QtCore
+import QtQuick
+import Quickshell
+import Quickshell.Io
+import qs.Common
+import qs.Services
+
+Singleton {
+    id: root
+
+    readonly property int sessionConfigVersion: 1
+
+    readonly property bool isGreeterMode: Quickshell.env("DMS_RUN_GREETER") === "1" || Quickshell.env("DMS_RUN_GREETER") === "true"
+    property bool hasTriedDefaultSession: false
+    readonly property string _stateUrl: StandardPaths.writableLocation(StandardPaths.GenericStateLocation)
+    readonly property string _stateDir: Paths.strip(_stateUrl)
+
+    property bool isLightMode: false
+    property bool doNotDisturb: false
+
+    property string wallpaperPath: ""
+    property bool perMonitorWallpaper: false
+    property var monitorWallpapers: ({})
+    property bool perModeWallpaper: false
+    property string wallpaperPathLight: ""
+    property string wallpaperPathDark: ""
+    property var monitorWallpapersLight: ({})
+    property var monitorWallpapersDark: ({})
+    property string wallpaperTransition: "fade"
+    readonly property var availableWallpaperTransitions: ["none", "fade", "wipe", "disc", "stripes", "iris bloom", "pixelate", "portal"]
+    property var includedTransitions: availableWallpaperTransitions.filter(t => t !== "none")
+
+    property bool wallpaperCyclingEnabled: false
+    property string wallpaperCyclingMode: "interval"
+    property int wallpaperCyclingInterval: 300
+    property string wallpaperCyclingTime: "06:00"
+    property var monitorCyclingSettings: ({})
+
+    property bool nightModeEnabled: false
+    property int nightModeTemperature: 4500
+    property bool nightModeAutoEnabled: false
+    property string nightModeAutoMode: "time"
+    property int nightModeStartHour: 18
+    property int nightModeStartMinute: 0
+    property int nightModeEndHour: 6
+    property int nightModeEndMinute: 0
+    property real latitude: 0.0
+    property real longitude: 0.0
+    property string nightModeLocationProvider: ""
+
+    property var pinnedApps: []
+    property var recentColors: []
+    property bool showThirdPartyPlugins: false
+    property string launchPrefix: ""
+    property string lastBrightnessDevice: ""
+
+    property int selectedGpuIndex: 0
+    property bool nvidiaGpuTempEnabled: false
+    property bool nonNvidiaGpuTempEnabled: false
+    property var enabledGpuPciIds: []
+
+    Component.onCompleted: {
+        if (!isGreeterMode) {
+            loadSettings()
+        }
+    }
+
+    function loadSettings() {
+        if (isGreeterMode) {
+            parseSettings(greeterSessionFile.text())
+        } else {
+            parseSettings(settingsFile.text())
+        }
+    }
+
+    function parseSettings(content) {
+        try {
+            if (content && content.trim()) {
+                var settings = JSON.parse(content)
+                isLightMode = settings.isLightMode !== undefined ? settings.isLightMode : false
+                wallpaperPath = settings.wallpaperPath !== undefined ? settings.wallpaperPath : ""
+                perMonitorWallpaper = settings.perMonitorWallpaper !== undefined ? settings.perMonitorWallpaper : false
+                monitorWallpapers = settings.monitorWallpapers !== undefined ? settings.monitorWallpapers : {}
+                perModeWallpaper = settings.perModeWallpaper !== undefined ? settings.perModeWallpaper : false
+                wallpaperPathLight = settings.wallpaperPathLight !== undefined ? settings.wallpaperPathLight : ""
+                wallpaperPathDark = settings.wallpaperPathDark !== undefined ? settings.wallpaperPathDark : ""
+                monitorWallpapersLight = settings.monitorWallpapersLight !== undefined ? settings.monitorWallpapersLight : {}
+                monitorWallpapersDark = settings.monitorWallpapersDark !== undefined ? settings.monitorWallpapersDark : {}
+                doNotDisturb = settings.doNotDisturb !== undefined ? settings.doNotDisturb : false
+                nightModeEnabled = settings.nightModeEnabled !== undefined ? settings.nightModeEnabled : false
+                nightModeTemperature = settings.nightModeTemperature !== undefined ? settings.nightModeTemperature : 4500
+                nightModeAutoEnabled = settings.nightModeAutoEnabled !== undefined ? settings.nightModeAutoEnabled : false
+                nightModeAutoMode = settings.nightModeAutoMode !== undefined ? settings.nightModeAutoMode : "time"
+                if (settings.nightModeStartTime !== undefined) {
+                    const parts = settings.nightModeStartTime.split(":")
+                    nightModeStartHour = parseInt(parts[0]) || 18
+                    nightModeStartMinute = parseInt(parts[1]) || 0
+                } else {
+                    nightModeStartHour = settings.nightModeStartHour !== undefined ? settings.nightModeStartHour : 18
+                    nightModeStartMinute = settings.nightModeStartMinute !== undefined ? settings.nightModeStartMinute : 0
+                }
+                if (settings.nightModeEndTime !== undefined) {
+                    const parts = settings.nightModeEndTime.split(":")
+                    nightModeEndHour = parseInt(parts[0]) || 6
+                    nightModeEndMinute = parseInt(parts[1]) || 0
+                } else {
+                    nightModeEndHour = settings.nightModeEndHour !== undefined ? settings.nightModeEndHour : 6
+                    nightModeEndMinute = settings.nightModeEndMinute !== undefined ? settings.nightModeEndMinute : 0
+                }
+                latitude = settings.latitude !== undefined ? settings.latitude : 0.0
+                longitude = settings.longitude !== undefined ? settings.longitude : 0.0
+                nightModeLocationProvider = settings.nightModeLocationProvider !== undefined ? settings.nightModeLocationProvider : ""
+                pinnedApps = settings.pinnedApps !== undefined ? settings.pinnedApps : []
+                selectedGpuIndex = settings.selectedGpuIndex !== undefined ? settings.selectedGpuIndex : 0
+                nvidiaGpuTempEnabled = settings.nvidiaGpuTempEnabled !== undefined ? settings.nvidiaGpuTempEnabled : false
+                nonNvidiaGpuTempEnabled = settings.nonNvidiaGpuTempEnabled !== undefined ? settings.nonNvidiaGpuTempEnabled : false
+                enabledGpuPciIds = settings.enabledGpuPciIds !== undefined ? settings.enabledGpuPciIds : []
+                wallpaperCyclingEnabled = settings.wallpaperCyclingEnabled !== undefined ? settings.wallpaperCyclingEnabled : false
+                wallpaperCyclingMode = settings.wallpaperCyclingMode !== undefined ? settings.wallpaperCyclingMode : "interval"
+                wallpaperCyclingInterval = settings.wallpaperCyclingInterval !== undefined ? settings.wallpaperCyclingInterval : 300
+                wallpaperCyclingTime = settings.wallpaperCyclingTime !== undefined ? settings.wallpaperCyclingTime : "06:00"
+                monitorCyclingSettings = settings.monitorCyclingSettings !== undefined ? settings.monitorCyclingSettings : {}
+                lastBrightnessDevice = settings.lastBrightnessDevice !== undefined ? settings.lastBrightnessDevice : ""
+                launchPrefix = settings.launchPrefix !== undefined ? settings.launchPrefix : ""
+                wallpaperTransition = settings.wallpaperTransition !== undefined ? settings.wallpaperTransition : "fade"
+                includedTransitions = settings.includedTransitions !== undefined ? settings.includedTransitions : availableWallpaperTransitions.filter(t => t !== "none")
+                recentColors = settings.recentColors !== undefined ? settings.recentColors : []
+                showThirdPartyPlugins = settings.showThirdPartyPlugins !== undefined ? settings.showThirdPartyPlugins : false
+
+                if (settings.configVersion === undefined) {
+                    migrateFromUndefinedToV1(settings)
+                    saveSettings()
+                } else if (settings.configVersion === sessionConfigVersion) {
+                    cleanupUnusedKeys()
+                }
+
+                if (!isGreeterMode) {
+                    if (typeof Theme !== "undefined") {
+                        Theme.generateSystemThemesFromCurrentTheme()
+                    }
+                }
+            }
+        } catch (e) {
+
+        }
+    }
+
+    function saveSettings() {
+        if (isGreeterMode) return
+        settingsFile.setText(JSON.stringify({
+                                                "isLightMode": isLightMode,
+                                                "wallpaperPath": wallpaperPath,
+                                                "perMonitorWallpaper": perMonitorWallpaper,
+                                                "monitorWallpapers": monitorWallpapers,
+                                                "perModeWallpaper": perModeWallpaper,
+                                                "wallpaperPathLight": wallpaperPathLight,
+                                                "wallpaperPathDark": wallpaperPathDark,
+                                                "monitorWallpapersLight": monitorWallpapersLight,
+                                                "monitorWallpapersDark": monitorWallpapersDark,
+                                                "doNotDisturb": doNotDisturb,
+                                                "nightModeEnabled": nightModeEnabled,
+                                                "nightModeTemperature": nightModeTemperature,
+                                                "nightModeAutoEnabled": nightModeAutoEnabled,
+                                                "nightModeAutoMode": nightModeAutoMode,
+                                                "nightModeStartHour": nightModeStartHour,
+                                                "nightModeStartMinute": nightModeStartMinute,
+                                                "nightModeEndHour": nightModeEndHour,
+                                                "nightModeEndMinute": nightModeEndMinute,
+                                                "latitude": latitude,
+                                                "longitude": longitude,
+                                                "nightModeLocationProvider": nightModeLocationProvider,
+                                                "pinnedApps": pinnedApps,
+                                                "selectedGpuIndex": selectedGpuIndex,
+                                                "nvidiaGpuTempEnabled": nvidiaGpuTempEnabled,
+                                                "nonNvidiaGpuTempEnabled": nonNvidiaGpuTempEnabled,
+                                                "enabledGpuPciIds": enabledGpuPciIds,
+                                                "wallpaperCyclingEnabled": wallpaperCyclingEnabled,
+                                                "wallpaperCyclingMode": wallpaperCyclingMode,
+                                                "wallpaperCyclingInterval": wallpaperCyclingInterval,
+                                                "wallpaperCyclingTime": wallpaperCyclingTime,
+                                                "monitorCyclingSettings": monitorCyclingSettings,
+                                                "lastBrightnessDevice": lastBrightnessDevice,
+                                                "launchPrefix": launchPrefix,
+                                                "wallpaperTransition": wallpaperTransition,
+                                                "includedTransitions": includedTransitions,
+                                                "recentColors": recentColors,
+                                                "showThirdPartyPlugins": showThirdPartyPlugins,
+                                                "configVersion": sessionConfigVersion
+                                            }, null, 2))
+    }
+
+    function migrateFromUndefinedToV1(settings) {
+        console.log("SessionData: Migrating configuration from undefined to version 1")
+        if (typeof SettingsData !== "undefined") {
+            if (settings.acMonitorTimeout !== undefined) {
+                SettingsData.setAcMonitorTimeout(settings.acMonitorTimeout)
+            }
+            if (settings.acLockTimeout !== undefined) {
+                SettingsData.setAcLockTimeout(settings.acLockTimeout)
+            }
+            if (settings.acSuspendTimeout !== undefined) {
+                SettingsData.setAcSuspendTimeout(settings.acSuspendTimeout)
+            }
+            if (settings.acHibernateTimeout !== undefined) {
+                SettingsData.setAcHibernateTimeout(settings.acHibernateTimeout)
+            }
+            if (settings.batteryMonitorTimeout !== undefined) {
+                SettingsData.setBatteryMonitorTimeout(settings.batteryMonitorTimeout)
+            }
+            if (settings.batteryLockTimeout !== undefined) {
+                SettingsData.setBatteryLockTimeout(settings.batteryLockTimeout)
+            }
+            if (settings.batterySuspendTimeout !== undefined) {
+                SettingsData.setBatterySuspendTimeout(settings.batterySuspendTimeout)
+            }
+            if (settings.batteryHibernateTimeout !== undefined) {
+                SettingsData.setBatteryHibernateTimeout(settings.batteryHibernateTimeout)
+            }
+            if (settings.lockBeforeSuspend !== undefined) {
+                SettingsData.setLockBeforeSuspend(settings.lockBeforeSuspend)
+            }
+            if (settings.loginctlLockIntegration !== undefined) {
+                SettingsData.setLoginctlLockIntegration(settings.loginctlLockIntegration)
+            }
+            if (settings.launchPrefix !== undefined) {
+                SettingsData.setLaunchPrefix(settings.launchPrefix)
+            }
+        }
+        if (typeof CacheData !== "undefined") {
+            if (settings.wallpaperLastPath !== undefined) {
+                CacheData.wallpaperLastPath = settings.wallpaperLastPath
+            }
+            if (settings.profileLastPath !== undefined) {
+                CacheData.profileLastPath = settings.profileLastPath
+            }
+            CacheData.saveCache()
+        }
+    }
+
+    function cleanupUnusedKeys() {
+        const validKeys = [
+            "isLightMode", "wallpaperPath", "perMonitorWallpaper", "monitorWallpapers", "perModeWallpaper",
+            "wallpaperPathLight", "wallpaperPathDark", "monitorWallpapersLight",
+            "monitorWallpapersDark", "doNotDisturb", "nightModeEnabled",
+            "nightModeTemperature", "nightModeAutoEnabled", "nightModeAutoMode",
+            "nightModeStartHour", "nightModeStartMinute", "nightModeEndHour",
+            "nightModeEndMinute", "latitude", "longitude", "nightModeLocationProvider",
+            "pinnedApps", "selectedGpuIndex", "nvidiaGpuTempEnabled",
+            "nonNvidiaGpuTempEnabled", "enabledGpuPciIds", "wallpaperCyclingEnabled",
+            "wallpaperCyclingMode", "wallpaperCyclingInterval", "wallpaperCyclingTime",
+            "monitorCyclingSettings", "lastBrightnessDevice", "wallpaperTransition",
+            "includedTransitions", "recentColors", "showThirdPartyPlugins", "configVersion"
+        ]
+
+        try {
+            const content = settingsFile.text()
+            if (!content || !content.trim()) return
+
+            const settings = JSON.parse(content)
+            let needsSave = false
+
+            for (const key in settings) {
+                if (!validKeys.includes(key)) {
+                    console.log("SessionData: Removing unused key:", key)
+                    delete settings[key]
+                    needsSave = true
+                }
+            }
+
+            if (needsSave) {
+                settingsFile.setText(JSON.stringify(settings, null, 2))
+            }
+        } catch (e) {
+            console.warn("SessionData: Failed to cleanup unused keys:", e.message)
+        }
+    }
+
+    function setLightMode(lightMode) {
+        isLightMode = lightMode
+        syncWallpaperForCurrentMode()
+        saveSettings()
+    }
+
+    function setDoNotDisturb(enabled) {
+        doNotDisturb = enabled
+        saveSettings()
+    }
+
+    function setWallpaperPath(path) {
+        wallpaperPath = path
+        saveSettings()
+    }
+
+    function setWallpaper(imagePath) {
+        wallpaperPath = imagePath
+        if (perModeWallpaper) {
+            if (isLightMode) {
+                wallpaperPathLight = imagePath
+            } else {
+                wallpaperPathDark = imagePath
+            }
+        }
+        saveSettings()
+
+        if (typeof Theme !== "undefined") {
+            Theme.generateSystemThemesFromCurrentTheme()
+        }
+    }
+
+    function setWallpaperColor(color) {
+        wallpaperPath = color
+        if (perModeWallpaper) {
+            if (isLightMode) {
+                wallpaperPathLight = color
+            } else {
+                wallpaperPathDark = color
+            }
+        }
+        saveSettings()
+
+        if (typeof Theme !== "undefined") {
+            Theme.generateSystemThemesFromCurrentTheme()
+        }
+    }
+
+    function clearWallpaper() {
+        wallpaperPath = ""
+        saveSettings()
+
+        if (typeof Theme !== "undefined") {
+            if (typeof SettingsData !== "undefined" && SettingsData.theme) {
+                Theme.switchTheme(SettingsData.theme)
+            } else {
+                Theme.switchTheme("blue")
+            }
+        }
+    }
+
+    function setPerMonitorWallpaper(enabled) {
+        perMonitorWallpaper = enabled
+        if (enabled && perModeWallpaper) {
+            syncWallpaperForCurrentMode()
+        }
+        saveSettings()
+
+        if (typeof Theme !== "undefined") {
+            Theme.generateSystemThemesFromCurrentTheme()
+        }
+    }
+
+    function setPerModeWallpaper(enabled) {
+        if (enabled && wallpaperCyclingEnabled) {
+            setWallpaperCyclingEnabled(false)
+        }
+        if (enabled && perMonitorWallpaper) {
+            var monitorCyclingAny = false
+            for (var key in monitorCyclingSettings) {
+                if (monitorCyclingSettings[key].enabled) {
+                    monitorCyclingAny = true
+                    break
+                }
+            }
+            if (monitorCyclingAny) {
+                var newSettings = Object.assign({}, monitorCyclingSettings)
+                for (var screenName in newSettings) {
+                    newSettings[screenName].enabled = false
+                }
+                monitorCyclingSettings = newSettings
+            }
+        }
+
+        perModeWallpaper = enabled
+        if (enabled) {
+            if (perMonitorWallpaper) {
+                monitorWallpapersLight = Object.assign({}, monitorWallpapers)
+                monitorWallpapersDark = Object.assign({}, monitorWallpapers)
+            } else {
+                wallpaperPathLight = wallpaperPath
+                wallpaperPathDark = wallpaperPath
+            }
+        } else {
+            syncWallpaperForCurrentMode()
+        }
+        saveSettings()
+
+        if (typeof Theme !== "undefined") {
+            Theme.generateSystemThemesFromCurrentTheme()
+        }
+    }
+
+    function setMonitorWallpaper(screenName, path) {
+        var newMonitorWallpapers = Object.assign({}, monitorWallpapers)
+        if (path && path !== "") {
+            newMonitorWallpapers[screenName] = path
+        } else {
+            delete newMonitorWallpapers[screenName]
+        }
+        monitorWallpapers = newMonitorWallpapers
+
+        if (perModeWallpaper) {
+            if (isLightMode) {
+                var newLight = Object.assign({}, monitorWallpapersLight)
+                if (path && path !== "") {
+                    newLight[screenName] = path
+                } else {
+                    delete newLight[screenName]
+                }
+                monitorWallpapersLight = newLight
+            } else {
+                var newDark = Object.assign({}, monitorWallpapersDark)
+                if (path && path !== "") {
+                    newDark[screenName] = path
+                } else {
+                    delete newDark[screenName]
+                }
+                monitorWallpapersDark = newDark
+            }
+        }
+
+        saveSettings()
+
+        if (typeof Theme !== "undefined" && typeof Quickshell !== "undefined") {
+            var screens = Quickshell.screens
+            if (screens.length > 0 && screenName === screens[0].name) {
+                Theme.generateSystemThemesFromCurrentTheme()
+            }
+        }
+    }
+
+    function setWallpaperTransition(transition) {
+        wallpaperTransition = transition
+        saveSettings()
+    }
+
+    function setWallpaperCyclingEnabled(enabled) {
+        wallpaperCyclingEnabled = enabled
+        saveSettings()
+    }
+
+    function setWallpaperCyclingMode(mode) {
+        wallpaperCyclingMode = mode
+        saveSettings()
+    }
+
+    function setWallpaperCyclingInterval(interval) {
+        wallpaperCyclingInterval = interval
+        saveSettings()
+    }
+
+    function setWallpaperCyclingTime(time) {
+        wallpaperCyclingTime = time
+        saveSettings()
+    }
+
+    function setMonitorCyclingEnabled(screenName, enabled) {
+        var newSettings = Object.assign({}, monitorCyclingSettings)
+        if (!newSettings[screenName]) {
+            newSettings[screenName] = { enabled: false, mode: "interval", interval: 300, time: "06:00" }
+        }
+        newSettings[screenName].enabled = enabled
+        monitorCyclingSettings = newSettings
+        saveSettings()
+    }
+
+    function setMonitorCyclingMode(screenName, mode) {
+        var newSettings = Object.assign({}, monitorCyclingSettings)
+        if (!newSettings[screenName]) {
+            newSettings[screenName] = { enabled: false, mode: "interval", interval: 300, time: "06:00" }
+        }
+        newSettings[screenName].mode = mode
+        monitorCyclingSettings = newSettings
+        saveSettings()
+    }
+
+    function setMonitorCyclingInterval(screenName, interval) {
+        var newSettings = Object.assign({}, monitorCyclingSettings)
+        if (!newSettings[screenName]) {
+            newSettings[screenName] = { enabled: false, mode: "interval", interval: 300, time: "06:00" }
+        }
+        newSettings[screenName].interval = interval
+        monitorCyclingSettings = newSettings
+        saveSettings()
+    }
+
+    function setMonitorCyclingTime(screenName, time) {
+        var newSettings = Object.assign({}, monitorCyclingSettings)
+        if (!newSettings[screenName]) {
+            newSettings[screenName] = { enabled: false, mode: "interval", interval: 300, time: "06:00" }
+        }
+        newSettings[screenName].time = time
+        monitorCyclingSettings = newSettings
+        saveSettings()
+    }
+
+    function setNightModeEnabled(enabled) {
+        nightModeEnabled = enabled
+        saveSettings()
+    }
+
+    function setNightModeTemperature(temperature) {
+        nightModeTemperature = temperature
+        saveSettings()
+    }
+
+    function setNightModeAutoEnabled(enabled) {
+        console.log("SessionData: Setting nightModeAutoEnabled to", enabled)
+        nightModeAutoEnabled = enabled
+        saveSettings()
+    }
+
+    function setNightModeAutoMode(mode) {
+        nightModeAutoMode = mode
+        saveSettings()
+    }
+
+    function setNightModeStartHour(hour) {
+        nightModeStartHour = hour
+        saveSettings()
+    }
+
+    function setNightModeStartMinute(minute) {
+        nightModeStartMinute = minute
+        saveSettings()
+    }
+
+    function setNightModeEndHour(hour) {
+        nightModeEndHour = hour
+        saveSettings()
+    }
+
+    function setNightModeEndMinute(minute) {
+        nightModeEndMinute = minute
+        saveSettings()
+    }
+
+    function setLatitude(lat) {
+        console.log("SessionData: Setting latitude to", lat)
+        latitude = lat
+        saveSettings()
+    }
+
+    function setLongitude(lng) {
+        console.log("SessionData: Setting longitude to", lng)
+        longitude = lng
+        saveSettings()
+    }
+
+    function setNightModeLocationProvider(provider) {
+        nightModeLocationProvider = provider
+        saveSettings()
+    }
+
+    function setPinnedApps(apps) {
+        pinnedApps = apps
+        saveSettings()
+    }
+
+    function addPinnedApp(appId) {
+        if (!appId)
+            return
+        var currentPinned = [...pinnedApps]
+        if (currentPinned.indexOf(appId) === -1) {
+            currentPinned.push(appId)
+            setPinnedApps(currentPinned)
+        }
+    }
+
+    function removePinnedApp(appId) {
+        if (!appId)
+            return
+        var currentPinned = pinnedApps.filter(id => id !== appId)
+        setPinnedApps(currentPinned)
+    }
+
+    function isPinnedApp(appId) {
+        return appId && pinnedApps.indexOf(appId) !== -1
+    }
+
+    function addRecentColor(color) {
+        const colorStr = color.toString()
+        let recent = recentColors.slice()
+        recent = recent.filter(c => c !== colorStr)
+        recent.unshift(colorStr)
+        if (recent.length > 5) recent = recent.slice(0, 5)
+        recentColors = recent
+        saveSettings()
+    }
+
+    function setShowThirdPartyPlugins(enabled) {
+        showThirdPartyPlugins = enabled
+        saveSettings()
+    }
+
+    function setLaunchPrefix(prefix) {
+        launchPrefix = prefix
+        saveSettings()
+    }
+
+    function setLastBrightnessDevice(device) {
+        lastBrightnessDevice = device
+        saveSettings()
+    }
+
+    function setSelectedGpuIndex(index) {
+        selectedGpuIndex = index
+        saveSettings()
+    }
+
+    function setNvidiaGpuTempEnabled(enabled) {
+        nvidiaGpuTempEnabled = enabled
+        saveSettings()
+    }
+
+    function setNonNvidiaGpuTempEnabled(enabled) {
+        nonNvidiaGpuTempEnabled = enabled
+        saveSettings()
+    }
+
+    function setEnabledGpuPciIds(pciIds) {
+        enabledGpuPciIds = pciIds
+        saveSettings()
+    }
+
+    function syncWallpaperForCurrentMode() {
+        if (!perModeWallpaper) return
+
+        if (perMonitorWallpaper) {
+            monitorWallpapers = isLightMode ? Object.assign({}, monitorWallpapersLight) : Object.assign({}, monitorWallpapersDark)
+            return
+        }
+
+        wallpaperPath = isLightMode ? wallpaperPathLight : wallpaperPathDark
+    }
+
+    function getMonitorWallpaper(screenName) {
+        if (!perMonitorWallpaper) {
+            return wallpaperPath
+        }
+        return monitorWallpapers[screenName] || wallpaperPath
+    }
+
+    function getMonitorCyclingSettings(screenName) {
+        return monitorCyclingSettings[screenName] || {
+            enabled: false,
+            mode: "interval",
+            interval: 300,
+            time: "06:00"
+        }
+    }
+
+    FileView {
+        id: settingsFile
+
+        path: isGreeterMode ? "" : StandardPaths.writableLocation(StandardPaths.GenericStateLocation) + "/DankMaterialShell/session.json"
+        blockLoading: isGreeterMode
+        blockWrites: true
+        watchChanges: !isGreeterMode
+        onLoaded: {
+            if (!isGreeterMode) {
+                parseSettings(settingsFile.text())
+                hasTriedDefaultSession = false
+            }
+        }
+        onLoadFailed: error => {
+            if (!isGreeterMode && !hasTriedDefaultSession) {
+                hasTriedDefaultSession = true
+                defaultSessionCheckProcess.running = true
+            }
+        }
+    }
+
+    FileView {
+        id: greeterSessionFile
+
+        path: {
+            const greetCfgDir = Quickshell.env("DMS_GREET_CFG_DIR") || "/etc/greetd/.dms"
+            return greetCfgDir + "/session.json"
+        }
+        preload: isGreeterMode
+        blockLoading: false
+        blockWrites: true
+        watchChanges: false
+        printErrors: true
+        onLoaded: {
+            if (isGreeterMode) {
+                parseSettings(greeterSessionFile.text())
+            }
+        }
+    }
+
+    Process {
+        id: defaultSessionCheckProcess
+
+        command: ["sh", "-c", "CONFIG_DIR=\"" + _stateDir
+            + "/DankMaterialShell\"; if [ -f \"$CONFIG_DIR/default-session.json\" ] && [ ! -f \"$CONFIG_DIR/session.json\" ]; then cp --no-preserve=mode \"$CONFIG_DIR/default-session.json\" \"$CONFIG_DIR/session.json\" && echo 'copied'; else echo 'not_found'; fi"]
+        running: false
+        onExited: exitCode => {
+            if (exitCode === 0) {
+                console.log("Copied default-session.json to session.json")
+                settingsFile.reload()
+            }
+        }
+    }
+
+    IpcHandler {
+        target: "wallpaper"
+
+        function get(): string {
+            if (root.perMonitorWallpaper) {
+                return "ERROR: Per-monitor mode enabled. Use getFor(screenName) instead."
+            }
+            return root.wallpaperPath || ""
+        }
+
+        function set(path: string): string {
+            if (root.perMonitorWallpaper) {
+                return "ERROR: Per-monitor mode enabled. Use setFor(screenName, path) instead."
+            }
+
+            if (!path) {
+                return "ERROR: No path provided"
+            }
+
+            var absolutePath = path.startsWith("/") ? path : StandardPaths.writableLocation(StandardPaths.HomeLocation) + "/" + path
+
+            try {
+                root.setWallpaper(absolutePath)
+                return "SUCCESS: Wallpaper set to " + absolutePath
+            } catch (e) {
+                return "ERROR: Failed to set wallpaper: " + e.toString()
+            }
+        }
+
+        function clear(): string {
+            root.setWallpaper("")
+            root.setPerMonitorWallpaper(false)
+            root.monitorWallpapers = {}
+            root.saveSettings()
+            return "SUCCESS: All wallpapers cleared"
+        }
+
+        function next(): string {
+            if (root.perMonitorWallpaper) {
+                return "ERROR: Per-monitor mode enabled. Use nextFor(screenName) instead."
+            }
+
+            if (!root.wallpaperPath) {
+                return "ERROR: No wallpaper set"
+            }
+
+            try {
+                WallpaperCyclingService.cycleNextManually()
+                return "SUCCESS: Cycling to next wallpaper"
+            } catch (e) {
+                return "ERROR: Failed to cycle wallpaper: " + e.toString()
+            }
+        }
+
+        function prev(): string {
+            if (root.perMonitorWallpaper) {
+                return "ERROR: Per-monitor mode enabled. Use prevFor(screenName) instead."
+            }
+
+            if (!root.wallpaperPath) {
+                return "ERROR: No wallpaper set"
+            }
+
+            try {
+                WallpaperCyclingService.cyclePrevManually()
+                return "SUCCESS: Cycling to previous wallpaper"
+            } catch (e) {
+                return "ERROR: Failed to cycle wallpaper: " + e.toString()
+            }
+        }
+
+        function getFor(screenName: string): string {
+            if (!screenName) {
+                return "ERROR: No screen name provided"
+            }
+            return root.getMonitorWallpaper(screenName) || ""
+        }
+
+        function setFor(screenName: string, path: string): string {
+            if (!screenName) {
+                return "ERROR: No screen name provided"
+            }
+
+            if (!path) {
+                return "ERROR: No path provided"
+            }
+
+            var absolutePath = path.startsWith("/") ? path : StandardPaths.writableLocation(StandardPaths.HomeLocation) + "/" + path
+
+            try {
+                if (!root.perMonitorWallpaper) {
+                    root.setPerMonitorWallpaper(true)
+                }
+                root.setMonitorWallpaper(screenName, absolutePath)
+                return "SUCCESS: Wallpaper set for " + screenName + " to " + absolutePath
+            } catch (e) {
+                return "ERROR: Failed to set wallpaper for " + screenName + ": " + e.toString()
+            }
+        }
+
+        function nextFor(screenName: string): string {
+            if (!screenName) {
+                return "ERROR: No screen name provided"
+            }
+
+            var currentWallpaper = root.getMonitorWallpaper(screenName)
+            if (!currentWallpaper) {
+                return "ERROR: No wallpaper set for " + screenName
+            }
+
+            try {
+                WallpaperCyclingService.cycleNextForMonitor(screenName)
+                return "SUCCESS: Cycling to next wallpaper for " + screenName
+            } catch (e) {
+                return "ERROR: Failed to cycle wallpaper for " + screenName + ": " + e.toString()
+            }
+        }
+
+        function prevFor(screenName: string): string {
+            if (!screenName) {
+                return "ERROR: No screen name provided"
+            }
+
+            var currentWallpaper = root.getMonitorWallpaper(screenName)
+            if (!currentWallpaper) {
+                return "ERROR: No wallpaper set for " + screenName
+            }
+
+            try {
+                WallpaperCyclingService.cyclePrevForMonitor(screenName)
+                return "SUCCESS: Cycling to previous wallpaper for " + screenName
+            } catch (e) {
+                return "ERROR: Failed to cycle wallpaper for " + screenName + ": " + e.toString()
+            }
+        }
+    }
+}

Common/StockThemes.js

@@ -2,16 +2,16 @@
 // Separated from Theme.qml to keep that file clean
 
 const CatppuccinMocha = {
-    surface: "#181825",
+    surface: "#313244",
     surfaceText: "#cdd6f4",
-    surfaceVariant: "#1e1e2e",
+    surfaceVariant: "#313244",
     surfaceVariantText: "#a6adc8",
-    background: "#181825",
+    background: "#1e1e2e",
     backgroundText: "#cdd6f4",
     outline: "#6c7086",
-    surfaceContainer: "#1e1e2e",
-    surfaceContainerHigh: "#313244",
-    surfaceContainerHighest: "#45475a"
+    surfaceContainer: "#45475a",
+    surfaceContainerHigh: "#585b70",
+    surfaceContainerHighest: "#6c7086"
 }
 
 const CatppuccinLatte = {

Common/Theme.qml

@@ -0,0 +1,992 @@
+pragma Singleton
+
+pragma ComponentBehavior: Bound
+
+import QtCore
+import QtQuick
+import Quickshell
+import Quickshell.Io
+import Quickshell.Services.UPower
+import qs.Common
+import qs.Services
+import "StockThemes.js" as StockThemes
+
+Singleton {
+    id: root
+
+    readonly property string stateDir: Paths.strip(StandardPaths.writableLocation(StandardPaths.GenericCacheLocation).toString()) + "/DankMaterialShell"
+
+    readonly property bool envDisableMatugen: Quickshell.env("DMS_DISABLE_MATUGEN") === "1" || Quickshell.env("DMS_DISABLE_MATUGEN") === "true"
+
+    readonly property real popupDistance: {
+        if (typeof SettingsData === "undefined") return 4
+        return SettingsData.popupGapsAuto ? Math.max(4, SettingsData.dankBarSpacing) : SettingsData.popupGapsManual
+    }
+
+    property string currentTheme: "blue"
+    property string currentThemeCategory: "generic"
+    property bool isLightMode: typeof SessionData !== "undefined" ? SessionData.isLightMode : false
+    property bool colorsFileLoadFailed: false
+
+    readonly property string dynamic: "dynamic"
+    readonly property string custom : "custom"
+
+    readonly property string homeDir: Paths.strip(StandardPaths.writableLocation(StandardPaths.HomeLocation))
+    readonly property string configDir: Paths.strip(StandardPaths.writableLocation(StandardPaths.ConfigLocation))
+    readonly property string shellDir: Paths.strip(Qt.resolvedUrl(".").toString()).replace("/Common/", "")
+    readonly property string wallpaperPath: {
+        if (typeof SessionData === "undefined") return ""
+
+        if (SessionData.perMonitorWallpaper) {
+            var screens = Quickshell.screens
+            if (screens.length > 0) {
+                var firstMonitorWallpaper = SessionData.getMonitorWallpaper(screens[0].name)
+                var wallpaperPath = firstMonitorWallpaper || SessionData.wallpaperPath
+
+                if (wallpaperPath && wallpaperPath.startsWith("we:")) {
+                    return stateDir + "/we_screenshots/" + wallpaperPath.substring(3) + ".jpg"
+                }
+
+                return wallpaperPath
+            }
+        }
+
+        var wallpaperPath = SessionData.wallpaperPath
+        var screens = Quickshell.screens
+        if (screens.length > 0 && wallpaperPath && wallpaperPath.startsWith("we:")) {
+            return stateDir + "/we_screenshots/" + wallpaperPath.substring(3) + ".jpg"
+        }
+
+        return wallpaperPath
+    }
+    readonly property string rawWallpaperPath: {
+        if (typeof SessionData === "undefined") return ""
+        
+        if (SessionData.perMonitorWallpaper) {
+            // Use first monitor's wallpaper for dynamic theming
+            var screens = Quickshell.screens
+            if (screens.length > 0) {
+                var firstMonitorWallpaper = SessionData.getMonitorWallpaper(screens[0].name)
+                return firstMonitorWallpaper || SessionData.wallpaperPath
+            }
+        }
+
+        return SessionData.wallpaperPath
+    }
+
+    property bool matugenAvailable: false
+    property bool gtkThemingEnabled: typeof SettingsData !== "undefined" ? SettingsData.gtkAvailable : false
+    property bool qtThemingEnabled: typeof SettingsData !== "undefined" ? (SettingsData.qt5ctAvailable || SettingsData.qt6ctAvailable) : false
+    property var workerRunning: false
+    property var matugenColors: ({})
+    property var customThemeData: null
+
+    Component.onCompleted: {
+        Quickshell.execDetached(["mkdir", "-p", stateDir])
+        Proc.runCommand("matugenCheck", ["which", "matugen"], (output, code) => {
+            matugenAvailable = (code === 0) && !envDisableMatugen
+            const isGreeterMode = (typeof SessionData !== "undefined" && SessionData.isGreeterMode)
+
+            if (!matugenAvailable || isGreeterMode) {
+                return
+            }
+
+            if (colorsFileLoadFailed && currentTheme === dynamic && wallpaperPath) {
+                console.log("Theme: Matugen now available, regenerating colors for dynamic theme")
+                const isLight = (typeof SessionData !== "undefined" && SessionData.isLightMode)
+                const iconTheme = (typeof SettingsData !== "undefined" && SettingsData.iconTheme) ? SettingsData.iconTheme : "System Default"
+                Quickshell.execDetached(["rm", "-f", stateDir + "/matugen.key"])
+                const selectedMatugenType = (typeof SettingsData !== "undefined" && SettingsData.matugenScheme) ? SettingsData.matugenScheme : "scheme-tonal-spot"
+                if (wallpaperPath.startsWith("#")) {
+                    setDesiredTheme("hex", wallpaperPath, isLight, iconTheme, selectedMatugenType)
+                } else {
+                    setDesiredTheme("image", wallpaperPath, isLight, iconTheme, selectedMatugenType)
+                }
+                return
+            }
+
+            const isLight = (typeof SessionData !== "undefined" && SessionData.isLightMode)
+            const iconTheme = (typeof SettingsData !== "undefined" && SettingsData.iconTheme) ? SettingsData.iconTheme : "System Default"
+
+            if (currentTheme === dynamic) {
+                if (wallpaperPath) {
+                    Quickshell.execDetached(["rm", "-f", stateDir + "/matugen.key"])
+                    const selectedMatugenType = (typeof SettingsData !== "undefined" && SettingsData.matugenScheme) ? SettingsData.matugenScheme : "scheme-tonal-spot"
+                    if (wallpaperPath.startsWith("#")) {
+                        setDesiredTheme("hex", wallpaperPath, isLight, iconTheme, selectedMatugenType)
+                    } else {
+                        setDesiredTheme("image", wallpaperPath, isLight, iconTheme, selectedMatugenType)
+                    }
+                }
+            } else {
+                let primaryColor
+                let matugenType
+                if (currentTheme === "custom") {
+                    if (customThemeData && customThemeData.primary) {
+                        primaryColor = customThemeData.primary
+                        matugenType = customThemeData.matugen_type
+                    }
+                } else {
+                    primaryColor = currentThemeData.primary
+                    matugenType = currentThemeData.matugen_type
+                }
+
+                if (primaryColor) {
+                    Quickshell.execDetached(["rm", "-f", stateDir + "/matugen.key"])
+                    setDesiredTheme("hex", primaryColor, isLight, iconTheme, matugenType)
+                }
+            }
+        }, 0)
+        if (typeof SessionData !== "undefined") {
+            SessionData.isLightModeChanged.connect(root.onLightModeChanged)
+        }
+
+        if (typeof SettingsData !== "undefined" && SettingsData.currentThemeName) {
+            switchTheme(SettingsData.currentThemeName, false, false)
+        }
+    }
+
+    function applyGreeterTheme(themeName) {
+        switchTheme(themeName, false, false)
+        if (themeName === dynamic && dynamicColorsFileView.path) {
+            dynamicColorsFileView.reload()
+        }
+    }
+
+    function getMatugenColor(path, fallback) {
+        const colorMode = (typeof SessionData !== "undefined" && SessionData.isLightMode) ? "light" : "dark"
+        let cur = matugenColors && matugenColors.colors && matugenColors.colors[colorMode]
+        for (const part of path.split(".")) {
+            if (!cur || typeof cur !== "object" || !(part in cur))
+                return fallback
+            cur = cur[part]
+        }
+        return cur || fallback
+    }
+
+    readonly property var currentThemeData: {
+        if (currentTheme === "custom") {
+            return customThemeData || StockThemes.getThemeByName("blue", isLightMode)
+        } else if (currentTheme === dynamic) {
+            return {
+                "primary": getMatugenColor("primary", "#42a5f5"),
+                "primaryText": getMatugenColor("on_primary", "#ffffff"),
+                "primaryContainer": getMatugenColor("primary_container", "#1976d2"),
+                "secondary": getMatugenColor("secondary", "#8ab4f8"),
+                "surface": getMatugenColor("surface", "#1a1c1e"),
+                "surfaceText": getMatugenColor("on_background", "#e3e8ef"),
+                "surfaceVariant": getMatugenColor("surface_variant", "#44464f"),
+                "surfaceVariantText": getMatugenColor("on_surface_variant", "#c4c7c5"),
+                "surfaceTint": getMatugenColor("surface_tint", "#8ab4f8"),
+                "background": getMatugenColor("background", "#1a1c1e"),
+                "backgroundText": getMatugenColor("on_background", "#e3e8ef"),
+                "outline": getMatugenColor("outline", "#8e918f"),
+                "surfaceContainer": getMatugenColor("surface_container", "#1e2023"),
+                "surfaceContainerHigh": getMatugenColor("surface_container_high", "#292b2f"),
+                "surfaceContainerHighest": getMatugenColor("surface_container_highest", "#343740"),
+                "error": "#F2B8B5",
+                "warning": "#FF9800",
+                "info": "#2196F3",
+                "success": "#4CAF50"
+            }
+        } else {
+            return StockThemes.getThemeByName(currentTheme, isLightMode)
+        }
+    }
+
+    readonly property var availableMatugenSchemes: [
+        ({ "value": "scheme-tonal-spot", "label": "Tonal Spot", "description": "Balanced palette with focused accents (default)." }),
+        ({ "value": "scheme-content", "label": "Content", "description": "Derives colors that closely match the underlying image." }),
+        ({ "value": "scheme-expressive", "label": "Expressive", "description": "Vibrant palette with playful saturation." }),
+        ({ "value": "scheme-fidelity", "label": "Fidelity", "description": "High-fidelity palette that preserves source hues." }),
+        ({ "value": "scheme-fruit-salad", "label": "Fruit Salad", "description": "Colorful mix of bright contrasting accents." }),
+        ({ "value": "scheme-monochrome", "label": "Monochrome", "description": "Minimal palette built around a single hue." }),
+        ({ "value": "scheme-neutral", "label": "Neutral", "description": "Muted palette with subdued, calming tones." }),
+        ({ "value": "scheme-rainbow", "label": "Rainbow", "description": "Diverse palette spanning the full spectrum." })
+    ]
+
+    function getMatugenScheme(value) {
+        const schemes = availableMatugenSchemes
+        for (let i = 0; i < schemes.length; i++) {
+            if (schemes[i].value === value)
+                return schemes[i]
+        }
+        return schemes[0]
+    }
+
+    property color primary: currentThemeData.primary
+    property color primaryText: currentThemeData.primaryText
+    property color primaryContainer: currentThemeData.primaryContainer
+    property color secondary: currentThemeData.secondary
+    property color surface: {
+        if (typeof SettingsData !== "undefined" && SettingsData.surfaceBase === "s") {
+            return currentThemeData.background
+        }
+        return currentThemeData.surface
+    }
+    property color surfaceText: currentThemeData.surfaceText
+    property color surfaceVariant: currentThemeData.surfaceVariant
+    property color surfaceVariantText: currentThemeData.surfaceVariantText
+    property color surfaceTint: currentThemeData.surfaceTint
+    property color background: currentThemeData.background
+    property color backgroundText: currentThemeData.backgroundText
+    property color outline: currentThemeData.outline
+    property color outlineVariant: currentThemeData.outlineVariant || Qt.rgba(outline.r, outline.g, outline.b, 0.6)
+    property color surfaceContainer: {
+        if (typeof SettingsData !== "undefined" && SettingsData.surfaceBase === "s") {
+            return currentThemeData.surface
+        }
+        return currentThemeData.surfaceContainer
+    }
+    property color surfaceContainerHigh: {
+        if (typeof SettingsData !== "undefined" && SettingsData.surfaceBase === "s") {
+            return currentThemeData.surfaceContainer
+        }
+        return currentThemeData.surfaceContainerHigh
+    }
+    property color surfaceContainerHighest: {
+        if (typeof SettingsData !== "undefined" && SettingsData.surfaceBase === "s") {
+            return currentThemeData.surfaceContainerHigh
+        }
+        return currentThemeData.surfaceContainerHighest
+    }
+
+    property color onSurface: surfaceText
+    property color onSurfaceVariant: surfaceVariantText
+    property color onPrimary: primaryText
+    property color onSurface_12: Qt.rgba(onSurface.r, onSurface.g, onSurface.b, 0.12)
+    property color onSurface_38: Qt.rgba(onSurface.r, onSurface.g, onSurface.b, 0.38)
+    property color onSurfaceVariant_30: Qt.rgba(onSurfaceVariant.r, onSurfaceVariant.g, onSurfaceVariant.b, 0.30)
+
+    property color error: currentThemeData.error || "#F2B8B5"
+    property color warning: currentThemeData.warning || "#FF9800"
+    property color info: currentThemeData.info || "#2196F3"
+    property color tempWarning: "#ff9933"
+    property color tempDanger: "#ff5555"
+    property color success: currentThemeData.success || "#4CAF50"
+
+    property color primaryHover: Qt.rgba(primary.r, primary.g, primary.b, 0.12)
+    property color primaryHoverLight: Qt.rgba(primary.r, primary.g, primary.b, 0.08)
+    property color primaryPressed: Qt.rgba(primary.r, primary.g, primary.b, 0.16)
+    property color primarySelected: Qt.rgba(primary.r, primary.g, primary.b, 0.3)
+    property color primaryBackground: Qt.rgba(primary.r, primary.g, primary.b, 0.04)
+
+    property color secondaryHover: Qt.rgba(secondary.r, secondary.g, secondary.b, 0.08)
+
+    property color surfaceHover: Qt.rgba(surfaceVariant.r, surfaceVariant.g, surfaceVariant.b, 0.08)
+    property color surfacePressed: Qt.rgba(surfaceVariant.r, surfaceVariant.g, surfaceVariant.b, 0.12)
+    property color surfaceSelected: Qt.rgba(surfaceVariant.r, surfaceVariant.g, surfaceVariant.b, 0.15)
+    property color surfaceLight: Qt.rgba(surfaceVariant.r, surfaceVariant.g, surfaceVariant.b, 0.1)
+    property color surfaceVariantAlpha: Qt.rgba(surfaceVariant.r, surfaceVariant.g, surfaceVariant.b, 0.2)
+    property color surfaceTextHover: Qt.rgba(surfaceText.r, surfaceText.g, surfaceText.b, 0.08)
+    property color surfaceTextAlpha: Qt.rgba(surfaceText.r, surfaceText.g, surfaceText.b, 0.3)
+    property color surfaceTextLight: Qt.rgba(surfaceText.r, surfaceText.g, surfaceText.b, 0.06)
+    property color surfaceTextMedium: Qt.rgba(surfaceText.r, surfaceText.g, surfaceText.b, 0.7)
+
+    property color outlineButton: Qt.rgba(outline.r, outline.g, outline.b, 0.5)
+    property color outlineLight: Qt.rgba(outline.r, outline.g, outline.b, 0.05)
+    property color outlineMedium: Qt.rgba(outline.r, outline.g, outline.b, 0.08)
+    property color outlineStrong: Qt.rgba(outline.r, outline.g, outline.b, 0.12)
+
+    property color errorHover: Qt.rgba(error.r, error.g, error.b, 0.12)
+    property color errorPressed: Qt.rgba(error.r, error.g, error.b, 0.16)
+
+    property color shadowMedium: Qt.rgba(0, 0, 0, 0.08)
+    property color shadowStrong: Qt.rgba(0, 0, 0, 0.3)
+
+    readonly property var animationDurations: [
+        { shorter: 0, short: 0, medium: 0, long: 0, extraLong: 0 },
+        { shorter: 50, short: 75, medium: 150, long: 250, extraLong: 500 },
+        { shorter: 100, short: 150, medium: 300, long: 500, extraLong: 1000 },
+        { shorter: 150, short: 225, medium: 450, long: 750, extraLong: 1500 },
+        { shorter: 200, short: 300, medium: 600, long: 1000, extraLong: 2000 }
+    ]
+
+    readonly property int currentAnimationSpeed: typeof SettingsData !== "undefined" ? SettingsData.animationSpeed : SettingsData.AnimationSpeed.Short
+    readonly property var currentDurations: animationDurations[currentAnimationSpeed] || animationDurations[SettingsData.AnimationSpeed.Short]
+
+    property int shorterDuration: currentDurations.shorter
+    property int shortDuration: currentDurations.short
+    property int mediumDuration: currentDurations.medium
+    property int longDuration: currentDurations.long
+    property int extraLongDuration: currentDurations.extraLong
+    property int standardEasing: Easing.OutCubic
+    property int emphasizedEasing: Easing.OutQuart
+
+    property real cornerRadius: typeof SettingsData !== "undefined" ? SettingsData.cornerRadius : 12
+    property real spacingXS: 4
+    property real spacingS: 8
+    property real spacingM: 12
+    property real spacingL: 16
+    property real spacingXL: 24
+    property real fontSizeSmall: (typeof SettingsData !== "undefined" ? SettingsData.fontScale : 1.0) * 12
+    property real fontSizeMedium: (typeof SettingsData !== "undefined" ? SettingsData.fontScale : 1.0) * 14
+    property real fontSizeLarge: (typeof SettingsData !== "undefined" ? SettingsData.fontScale : 1.0) * 16
+    property real fontSizeXLarge: (typeof SettingsData !== "undefined" ? SettingsData.fontScale : 1.0) * 20
+    property real barHeight: 48
+    property real iconSize: 24
+    property real iconSizeSmall: 16
+    property real iconSizeLarge: 32
+
+    property real panelTransparency: 0.85
+    property real widgetTransparency: typeof SettingsData !== "undefined" && SettingsData.dankBarWidgetTransparency !== undefined ? SettingsData.dankBarWidgetTransparency : 1.0
+    property real popupTransparency: typeof SettingsData !== "undefined" && SettingsData.popupTransparency !== undefined ? SettingsData.popupTransparency : 1.0
+
+    function screenTransition() {
+        CompositorService.isNiri && NiriService.doScreenTransition()
+    }
+
+    function switchTheme(themeName, savePrefs = true, enableTransition = true) {
+        if (enableTransition) {
+            screenTransition()
+            themeTransitionTimer.themeName = themeName
+            themeTransitionTimer.savePrefs = savePrefs
+            themeTransitionTimer.restart()
+            return
+        }
+
+        if (themeName === dynamic) {
+            currentTheme = dynamic
+            currentThemeCategory = dynamic
+        } else if (themeName === custom) {
+            currentTheme = custom
+            currentThemeCategory = custom
+            if (typeof SettingsData !== "undefined" && SettingsData.customThemeFile) {
+                loadCustomThemeFromFile(SettingsData.customThemeFile)
+            }
+        } else {
+            currentTheme = themeName
+            if (StockThemes.isCatppuccinVariant(themeName)) {
+                currentThemeCategory = "catppuccin"
+            } else {
+                currentThemeCategory = "generic"
+            }
+        }
+        const isGreeterMode = (typeof SessionData !== "undefined" && SessionData.isGreeterMode)
+        if (savePrefs && typeof SettingsData !== "undefined" && !isGreeterMode)
+            SettingsData.setTheme(currentTheme)
+
+        if (!isGreeterMode) {
+            generateSystemThemesFromCurrentTheme()
+        }
+    }
+
+    function setLightMode(light, savePrefs = true, enableTransition = false) {
+        if (enableTransition) {
+            screenTransition()
+            lightModeTransitionTimer.lightMode = light
+            lightModeTransitionTimer.savePrefs = savePrefs
+            lightModeTransitionTimer.restart()
+            return
+        }
+
+        const isGreeterMode = (typeof SessionData !== "undefined" && SessionData.isGreeterMode)
+        if (savePrefs && typeof SessionData !== "undefined" && !isGreeterMode)
+            SessionData.setLightMode(light)
+        if (!isGreeterMode) {
+            PortalService.setLightMode(light)
+            generateSystemThemesFromCurrentTheme()
+        }
+    }
+
+    function toggleLightMode(savePrefs = true) {
+        setLightMode(!isLightMode, savePrefs, true)
+    }
+
+    function forceGenerateSystemThemes() {
+        if (!matugenAvailable) {
+            return
+        }
+        generateSystemThemesFromCurrentTheme()
+    }
+
+    function getAvailableThemes() {
+        return StockThemes.getAllThemeNames()
+    }
+
+    function getThemeDisplayName(themeName) {
+        const themeData = StockThemes.getThemeByName(themeName, isLightMode)
+        return themeData.name
+    }
+
+    function getThemeColors(themeName) {
+        if (themeName === "custom" && customThemeData) {
+            return customThemeData
+        }
+        return StockThemes.getThemeByName(themeName, isLightMode)
+    }
+
+    function switchThemeCategory(category, defaultTheme) {
+        screenTransition()
+        themeCategoryTransitionTimer.category = category
+        themeCategoryTransitionTimer.defaultTheme = defaultTheme
+        themeCategoryTransitionTimer.restart()
+    }
+
+    function getCatppuccinColor(variantName) {
+        const catColors = {
+            "cat-rosewater": "#f5e0dc", "cat-flamingo": "#f2cdcd", "cat-pink": "#f5c2e7", "cat-mauve": "#cba6f7",
+            "cat-red": "#f38ba8", "cat-maroon": "#eba0ac", "cat-peach": "#fab387", "cat-yellow": "#f9e2af",
+            "cat-green": "#a6e3a1", "cat-teal": "#94e2d5", "cat-sky": "#89dceb", "cat-sapphire": "#74c7ec",
+            "cat-blue": "#89b4fa", "cat-lavender": "#b4befe"
+        }
+        return catColors[variantName] || "#cba6f7"
+    }
+
+    function getCatppuccinVariantName(variantName) {
+        const catNames = {
+            "cat-rosewater": "Rosewater", "cat-flamingo": "Flamingo", "cat-pink": "Pink", "cat-mauve": "Mauve",
+            "cat-red": "Red", "cat-maroon": "Maroon", "cat-peach": "Peach", "cat-yellow": "Yellow",
+            "cat-green": "Green", "cat-teal": "Teal", "cat-sky": "Sky", "cat-sapphire": "Sapphire",
+            "cat-blue": "Blue", "cat-lavender": "Lavender"
+        }
+        return catNames[variantName] || "Unknown"
+    }
+
+    function loadCustomTheme(themeData) {
+        if (themeData.dark || themeData.light) {
+            const colorMode = (typeof SessionData !== "undefined" && SessionData.isLightMode) ? "light" : "dark"
+            const selectedTheme = themeData[colorMode] || themeData.dark || themeData.light
+            customThemeData = selectedTheme
+        } else {
+            customThemeData = themeData
+        }
+
+        generateSystemThemesFromCurrentTheme()
+    }
+
+    function loadCustomThemeFromFile(filePath) {
+        customThemeFileView.path = filePath
+    }
+
+    property alias availableThemeNames: root._availableThemeNames
+    readonly property var _availableThemeNames: StockThemes.getAllThemeNames()
+    property string currentThemeName: currentTheme
+
+    function popupBackground() {
+        return Qt.rgba(surfaceContainer.r, surfaceContainer.g, surfaceContainer.b, popupTransparency)
+    }
+
+    function contentBackground() {
+        return Qt.rgba(surfaceContainer.r, surfaceContainer.g, surfaceContainer.b, popupTransparency)
+    }
+
+    function panelBackground() {
+        return Qt.rgba(surfaceContainer.r, surfaceContainer.g, surfaceContainer.b, panelTransparency)
+    }
+
+    property real notepadTransparency: SettingsData.notepadTransparencyOverride >= 0 ? SettingsData.notepadTransparencyOverride : popupTransparency
+
+    property var widgetBaseBackgroundColor: {
+        const colorMode = typeof SettingsData !== "undefined" ? SettingsData.widgetBackgroundColor : "sch"
+        switch (colorMode) {
+            case "s":
+                return surface
+            case "sc":
+                return surfaceContainer
+            case "sch":
+                return surfaceContainerHigh
+            case "sth":
+            default:
+                return surfaceTextHover
+        }
+    }
+
+    property var widgetBaseHoverColor: {
+        const baseColor = widgetBaseBackgroundColor
+        const factor = 1.2
+        return isLightMode ? Qt.darker(baseColor, factor) : Qt.lighter(baseColor, factor)
+    }
+
+    property var widgetBackground: {
+        const colorMode = typeof SettingsData !== "undefined" ? SettingsData.widgetBackgroundColor : "sch"
+        switch (colorMode) {
+            case "s":
+                return Qt.rgba(surface.r, surface.g, surface.b, widgetTransparency)
+            case "sc":
+                return Qt.rgba(surfaceContainer.r, surfaceContainer.g, surfaceContainer.b, widgetTransparency)
+            case "sch":
+                return Qt.rgba(surfaceContainerHigh.r, surfaceContainerHigh.g, surfaceContainerHigh.b, widgetTransparency)
+            case "sth":
+            default:
+                return Qt.rgba(surfaceContainer.r, surfaceContainer.g, surfaceContainer.b, widgetTransparency)
+        }
+    }
+
+    function getPopupBackgroundAlpha() {
+        return popupTransparency
+    }
+
+    function getContentBackgroundAlpha() {
+        return popupTransparency
+    }
+
+    function isColorDark(c) {
+        return (0.299 * c.r + 0.587 * c.g + 0.114 * c.b) < 0.5
+    }
+
+    function barIconSize(barThickness, offset) {
+        const defaultOffset = offset !== undefined ? offset : -6
+        return Math.round((barThickness / 48) * (iconSize + defaultOffset))
+    }
+
+    function barTextSize(barThickness) {
+        const scale = barThickness / 48
+        const dankBarScale = (typeof SettingsData !== "undefined" ? SettingsData.dankBarFontScale : 1.0)
+        if (scale <= 0.75) return fontSizeSmall * 0.9 * dankBarScale
+        if (scale >= 1.25) return fontSizeMedium * dankBarScale
+        return fontSizeSmall * dankBarScale
+    }
+
+    function getBatteryIcon(level, isCharging, batteryAvailable) {
+        if (!batteryAvailable)
+            return _getBatteryPowerProfileIcon()
+
+        if (isCharging) {
+            if (level >= 90)
+                return "battery_charging_full"
+            if (level >= 80)
+                return "battery_charging_90"
+            if (level >= 60)
+                return "battery_charging_80"
+            if (level >= 50)
+                return "battery_charging_60"
+            if (level >= 30)
+                return "battery_charging_50"
+            if (level >= 20)
+                return "battery_charging_30"
+            return "battery_charging_20"
+        } else {
+            if (level >= 95)
+                return "battery_full"
+            if (level >= 85)
+                return "battery_6_bar"
+            if (level >= 70)
+                return "battery_5_bar"
+            if (level >= 55)
+                return "battery_4_bar"
+            if (level >= 40)
+                return "battery_3_bar"
+            if (level >= 25)
+                return "battery_2_bar"
+            if (level >= 10)
+                return "battery_1_bar"
+            return "battery_alert"
+        }
+    }
+
+    function _getBatteryPowerProfileIcon() {
+        if (typeof PowerProfiles === "undefined")
+            return "balance"
+
+        switch (PowerProfiles.profile) {
+        case PowerProfile.PowerSaver:
+            return "energy_savings_leaf"
+        case PowerProfile.Performance:
+            return "rocket_launch"
+        default:
+            return "balance"
+        }
+    }
+
+    function getPowerProfileIcon(profile) {
+        switch (profile) {
+        case PowerProfile.PowerSaver:
+            return "battery_saver"
+        case PowerProfile.Balanced:
+            return "battery_std"
+        case PowerProfile.Performance:
+            return "flash_on"
+        default:
+            return "settings"
+        }
+    }
+
+    function getPowerProfileLabel(profile) {
+        switch (profile) {
+        case PowerProfile.PowerSaver:
+            return "Power Saver"
+        case PowerProfile.Balanced:
+            return "Balanced"
+        case PowerProfile.Performance:
+            return "Performance"
+        default:
+            return profile.charAt(0).toUpperCase() + profile.slice(1)
+        }
+    }
+
+    function getPowerProfileDescription(profile) {
+        switch (profile) {
+        case PowerProfile.PowerSaver:
+            return "Extend battery life"
+        case PowerProfile.Balanced:
+            return "Balance power and performance"
+        case PowerProfile.Performance:
+            return "Prioritize performance"
+        default:
+            return "Custom power profile"
+        }
+    }
+
+
+    function onLightModeChanged() {
+        if (currentTheme === "custom" && customThemeFileView.path) {
+            customThemeFileView.reload()
+        }
+    }
+
+    function setDesiredTheme(kind, value, isLight, iconTheme, matugenType) {
+        if (!matugenAvailable) {
+            console.warn("Theme: matugen not available or disabled - cannot set system theme")
+            return
+        }
+
+        console.log("Theme: Setting desired theme -", kind, "mode:", isLight ? "light" : "dark", "type:", matugenType)
+
+        if (typeof NiriService !== "undefined" && CompositorService.isNiri) {
+            NiriService.suppressNextToast()
+        }
+
+        const desired = {
+            "kind": kind,
+            "value": value,
+            "mode": isLight ? "light" : "dark",
+            "iconTheme": iconTheme || "System Default",
+            "matugenType": matugenType || "scheme-tonal-spot",
+            "surfaceBase": (typeof SettingsData !== "undefined" && SettingsData.surfaceBase) ? SettingsData.surfaceBase : "sc",
+            "runUserTemplates": (typeof SettingsData !== "undefined") ? SettingsData.runUserMatugenTemplates : true
+        }
+
+        const json = JSON.stringify(desired)
+        const desiredPath = stateDir + "/matugen.desired.json"
+
+        Quickshell.execDetached(["sh", "-c", `mkdir -p '${stateDir}' && cat > '${desiredPath}' << 'EOF'\n${json}\nEOF`])
+        workerRunning = true
+        if (rawWallpaperPath.startsWith("we:")) {
+            console.log("Theme: Starting matugen worker (WE wallpaper)")
+            systemThemeGenerator.command = [
+                "sh", "-c",
+                `sleep 1 && ${shellDir}/scripts/matugen-worker.sh '${stateDir}' '${shellDir}' '${configDir}' --run`
+            ]
+        } else {
+            console.log("Theme: Starting matugen worker")
+            systemThemeGenerator.command = [shellDir + "/scripts/matugen-worker.sh", stateDir, shellDir, configDir, "--run"]
+        }
+        systemThemeGenerator.running = true
+    }
+
+    function generateSystemThemesFromCurrentTheme() {
+        const isGreeterMode = (typeof SessionData !== "undefined" && SessionData.isGreeterMode)
+        if (!matugenAvailable || isGreeterMode)
+            return
+
+        const isLight = (typeof SessionData !== "undefined" && SessionData.isLightMode)
+        const iconTheme = (typeof SettingsData !== "undefined" && SettingsData.iconTheme) ? SettingsData.iconTheme : "System Default"
+
+        if (currentTheme === dynamic) {
+            if (!wallpaperPath) {
+                return
+            }
+            const selectedMatugenType = (typeof SettingsData !== "undefined" && SettingsData.matugenScheme) ? SettingsData.matugenScheme : "scheme-tonal-spot"
+            if (wallpaperPath.startsWith("#")) {
+                setDesiredTheme("hex", wallpaperPath, isLight, iconTheme, selectedMatugenType)
+            } else {
+                setDesiredTheme("image", wallpaperPath, isLight, iconTheme, selectedMatugenType)
+            }
+        } else {
+            let primaryColor
+            let matugenType
+            if (currentTheme === "custom") {
+                if (!customThemeData || !customThemeData.primary) {
+                    console.warn("Custom theme data not available for system theme generation")
+                    return
+                }
+                primaryColor = customThemeData.primary
+                matugenType = customThemeData.matugen_type
+            } else {
+                primaryColor = currentThemeData.primary
+                matugenType = currentThemeData.matugen_type
+            }
+
+            if (!primaryColor) {
+                console.warn("No primary color available for theme:", currentTheme)
+                return
+            }
+            setDesiredTheme("hex", primaryColor, isLight, iconTheme, matugenType)
+        }
+    }
+
+    function applyGtkColors() {
+        if (!matugenAvailable) {
+            if (typeof ToastService !== "undefined") {
+                ToastService.showError("matugen not available or disabled - cannot apply GTK colors")
+            }
+            return
+        }
+
+        const isLight = (typeof SessionData !== "undefined" && SessionData.isLightMode) ? "true" : "false"
+        Proc.runCommand("gtkApplier", [shellDir + "/scripts/gtk.sh", configDir, isLight, shellDir], (output, exitCode) => {
+            if (exitCode === 0) {
+                if (typeof ToastService !== "undefined" && typeof NiriService !== "undefined" && !NiriService.matugenSuppression) {
+                    ToastService.showInfo("GTK colors applied successfully")
+                }
+            } else {
+                if (typeof ToastService !== "undefined") {
+                    ToastService.showError("Failed to apply GTK colors")
+                }
+            }
+        })
+    }
+
+    function applyQtColors() {
+        if (!matugenAvailable) {
+            if (typeof ToastService !== "undefined") {
+                ToastService.showError("matugen not available or disabled - cannot apply Qt colors")
+            }
+            return
+        }
+
+        Proc.runCommand("qtApplier", [shellDir + "/scripts/qt.sh", configDir], (output, exitCode) => {
+            if (exitCode === 0) {
+                if (typeof ToastService !== "undefined") {
+                    ToastService.showInfo("Qt colors applied successfully")
+                }
+            } else {
+                if (typeof ToastService !== "undefined") {
+                    ToastService.showError("Failed to apply Qt colors")
+                }
+            }
+        })
+    }
+
+    function withAlpha(c, a) { return Qt.rgba(c.r, c.g, c.b, a); }
+
+    function snap(value, dpr) {
+        const s = dpr || 1
+        return Math.round(value * s) / s
+    }
+
+    function px(value, dpr) {
+        const s = dpr || 1
+        return Math.round(value * s) / s
+    }
+
+    function hairline(dpr) {
+        return 1 / (dpr || 1)
+    }
+
+    function invertHex(hex) {
+        hex = hex.replace('#', '');
+
+        if (!/^[0-9A-Fa-f]{6}$/.test(hex)) {
+            return hex;
+        }
+
+        const r = parseInt(hex.substr(0, 2), 16);
+        const g = parseInt(hex.substr(2, 2), 16);
+        const b = parseInt(hex.substr(4, 2), 16);
+
+        const invR = (255 - r).toString(16).padStart(2, '0');
+        const invG = (255 - g).toString(16).padStart(2, '0');
+        const invB = (255 - b).toString(16).padStart(2, '0');
+
+        return `#${invR}${invG}${invB}`;
+    }
+
+    property string baseLogoColor: {
+        if (typeof SettingsData === "undefined") return ""
+        const colorOverride = SettingsData.launcherLogoColorOverride
+        if (!colorOverride || colorOverride === "") return ""
+        if (colorOverride === "primary") return primary
+        if (colorOverride === "surface") return surfaceText
+        return colorOverride
+    }
+
+    property string effectiveLogoColor: {
+        if (typeof SettingsData === "undefined") return ""
+
+        const colorOverride = SettingsData.launcherLogoColorOverride
+        if (!colorOverride || colorOverride === "") return ""
+
+        if (colorOverride === "primary") return primary
+        if (colorOverride === "surface") return surfaceText
+
+        if (!SettingsData.launcherLogoColorInvertOnMode) {
+            return colorOverride
+        }
+
+        if (isLightMode) {
+            return invertHex(colorOverride)
+        }
+
+        return colorOverride
+    }
+
+
+
+    Process {
+        id: systemThemeGenerator
+        running: false
+
+        onExited: exitCode => {
+            workerRunning = false
+
+            if (exitCode === 0) {
+                console.log("Theme: Matugen worker completed successfully")
+                if (currentTheme === dynamic) {
+                    console.log("Theme: Reloading dynamic colors file")
+                    dynamicColorsFileView.reload()
+                }
+            } else if (exitCode === 2) {
+                console.log("Theme: Matugen worker completed with code 2 (no changes needed)")
+            } else {
+                if (typeof ToastService !== "undefined") {
+                    ToastService.showError("Theme worker failed (" + exitCode + ")")
+                }
+                console.warn("Theme: Matugen worker failed with exit code:", exitCode)
+            }
+        }
+    }
+
+    FileView {
+        id: customThemeFileView
+        watchChanges: currentTheme === "custom"
+
+        function parseAndLoadTheme() {
+            try {
+                var themeData = JSON.parse(customThemeFileView.text())
+                loadCustomTheme(themeData)
+            } catch (e) {
+                ToastService.showError("Invalid JSON format: " + e.message)
+            }
+        }
+
+        onLoaded: {
+            parseAndLoadTheme()
+        }
+
+        onFileChanged: {
+            customThemeFileView.reload()
+        }
+
+        onLoadFailed: function (error) {
+            if (typeof ToastService !== "undefined") {
+                ToastService.showError("Failed to read theme file: " + error)
+            }
+        }
+    }
+
+    FileView {
+        id: dynamicColorsFileView
+        path: {
+            const greetCfgDir = Quickshell.env("DMS_GREET_CFG_DIR") || "/etc/greetd/.dms"
+            const colorsPath = SessionData.isGreeterMode
+                ? greetCfgDir + "/colors.json"
+                : stateDir + "/dms-colors.json"
+            return colorsPath
+        }
+        watchChanges: currentTheme === dynamic && !SessionData.isGreeterMode
+
+        function parseAndLoadColors() {
+            try {
+                const colorsText = dynamicColorsFileView.text()
+                if (colorsText) {
+                    root.matugenColors = JSON.parse(colorsText)
+                    if (typeof ToastService !== "undefined") {
+                        ToastService.clearWallpaperError()
+                    }
+                }
+            } catch (e) {
+                console.error("Theme: Failed to parse dynamic colors:", e)
+                if (typeof ToastService !== "undefined") {
+                    ToastService.wallpaperErrorStatus = "error"
+                    ToastService.showError("Dynamic colors parse error: " + e.message)
+                }
+            }
+        }
+
+        onLoaded: {
+            if (currentTheme === dynamic) {
+                console.log("Theme: Dynamic colors file loaded successfully")
+                colorsFileLoadFailed = false
+                parseAndLoadColors()
+            }
+        }
+
+        onFileChanged: {
+            if (currentTheme === dynamic) {
+                dynamicColorsFileView.reload()
+            }
+        }
+
+        onLoadFailed: function (error) {
+            if (currentTheme === dynamic) {
+                console.log("Theme: Dynamic colors file load failed, marking for regeneration")
+                colorsFileLoadFailed = true
+                const isGreeterMode = (typeof SessionData !== "undefined" && SessionData.isGreeterMode)
+                if (!isGreeterMode && matugenAvailable && wallpaperPath) {
+                    console.log("Theme: Matugen available, triggering immediate regeneration")
+                    generateSystemThemesFromCurrentTheme()
+                }
+            }
+        }
+
+        onPathChanged: {
+            colorsFileLoadFailed = false
+        }
+    }
+
+    IpcHandler {
+        target: "theme"
+
+        function toggle(): string {
+            root.toggleLightMode()
+            return root.isLightMode ? "dark" : "light"
+        }
+
+        function light(): string {
+            root.setLightMode(true, true, true)
+            return "light"
+        }
+
+        function dark(): string {
+            root.setLightMode(false, true, true)
+            return "dark"
+        }
+
+        function getMode(): string {
+            return root.isLightMode ? "light" : "dark"
+        }
+    }
+
+    // These timers are for screen transitions, since sometimes QML still beats the niri call
+    Timer {
+        id: themeTransitionTimer
+        interval: 50
+        repeat: false
+        property string themeName: ""
+        property bool savePrefs: true
+        onTriggered: root.switchTheme(themeName, savePrefs, false)
+    }
+
+    Timer {
+        id: lightModeTransitionTimer
+        interval: 100
+        repeat: false
+        property bool lightMode: false
+        property bool savePrefs: true
+        onTriggered: root.setLightMode(lightMode, savePrefs, false)
+    }
+
+    Timer {
+        id: themeCategoryTransitionTimer
+        interval: 50
+        repeat: false
+        property string category: ""
+        property string defaultTheme: ""
+        onTriggered: {
+            root.currentThemeCategory = category
+            root.switchTheme(defaultTheme, true, false)
+        }
+    }
+}

DMSGreeter.qml

@@ -0,0 +1,29 @@
+import QtQuick
+import Quickshell
+import Quickshell.Wayland
+import Quickshell.Services.Greetd
+import qs.Common
+import qs.Modules.Greetd
+
+Item {
+    id: root
+
+    WlSessionLock {
+        id: sessionLock
+        locked: false
+
+        Component.onCompleted: {
+            Qt.callLater(() => { locked = true })
+        }
+
+        onLockedChanged: {
+            if (!locked) {
+                console.log("Greetd session unlocked, exiting")
+            }
+        }
+
+        GreeterSurface {
+            lock: sessionLock
+        }
+    }
+}

DMSShell.qml

@@ -0,0 +1,541 @@
+import QtQuick
+import Quickshell
+import Quickshell.Io
+import qs.Common
+import qs.Modals
+import qs.Modals.Clipboard
+import qs.Modals.Common
+import qs.Modals.Settings
+import qs.Modals.Spotlight
+import qs.Modules
+import qs.Modules.AppDrawer
+import qs.Modules.DankDash
+import qs.Modules.ControlCenter
+import qs.Modules.Dock
+import qs.Modules.Lock
+import qs.Modules.Notepad
+import qs.Modules.Notifications.Center
+import qs.Widgets
+import qs.Modules.Notifications.Popup
+import qs.Modules.OSD
+import qs.Modules.ProcessList
+import qs.Modules.Settings
+import qs.Modules.DankBar
+import qs.Modules.DankBar.Popouts
+import qs.Modules.Plugins
+import qs.Services
+
+Item {
+    id: root
+
+    Instantiator {
+        id: daemonPluginInstantiator
+        asynchronous: true
+        model: Object.keys(PluginService.pluginDaemonComponents)
+
+        delegate: Loader {
+            id: daemonLoader
+            property string pluginId: modelData
+            sourceComponent: PluginService.pluginDaemonComponents[pluginId]
+
+            onLoaded: {
+                if (item) {
+                    item.pluginService = PluginService
+                    if (item.popoutService !== undefined) {
+                        item.popoutService = PopoutService
+                    }
+                    item.pluginId = pluginId
+                    console.log("Daemon plugin loaded:", pluginId)
+                }
+            }
+        }
+    }
+
+    WallpaperBackground {}
+
+    Lock {
+        id: lock
+    }
+
+    Loader {
+        id: dankBarLoader
+        asynchronous: false
+
+        property var currentPosition: SettingsData.dankBarPosition
+        property bool initialized: false
+
+        sourceComponent: DankBar {
+            onColorPickerRequested: {
+                if (colorPickerModal.shouldBeVisible) {
+                    colorPickerModal.close()
+                } else {
+                    colorPickerModal.show()
+                }
+            }
+        }
+
+        Component.onCompleted: {
+            initialized = true
+        }
+
+        onCurrentPositionChanged: {
+            if (!initialized)
+                return
+
+            const component = sourceComponent
+            sourceComponent = null
+            sourceComponent = component
+        }
+    }
+
+    Loader {
+        id: dockLoader
+        active: true
+        asynchronous: false
+
+        property var currentPosition: SettingsData.dockPosition
+        property bool initialized: false
+
+        sourceComponent: Dock {
+            contextMenu: dockContextMenuLoader.item ? dockContextMenuLoader.item : null
+        }
+
+        onLoaded: {
+            if (item) {
+                dockContextMenuLoader.active = true
+            }
+        }
+
+        Component.onCompleted: {
+            initialized = true
+        }
+
+        onCurrentPositionChanged: {
+            if (!initialized)
+                return
+
+            console.log("DEBUG: Dock position changed to:", currentPosition, "- recreating dock")
+            const comp = sourceComponent
+            sourceComponent = null
+            sourceComponent = comp
+        }
+    }
+
+    Loader {
+        id: dankDashPopoutLoader
+
+        active: false
+        asynchronous: true
+
+        sourceComponent: Component {
+            DankDashPopout {
+                id: dankDashPopout
+
+                Component.onCompleted: {
+                    PopoutService.dankDashPopout = dankDashPopout
+                }
+            }
+        }
+    }
+
+    LazyLoader {
+        id: dockContextMenuLoader
+
+        active: false
+
+        DockContextMenu {
+            id: dockContextMenu
+        }
+    }
+
+    LazyLoader {
+        id: notificationCenterLoader
+
+        active: false
+
+        NotificationCenterPopout {
+            id: notificationCenter
+
+            Component.onCompleted: {
+                PopoutService.notificationCenterPopout = notificationCenter
+            }
+        }
+    }
+
+    Variants {
+        model: SettingsData.getFilteredScreens("notifications")
+
+        delegate: NotificationPopupManager {
+            modelData: item
+        }
+    }
+
+    LazyLoader {
+        id: controlCenterLoader
+
+        active: false
+
+        property var modalRef: colorPickerModal
+        property LazyLoader powerModalLoaderRef: powerMenuModalLoader
+
+        ControlCenterPopout {
+            id: controlCenterPopout
+            colorPickerModal: controlCenterLoader.modalRef
+            powerMenuModalLoader: controlCenterLoader.powerModalLoaderRef
+
+            onLockRequested: {
+                lock.activate()
+            }
+
+            Component.onCompleted: {
+                PopoutService.controlCenterPopout = controlCenterPopout
+            }
+        }
+    }
+
+    LazyLoader {
+        id: wifiPasswordModalLoader
+
+        active: false
+
+        WifiPasswordModal {
+            id: wifiPasswordModal
+
+            Component.onCompleted: {
+                PopoutService.wifiPasswordModal = wifiPasswordModal
+            }
+        }
+    }
+
+    LazyLoader {
+        id: networkInfoModalLoader
+
+        active: false
+
+        NetworkInfoModal {
+            id: networkInfoModal
+
+            Component.onCompleted: {
+                PopoutService.networkInfoModal = networkInfoModal
+            }
+        }
+    }
+
+    LazyLoader {
+        id: batteryPopoutLoader
+
+        active: false
+
+        BatteryPopout {
+            id: batteryPopout
+
+            Component.onCompleted: {
+                PopoutService.batteryPopout = batteryPopout
+            }
+        }
+    }
+
+    LazyLoader {
+        id: vpnPopoutLoader
+
+        active: false
+
+        VpnPopout {
+            id: vpnPopout
+
+            Component.onCompleted: {
+                PopoutService.vpnPopout = vpnPopout
+            }
+        }
+    }
+
+    LazyLoader {
+        id: powerMenuLoader
+
+        active: false
+
+        PowerMenu {
+            id: powerMenu
+
+            onPowerActionRequested: (action, title, message) => {
+                                        if (SettingsData.powerActionConfirm) {
+                                            powerConfirmModalLoader.active = true
+                                            if (powerConfirmModalLoader.item) {
+                                                powerConfirmModalLoader.item.confirmButtonColor = action === "poweroff" ? Theme.error : action === "reboot" ? Theme.warning : Theme.primary
+                                                powerConfirmModalLoader.item.show(title, message, () => actionApply(action), function () {})
+                                            }
+                                        } else {
+                                            actionApply(action)
+                                        }
+                                    }
+
+            function actionApply(action) {
+                switch (action) {
+                case "logout":
+                    SessionService.logout()
+                    break
+                case "suspend":
+                    SessionService.suspend()
+                    break
+                case "hibernate":
+                    SessionService.hibernate()
+                    break
+                case "reboot":
+                    SessionService.reboot()
+                    break
+                case "poweroff":
+                    SessionService.poweroff()
+                    break
+                }
+            }
+        }
+    }
+
+    LazyLoader {
+        id: powerConfirmModalLoader
+
+        active: false
+
+        ConfirmModal {
+            id: powerConfirmModal
+        }
+    }
+
+    LazyLoader {
+        id: processListPopoutLoader
+
+        active: false
+
+        ProcessListPopout {
+            id: processListPopout
+
+            Component.onCompleted: {
+                PopoutService.processListPopout = processListPopout
+            }
+        }
+    }
+
+    SettingsModal {
+        id: settingsModal
+
+        Component.onCompleted: {
+            PopoutService.settingsModal = settingsModal
+        }
+    }
+
+    LazyLoader {
+        id: appDrawerLoader
+
+        active: false
+
+        AppDrawerPopout {
+            id: appDrawerPopout
+
+            Component.onCompleted: {
+                PopoutService.appDrawerPopout = appDrawerPopout
+            }
+        }
+    }
+
+    SpotlightModal {
+        id: spotlightModal
+
+        Component.onCompleted: {
+            PopoutService.spotlightModal = spotlightModal
+        }
+    }
+
+    ClipboardHistoryModal {
+        id: clipboardHistoryModalPopup
+
+        Component.onCompleted: {
+            PopoutService.clipboardHistoryModal = clipboardHistoryModalPopup
+        }
+    }
+
+    NotificationModal {
+        id: notificationModal
+
+        Component.onCompleted: {
+            PopoutService.notificationModal = notificationModal
+        }
+    }
+
+    DankColorPickerModal {
+        id: colorPickerModal
+
+        Component.onCompleted: {
+            PopoutService.colorPickerModal = colorPickerModal
+        }
+    }
+
+    LazyLoader {
+        id: processListModalLoader
+
+        active: false
+
+        ProcessListModal {
+            id: processListModal
+
+            Component.onCompleted: {
+                PopoutService.processListModal = processListModal
+            }
+        }
+    }
+
+    LazyLoader {
+        id: systemUpdateLoader
+
+        active: false
+
+        SystemUpdatePopout {
+            id: systemUpdatePopout
+
+            Component.onCompleted: {
+                PopoutService.systemUpdatePopout = systemUpdatePopout
+            }
+        }
+    }
+
+    Variants {
+        id: notepadSlideoutVariants
+        model: SettingsData.getFilteredScreens("notepad")
+
+        delegate: DankSlideout {
+            id: notepadSlideout
+            modelData: item
+            title: I18n.tr("Notepad")
+            slideoutWidth: 480
+            expandable: true
+            expandedWidthValue: 960
+            customTransparency: SettingsData.notepadTransparencyOverride
+
+            content: Component {
+                Notepad {
+                    onHideRequested: {
+                        notepadSlideout.hide()
+                    }
+                }
+            }
+
+            function toggle() {
+                if (isVisible) {
+                    hide()
+                } else {
+                    show()
+                }
+            }
+        }
+    }
+
+    LazyLoader {
+        id: powerMenuModalLoader
+
+        active: false
+
+        PowerMenuModal {
+            id: powerMenuModal
+
+            onPowerActionRequested: (action, title, message) => {
+                                        if (SettingsData.powerActionConfirm) {
+                                            powerConfirmModalLoader.active = true
+                                            if (powerConfirmModalLoader.item) {
+                                                powerConfirmModalLoader.item.confirmButtonColor = action === "poweroff" ? Theme.error : action === "reboot" ? Theme.warning : Theme.primary
+                                                powerConfirmModalLoader.item.show(title, message, () => actionApply(action), function () {})
+                                            }
+                                        } else {
+                                            actionApply(action)
+                                        }
+                                    }
+
+            function actionApply(action) {
+                switch (action) {
+                case "logout":
+                    SessionService.logout()
+                    break
+                case "suspend":
+                    SessionService.suspend()
+                    break
+                case "hibernate":
+                    SessionService.hibernate()
+                    break
+                case "reboot":
+                    SessionService.reboot()
+                    break
+                case "poweroff":
+                    SessionService.poweroff()
+                    break
+                }
+            }
+
+            Component.onCompleted: {
+                PopoutService.powerMenuModal = powerMenuModal
+            }
+        }
+    }
+
+    LazyLoader {
+        id: hyprKeybindsModalLoader
+
+        active: false
+
+        HyprKeybindsModal {
+            id: hyprKeybindsModal
+
+            Component.onCompleted: {
+                PopoutService.hyprKeybindsModal = hyprKeybindsModal
+            }
+        }
+    }
+
+    DMSShellIPC {
+        powerMenuModalLoader: powerMenuModalLoader
+        processListModalLoader: processListModalLoader
+        controlCenterLoader: controlCenterLoader
+        dankDashPopoutLoader: dankDashPopoutLoader
+        notepadSlideoutVariants: notepadSlideoutVariants
+        hyprKeybindsModalLoader: hyprKeybindsModalLoader
+        dankBarLoader: dankBarLoader
+    }
+
+    Variants {
+        model: SettingsData.getFilteredScreens("toast")
+
+        delegate: Toast {
+            modelData: item
+            visible: ToastService.toastVisible
+        }
+    }
+
+    Variants {
+        model: SettingsData.getFilteredScreens("osd")
+
+        delegate: VolumeOSD {
+            modelData: item
+        }
+    }
+
+    Variants {
+        model: SettingsData.getFilteredScreens("osd")
+
+        delegate: MicMuteOSD {
+            modelData: item
+        }
+    }
+
+    Variants {
+        model: SettingsData.getFilteredScreens("osd")
+
+        delegate: BrightnessOSD {
+            modelData: item
+        }
+    }
+
+    Variants {
+        model: SettingsData.getFilteredScreens("osd")
+
+        delegate: IdleInhibitorOSD {
+            modelData: item
+        }
+    }
+}

DMSShellIPC.qml

@@ -0,0 +1,352 @@
+import QtQuick
+import Quickshell
+import Quickshell.Io
+import Quickshell.Hyprland
+import qs.Common
+import qs.Services
+
+Item {
+    id: root
+
+    required property var powerMenuModalLoader
+    required property var processListModalLoader
+    required property var controlCenterLoader
+    required property var dankDashPopoutLoader
+    required property var notepadSlideoutVariants
+    required property var hyprKeybindsModalLoader
+    required property var dankBarLoader
+
+    IpcHandler {
+        function open() {
+            root.powerMenuModalLoader.active = true
+            if (root.powerMenuModalLoader.item)
+                root.powerMenuModalLoader.item.openCentered()
+
+            return "POWERMENU_OPEN_SUCCESS"
+        }
+
+        function close() {
+            if (root.powerMenuModalLoader.item)
+                root.powerMenuModalLoader.item.close()
+
+            return "POWERMENU_CLOSE_SUCCESS"
+        }
+
+        function toggle() {
+            root.powerMenuModalLoader.active = true
+            if (root.powerMenuModalLoader.item) {
+                if (root.powerMenuModalLoader.item.shouldBeVisible) {
+                    root.powerMenuModalLoader.item.close()
+                } else {
+                    root.powerMenuModalLoader.item.openCentered()
+                }
+            }
+
+            return "POWERMENU_TOGGLE_SUCCESS"
+        }
+
+        target: "powermenu"
+    }
+
+    IpcHandler {
+        function open(): string {
+            root.processListModalLoader.active = true
+            if (root.processListModalLoader.item)
+                root.processListModalLoader.item.show()
+
+            return "PROCESSLIST_OPEN_SUCCESS"
+        }
+
+        function close(): string {
+            if (root.processListModalLoader.item)
+                root.processListModalLoader.item.hide()
+
+            return "PROCESSLIST_CLOSE_SUCCESS"
+        }
+
+        function toggle(): string {
+            root.processListModalLoader.active = true
+            if (root.processListModalLoader.item)
+                root.processListModalLoader.item.toggle()
+
+            return "PROCESSLIST_TOGGLE_SUCCESS"
+        }
+
+        target: "processlist"
+    }
+
+    IpcHandler {
+        function open(): string {
+            if (root.dankBarLoader.item) {
+                root.dankBarLoader.item.triggerControlCenterOnFocusedScreen()
+                return "CONTROL_CENTER_OPEN_SUCCESS"
+            }
+            return "CONTROL_CENTER_OPEN_FAILED"
+        }
+
+        function close(): string {
+            if (root.controlCenterLoader.item) {
+                root.controlCenterLoader.item.close()
+                return "CONTROL_CENTER_CLOSE_SUCCESS"
+            }
+            return "CONTROL_CENTER_CLOSE_FAILED"
+        }
+
+        function toggle(): string {
+            if (root.dankBarLoader.item) {
+                root.dankBarLoader.item.triggerControlCenterOnFocusedScreen()
+                return "CONTROL_CENTER_TOGGLE_SUCCESS"
+            }
+            return "CONTROL_CENTER_TOGGLE_FAILED"
+        }
+
+        target: "control-center"
+    }
+
+    IpcHandler {
+        function open(tab: string): string {
+            root.dankDashPopoutLoader.active = true
+            if (root.dankDashPopoutLoader.item) {
+                switch (tab.toLowerCase()) {
+                case "media":
+                    root.dankDashPopoutLoader.item.currentTabIndex = 1
+                    break
+                case "weather":
+                    root.dankDashPopoutLoader.item.currentTabIndex = SettingsData.weatherEnabled ? 2 : 0
+                    break
+                default:
+                    root.dankDashPopoutLoader.item.currentTabIndex = 0
+                    break
+                }
+                root.dankDashPopoutLoader.item.setTriggerPosition(Screen.width / 2, Theme.barHeight + Theme.spacingS, 100, "center", Screen)
+                root.dankDashPopoutLoader.item.dashVisible = true
+                return "DASH_OPEN_SUCCESS"
+            }
+            return "DASH_OPEN_FAILED"
+        }
+
+        function close(): string {
+            if (root.dankDashPopoutLoader.item) {
+                root.dankDashPopoutLoader.item.dashVisible = false
+                return "DASH_CLOSE_SUCCESS"
+            }
+            return "DASH_CLOSE_FAILED"
+        }
+
+        function toggle(tab: string): string {
+            root.dankDashPopoutLoader.active = true
+            if (root.dankDashPopoutLoader.item) {
+                if (root.dankDashPopoutLoader.item.dashVisible) {
+                    root.dankDashPopoutLoader.item.dashVisible = false
+                } else {
+                    switch (tab.toLowerCase()) {
+                    case "media":
+                        root.dankDashPopoutLoader.item.currentTabIndex = 1
+                        break
+                    case "weather":
+                        root.dankDashPopoutLoader.item.currentTabIndex = SettingsData.weatherEnabled ? 2 : 0
+                        break
+                    default:
+                        root.dankDashPopoutLoader.item.currentTabIndex = 0
+                        break
+                    }
+                    root.dankDashPopoutLoader.item.setTriggerPosition(Screen.width / 2, Theme.barHeight + Theme.spacingS, 100, "center", Screen)
+                    root.dankDashPopoutLoader.item.dashVisible = true
+                }
+                return "DASH_TOGGLE_SUCCESS"
+            }
+            return "DASH_TOGGLE_FAILED"
+        }
+
+        target: "dash"
+    }
+
+    IpcHandler {
+        function getFocusedScreenName() {
+            if (CompositorService.isHyprland && Hyprland.focusedWorkspace && Hyprland.focusedWorkspace.monitor) {
+                return Hyprland.focusedWorkspace.monitor.name
+            }
+            if (CompositorService.isNiri && NiriService.currentOutput) {
+                return NiriService.currentOutput
+            }
+            return ""
+        }
+
+        function getActiveNotepadInstance() {
+            if (root.notepadSlideoutVariants.instances.length === 0) {
+                return null
+            }
+
+            if (root.notepadSlideoutVariants.instances.length === 1) {
+                return root.notepadSlideoutVariants.instances[0]
+            }
+
+            var focusedScreen = getFocusedScreenName()
+            if (focusedScreen && root.notepadSlideoutVariants.instances.length > 0) {
+                for (var i = 0; i < root.notepadSlideoutVariants.instances.length; i++) {
+                    var slideout = root.notepadSlideoutVariants.instances[i]
+                    if (slideout.modelData && slideout.modelData.name === focusedScreen) {
+                        return slideout
+                    }
+                }
+            }
+
+            for (var i = 0; i < root.notepadSlideoutVariants.instances.length; i++) {
+                var slideout = root.notepadSlideoutVariants.instances[i]
+                if (slideout.isVisible) {
+                    return slideout
+                }
+            }
+
+            return root.notepadSlideoutVariants.instances[0]
+        }
+
+        function open(): string {
+            var instance = getActiveNotepadInstance()
+            if (instance) {
+                instance.show()
+                return "NOTEPAD_OPEN_SUCCESS"
+            }
+            return "NOTEPAD_OPEN_FAILED"
+        }
+
+        function close(): string {
+            var instance = getActiveNotepadInstance()
+            if (instance) {
+                instance.hide()
+                return "NOTEPAD_CLOSE_SUCCESS"
+            }
+            return "NOTEPAD_CLOSE_FAILED"
+        }
+
+        function toggle(): string {
+            var instance = getActiveNotepadInstance()
+            if (instance) {
+                instance.toggle()
+                return "NOTEPAD_TOGGLE_SUCCESS"
+            }
+            return "NOTEPAD_TOGGLE_FAILED"
+        }
+
+        target: "notepad"
+    }
+
+    IpcHandler {
+        function toggle(): string {
+            SessionService.toggleIdleInhibit()
+            return SessionService.idleInhibited ? "Idle inhibit enabled" : "Idle inhibit disabled"
+        }
+
+        function enable(): string {
+            SessionService.enableIdleInhibit()
+            return "Idle inhibit enabled"
+        }
+
+        function disable(): string {
+            SessionService.disableIdleInhibit()
+            return "Idle inhibit disabled"
+        }
+
+        function status(): string {
+            return SessionService.idleInhibited ? "Idle inhibit is enabled" : "Idle inhibit is disabled"
+        }
+
+        function reason(newReason: string): string {
+            if (!newReason) {
+                return `Current reason: ${SessionService.inhibitReason}`
+            }
+
+            SessionService.setInhibitReason(newReason)
+            return `Inhibit reason set to: ${newReason}`
+        }
+
+        target: "inhibit"
+    }
+
+    IpcHandler {
+        function list(): string {
+            return MprisController.availablePlayers.map(p => p.identity).join("\n")
+        }
+
+        function play(): void {
+            if (MprisController.activePlayer && MprisController.activePlayer.canPlay) {
+                MprisController.activePlayer.play()
+            }
+        }
+
+        function pause(): void {
+            if (MprisController.activePlayer && MprisController.activePlayer.canPause) {
+                MprisController.activePlayer.pause()
+            }
+        }
+
+        function playPause(): void {
+            if (MprisController.activePlayer && MprisController.activePlayer.canTogglePlaying) {
+                MprisController.activePlayer.togglePlaying()
+            }
+        }
+
+        function previous(): void {
+            if (MprisController.activePlayer && MprisController.activePlayer.canGoPrevious) {
+                MprisController.activePlayer.previous()
+            }
+        }
+
+        function next(): void {
+            if (MprisController.activePlayer && MprisController.activePlayer.canGoNext) {
+                MprisController.activePlayer.next()
+            }
+        }
+
+        function stop(): void {
+            if (MprisController.activePlayer) {
+                MprisController.activePlayer.stop()
+            }
+        }
+
+        target: "mpris"
+    }
+
+    IpcHandler {
+        function openBinds(): string {
+            if (!CompositorService.isHyprland) {
+                return "HYPR_NOT_AVAILABLE"
+            }
+            root.hyprKeybindsModalLoader.active = true
+            if (root.hyprKeybindsModalLoader.item) {
+                root.hyprKeybindsModalLoader.item.open()
+                return "HYPR_KEYBINDS_OPEN_SUCCESS"
+            }
+            return "HYPR_KEYBINDS_OPEN_FAILED"
+        }
+
+        function closeBinds(): string {
+            if (!CompositorService.isHyprland) {
+                return "HYPR_NOT_AVAILABLE"
+            }
+            if (root.hyprKeybindsModalLoader.item) {
+                root.hyprKeybindsModalLoader.item.close()
+                return "HYPR_KEYBINDS_CLOSE_SUCCESS"
+            }
+            return "HYPR_KEYBINDS_CLOSE_FAILED"
+        }
+
+        function toggleBinds(): string {
+            if (!CompositorService.isHyprland) {
+                return "HYPR_NOT_AVAILABLE"
+            }
+            root.hyprKeybindsModalLoader.active = true
+            if (root.hyprKeybindsModalLoader.item) {
+                if (root.hyprKeybindsModalLoader.item.shouldBeVisible) {
+                    root.hyprKeybindsModalLoader.item.close()
+                } else {
+                    root.hyprKeybindsModalLoader.item.open()
+                }
+                return "HYPR_KEYBINDS_TOGGLE_SUCCESS"
+            }
+            return "HYPR_KEYBINDS_TOGGLE_FAILED"
+        }
+
+        target: "hypr"
+    }
+}

LICENSE

@@ -1,21 +1,674 @@
-MIT License
+                    GNU GENERAL PUBLIC LICENSE
+                       Version 3, 29 June 2007
 
-Copyright (c) 2025 Avenge Media LLC
+ Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
+ Everyone is permitted to copy and distribute verbatim copies
+ of this license document, but changing it is not allowed.
 
-Permission is hereby granted, free of charge, to any person obtaining a copy
-of this software and associated documentation files (the "Software"), to deal
-in the Software without restriction, including without limitation the rights
-to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
-copies of the Software, and to permit persons to whom the Software is
-furnished to do so, subject to the following conditions:
+                            Preamble
 
-The above copyright notice and this permission notice shall be included in all
-copies or substantial portions of the Software.
+  The GNU General Public License is a free, copyleft license for
+software and other kinds of works.
 
-THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
-IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
-AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
-LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
-OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+  The licenses for most software and other practical works are designed
+to take away your freedom to share and change the works.  By contrast,
+the GNU General Public License is intended to guarantee your freedom to
+share and change all versions of a program--to make sure it remains free
+software for all its users.  We, the Free Software Foundation, use the
+GNU General Public License for most of our software; it applies also to
+any other work released this way by its authors.  You can apply it to
+your programs, too.
+
+  When we speak of free software, we are referring to freedom, not
+price.  Our General Public Licenses are designed to make sure that you
+have the freedom to distribute copies of free software (and charge for
+them if you wish), that you receive source code or can get it if you
+want it, that you can change the software or use pieces of it in new
+free programs, and that you know you can do these things.
+
+  To protect your rights, we need to prevent others from denying you
+these rights or asking you to surrender the rights.  Therefore, you have
+certain responsibilities if you distribute copies of the software, or if
+you modify it: responsibilities to respect the freedom of others.
+
+  For example, if you distribute copies of such a program, whether
+gratis or for a fee, you must pass on to the recipients the same
+freedoms that you received.  You must make sure that they, too, receive
+or can get the source code.  And you must show them these terms so they
+know their rights.
+
+  Developers that use the GNU GPL protect your rights with two steps:
+(1) assert copyright on the software, and (2) offer you this License
+giving you legal permission to copy, distribute and/or modify it.
+
+  For the developers' and authors' protection, the GPL clearly explains
+that there is no warranty for this free software.  For both users' and
+authors' sake, the GPL requires that modified versions be marked as
+changed, so that their problems will not be attributed erroneously to
+authors of previous versions.
+
+  Some devices are designed to deny users access to install or run
+modified versions of the software inside them, although the manufacturer
+can do so.  This is fundamentally incompatible with the aim of
+protecting users' freedom to change the software.  The systematic
+pattern of such abuse occurs in the area of products for individuals to
+use, which is precisely where it is most unacceptable.  Therefore, we
+have designed this version of the GPL to prohibit the practice for those
+products.  If such problems arise substantially in other domains, we
+stand ready to extend this provision to those domains in future versions
+of the GPL, as needed to protect the freedom of users.
+
+  Finally, every program is threatened constantly by software patents.
+States should not allow patents to restrict development and use of
+software on general-purpose computers, but in those that do, we wish to
+avoid the special danger that patents applied to a free program could
+make it effectively proprietary.  To prevent this, the GPL assures that
+patents cannot be used to render the program non-free.
+
+  The precise terms and conditions for copying, distribution and
+modification follow.
+
+                       TERMS AND CONDITIONS
+
+  0. Definitions.
+
+  "This License" refers to version 3 of the GNU General Public License.
+
+  "Copyright" also means copyright-like laws that apply to other kinds of
+works, such as semiconductor masks.
+
+  "The Program" refers to any copyrightable work licensed under this
+License.  Each licensee is addressed as "you".  "Licensees" and
+"recipients" may be individuals or organizations.
+
+  To "modify" a work means to copy from or adapt all or part of the work
+in a fashion requiring copyright permission, other than the making of an
+exact copy.  The resulting work is called a "modified version" of the
+earlier work or a work "based on" the earlier work.
+
+  A "covered work" means either the unmodified Program or a work based
+on the Program.
+
+  To "propagate" a work means to do anything with it that, without
+permission, would make you directly or secondarily liable for
+infringement under applicable copyright law, except executing it on a
+computer or modifying a private copy.  Propagation includes copying,
+distribution (with or without modification), making available to the
+public, and in some countries other activities as well.
+
+  To "convey" a work means any kind of propagation that enables other
+parties to make or receive copies.  Mere interaction with a user through
+a computer network, with no transfer of a copy, is not conveying.
+
+  An interactive user interface displays "Appropriate Legal Notices"
+to the extent that it includes a convenient and prominently visible
+feature that (1) displays an appropriate copyright notice, and (2)
+tells the user that there is no warranty for the work (except to the
+extent that warranties are provided), that licensees may convey the
+work under this License, and how to view a copy of this License.  If
+the interface presents a list of user commands or options, such as a
+menu, a prominent item in the list meets this criterion.
+
+  1. Source Code.
+
+  The "source code" for a work means the preferred form of the work
+for making modifications to it.  "Object code" means any non-source
+form of a work.
+
+  A "Standard Interface" means an interface that either is an official
+standard defined by a recognized standards body, or, in the case of
+interfaces specified for a particular programming language, one that
+is widely used among developers working in that language.
+
+  The "System Libraries" of an executable work include anything, other
+than the work as a whole, that (a) is included in the normal form of
+packaging a Major Component, but which is not part of that Major
+Component, and (b) serves only to enable use of the work with that
+Major Component, or to implement a Standard Interface for which an
+implementation is available to the public in source code form.  A
+"Major Component", in this context, means a major essential component
+(kernel, window system, and so on) of the specific operating system
+(if any) on which the executable work runs, or a compiler used to
+produce the work, or an object code interpreter used to run it.
+
+  The "Corresponding Source" for a work in object code form means all
+the source code needed to generate, install, and (for an executable
+work) run the object code and to modify the work, including scripts to
+control those activities.  However, it does not include the work's
+System Libraries, or general-purpose tools or generally available free
+programs which are used unmodified in performing those activities but
+which are not part of the work.  For example, Corresponding Source
+includes interface definition files associated with source files for
+the work, and the source code for shared libraries and dynamically
+linked subprograms that the work is specifically designed to require,
+such as by intimate data communication or control flow between those
+subprograms and other parts of the work.
+
+  The Corresponding Source need not include anything that users
+can regenerate automatically from other parts of the Corresponding
+Source.
+
+  The Corresponding Source for a work in source code form is that
+same work.
+
+  2. Basic Permissions.
+
+  All rights granted under this License are granted for the term of
+copyright on the Program, and are irrevocable provided the stated
+conditions are met.  This License explicitly affirms your unlimited
+permission to run the unmodified Program.  The output from running a
+covered work is covered by this License only if the output, given its
+content, constitutes a covered work.  This License acknowledges your
+rights of fair use or other equivalent, as provided by copyright law.
+
+  You may make, run and propagate covered works that you do not
+convey, without conditions so long as your license otherwise remains
+in force.  You may convey covered works to others for the sole purpose
+of having them make modifications exclusively for you, or provide you
+with facilities for running those works, provided that you comply with
+the terms of this License in conveying all material for which you do
+not control copyright.  Those thus making or running the covered works
+for you must do so exclusively on your behalf, under your direction
+and control, on terms that prohibit them from making any copies of
+your copyrighted material outside their relationship with you.
+
+  Conveying under any other circumstances is permitted solely under
+the conditions stated below.  Sublicensing is not allowed; section 10
+makes it unnecessary.
+
+  3. Protecting Users' Legal Rights From Anti-Circumvention Law.
+
+  No covered work shall be deemed part of an effective technological
+measure under any applicable law fulfilling obligations under article
+11 of the WIPO copyright treaty adopted on 20 December 1996, or
+similar laws prohibiting or restricting circumvention of such
+measures.
+
+  When you convey a covered work, you waive any legal power to forbid
+circumvention of technological measures to the extent such circumvention
+is effected by exercising rights under this License with respect to
+the covered work, and you disclaim any intention to limit operation or
+modification of the work as a means of enforcing, against the work's
+users, your or third parties' legal rights to forbid circumvention of
+technological measures.
+
+  4. Conveying Verbatim Copies.
+
+  You may convey verbatim copies of the Program's source code as you
+receive it, in any medium, provided that you conspicuously and
+appropriately publish on each copy an appropriate copyright notice;
+keep intact all notices stating that this License and any
+non-permissive terms added in accord with section 7 apply to the code;
+keep intact all notices of the absence of any warranty; and give all
+recipients a copy of this License along with the Program.
+
+  You may charge any price or no price for each copy that you convey,
+and you may offer support or warranty protection for a fee.
+
+  5. Conveying Modified Source Versions.
+
+  You may convey a work based on the Program, or the modifications to
+produce it from the Program, in the form of source code under the
+terms of section 4, provided that you also meet all of these conditions:
+
+    a) The work must carry prominent notices stating that you modified
+    it, and giving a relevant date.
+
+    b) The work must carry prominent notices stating that it is
+    released under this License and any conditions added under section
+    7.  This requirement modifies the requirement in section 4 to
+    "keep intact all notices".
+
+    c) You must license the entire work, as a whole, under this
+    License to anyone who comes into possession of a copy.  This
+    License will therefore apply, along with any applicable section 7
+    additional terms, to the whole of the work, and all its parts,
+    regardless of how they are packaged.  This License gives no
+    permission to license the work in any other way, but it does not
+    invalidate such permission if you have separately received it.
+
+    d) If the work has interactive user interfaces, each must display
+    Appropriate Legal Notices; however, if the Program has interactive
+    interfaces that do not display Appropriate Legal Notices, your
+    work need not make them do so.
+
+  A compilation of a covered work with other separate and independent
+works, which are not by their nature extensions of the covered work,
+and which are not combined with it such as to form a larger program,
+in or on a volume of a storage or distribution medium, is called an
+"aggregate" if the compilation and its resulting copyright are not
+used to limit the access or legal rights of the compilation's users
+beyond what the individual works permit.  Inclusion of a covered work
+in an aggregate does not cause this License to apply to the other
+parts of the aggregate.
+
+  6. Conveying Non-Source Forms.
+
+  You may convey a covered work in object code form under the terms
+of sections 4 and 5, provided that you also convey the
+machine-readable Corresponding Source under the terms of this License,
+in one of these ways:
+
+    a) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by the
+    Corresponding Source fixed on a durable physical medium
+    customarily used for software interchange.
+
+    b) Convey the object code in, or embodied in, a physical product
+    (including a physical distribution medium), accompanied by a
+    written offer, valid for at least three years and valid for as
+    long as you offer spare parts or customer support for that product
+    model, to give anyone who possesses the object code either (1) a
+    copy of the Corresponding Source for all the software in the
+    product that is covered by this License, on a durable physical
+    medium customarily used for software interchange, for a price no
+    more than your reasonable cost of physically performing this
+    conveying of source, or (2) access to copy the
+    Corresponding Source from a network server at no charge.
+
+    c) Convey individual copies of the object code with a copy of the
+    written offer to provide the Corresponding Source.  This
+    alternative is allowed only occasionally and noncommercially, and
+    only if you received the object code with such an offer, in accord
+    with subsection 6b.
+
+    d) Convey the object code by offering access from a designated
+    place (gratis or for a charge), and offer equivalent access to the
+    Corresponding Source in the same way through the same place at no
+    further charge.  You need not require recipients to copy the
+    Corresponding Source along with the object code.  If the place to
+    copy the object code is a network server, the Corresponding Source
+    may be on a different server (operated by you or a third party)
+    that supports equivalent copying facilities, provided you maintain
+    clear directions next to the object code saying where to find the
+    Corresponding Source.  Regardless of what server hosts the
+    Corresponding Source, you remain obligated to ensure that it is
+    available for as long as needed to satisfy these requirements.
+
+    e) Convey the object code using peer-to-peer transmission, provided
+    you inform other peers where the object code and Corresponding
+    Source of the work are being offered to the general public at no
+    charge under subsection 6d.
+
+  A separable portion of the object code, whose source code is excluded
+from the Corresponding Source as a System Library, need not be
+included in conveying the object code work.
+
+  A "User Product" is either (1) a "consumer product", which means any
+tangible personal property which is normally used for personal, family,
+or household purposes, or (2) anything designed or sold for incorporation
+into a dwelling.  In determining whether a product is a consumer product,
+doubtful cases shall be resolved in favor of coverage.  For a particular
+product received by a particular user, "normally used" refers to a
+typical or common use of that class of product, regardless of the status
+of the particular user or of the way in which the particular user
+actually uses, or expects or is expected to use, the product.  A product
+is a consumer product regardless of whether the product has substantial
+commercial, industrial or non-consumer uses, unless such uses represent
+the only significant mode of use of the product.
+
+  "Installation Information" for a User Product means any methods,
+procedures, authorization keys, or other information required to install
+and execute modified versions of a covered work in that User Product from
+a modified version of its Corresponding Source.  The information must
+suffice to ensure that the continued functioning of the modified object
+code is in no case prevented or interfered with solely because
+modification has been made.
+
+  If you convey an object code work under this section in, or with, or
+specifically for use in, a User Product, and the conveying occurs as
+part of a transaction in which the right of possession and use of the
+User Product is transferred to the recipient in perpetuity or for a
+fixed term (regardless of how the transaction is characterized), the
+Corresponding Source conveyed under this section must be accompanied
+by the Installation Information.  But this requirement does not apply
+if neither you nor any third party retains the ability to install
+modified object code on the User Product (for example, the work has
+been installed in ROM).
+
+  The requirement to provide Installation Information does not include a
+requirement to continue to provide support service, warranty, or updates
+for a work that has been modified or installed by the recipient, or for
+the User Product in which it has been modified or installed.  Access to a
+network may be denied when the modification itself materially and
+adversely affects the operation of the network or violates the rules and
+protocols for communication across the network.
+
+  Corresponding Source conveyed, and Installation Information provided,
+in accord with this section must be in a format that is publicly
+documented (and with an implementation available to the public in
+source code form), and must require no special password or key for
+unpacking, reading or copying.
+
+  7. Additional Terms.
+
+  "Additional permissions" are terms that supplement the terms of this
+License by making exceptions from one or more of its conditions.
+Additional permissions that are applicable to the entire Program shall
+be treated as though they were included in this License, to the extent
+that they are valid under applicable law.  If additional permissions
+apply only to part of the Program, that part may be used separately
+under those permissions, but the entire Program remains governed by
+this License without regard to the additional permissions.
+
+  When you convey a copy of a covered work, you may at your option
+remove any additional permissions from that copy, or from any part of
+it.  (Additional permissions may be written to require their own
+removal in certain cases when you modify the work.)  You may place
+additional permissions on material, added by you to a covered work,
+for which you have or can give appropriate copyright permission.
+
+  Notwithstanding any other provision of this License, for material you
+add to a covered work, you may (if authorized by the copyright holders of
+that material) supplement the terms of this License with terms:
+
+    a) Disclaiming warranty or limiting liability differently from the
+    terms of sections 15 and 16 of this License; or
+
+    b) Requiring preservation of specified reasonable legal notices or
+    author attributions in that material or in the Appropriate Legal
+    Notices displayed by works containing it; or
+
+    c) Prohibiting misrepresentation of the origin of that material, or
+    requiring that modified versions of such material be marked in
+    reasonable ways as different from the original version; or
+
+    d) Limiting the use for publicity purposes of names of licensors or
+    authors of the material; or
+
+    e) Declining to grant rights under trademark law for use of some
+    trade names, trademarks, or service marks; or
+
+    f) Requiring indemnification of licensors and authors of that
+    material by anyone who conveys the material (or modified versions of
+    it) with contractual assumptions of liability to the recipient, for
+    any liability that these contractual assumptions directly impose on
+    those licensors and authors.
+
+  All other non-permissive additional terms are considered "further
+restrictions" within the meaning of section 10.  If the Program as you
+received it, or any part of it, contains a notice stating that it is
+governed by this License along with a term that is a further
+restriction, you may remove that term.  If a license document contains
+a further restriction but permits relicensing or conveying under this
+License, you may add to a covered work material governed by the terms
+of that license document, provided that the further restriction does
+not survive such relicensing or conveying.
+
+  If you add terms to a covered work in accord with this section, you
+must place, in the relevant source files, a statement of the
+additional terms that apply to those files, or a notice indicating
+where to find the applicable terms.
+
+  Additional terms, permissive or non-permissive, may be stated in the
+form of a separately written license, or stated as exceptions;
+the above requirements apply either way.
+
+  8. Termination.
+
+  You may not propagate or modify a covered work except as expressly
+provided under this License.  Any attempt otherwise to propagate or
+modify it is void, and will automatically terminate your rights under
+this License (including any patent licenses granted under the third
+paragraph of section 11).
+
+  However, if you cease all violation of this License, then your
+license from a particular copyright holder is reinstated (a)
+provisionally, unless and until the copyright holder explicitly and
+finally terminates your license, and (b) permanently, if the copyright
+holder fails to notify you of the violation by some reasonable means
+prior to 60 days after the cessation.
+
+  Moreover, your license from a particular copyright holder is
+reinstated permanently if the copyright holder notifies you of the
+violation by some reasonable means, this is the first time you have
+received notice of violation of this License (for any work) from that
+copyright holder, and you cure the violation prior to 30 days after
+your receipt of the notice.
+
+  Termination of your rights under this section does not terminate the
+licenses of parties who have received copies or rights from you under
+this License.  If your rights have been terminated and not permanently
+reinstated, you do not qualify to receive new licenses for the same
+material under section 10.
+
+  9. Acceptance Not Required for Having Copies.
+
+  You are not required to accept this License in order to receive or
+run a copy of the Program.  Ancillary propagation of a covered work
+occurring solely as a consequence of using peer-to-peer transmission
+to receive a copy likewise does not require acceptance.  However,
+nothing other than this License grants you permission to propagate or
+modify any covered work.  These actions infringe copyright if you do
+not accept this License.  Therefore, by modifying or propagating a
+covered work, you indicate your acceptance of this License to do so.
+
+  10. Automatic Licensing of Downstream Recipients.
+
+  Each time you convey a covered work, the recipient automatically
+receives a license from the original licensors, to run, modify and
+propagate that work, subject to this License.  You are not responsible
+for enforcing compliance by third parties with this License.
+
+  An "entity transaction" is a transaction transferring control of an
+organization, or substantially all assets of one, or subdividing an
+organization, or merging organizations.  If propagation of a covered
+work results from an entity transaction, each party to that
+transaction who receives a copy of the work also receives whatever
+licenses to the work the party's predecessor in interest had or could
+give under the previous paragraph, plus a right to possession of the
+Corresponding Source of the work from the predecessor in interest, if
+the predecessor has it or can get it with reasonable efforts.
+
+  You may not impose any further restrictions on the exercise of the
+rights granted or affirmed under this License.  For example, you may
+not impose a license fee, royalty, or other charge for exercise of
+rights granted under this License, and you may not initiate litigation
+(including a cross-claim or counterclaim in a lawsuit) alleging that
+any patent claim is infringed by making, using, selling, offering for
+sale, or importing the Program or any portion of it.
+
+  11. Patents.
+
+  A "contributor" is a copyright holder who authorizes use under this
+License of the Program or a work on which the Program is based.  The
+work thus licensed is called the contributor's "contributor version".
+
+  A contributor's "essential patent claims" are all patent claims
+owned or controlled by the contributor, whether already acquired or
+hereafter acquired, that would be infringed by some manner, permitted
+by this License, of making, using, or selling its contributor version,
+but do not include claims that would be infringed only as a
+consequence of further modification of the contributor version.  For
+purposes of this definition, "control" includes the right to grant
+patent sublicenses in a manner consistent with the requirements of
+this License.
+
+  Each contributor grants you a non-exclusive, worldwide, royalty-free
+patent license under the contributor's essential patent claims, to
+make, use, sell, offer for sale, import and otherwise run, modify and
+propagate the contents of its contributor version.
+
+  In the following three paragraphs, a "patent license" is any express
+agreement or commitment, however denominated, not to enforce a patent
+(such as an express permission to practice a patent or covenant not to
+sue for patent infringement).  To "grant" such a patent license to a
+party means to make such an agreement or commitment not to enforce a
+patent against the party.
+
+  If you convey a covered work, knowingly relying on a patent license,
+and the Corresponding Source of the work is not available for anyone
+to copy, free of charge and under the terms of this License, through a
+publicly available network server or other readily accessible means,
+then you must either (1) cause the Corresponding Source to be so
+available, or (2) arrange to deprive yourself of the benefit of the
+patent license for this particular work, or (3) arrange, in a manner
+consistent with the requirements of this License, to extend the patent
+license to downstream recipients.  "Knowingly relying" means you have
+actual knowledge that, but for the patent license, your conveying the
+covered work in a country, or your recipient's use of the covered work
+in a country, would infringe one or more identifiable patents in that
+country that you have reason to believe are valid.
+
+  If, pursuant to or in connection with a single transaction or
+arrangement, you convey, or propagate by procuring conveyance of, a
+covered work, and grant a patent license to some of the parties
+receiving the covered work authorizing them to use, propagate, modify
+or convey a specific copy of the covered work, then the patent license
+you grant is automatically extended to all recipients of the covered
+work and works based on it.
+
+  A patent license is "discriminatory" if it does not include within
+the scope of its coverage, prohibits the exercise of, or is
+conditioned on the non-exercise of one or more of the rights that are
+specifically granted under this License.  You may not convey a covered
+work if you are a party to an arrangement with a third party that is
+in the business of distributing software, under which you make payment
+to the third party based on the extent of your activity of conveying
+the work, and under which the third party grants, to any of the
+parties who would receive the covered work from you, a discriminatory
+patent license (a) in connection with copies of the covered work
+conveyed by you (or copies made from those copies), or (b) primarily
+for and in connection with specific products or compilations that
+contain the covered work, unless you entered into that arrangement,
+or that patent license was granted, prior to 28 March 2007.
+
+  Nothing in this License shall be construed as excluding or limiting
+any implied license or other defenses to infringement that may
+otherwise be available to you under applicable patent law.
+
+  12. No Surrender of Others' Freedom.
+
+  If conditions are imposed on you (whether by court order, agreement or
+otherwise) that contradict the conditions of this License, they do not
+excuse you from the conditions of this License.  If you cannot convey a
+covered work so as to satisfy simultaneously your obligations under this
+License and any other pertinent obligations, then as a consequence you may
+not convey it at all.  For example, if you agree to terms that obligate you
+to collect a royalty for further conveying from those to whom you convey
+the Program, the only way you could satisfy both those terms and this
+License would be to refrain entirely from conveying the Program.
+
+  13. Use with the GNU Affero General Public License.
+
+  Notwithstanding any other provision of this License, you have
+permission to link or combine any covered work with a work licensed
+under version 3 of the GNU Affero General Public License into a single
+combined work, and to convey the resulting work.  The terms of this
+License will continue to apply to the part which is the covered work,
+but the special requirements of the GNU Affero General Public License,
+section 13, concerning interaction through a network will apply to the
+combination as such.
+
+  14. Revised Versions of this License.
+
+  The Free Software Foundation may publish revised and/or new versions of
+the GNU General Public License from time to time.  Such new versions will
+be similar in spirit to the present version, but may differ in detail to
+address new problems or concerns.
+
+  Each version is given a distinguishing version number.  If the
+Program specifies that a certain numbered version of the GNU General
+Public License "or any later version" applies to it, you have the
+option of following the terms and conditions either of that numbered
+version or of any later version published by the Free Software
+Foundation.  If the Program does not specify a version number of the
+GNU General Public License, you may choose any version ever published
+by the Free Software Foundation.
+
+  If the Program specifies that a proxy can decide which future
+versions of the GNU General Public License can be used, that proxy's
+public statement of acceptance of a version permanently authorizes you
+to choose that version for the Program.
+
+  Later license versions may give you additional or different
+permissions.  However, no additional obligations are imposed on any
+author or copyright holder as a result of your choosing to follow a
+later version.
+
+  15. Disclaimer of Warranty.
+
+  THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
+APPLICABLE LAW.  EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
+HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
+OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
+THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
+PURPOSE.  THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
+IS WITH YOU.  SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
+ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
+
+  16. Limitation of Liability.
+
+  IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
+WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
+THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
+GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
+USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
+DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
+PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
+EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
+SUCH DAMAGES.
+
+  17. Interpretation of Sections 15 and 16.
+
+  If the disclaimer of warranty and limitation of liability provided
+above cannot be given local legal effect according to their terms,
+reviewing courts shall apply local law that most closely approximates
+an absolute waiver of all civil liability in connection with the
+Program, unless a warranty or assumption of liability accompanies a
+copy of the Program in return for a fee.
+
+                     END OF TERMS AND CONDITIONS
+
+            How to Apply These Terms to Your New Programs
+
+  If you develop a new program, and you want it to be of the greatest
+possible use to the public, the best way to achieve this is to make it
+free software which everyone can redistribute and change under these terms.
+
+  To do so, attach the following notices to the program.  It is safest
+to attach them to the start of each source file to most effectively
+state the exclusion of warranty; and each file should have at least
+the "copyright" line and a pointer to where the full notice is found.
+
+    <one line to give the program's name and a brief idea of what it does.>
+    Copyright (C) <year>  <name of author>
+
+    This program is free software: you can redistribute it and/or modify
+    it under the terms of the GNU General Public License as published by
+    the Free Software Foundation, either version 3 of the License, or
+    (at your option) any later version.
+
+    This program is distributed in the hope that it will be useful,
+    but WITHOUT ANY WARRANTY; without even the implied warranty of
+    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+    GNU General Public License for more details.
+
+    You should have received a copy of the GNU General Public License
+    along with this program.  If not, see <https://www.gnu.org/licenses/>.
+
+Also add information on how to contact you by electronic and paper mail.
+
+  If the program does terminal interaction, make it output a short
+notice like this when it starts in an interactive mode:
+
+    <program>  Copyright (C) <year>  <name of author>
+    This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
+    This is free software, and you are welcome to redistribute it
+    under certain conditions; type `show c' for details.
+
+The hypothetical commands `show w' and `show c' should show the appropriate
+parts of the General Public License.  Of course, your program's commands
+might be different; for a GUI interface, you would use an "about box".
+
+  You should also get your employer (if you work as a programmer) or school,
+if any, to sign a "copyright disclaimer" for the program, if necessary.
+For more information on this, and how to apply and follow the GNU GPL, see
+<https://www.gnu.org/licenses/>.
+
+  The GNU General Public License does not permit incorporating your program
+into proprietary programs.  If your program is a subroutine library, you
+may consider it more useful to permit linking proprietary applications with
+the library.  If this is what you want to do, use the GNU Lesser General
+Public License instead of this License.  But first, please read
+<https://www.gnu.org/licenses/why-not-lgpl.html>.

Makefile

@@ -1,156 +0,0 @@
-# Root Makefile for DankMaterialShell (DMS)
-# Orchestrates building, installation, and systemd management
-
-# Build configuration
-BINARY_NAME=dms
-CORE_DIR=core
-BUILD_DIR=$(CORE_DIR)/bin
-PREFIX ?= /usr/local
-INSTALL_DIR=$(PREFIX)/bin
-DATA_DIR=$(PREFIX)/share
-ICON_DIR=$(DATA_DIR)/icons/hicolor/scalable/apps
-
-USER_HOME := $(if $(SUDO_USER),$(shell getent passwd $(SUDO_USER) | cut -d: -f6),$(HOME))
-SYSTEMD_USER_DIR=$(USER_HOME)/.config/systemd/user
-
-SHELL_DIR=quickshell
-SHELL_INSTALL_DIR=$(DATA_DIR)/quickshell/dms
-ASSETS_DIR=assets
-APPLICATIONS_DIR=$(DATA_DIR)/applications
-
-.PHONY: all build clean install install-bin install-shell install-completions install-systemd install-icon install-desktop uninstall uninstall-bin uninstall-shell uninstall-completions uninstall-systemd uninstall-icon uninstall-desktop help
-
-all: build
-
-build:
-	@echo "Building $(BINARY_NAME)..."
-	@$(MAKE) -C $(CORE_DIR) build
-	@echo "Build complete"
-
-clean:
-	@echo "Cleaning build artifacts..."
-	@$(MAKE) -C $(CORE_DIR) clean
-	@echo "Clean complete"
-
-# Installation targets
-install-bin:
-	@echo "Installing $(BINARY_NAME) to $(INSTALL_DIR)..."
-	@install -D -m 755 $(BUILD_DIR)/$(BINARY_NAME) $(INSTALL_DIR)/$(BINARY_NAME)
-	@echo "Binary installed"
-
-install-shell:
-	@echo "Installing shell files to $(SHELL_INSTALL_DIR)..."
-	@mkdir -p $(SHELL_INSTALL_DIR)
-	@cp -r $(SHELL_DIR)/* $(SHELL_INSTALL_DIR)/
-	@rm -rf $(SHELL_INSTALL_DIR)/.git* $(SHELL_INSTALL_DIR)/.github
-	@$(MAKE) --no-print-directory -C $(CORE_DIR) print-version > $(SHELL_INSTALL_DIR)/VERSION
-	@echo "Shell files installed"
-
-install-completions:
-	@echo "Installing shell completions..."
-	@mkdir -p $(DATA_DIR)/bash-completion/completions
-	@mkdir -p $(DATA_DIR)/zsh/site-functions
-	@mkdir -p $(DATA_DIR)/fish/vendor_completions.d
-	@$(BUILD_DIR)/$(BINARY_NAME) completion bash > $(DATA_DIR)/bash-completion/completions/dms 2>/dev/null || true
-	@$(BUILD_DIR)/$(BINARY_NAME) completion zsh > $(DATA_DIR)/zsh/site-functions/_dms 2>/dev/null || true
-	@$(BUILD_DIR)/$(BINARY_NAME) completion fish > $(DATA_DIR)/fish/vendor_completions.d/dms.fish 2>/dev/null || true
-	@echo "Shell completions installed"
-
-install-systemd:
-	@echo "Installing systemd user service..."
-	@mkdir -p $(SYSTEMD_USER_DIR)
-	@if [ -n "$(SUDO_USER)" ]; then chown -R $(SUDO_USER):$(SUDO_USER) $(SYSTEMD_USER_DIR); fi
-	@sed 's|/usr/bin/dms|$(INSTALL_DIR)/dms|g' $(ASSETS_DIR)/systemd/dms.service > $(SYSTEMD_USER_DIR)/dms.service
-	@chmod 644 $(SYSTEMD_USER_DIR)/dms.service
-	@if [ -n "$(SUDO_USER)" ]; then chown $(SUDO_USER):$(SUDO_USER) $(SYSTEMD_USER_DIR)/dms.service; fi
-	@echo "Systemd service installed to $(SYSTEMD_USER_DIR)/dms.service"
-
-install-icon:
-	@echo "Installing icon..."
-	@install -D -m 644 $(ASSETS_DIR)/danklogo.svg $(ICON_DIR)/danklogo.svg
-	@gtk-update-icon-cache -q $(DATA_DIR)/icons/hicolor 2>/dev/null || true
-	@echo "Icon installed"
-
-install-desktop:
-	@echo "Installing desktop entry..."
-	@install -D -m 644 $(ASSETS_DIR)/dms-open.desktop $(APPLICATIONS_DIR)/dms-open.desktop
-	@update-desktop-database -q $(APPLICATIONS_DIR) 2>/dev/null || true
-	@echo "Desktop entry installed"
-
-install: build install-bin install-shell install-completions install-systemd install-icon install-desktop
-	@echo ""
-	@echo "Installation complete!"
-	@echo ""
-	@echo "=== The DMS Team! ==="
-
-# Uninstallation targets
-uninstall-bin:
-	@echo "Removing $(BINARY_NAME) from $(INSTALL_DIR)..."
-	@rm -f $(INSTALL_DIR)/$(BINARY_NAME)
-	@echo "Binary removed"
-
-uninstall-shell:
-	@echo "Removing shell files from $(SHELL_INSTALL_DIR)..."
-	@rm -rf $(SHELL_INSTALL_DIR)
-	@echo "Shell files removed"
-
-uninstall-completions:
-	@echo "Removing shell completions..."
-	@rm -f $(DATA_DIR)/bash-completion/completions/dms
-	@rm -f $(DATA_DIR)/zsh/site-functions/_dms
-	@rm -f $(DATA_DIR)/fish/vendor_completions.d/dms.fish
-	@echo "Shell completions removed"
-
-uninstall-systemd:
-	@echo "Removing systemd user service..."
-	@rm -f $(SYSTEMD_USER_DIR)/dms.service
-	@echo "Systemd service removed"
-	@echo "Note: Stop/disable service manually if running: systemctl --user stop dms"
-
-uninstall-icon:
-	@echo "Removing icon..."
-	@rm -f $(ICON_DIR)/danklogo.svg
-	@gtk-update-icon-cache -q $(DATA_DIR)/icons/hicolor 2>/dev/null || true
-	@echo "Icon removed"
-
-uninstall-desktop:
-	@echo "Removing desktop entry..."
-	@rm -f $(APPLICATIONS_DIR)/dms-open.desktop
-	@update-desktop-database -q $(APPLICATIONS_DIR) 2>/dev/null || true
-	@echo "Desktop entry removed"
-
-uninstall: uninstall-systemd uninstall-desktop uninstall-icon uninstall-completions uninstall-shell uninstall-bin
-	@echo ""
-	@echo "Uninstallation complete!"
-
-# Target assist
-help:
-	@echo "Available targets:"
-	@echo ""
-	@echo "Build:"
-	@echo "  all (default)        - Build the DMS binary"
-	@echo "  build                - Same as 'all'"
-	@echo "  clean                - Clean build artifacts"
-	@echo ""
-	@echo "Install:"
-	@echo "  install              - Build and install everything (requires sudo)"
-	@echo "  install-bin          - Install only the binary"
-	@echo "  install-shell        - Install only shell files"
-	@echo "  install-completions  - Install only shell completions"
-	@echo "  install-systemd      - Install only systemd service"
-	@echo "  install-icon         - Install only icon"
-	@echo "  install-desktop      - Install only desktop entry"
-	@echo ""
-	@echo "Uninstall:"
-	@echo "  uninstall            - Remove everything (requires sudo)"
-	@echo "  uninstall-bin        - Remove only the binary"
-	@echo "  uninstall-shell      - Remove only shell files"
-	@echo "  uninstall-completions - Remove only shell completions"
-	@echo "  uninstall-systemd    - Remove only systemd service"
-	@echo "  uninstall-icon       - Remove only icon"
-	@echo "  uninstall-desktop    - Remove only desktop entry"
-	@echo ""
-	@echo "Usage:"
-	@echo "  sudo make install              - Build and install DMS"
-	@echo "  sudo make uninstall            - Remove DMS"
-	@echo "  systemctl --user enable --now dms  - Enable and start service"

Modals/Clipboard/ClipboardContent.qml

@@ -1,9 +1,10 @@
 import QtQuick
 import qs.Common
+import qs.Services
 import qs.Widgets
 import qs.Modals.Clipboard
 
-FocusScope {
+Item {
     id: clipboardContent
 
     required property var modal
@@ -14,7 +15,6 @@ FocusScope {
     property alias clipboardListView: clipboardListView
 
     anchors.fill: parent
-    focus: true
 
     Column {
         anchors.fill: parent
@@ -31,13 +31,14 @@ FocusScope {
             onKeyboardHintsToggled: modal.showKeyboardHints = !modal.showKeyboardHints
             onClearAllClicked: {
                 clearConfirmDialog.show(I18n.tr("Clear All History?"), I18n.tr("This will permanently delete all clipboard history."), function () {
-                    modal.clearAll();
-                    modal.hide();
-                }, function () {});
+                    modal.clearAll()
+                    modal.hide()
+                }, function () {})
             }
             onCloseClicked: modal.hide()
         }
 
+        // Search Field
         DankTextField {
             id: searchField
             width: parent.width
@@ -46,24 +47,27 @@ FocusScope {
             showClearButton: true
             focus: true
             ignoreTabKeys: true
+            keyForwardTargets: [modal.modalFocusScope]
             onTextChanged: {
-                modal.searchText = text;
-                modal.updateFilteredModel();
+                modal.searchText = text
+                modal.updateFilteredModel()
             }
-            Keys.onPressed: event => {
-                if (event.key === Qt.Key_Escape) {
-                    modal.hide();
-                    event.accepted = true;
-                    return;
-                }
-                modal.keyboardController?.handleKey(event);
+            Keys.onEscapePressed: function (event) {
+                modal.hide()
+                event.accepted = true
+            }
+            Component.onCompleted: {
+                Qt.callLater(function () {
+                    forceActiveFocus()
+                })
             }
-            Component.onCompleted: Qt.callLater(() => forceActiveFocus())
 
             Connections {
                 target: modal
                 function onOpened() {
-                    Qt.callLater(() => searchField.forceActiveFocus());
+                    Qt.callLater(function () {
+                        searchField.forceActiveFocus()
+                    })
                 }
             }
         }
@@ -80,7 +84,7 @@ FocusScope {
                 id: clipboardListView
                 anchors.fill: parent
                 model: filteredModel
-
+                
                 currentIndex: clipboardContent.modal ? clipboardContent.modal.selectedIndex : 0
                 spacing: Theme.spacingXS
                 interactive: true
@@ -90,27 +94,27 @@ FocusScope {
                 boundsMovement: Flickable.FollowBoundsBehavior
                 pressDelay: 0
                 flickableDirection: Flickable.VerticalFlick
-
+                
                 function ensureVisible(index) {
                     if (index < 0 || index >= count) {
-                        return;
+                        return
                     }
-                    const itemHeight = ClipboardConstants.itemHeight + spacing;
-                    const itemY = index * itemHeight;
-                    const itemBottom = itemY + itemHeight;
+                    const itemHeight = ClipboardConstants.itemHeight + spacing
+                    const itemY = index * itemHeight
+                    const itemBottom = itemY + itemHeight
                     if (itemY < contentY) {
-                        contentY = itemY;
+                        contentY = itemY
                     } else if (itemBottom > contentY + height) {
-                        contentY = itemBottom - height;
+                        contentY = itemBottom - height
                     }
                 }
-
+                
                 onCurrentIndexChanged: {
                     if (clipboardContent.modal && clipboardContent.modal.keyboardNavigationActive && currentIndex >= 0) {
-                        ensureVisible(currentIndex);
+                        ensureVisible(currentIndex)
                     }
                 }
-
+                
                 StyledText {
                     text: I18n.tr("No clipboard entries found")
                     anchors.centerIn: parent
@@ -118,11 +122,11 @@ FocusScope {
                     color: Theme.surfaceVariantText
                     visible: filteredModel.count === 0
                 }
-
+                
                 delegate: ClipboardEntry {
                     required property int index
                     required property var model
-
+                    
                     width: clipboardListView.width
                     height: ClipboardConstants.itemHeight
                     entryData: model.entry

Modals/Clipboard/ClipboardEntry.qml

@@ -26,7 +26,7 @@ Rectangle {
         if (isSelected) {
             return Theme.primaryPressed
         }
-        return mouseArea.containsMouse ? Theme.primaryHoverLight : Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
+        return mouseArea.containsMouse ? Theme.primaryHoverLight : Theme.surfaceContainerHigh
     }
 
     Row {

Modals/Clipboard/ClipboardHistoryModal.qml

@@ -1,17 +1,17 @@
 pragma ComponentBehavior: Bound
 
 import QtQuick
+import QtQuick.Controls
 import Quickshell
 import Quickshell.Io
 import qs.Common
 import qs.Modals.Common
 import qs.Services
+import qs.Widgets
 
 DankModal {
     id: clipboardHistoryModal
 
-    layerNamespace: "dms:clipboard"
-
     property int totalCount: 0
     property var clipboardEntries: []
     property string searchText: ""
@@ -23,129 +23,130 @@ DankModal {
     readonly property int maxConcurrentLoads: 3
 
     function updateFilteredModel() {
-        filteredClipboardModel.clear();
+        filteredClipboardModel.clear()
         for (var i = 0; i < clipboardModel.count; i++) {
-            const entry = clipboardModel.get(i).entry;
+            const entry = clipboardModel.get(i).entry
             if (searchText.trim().length === 0) {
                 filteredClipboardModel.append({
-                    "entry": entry
-                });
+                                                  "entry": entry
+                                              })
             } else {
-                const content = getEntryPreview(entry).toLowerCase();
+                const content = getEntryPreview(entry).toLowerCase()
                 if (content.includes(searchText.toLowerCase())) {
                     filteredClipboardModel.append({
-                        "entry": entry
-                    });
+                                                      "entry": entry
+                                                  })
                 }
             }
         }
-        clipboardHistoryModal.totalCount = filteredClipboardModel.count;
+        clipboardHistoryModal.totalCount = filteredClipboardModel.count
         if (filteredClipboardModel.count === 0) {
-            keyboardNavigationActive = false;
-            selectedIndex = 0;
+            keyboardNavigationActive = false
+            selectedIndex = 0
         } else if (selectedIndex >= filteredClipboardModel.count) {
-            selectedIndex = filteredClipboardModel.count - 1;
+            selectedIndex = filteredClipboardModel.count - 1
         }
     }
 
     function toggle() {
         if (shouldBeVisible) {
-            hide();
+            hide()
         } else {
-            show();
+            show()
         }
     }
 
     function show() {
-        open();
-        clipboardHistoryModal.searchText = "";
-        clipboardHistoryModal.activeImageLoads = 0;
-        clipboardHistoryModal.shouldHaveFocus = true;
-        refreshClipboard();
-        keyboardController.reset();
+        open()
+        clipboardHistoryModal.searchText = ""
+        clipboardHistoryModal.activeImageLoads = 0
+        clipboardHistoryModal.shouldHaveFocus = true
+        refreshClipboard()
+        keyboardController.reset()
 
         Qt.callLater(function () {
             if (contentLoader.item && contentLoader.item.searchField) {
-                contentLoader.item.searchField.text = "";
-                contentLoader.item.searchField.forceActiveFocus();
+                contentLoader.item.searchField.text = ""
+                contentLoader.item.searchField.forceActiveFocus()
             }
-        });
+        })
     }
 
     function hide() {
-        close();
-        clipboardHistoryModal.searchText = "";
-        clipboardHistoryModal.activeImageLoads = 0;
-        updateFilteredModel();
-        keyboardController.reset();
-        cleanupTempFiles();
+        close()
+        clipboardHistoryModal.searchText = ""
+        clipboardHistoryModal.activeImageLoads = 0
+        updateFilteredModel()
+        keyboardController.reset()
+        cleanupTempFiles()
     }
 
     function cleanupTempFiles() {
-        Quickshell.execDetached(["sh", "-c", "rm -f /tmp/clipboard_*.png"]);
+        Quickshell.execDetached(["sh", "-c", "rm -f /tmp/clipboard_*.png"])
     }
 
     function refreshClipboard() {
-        clipboardProcesses.refresh();
+        clipboardProcesses.refresh()
     }
 
     function copyEntry(entry) {
-        const entryId = entry.split('\t')[0];
-        Quickshell.execDetached(["sh", "-c", `cliphist decode ${entryId} | wl-copy`]);
-        ToastService.showInfo(I18n.tr("Copied to clipboard"));
-        hide();
+        const entryId = entry.split('\t')[0]
+        Quickshell.execDetached(["sh", "-c", `cliphist decode ${entryId} | wl-copy`])
+        ToastService.showInfo(I18n.tr("Copied to clipboard"))
+        hide()
     }
 
     function deleteEntry(entry) {
-        clipboardProcesses.deleteEntry(entry);
+        clipboardProcesses.deleteEntry(entry)
     }
 
     function clearAll() {
-        clipboardProcesses.clearAll();
+        clipboardProcesses.clearAll()
     }
 
     function getEntryPreview(entry) {
-        let content = entry.replace(/^\s*\d+\s+/, "");
+        let content = entry.replace(/^\s*\d+\s+/, "")
         if (content.includes("image/") || content.includes("binary data") || /\.(png|jpg|jpeg|gif|bmp|webp)/i.test(content)) {
-            const dimensionMatch = content.match(/(\d+)x(\d+)/);
+            const dimensionMatch = content.match(/(\d+)x(\d+)/)
             if (dimensionMatch) {
-                return `Image ${dimensionMatch[1]}×${dimensionMatch[2]}`;
+                return `Image ${dimensionMatch[1]}×${dimensionMatch[2]}`
             }
-            const typeMatch = content.match(/\b(png|jpg|jpeg|gif|bmp|webp)\b/i);
+            const typeMatch = content.match(/\b(png|jpg|jpeg|gif|bmp|webp)\b/i)
             if (typeMatch) {
-                return `Image (${typeMatch[1].toUpperCase()})`;
+                return `Image (${typeMatch[1].toUpperCase()})`
             }
-            return "Image";
+            return "Image"
         }
         if (content.length > ClipboardConstants.previewLength) {
-            return content.substring(0, ClipboardConstants.previewLength) + "...";
+            return content.substring(0, ClipboardConstants.previewLength) + "..."
         }
-        return content;
+        return content
     }
 
     function getEntryType(entry) {
         if (entry.includes("image/") || entry.includes("binary data") || /\.(png|jpg|jpeg|gif|bmp|webp)/i.test(entry) || /\b(png|jpg|jpeg|gif|bmp|webp)\b/i.test(entry)) {
-            return "image";
+            return "image"
         }
         if (entry.length > ClipboardConstants.longTextThreshold) {
-            return "long_text";
+            return "long_text"
         }
-        return "text";
+        return "text"
     }
 
     visible: false
-    modalWidth: ClipboardConstants.modalWidth
-    modalHeight: ClipboardConstants.modalHeight
-    backgroundColor: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
+    width: ClipboardConstants.modalWidth
+    height: ClipboardConstants.modalHeight
+    backgroundColor: Theme.popupBackground()
     cornerRadius: Theme.cornerRadius
     borderColor: Theme.outlineMedium
     borderWidth: 1
     enableShadow: true
     onBackgroundClicked: hide()
+    modalFocusScope.Keys.onPressed: function (event) {
+        keyboardController.handleKey(event)
+    }
     content: clipboardContent
 
-    property alias keyboardController: keyboardController
-
     ClipboardKeyboardController {
         id: keyboardController
         modal: clipboardHistoryModal
@@ -157,12 +158,14 @@ DankModal {
         confirmButtonColor: Theme.primary
         onVisibleChanged: {
             if (visible) {
-                clipboardHistoryModal.shouldHaveFocus = false;
-                return;
+                clipboardHistoryModal.shouldHaveFocus = false
+            } else if (clipboardHistoryModal.shouldBeVisible) {
+                clipboardHistoryModal.shouldHaveFocus = true
+                clipboardHistoryModal.modalFocusScope.forceActiveFocus()
+                if (clipboardHistoryModal.contentLoader.item && clipboardHistoryModal.contentLoader.item.searchField) {
+                    clipboardHistoryModal.contentLoader.item.searchField.forceActiveFocus()
+                }
             }
-            if (!clipboardHistoryModal.shouldBeVisible)
-                return;
-            clipboardHistoryModal.shouldHaveFocus = true;
         }
     }
 
@@ -187,18 +190,18 @@ DankModal {
 
     IpcHandler {
         function open(): string {
-            clipboardHistoryModal.show();
-            return "CLIPBOARD_OPEN_SUCCESS";
+            clipboardHistoryModal.show()
+            return "CLIPBOARD_OPEN_SUCCESS"
         }
 
         function close(): string {
-            clipboardHistoryModal.hide();
-            return "CLIPBOARD_CLOSE_SUCCESS";
+            clipboardHistoryModal.hide()
+            return "CLIPBOARD_CLOSE_SUCCESS"
         }
 
         function toggle(): string {
-            clipboardHistoryModal.toggle();
-            return "CLIPBOARD_TOGGLE_SUCCESS";
+            clipboardHistoryModal.toggle()
+            return "CLIPBOARD_TOGGLE_SUCCESS"
         }
 
         target: "clipboard"

Modals/Common/ConfirmModal.qml

@@ -6,9 +6,6 @@ import qs.Widgets
 DankModal {
     id: root
 
-    layerNamespace: "dms:confirm-modal"
-    keepPopoutsOpen: true
-
     property string confirmTitle: ""
     property string confirmMessage: ""
     property string confirmButtonText: "Confirm"
@@ -20,153 +17,152 @@ DankModal {
     property bool keyboardNavigation: false
 
     function show(title, message, onConfirmCallback, onCancelCallback) {
-        confirmTitle = title || "";
-        confirmMessage = message || "";
-        confirmButtonText = "Confirm";
-        cancelButtonText = "Cancel";
-        confirmButtonColor = Theme.primary;
-        onConfirm = onConfirmCallback || (() => {});
-        onCancel = onCancelCallback || (() => {});
-        selectedButton = -1;
-        keyboardNavigation = false;
-        open();
+        confirmTitle = title || ""
+        confirmMessage = message || ""
+        confirmButtonText = "Confirm"
+        cancelButtonText = "Cancel"
+        confirmButtonColor = Theme.primary
+        onConfirm = onConfirmCallback || (() => {})
+        onCancel = onCancelCallback || (() => {})
+        selectedButton = -1
+        keyboardNavigation = false
+        open()
     }
 
     function showWithOptions(options) {
-        confirmTitle = options.title || "";
-        confirmMessage = options.message || "";
-        confirmButtonText = options.confirmText || "Confirm";
-        cancelButtonText = options.cancelText || "Cancel";
-        confirmButtonColor = options.confirmColor || Theme.primary;
-        onConfirm = options.onConfirm || (() => {});
-        onCancel = options.onCancel || (() => {});
-        selectedButton = -1;
-        keyboardNavigation = false;
-        open();
+        confirmTitle = options.title || ""
+        confirmMessage = options.message || ""
+        confirmButtonText = options.confirmText || "Confirm"
+        cancelButtonText = options.cancelText || "Cancel"
+        confirmButtonColor = options.confirmColor || Theme.primary
+        onConfirm = options.onConfirm || (() => {})
+        onCancel = options.onCancel || (() => {})
+        selectedButton = -1
+        keyboardNavigation = false
+        open()
     }
 
     function selectButton() {
-        close();
+        close()
         if (selectedButton === 0) {
             if (onCancel) {
-                onCancel();
+                onCancel()
             }
         } else {
             if (onConfirm) {
-                onConfirm();
+                onConfirm()
             }
         }
     }
 
     shouldBeVisible: false
     allowStacking: true
-    modalWidth: 350
-    modalHeight: 160
+    width: 350
+    height: 160
     enableShadow: true
     shouldHaveFocus: true
     onBackgroundClicked: {
-        close();
-        if (onCancel)
-            onCancel();
+        close()
+        if (onCancel) {
+            onCancel()
+        }
     }
-
-    function handleKey(event) {
+    onOpened: {
+        Qt.callLater(function () {
+            modalFocusScope.forceActiveFocus()
+            modalFocusScope.focus = true
+            shouldHaveFocus = true
+        })
+    }
+    modalFocusScope.Keys.onPressed: function (event) {
         switch (event.key) {
         case Qt.Key_Escape:
-            close();
-            if (onCancel)
-                onCancel();
-            event.accepted = true;
-            break;
+            close()
+            if (onCancel) {
+                onCancel()
+            }
+            event.accepted = true
+            break
         case Qt.Key_Left:
         case Qt.Key_Up:
-            keyboardNavigation = true;
-            selectedButton = 0;
-            event.accepted = true;
-            break;
+            keyboardNavigation = true
+            selectedButton = 0
+            event.accepted = true
+            break
         case Qt.Key_Right:
         case Qt.Key_Down:
-            keyboardNavigation = true;
-            selectedButton = 1;
-            event.accepted = true;
-            break;
+            keyboardNavigation = true
+            selectedButton = 1
+            event.accepted = true
+            break
         case Qt.Key_N:
-            if (!(event.modifiers & Qt.ControlModifier))
-                return;
-            keyboardNavigation = true;
-            selectedButton = (selectedButton + 1) % 2;
-            event.accepted = true;
-            break;
+            if (event.modifiers & Qt.ControlModifier) {
+                keyboardNavigation = true
+                selectedButton = (selectedButton + 1) % 2
+                event.accepted = true
+            }
+            break
         case Qt.Key_P:
-            if (!(event.modifiers & Qt.ControlModifier))
-                return;
-            keyboardNavigation = true;
-            selectedButton = selectedButton === -1 ? 1 : (selectedButton - 1 + 2) % 2;
-            event.accepted = true;
-            break;
+            if (event.modifiers & Qt.ControlModifier) {
+                keyboardNavigation = true
+                selectedButton = selectedButton === -1 ? 1 : (selectedButton - 1 + 2) % 2
+                event.accepted = true
+            }
+            break
         case Qt.Key_J:
-            if (!(event.modifiers & Qt.ControlModifier))
-                return;
-            keyboardNavigation = true;
-            selectedButton = 1;
-            event.accepted = true;
-            break;
+            if (event.modifiers & Qt.ControlModifier) {
+                keyboardNavigation = true
+                selectedButton = 1
+                event.accepted = true
+            }
+            break
         case Qt.Key_K:
-            if (!(event.modifiers & Qt.ControlModifier))
-                return;
-            keyboardNavigation = true;
-            selectedButton = 0;
-            event.accepted = true;
-            break;
+            if (event.modifiers & Qt.ControlModifier) {
+                keyboardNavigation = true
+                selectedButton = 0
+                event.accepted = true
+            }
+            break
         case Qt.Key_H:
-            if (!(event.modifiers & Qt.ControlModifier))
-                return;
-            keyboardNavigation = true;
-            selectedButton = 0;
-            event.accepted = true;
-            break;
+            if (event.modifiers & Qt.ControlModifier) {
+                keyboardNavigation = true
+                selectedButton = 0
+                event.accepted = true
+            }
+            break
         case Qt.Key_L:
-            if (!(event.modifiers & Qt.ControlModifier))
-                return;
-            keyboardNavigation = true;
-            selectedButton = 1;
-            event.accepted = true;
-            break;
+            if (event.modifiers & Qt.ControlModifier) {
+                keyboardNavigation = true
+                selectedButton = 1
+                event.accepted = true
+            }
+            break
         case Qt.Key_Tab:
-            keyboardNavigation = true;
-            selectedButton = selectedButton === -1 ? 0 : (selectedButton + 1) % 2;
-            event.accepted = true;
-            break;
+            keyboardNavigation = true
+            selectedButton = selectedButton === -1 ? 0 : (selectedButton + 1) % 2
+            event.accepted = true
+            break
         case Qt.Key_Return:
         case Qt.Key_Enter:
-            if (selectedButton !== -1)
-                selectButton();
-            else {
-                selectedButton = 1;
-                selectButton();
+            if (selectedButton !== -1) {
+                selectButton()
+            } else {
+                selectedButton = 1
+                selectButton()
             }
-            event.accepted = true;
-            break;
+            event.accepted = true
+            break
         }
     }
 
     content: Component {
-        FocusScope {
+        Item {
             anchors.fill: parent
-            focus: true
-            implicitHeight: mainColumn.implicitHeight
-
-            Keys.onPressed: event => root.handleKey(event)
 
             Column {
-                id: mainColumn
-                anchors.left: parent.left
-                anchors.right: parent.right
-                anchors.top: parent.top
-                anchors.leftMargin: Theme.spacingL
-                anchors.rightMargin: Theme.spacingL
-                anchors.topMargin: Theme.spacingL
-                spacing: 0
+                anchors.centerIn: parent
+                width: parent.width - Theme.spacingM * 2
+                spacing: Theme.spacingM
 
                 StyledText {
                     text: confirmTitle
@@ -177,11 +173,6 @@ DankModal {
                     horizontalAlignment: Text.AlignHCenter
                 }
 
-                Item {
-                    width: 1
-                    height: Theme.spacingL
-                }
-
                 StyledText {
                     text: confirmMessage
                     font.pixelSize: Theme.fontSizeMedium
@@ -192,8 +183,7 @@ DankModal {
                 }
 
                 Item {
-                    width: 1
-                    height: Theme.spacingL * 1.5
+                    height: Theme.spacingS
                 }
 
                 Row {
@@ -206,11 +196,11 @@ DankModal {
                         radius: Theme.cornerRadius
                         color: {
                             if (keyboardNavigation && selectedButton === 0) {
-                                return Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12);
+                                return Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12)
                             } else if (cancelButton.containsMouse) {
-                                return Theme.surfacePressed;
+                                return Theme.surfacePressed
                             } else {
-                                return Theme.surfaceVariantAlpha;
+                                return Theme.surfaceVariantAlpha
                             }
                         }
                         border.color: (keyboardNavigation && selectedButton === 0) ? Theme.primary : "transparent"
@@ -231,8 +221,8 @@ DankModal {
                             hoverEnabled: true
                             cursorShape: Qt.PointingHandCursor
                             onClicked: {
-                                selectedButton = 0;
-                                selectButton();
+                                selectedButton = 0
+                                selectButton()
                             }
                         }
                     }
@@ -242,13 +232,13 @@ DankModal {
                         height: 40
                         radius: Theme.cornerRadius
                         color: {
-                            const baseColor = confirmButtonColor;
+                            const baseColor = confirmButtonColor
                             if (keyboardNavigation && selectedButton === 1) {
-                                return Qt.rgba(baseColor.r, baseColor.g, baseColor.b, 1);
+                                return Qt.rgba(baseColor.r, baseColor.g, baseColor.b, 1)
                             } else if (confirmButton.containsMouse) {
-                                return Qt.rgba(baseColor.r, baseColor.g, baseColor.b, 0.9);
+                                return Qt.rgba(baseColor.r, baseColor.g, baseColor.b, 0.9)
                             } else {
-                                return baseColor;
+                                return baseColor
                             }
                         }
                         border.color: (keyboardNavigation && selectedButton === 1) ? "white" : "transparent"
@@ -269,17 +259,12 @@ DankModal {
                             hoverEnabled: true
                             cursorShape: Qt.PointingHandCursor
                             onClicked: {
-                                selectedButton = 1;
-                                selectButton();
+                                selectedButton = 1
+                                selectButton()
                             }
                         }
                     }
                 }
-
-                Item {
-                    width: 1
-                    height: Theme.spacingL
-                }
             }
         }
     }

Modals/Common/DankModal.qml

@@ -0,0 +1,281 @@
+import QtQuick
+import Quickshell
+import Quickshell.Hyprland
+import Quickshell.Wayland
+import qs.Common
+import qs.Services
+
+PanelWindow {
+    id: root
+
+    WlrLayershell.namespace: "quickshell:modal"
+
+    property alias content: contentLoader.sourceComponent
+    property alias contentLoader: contentLoader
+    property Item directContent: null
+    property real width: 400
+    property real height: 300
+    readonly property real screenWidth: screen ? screen.width : 1920
+    readonly property real screenHeight: screen ? screen.height : 1080
+    readonly property real dpr: {
+        if (CompositorService.isNiri && screen) {
+            const niriScale = NiriService.displayScales[screen.name]
+            if (niriScale !== undefined) return niriScale
+        }
+        if (CompositorService.isHyprland && screen) {
+            const hyprlandMonitor = Hyprland.monitors.values.find(m => m.name === screen.name)
+            if (hyprlandMonitor?.scale !== undefined) return hyprlandMonitor.scale
+        }
+        return (screen?.devicePixelRatio) || 1
+    }
+    property bool showBackground: true
+    property real backgroundOpacity: 0.5
+    property string positioning: "center"
+    property point customPosition: Qt.point(0, 0)
+    property bool closeOnEscapeKey: true
+    property bool closeOnBackgroundClick: true
+    property string animationType: "scale"
+    property int animationDuration: Theme.shortDuration
+    property var animationEasing: Theme.emphasizedEasing
+    property color backgroundColor: Theme.surfaceContainer
+    property color borderColor: Theme.outlineMedium
+    property real borderWidth: 1
+    property real cornerRadius: Theme.cornerRadius
+    property bool enableShadow: false
+    property alias modalFocusScope: focusScope
+    property bool shouldBeVisible: false
+    property bool shouldHaveFocus: shouldBeVisible
+    property bool allowFocusOverride: false
+    property bool allowStacking: false
+    property bool keepContentLoaded: false
+
+    signal opened
+    signal dialogClosed
+    signal backgroundClicked
+
+    function open() {
+        ModalManager.openModal(root)
+        closeTimer.stop()
+        shouldBeVisible = true
+        visible = true
+        focusScope.forceActiveFocus()
+    }
+
+    function close() {
+        shouldBeVisible = false
+        closeTimer.restart()
+    }
+
+    function toggle() {
+        if (shouldBeVisible) {
+            close()
+        } else {
+            open()
+        }
+    }
+
+    visible: shouldBeVisible
+    color: "transparent"
+    WlrLayershell.layer: WlrLayershell.Top // if set to overlay -> virtual keyboards can be stuck under modal
+    WlrLayershell.exclusiveZone: -1
+    WlrLayershell.keyboardFocus: shouldHaveFocus ? WlrKeyboardFocus.Exclusive : WlrKeyboardFocus.None
+    onVisibleChanged: {
+        if (root.visible) {
+            opened()
+        } else {
+            if (Qt.inputMethod) {
+                Qt.inputMethod.hide()
+                Qt.inputMethod.reset()
+            }
+            dialogClosed()
+        }
+    }
+
+    Connections {
+        function onCloseAllModalsExcept(excludedModal) {
+            if (excludedModal !== root && !allowStacking && shouldBeVisible) {
+                close()
+            }
+        }
+
+        target: ModalManager
+    }
+
+    Timer {
+        id: closeTimer
+
+        interval: animationDuration + 100
+        onTriggered: {
+            visible = false
+        }
+    }
+
+    anchors {
+        top: true
+        left: true
+        right: true
+        bottom: true
+    }
+
+    Rectangle {
+        id: background
+
+        anchors.fill: parent
+        color: "black"
+        opacity: root.showBackground ? (root.shouldBeVisible ? root.backgroundOpacity : 0) : 0
+        visible: root.showBackground
+
+        MouseArea {
+            anchors.fill: parent
+            enabled: root.closeOnBackgroundClick
+            onClicked: mouse => {
+                           const localPos = mapToItem(contentContainer, mouse.x, mouse.y)
+                           if (localPos.x < 0 || localPos.x > contentContainer.width || localPos.y < 0 || localPos.y > contentContainer.height) {
+                               root.backgroundClicked()
+                           }
+                       }
+        }
+
+        Behavior on opacity {
+            NumberAnimation {
+                duration: root.animationDuration
+                easing.type: root.animationEasing
+            }
+        }
+    }
+
+    Rectangle {
+        id: contentContainer
+
+        width: Theme.px(root.width, dpr)
+        height: Theme.px(root.height, dpr)
+        anchors.centerIn: undefined
+        x: {
+            if (positioning === "center") {
+                return Theme.snap((root.screenWidth - width) / 2, dpr)
+            } else if (positioning === "top-right") {
+                return Theme.px(Math.max(Theme.spacingL, root.screenWidth - width - Theme.spacingL), dpr)
+            } else if (positioning === "custom") {
+                return Theme.snap(root.customPosition.x, dpr)
+            }
+            return 0
+        }
+        y: {
+            if (positioning === "center") {
+                return Theme.snap((root.screenHeight - height) / 2, dpr)
+            } else if (positioning === "top-right") {
+                return Theme.px(Theme.barHeight + Theme.spacingXS, dpr)
+            } else if (positioning === "custom") {
+                return Theme.snap(root.customPosition.y, dpr)
+            }
+            return 0
+        }
+        color: root.backgroundColor
+        radius: root.cornerRadius
+        border.color: root.borderColor
+        border.width: root.borderWidth
+        clip: false
+        layer.enabled: true
+        opacity: root.shouldBeVisible ? 1 : 0
+        transform: root.animationType === "slide" ? slideTransform : null
+
+        Translate {
+            id: slideTransform
+
+            readonly property real rawX: root.shouldBeVisible ? 0 : 15
+            readonly property real rawY: root.shouldBeVisible ? 0 : -30
+
+            x: Theme.snap(rawX, root.dpr)
+            y: Theme.snap(rawY, root.dpr)
+        }
+
+        Behavior on opacity {
+            NumberAnimation {
+                duration: animationDuration
+                easing.type: animationEasing
+            }
+        }
+
+        FocusScope {
+            anchors.fill: parent
+            focus: root.shouldBeVisible
+            clip: false
+
+            Item {
+                id: directContentWrapper
+
+                anchors.fill: parent
+                visible: root.directContent !== null
+                focus: true
+                clip: false
+
+                Component.onCompleted: {
+                    if (root.directContent) {
+                        root.directContent.parent = directContentWrapper
+                        root.directContent.anchors.fill = directContentWrapper
+                        Qt.callLater(() => root.directContent.forceActiveFocus())
+                    }
+                }
+
+                Connections {
+                    function onDirectContentChanged() {
+                        if (root.directContent) {
+                            root.directContent.parent = directContentWrapper
+                            root.directContent.anchors.fill = directContentWrapper
+                            Qt.callLater(() => root.directContent.forceActiveFocus())
+                        }
+                    }
+
+                    target: root
+                }
+            }
+
+            Loader {
+                id: contentLoader
+
+                anchors.fill: parent
+                active: root.directContent === null && (root.keepContentLoaded || root.shouldBeVisible || root.visible)
+                asynchronous: false
+                focus: true
+                clip: false
+                visible: root.directContent === null
+
+                onLoaded: {
+                    if (item) {
+                        Qt.callLater(() => item.forceActiveFocus())
+                    }
+                }
+            }
+        }
+    }
+
+    FocusScope {
+        id: focusScope
+
+        objectName: "modalFocusScope"
+        anchors.fill: parent
+        visible: root.shouldBeVisible || root.visible
+        focus: root.shouldBeVisible
+        Keys.onEscapePressed: event => {
+                                  if (root.closeOnEscapeKey && shouldHaveFocus) {
+                                      root.close()
+                                      event.accepted = true
+                                  }
+                              }
+        onVisibleChanged: {
+            if (visible && shouldHaveFocus) {
+                Qt.callLater(() => focusScope.forceActiveFocus())
+            }
+        }
+
+        Connections {
+            function onShouldHaveFocusChanged() {
+                if (shouldHaveFocus && shouldBeVisible) {
+                    Qt.callLater(() => focusScope.forceActiveFocus())
+                }
+            }
+
+            target: root
+        }
+    }
+}

Modals/DankColorPickerModal.qml

@@ -0,0 +1,542 @@
+import QtQuick
+import QtQuick.Controls
+import Quickshell
+import Quickshell.Io
+import qs.Common
+import qs.Modals.Common
+import qs.Services
+import qs.Widgets
+
+DankModal {
+    id: root
+
+    property string pickerTitle: "Choose Color"
+    property color selectedColor: SessionData.recentColors.length > 0 ? SessionData.recentColors[0] : Theme.primary
+    property var onColorSelectedCallback: null
+
+    signal colorSelected(color selectedColor)
+
+    property color currentColor: Theme.primary
+    property real hue: 0
+    property real saturation: 1
+    property real value: 1
+    property real alpha: 1
+    property real gradientX: 0
+    property real gradientY: 0
+
+    readonly property var standardColors: [
+        "#f44336", "#e91e63", "#9c27b0", "#673ab7", "#3f51b5", "#2196f3", "#03a9f4", "#00bcd4",
+        "#009688", "#4caf50", "#8bc34a", "#cddc39", "#ffeb3b", "#ffc107", "#ff9800", "#ff5722",
+        "#d32f2f", "#c2185b", "#7b1fa2", "#512da8", "#303f9f", "#1976d2", "#0288d1", "#0097a7",
+        "#00796b", "#388e3c", "#689f38", "#afb42b", "#fbc02d", "#ffa000", "#f57c00", "#e64a19",
+        "#c62828", "#ad1457", "#6a1b9a", "#4527a0", "#283593", "#1565c0", "#0277bd", "#00838f",
+        "#00695c", "#2e7d32", "#558b2f", "#9e9d24", "#f9a825", "#ff8f00", "#ef6c00", "#d84315",
+        "#ffffff", "#9e9e9e", "#212121"
+    ]
+
+    function show() {
+        currentColor = selectedColor
+        updateFromColor(currentColor)
+        open()
+    }
+
+    function hide() {
+        onColorSelectedCallback = null
+        close()
+    }
+
+    onColorSelected: (color) => {
+        if (onColorSelectedCallback) {
+            onColorSelectedCallback(color)
+        }
+    }
+
+    function copyColorToClipboard(colorValue) {
+        Quickshell.execDetached(["sh", "-c", `echo "${colorValue}" | wl-copy`])
+        ToastService.showInfo(`Color ${colorValue} copied`)
+        SessionData.addRecentColor(currentColor)
+    }
+
+    function updateFromColor(color) {
+        hue = color.hsvHue
+        saturation = color.hsvSaturation
+        value = color.hsvValue
+        alpha = color.a
+        gradientX = saturation
+        gradientY = 1 - value
+    }
+
+    function updateColor() {
+        currentColor = Qt.hsva(hue, saturation, value, alpha)
+    }
+
+    function updateColorFromGradient(x, y) {
+        saturation = Math.max(0, Math.min(1, x))
+        value = Math.max(0, Math.min(1, 1 - y))
+        updateColor()
+        selectedColor = currentColor
+    }
+
+    function pickColorFromScreen() {
+        hide()
+        Proc.runCommand("hyprpicker", ["hyprpicker", "--format=hex"], (output, errorCode) => {
+            if (errorCode !== 0) {
+                console.warn("hyprpicker exited with code:", errorCode)
+                root.show()
+                return
+            }
+            const colorStr = output.trim()
+            if (colorStr.length >= 7 && colorStr.startsWith('#')) {
+                const pickedColor = Qt.color(colorStr)
+                root.selectedColor = pickedColor
+                root.currentColor = pickedColor
+                root.updateFromColor(pickedColor)
+                copyColorToClipboard(colorStr)
+                root.show()
+            }
+        })
+    }
+
+    width: 680
+    height: 680
+    backgroundColor: Theme.surfaceContainer
+    cornerRadius: Theme.cornerRadius
+    borderColor: Theme.outlineMedium
+    borderWidth: 1
+    keepContentLoaded: true
+
+    onBackgroundClicked: hide()
+
+    content: Component {
+        FocusScope {
+            id: colorContent
+
+            property alias hexInput: hexInput
+
+            anchors.fill: parent
+            focus: true
+
+            Keys.onEscapePressed: event => {
+                root.hide()
+                event.accepted = true
+            }
+
+            Column {
+                anchors.fill: parent
+                anchors.margins: Theme.spacingM
+                spacing: Theme.spacingM
+
+                Row {
+                    width: parent.width
+                    spacing: Theme.spacingS
+
+                    Column {
+                        width: parent.width - 90
+                        spacing: Theme.spacingXS
+
+                        StyledText {
+                            text: root.pickerTitle
+                            font.pixelSize: Theme.fontSizeLarge
+                            color: Theme.surfaceText
+                            font.weight: Font.Medium
+                        }
+
+                        StyledText {
+                            text: I18n.tr("Select a color from the palette or use custom sliders")
+                            font.pixelSize: Theme.fontSizeMedium
+                            color: Theme.surfaceTextMedium
+                        }
+                    }
+
+                    DankActionButton {
+                        iconName: "colorize"
+                        iconSize: Theme.iconSize - 4
+                        iconColor: Theme.surfaceText
+                        onClicked: () => {
+                            root.pickColorFromScreen()
+                        }
+                    }
+
+                    DankActionButton {
+                        iconName: "close"
+                        iconSize: Theme.iconSize - 4
+                        iconColor: Theme.surfaceText
+                        onClicked: () => {
+                            root.hide()
+                        }
+                    }
+                }
+
+                Row {
+                    width: parent.width
+                    spacing: Theme.spacingM
+
+                    Rectangle {
+                        id: gradientPicker
+                        width: parent.width - 70
+                        height: 280
+                        radius: Theme.cornerRadius
+                        border.color: Theme.outlineStrong
+                        border.width: 1
+                        clip: true
+
+                        Rectangle {
+                            anchors.fill: parent
+                            color: Qt.hsva(root.hue, 1, 1, 1)
+
+                            Rectangle {
+                                anchors.fill: parent
+                                gradient: Gradient {
+                                    orientation: Gradient.Horizontal
+                                    GradientStop { position: 0.0; color: "#ffffff" }
+                                    GradientStop { position: 1.0; color: "transparent" }
+                                }
+                            }
+
+                            Rectangle {
+                                anchors.fill: parent
+                                gradient: Gradient {
+                                    orientation: Gradient.Vertical
+                                    GradientStop { position: 0.0; color: "transparent" }
+                                    GradientStop { position: 1.0; color: "#000000" }
+                                }
+                            }
+                        }
+
+                        Rectangle {
+                            id: pickerCircle
+                            width: 16
+                            height: 16
+                            radius: 8
+                            border.color: "white"
+                            border.width: 2
+                            color: "transparent"
+                            x: root.gradientX * parent.width - width / 2
+                            y: root.gradientY * parent.height - height / 2
+
+                            Rectangle {
+                                anchors.centerIn: parent
+                                width: parent.width - 4
+                                height: parent.height - 4
+                                radius: width / 2
+                                border.color: "black"
+                                border.width: 1
+                                color: "transparent"
+                            }
+                        }
+
+                        MouseArea {
+                            anchors.fill: parent
+                            cursorShape: Qt.CrossCursor
+                            onPressed: mouse => {
+                                const x = Math.max(0, Math.min(1, mouse.x / width))
+                                const y = Math.max(0, Math.min(1, mouse.y / height))
+                                root.gradientX = x
+                                root.gradientY = y
+                                root.updateColorFromGradient(x, y)
+                            }
+                            onPositionChanged: mouse => {
+                                if (pressed) {
+                                    const x = Math.max(0, Math.min(1, mouse.x / width))
+                                    const y = Math.max(0, Math.min(1, mouse.y / height))
+                                    root.gradientX = x
+                                    root.gradientY = y
+                                    root.updateColorFromGradient(x, y)
+                                }
+                            }
+                        }
+                    }
+
+                    Rectangle {
+                        id: hueSlider
+                        width: 50
+                        height: 280
+                        radius: Theme.cornerRadius
+                        border.color: Theme.outlineStrong
+                        border.width: 1
+
+                        gradient: Gradient {
+                            orientation: Gradient.Vertical
+                            GradientStop { position: 0.00; color: "#ff0000" }
+                            GradientStop { position: 0.17; color: "#ffff00" }
+                            GradientStop { position: 0.33; color: "#00ff00" }
+                            GradientStop { position: 0.50; color: "#00ffff" }
+                            GradientStop { position: 0.67; color: "#0000ff" }
+                            GradientStop { position: 0.83; color: "#ff00ff" }
+                            GradientStop { position: 1.00; color: "#ff0000" }
+                        }
+
+                        Rectangle {
+                            id: hueIndicator
+                            width: parent.width
+                            height: 4
+                            color: "white"
+                            border.color: "black"
+                            border.width: 1
+                            y: root.hue * parent.height - height / 2
+                        }
+
+                        MouseArea {
+                            anchors.fill: parent
+                            cursorShape: Qt.SizeVerCursor
+                            onPressed: mouse => {
+                                const h = Math.max(0, Math.min(1, mouse.y / height))
+                                root.hue = h
+                                root.updateColor()
+                                root.selectedColor = root.currentColor
+                            }
+                            onPositionChanged: mouse => {
+                                if (pressed) {
+                                    const h = Math.max(0, Math.min(1, mouse.y / height))
+                                    root.hue = h
+                                    root.updateColor()
+                                    root.selectedColor = root.currentColor
+                                }
+                            }
+                        }
+                    }
+                }
+
+                Column {
+                    width: parent.width
+                    spacing: Theme.spacingS
+
+                    StyledText {
+                        text: I18n.tr("Material Colors")
+                        font.pixelSize: Theme.fontSizeMedium
+                        color: Theme.surfaceText
+                        font.weight: Font.Medium
+                    }
+
+                    GridView {
+                        width: parent.width
+                        height: 140
+                        cellWidth: 38
+                        cellHeight: 38
+                        clip: true
+                        interactive: false
+                        model: root.standardColors
+
+                        delegate: Rectangle {
+                            width: 36
+                            height: 36
+                            color: modelData
+                            radius: 4
+                            border.color: Theme.outlineStrong
+                            border.width: 1
+
+                            MouseArea {
+                                anchors.fill: parent
+                                cursorShape: Qt.PointingHandCursor
+                                onClicked: () => {
+                                    const pickedColor = Qt.color(modelData)
+                                    root.selectedColor = pickedColor
+                                    root.currentColor = pickedColor
+                                    root.updateFromColor(pickedColor)
+                                }
+                            }
+                        }
+                    }
+                }
+
+                Column {
+                    width: parent.width
+                    spacing: Theme.spacingS
+
+                    Row {
+                        width: parent.width
+                        spacing: Theme.spacingS
+
+                        Column {
+                            width: 210
+                            spacing: Theme.spacingXS
+
+                            StyledText {
+                                text: I18n.tr("Recent Colors")
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: Theme.surfaceText
+                                font.weight: Font.Medium
+                            }
+
+                            Row {
+                                width: parent.width
+                                spacing: Theme.spacingXS
+
+                                Repeater {
+                                    model: 5
+
+                                    Rectangle {
+                                        width: 36
+                                        height: 36
+                                        radius: 4
+                                        border.color: Theme.outlineStrong
+                                        border.width: 1
+
+                                        color: {
+                                            if (index < SessionData.recentColors.length) {
+                                                return SessionData.recentColors[index]
+                                            }
+                                            return Theme.surfaceContainerHigh
+                                        }
+
+                                        opacity: index < SessionData.recentColors.length ? 1.0 : 0.3
+
+                                        MouseArea {
+                                            anchors.fill: parent
+                                            cursorShape: index < SessionData.recentColors.length ? Qt.PointingHandCursor : Qt.ArrowCursor
+                                            enabled: index < SessionData.recentColors.length
+                                            onClicked: () => {
+                                                if (index < SessionData.recentColors.length) {
+                                                    const pickedColor = SessionData.recentColors[index]
+                                                    root.selectedColor = pickedColor
+                                                    root.currentColor = pickedColor
+                                                    root.updateFromColor(pickedColor)
+                                                }
+                                            }
+                                        }
+                                    }
+                                }
+                            }
+                        }
+
+                        Column {
+                            width: parent.width - 330
+                            spacing: Theme.spacingXS
+
+                            StyledText {
+                                text: I18n.tr("Opacity")
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: Theme.surfaceText
+                                font.weight: Font.Medium
+                            }
+
+                            DankSlider {
+                                width: parent.width
+                                value: Math.round(root.alpha * 100)
+                                minimum: 0
+                                maximum: 100
+                                showValue: false
+                                onSliderValueChanged: (newValue) => {
+                                    root.alpha = newValue / 100
+                                    root.updateColor()
+                                    root.selectedColor = root.currentColor
+                                }
+                            }
+                        }
+
+                        Rectangle {
+                            width: 100
+                            height: 50
+                            radius: Theme.cornerRadius
+                            color: root.currentColor
+                            border.color: Theme.outlineStrong
+                            border.width: 2
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+                    }
+                }
+
+                Row {
+                    width: parent.width
+                    spacing: Theme.spacingS
+
+                    StyledText {
+                        text: I18n.tr("Hex:")
+                        font.pixelSize: Theme.fontSizeMedium
+                        color: Theme.surfaceTextMedium
+                        anchors.verticalCenter: parent.verticalCenter
+                    }
+
+                    DankTextField {
+                        id: hexInput
+                        width: 120
+                        height: 38
+                        text: root.currentColor.toString()
+                        font.pixelSize: Theme.fontSizeMedium
+                        textColor: {
+                            if (text.length === 0) return Theme.surfaceText
+                            const hexPattern = /^#?[0-9A-Fa-f]{6}([0-9A-Fa-f]{2})?$/
+                            return hexPattern.test(text) ? Theme.surfaceText : Theme.error
+                        }
+                        placeholderText: "#000000"
+                        backgroundColor: Theme.surfaceHover
+                        borderWidth: 1
+                        focusedBorderWidth: 2
+                        topPadding: Theme.spacingS
+                        bottomPadding: Theme.spacingS
+                        anchors.verticalCenter: parent.verticalCenter
+                        onAccepted: () => {
+                            const hexPattern = /^#?[0-9A-Fa-f]{6}([0-9A-Fa-f]{2})?$/
+                            if (!hexPattern.test(text)) return
+                            const color = Qt.color(text)
+                            if (color) {
+                                root.selectedColor = color
+                                root.currentColor = color
+                                root.updateFromColor(color)
+                            }
+                        }
+                    }
+
+                    DankButton {
+                        width: 80
+                        buttonHeight: 36
+                        text: I18n.tr("Apply")
+                        backgroundColor: Theme.primary
+                        textColor: Theme.background
+                        anchors.verticalCenter: parent.verticalCenter
+                        onClicked: {
+                            const hexPattern = /^#?[0-9A-Fa-f]{6}([0-9A-Fa-f]{2})?$/
+                            if (!hexPattern.test(hexInput.text)) return
+                            const color = Qt.color(hexInput.text)
+                            if (color) {
+                                root.currentColor = color
+                                root.updateFromColor(color)
+                                root.selectedColor = root.currentColor
+                                root.colorSelected(root.currentColor)
+                                SessionData.addRecentColor(root.currentColor)
+                                root.hide()
+                            }
+                        }
+                    }
+
+                    Item {
+                        width: parent.width - 460
+                        height: 1
+                    }
+
+                    DankButton {
+                        width: 70
+                        buttonHeight: 36
+                        text: I18n.tr("Cancel")
+                        backgroundColor: "transparent"
+                        textColor: Theme.surfaceText
+                        anchors.verticalCenter: parent.verticalCenter
+                        onClicked: root.hide()
+
+                        Rectangle {
+                            anchors.fill: parent
+                            radius: Theme.cornerRadius
+                            color: "transparent"
+                            border.color: Theme.surfaceVariantAlpha
+                            border.width: 1
+                            z: -1
+                        }
+                    }
+
+                    DankButton {
+                        width: 70
+                        buttonHeight: 36
+                        text: I18n.tr("Copy")
+                        backgroundColor: Theme.primary
+                        textColor: Theme.background
+                        anchors.verticalCenter: parent.verticalCenter
+                        onClicked: {
+                            const colorString = root.currentColor.toString()
+                            root.copyColorToClipboard(colorString)
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

Modals/HyprKeybindsModal.qml

@@ -0,0 +1,266 @@
+import QtQuick
+import QtQuick.Controls
+import Quickshell
+import qs.Common
+import qs.Modals.Common
+import qs.Services
+import qs.Widgets
+
+DankModal {
+    id: root
+
+    width: 1400
+    height: 900
+    onBackgroundClicked: close()
+
+    function categorizeKeybinds() {
+        const categories = {
+            "Workspace": [],
+            "Window": [],
+            "Monitor": [],
+            "Execute": [],
+            "System": [],
+            "Other": []
+        }
+
+        function addKeybind(keybind) {
+            const dispatcher = keybind.dispatcher || ""
+            if (dispatcher.includes("workspace")) {
+                categories["Workspace"].push(keybind)
+            } else if (dispatcher.includes("monitor")) {
+                categories["Monitor"].push(keybind)
+            } else if (dispatcher.includes("window") || dispatcher.includes("focus") || dispatcher.includes("move") || dispatcher.includes("swap") || dispatcher.includes("resize") || dispatcher === "killactive" || dispatcher === "fullscreen" || dispatcher === "togglefloating") {
+                categories["Window"].push(keybind)
+            } else if (dispatcher === "exec") {
+                categories["Execute"].push(keybind)
+            } else if (dispatcher === "exit" || dispatcher.includes("dpms")) {
+                categories["System"].push(keybind)
+            } else {
+                categories["Other"].push(keybind)
+            }
+        }
+
+        const allKeybinds = HyprKeybindsService.keybinds.keybinds || []
+        for (let i = 0; i < allKeybinds.length; i++) {
+            addKeybind(allKeybinds[i])
+        }
+
+        const children = HyprKeybindsService.keybinds.children || []
+        for (let i = 0; i < children.length; i++) {
+            const child = children[i]
+            const childKeybinds = child.keybinds || []
+            for (let j = 0; j < childKeybinds.length; j++) {
+                addKeybind(childKeybinds[j])
+            }
+        }
+
+        categories["Workspace"].sort((a, b) => {
+            const dispA = a.dispatcher || ""
+            const dispB = b.dispatcher || ""
+            return dispA.localeCompare(dispB)
+        })
+
+        categories["Window"].sort((a, b) => {
+            const dispA = a.dispatcher || ""
+            const dispB = b.dispatcher || ""
+            return dispA.localeCompare(dispB)
+        })
+
+        categories["Monitor"].sort((a, b) => {
+            const dispA = a.dispatcher || ""
+            const dispB = b.dispatcher || ""
+            return dispA.localeCompare(dispB)
+        })
+
+        categories["Execute"].sort((a, b) => {
+            const modsA = a.mods || []
+            const keyA = a.key || ""
+            const bindA = [...modsA, keyA].join("+")
+
+            const modsB = b.mods || []
+            const keyB = b.key || ""
+            const bindB = [...modsB, keyB].join("+")
+
+            return bindA.localeCompare(bindB)
+        })
+
+        return categories
+    }
+
+    content: Component {
+        Item {
+            anchors.fill: parent
+
+            DankFlickable {
+                id: mainFlickable
+                anchors.fill: parent
+                anchors.margins: Theme.spacingL
+                contentWidth: rowLayout.implicitWidth
+                contentHeight: rowLayout.implicitHeight
+                clip: true
+
+                Row {
+                    id: rowLayout
+                    spacing: Theme.spacingM
+
+                    property var categories: root.categorizeKeybinds()
+                    property real columnWidth: (mainFlickable.width - spacing * 2) / 3
+
+                    Column {
+                        width: rowLayout.columnWidth
+                        spacing: Theme.spacingXS
+
+                        StyledText {
+                            text: "Window / Monitor"
+                            font.pixelSize: Theme.fontSizeMedium
+                            font.weight: Font.Bold
+                            color: Theme.primary
+                        }
+
+                        Rectangle {
+                            width: parent.width
+                            height: 1
+                            color: Theme.primary
+                            opacity: 0.3
+                        }
+
+                        Item { width: 1; height: Theme.spacingXS }
+
+                        Column {
+                            width: parent.width
+                            spacing: Theme.spacingXS
+
+                            Repeater {
+                                model: [...(rowLayout.categories["Window"] || []), ...(rowLayout.categories["Monitor"] || [])]
+
+                                Row {
+                                    width: parent.width
+                                    spacing: Theme.spacingS
+
+                                    StyledRect {
+                                        width: Math.min(140, parent.width * 0.42)
+                                        height: 22
+                                        radius: 4
+                                        opacity: 0.3
+
+                                        StyledText {
+                                            anchors.centerIn: parent
+                                            anchors.margins: 2
+                                            width: parent.width - 4
+                                            text: {
+                                                const mods = modelData.mods || []
+                                                const key = modelData.key || ""
+                                                const parts = [...mods, key]
+                                                return parts.join("+")
+                                            }
+                                            font.pixelSize: Theme.fontSizeSmall
+                                            font.weight: Font.Medium
+                                            isMonospace: true
+                                            elide: Text.ElideRight
+                                            horizontalAlignment: Text.AlignHCenter
+                                        }
+                                    }
+
+                                    StyledText {
+                                        width: parent.width - 150
+                                        text: {
+                                            const comment = modelData.comment || ""
+                                            if (comment) return comment
+
+                                            const dispatcher = modelData.dispatcher || ""
+                                            const params = modelData.params || ""
+                                            return params ? `${dispatcher} ${params}` : dispatcher
+                                        }
+                                        font.pixelSize: Theme.fontSizeSmall
+                                        opacity: 0.9
+                                        elide: Text.ElideRight
+                                        anchors.verticalCenter: parent.verticalCenter
+                                    }
+                                }
+                            }
+                        }
+                    }
+
+                    Repeater {
+                        model: ["Workspace", "Execute"]
+
+                        Column {
+                            width: rowLayout.columnWidth
+                            spacing: Theme.spacingXS
+
+                            StyledText {
+                                text: modelData
+                                font.pixelSize: Theme.fontSizeMedium
+                                font.weight: Font.Bold
+                                color: Theme.primary
+                            }
+
+                            Rectangle {
+                                width: parent.width
+                                height: 1
+                                color: Theme.primary
+                                opacity: 0.3
+                            }
+
+                            Item { width: 1; height: Theme.spacingXS }
+
+                            Column {
+                                width: parent.width
+                                spacing: Theme.spacingXS
+
+                                Repeater {
+                                    model: rowLayout.categories[modelData] || []
+
+                                    Row {
+                                        width: parent.width
+                                        spacing: Theme.spacingS
+
+                                        StyledRect {
+                                            width: Math.min(140, parent.width * 0.42)
+                                            height: 22
+                                            radius: 4
+                                            opacity: 0.3
+
+                                            StyledText {
+                                                anchors.centerIn: parent
+                                                anchors.margins: 2
+                                                width: parent.width - 4
+                                                text: {
+                                                    const mods = modelData.mods || []
+                                                    const key = modelData.key || ""
+                                                    const parts = [...mods, key]
+                                                    return parts.join("+")
+                                                }
+                                                font.pixelSize: Theme.fontSizeSmall
+                                                font.weight: Font.Medium
+                                                isMonospace: true
+                                                elide: Text.ElideRight
+                                                horizontalAlignment: Text.AlignHCenter
+                                            }
+                                        }
+
+                                        StyledText {
+                                            width: parent.width - 150
+                                            text: {
+                                                const comment = modelData.comment || ""
+                                                if (comment) return comment
+
+                                                const dispatcher = modelData.dispatcher || ""
+                                                const params = modelData.params || ""
+                                                return params ? `${dispatcher} ${params}` : dispatcher
+                                            }
+                                            font.pixelSize: Theme.fontSizeSmall
+                                            opacity: 0.9
+                                            elide: Text.ElideRight
+                                            anchors.verticalCenter: parent.verticalCenter
+                                        }
+                                    }
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

Modals/NetworkInfoModal.qml

@@ -1,4 +1,5 @@
 import QtQuick
+import QtQuick.Controls
 import qs.Common
 import qs.Modals.Common
 import qs.Services
@@ -7,38 +8,34 @@ import qs.Widgets
 DankModal {
     id: root
 
-    layerNamespace: "dms:network-info"
-
-    keepPopoutsOpen: true
-
     property bool networkInfoModalVisible: false
     property string networkSSID: ""
     property var networkData: null
 
     function showNetworkInfo(ssid, data) {
-        networkSSID = ssid;
-        networkData = data;
-        networkInfoModalVisible = true;
-        open();
-        NetworkService.fetchNetworkInfo(ssid);
+        networkSSID = ssid
+        networkData = data
+        networkInfoModalVisible = true
+        open()
+        NetworkService.fetchNetworkInfo(ssid)
     }
 
     function hideDialog() {
-        networkInfoModalVisible = false;
-        close();
-        networkSSID = "";
-        networkData = null;
+        networkInfoModalVisible = false
+        close()
+        networkSSID = ""
+        networkData = null
     }
 
     visible: networkInfoModalVisible
-    modalWidth: 600
-    modalHeight: 500
+    width: 600
+    height: 500
     enableShadow: true
     onBackgroundClicked: hideDialog()
     onVisibleChanged: {
         if (!visible) {
-            networkSSID = "";
-            networkData = null;
+            networkSSID = ""
+            networkData = null
         }
     }
 
@@ -72,6 +69,7 @@ DankModal {
                             width: parent.width
                             elide: Text.ElideRight
                         }
+
                     }
 
                     DankActionButton {
@@ -80,6 +78,7 @@ DankModal {
                         iconColor: Theme.surfaceText
                         onClicked: root.hideDialog()
                     }
+
                 }
 
                 Rectangle {
@@ -108,6 +107,7 @@ DankModal {
                             wrapMode: Text.WordWrap
                         }
                     }
+
                 }
 
                 Item {
@@ -146,10 +146,17 @@ DankModal {
                                 duration: Theme.shortDuration
                                 easing.type: Theme.standardEasing
                             }
+
                         }
+
                     }
+
                 }
+
             }
+
         }
+
     }
+
 }

Modals/NetworkWiredInfoModal.qml

@@ -1,4 +1,5 @@
 import QtQuick
+import QtQuick.Controls
 import qs.Common
 import qs.Modals.Common
 import qs.Services
@@ -7,38 +8,34 @@ import qs.Widgets
 DankModal {
     id: root
 
-    layerNamespace: "dms:network-info-wired"
-
-    keepPopoutsOpen: true
-
     property bool networkWiredInfoModalVisible: false
     property string networkID: ""
     property var networkData: null
 
     function showNetworkInfo(id, data) {
-        networkID = id;
-        networkData = data;
-        networkWiredInfoModalVisible = true;
-        open();
-        NetworkService.fetchWiredNetworkInfo(data.uuid);
+        networkID = id
+        networkData = data
+        networkWiredInfoModalVisible = true
+        open()
+        NetworkService.fetchWiredNetworkInfo(data.uuid)
     }
 
     function hideDialog() {
-        networkWiredInfoModalVisible = false;
-        close();
-        networkID = "";
-        networkData = null;
+        networkWiredInfoModalVisible = false
+        close()
+        networkID = ""
+        networkData = null
     }
 
     visible: networkWiredInfoModalVisible
-    modalWidth: 600
-    modalHeight: 500
+    width: 600
+    height: 500
     enableShadow: true
     onBackgroundClicked: hideDialog()
     onVisibleChanged: {
         if (!visible) {
-            networkID = "";
-            networkData = null;
+            networkID = ""
+            networkData = null
         }
     }
 
@@ -72,6 +69,7 @@ DankModal {
                             width: parent.width
                             elide: Text.ElideRight
                         }
+
                     }
 
                     DankActionButton {
@@ -80,6 +78,7 @@ DankModal {
                         iconColor: Theme.surfaceText
                         onClicked: root.hideDialog()
                     }
+
                 }
 
                 Rectangle {
@@ -108,6 +107,7 @@ DankModal {
                             wrapMode: Text.WordWrap
                         }
                     }
+
                 }
 
                 Item {
@@ -146,10 +146,17 @@ DankModal {
                                 duration: Theme.shortDuration
                                 easing.type: Theme.standardEasing
                             }
+
                         }
+
                     }
+
                 }
+
             }
+
         }
+
     }
+
 }

Modals/NotificationModal.qml

@@ -4,64 +4,67 @@ import qs.Common
 import qs.Modals.Common
 import qs.Modules.Notifications.Center
 import qs.Services
+import qs.Widgets
 
 DankModal {
     id: notificationModal
 
-    layerNamespace: "dms:notification-center-modal"
-
     property bool notificationModalOpen: false
     property var notificationListRef: null
 
     function show() {
-        notificationModalOpen = true;
-        NotificationService.onOverlayOpen();
-        open();
-        modalKeyboardController.reset();
+        notificationModalOpen = true
+        NotificationService.onOverlayOpen()
+        open()
+        modalKeyboardController.reset()
         if (modalKeyboardController && notificationListRef) {
-            modalKeyboardController.listView = notificationListRef;
-            modalKeyboardController.rebuildFlatNavigation();
-
+            modalKeyboardController.listView = notificationListRef
+            modalKeyboardController.rebuildFlatNavigation()
+            
             Qt.callLater(() => {
-                modalKeyboardController.keyboardNavigationActive = true;
-                modalKeyboardController.selectedFlatIndex = 0;
-                modalKeyboardController.updateSelectedIdFromIndex();
+                modalKeyboardController.keyboardNavigationActive = true
+                modalKeyboardController.selectedFlatIndex = 0
+                modalKeyboardController.updateSelectedIdFromIndex()
                 if (notificationListRef) {
-                    notificationListRef.keyboardActive = true;
-                    notificationListRef.currentIndex = 0;
+                    notificationListRef.keyboardActive = true
+                    notificationListRef.currentIndex = 0
                 }
-                modalKeyboardController.selectionVersion++;
-                modalKeyboardController.ensureVisible();
-            });
+                modalKeyboardController.selectionVersion++
+                modalKeyboardController.ensureVisible()
+            })
         }
     }
 
     function hide() {
-        notificationModalOpen = false;
-        NotificationService.onOverlayClose();
-        close();
-        modalKeyboardController.reset();
+        notificationModalOpen = false
+        NotificationService.onOverlayClose()
+        close()
+        modalKeyboardController.reset()
     }
 
     function toggle() {
         if (shouldBeVisible) {
-            hide();
+            hide()
         } else {
-            show();
+            show()
         }
     }
 
-    modalWidth: 500
-    modalHeight: 700
+    width: 500
+    height: 700
     visible: false
     onBackgroundClicked: hide()
-    onShouldBeVisibleChanged: shouldBeVisible => {
+    onOpened: () => {
+        Qt.callLater(() => modalFocusScope.forceActiveFocus());
+    }
+    onShouldBeVisibleChanged: (shouldBeVisible) => {
         if (!shouldBeVisible) {
-            notificationModalOpen = false;
-            modalKeyboardController.reset();
-            NotificationService.onOverlayClose();
+            notificationModalOpen = false
+            modalKeyboardController.reset()
+            NotificationService.onOverlayClose()
         }
     }
+    modalFocusScope.Keys.onPressed: (event) => modalKeyboardController.handleKey(event)
 
     NotificationKeyboardController {
         id: modalKeyboardController
@@ -91,12 +94,10 @@ DankModal {
     }
 
     content: Component {
-        FocusScope {
+        Item {
             id: notificationKeyHandler
-            anchors.fill: parent
-            focus: true
 
-            Keys.onPressed: event => modalKeyboardController.handleKey(event)
+            anchors.fill: parent
 
             Column {
                 anchors.fill: parent
@@ -122,13 +123,14 @@ DankModal {
                     height: parent.height - y
                     keyboardController: modalKeyboardController
                     Component.onCompleted: {
-                        notificationModal.notificationListRef = notificationList;
+                        notificationModal.notificationListRef = notificationList
                         if (modalKeyboardController) {
-                            modalKeyboardController.listView = notificationList;
-                            modalKeyboardController.rebuildFlatNavigation();
+                            modalKeyboardController.listView = notificationList
+                            modalKeyboardController.rebuildFlatNavigation()
                         }
                     }
                 }
+
             }
 
             NotificationKeyboardHints {
@@ -140,6 +142,9 @@ DankModal {
                 anchors.margins: Theme.spacingL
                 showHints: modalKeyboardController.showKeyboardHints
             }
+
         }
+
     }
+
 }

Modals/PowerMenuModal.qml

@@ -0,0 +1,454 @@
+import QtQuick
+import qs.Common
+import qs.Modals.Common
+import qs.Services
+import qs.Widgets
+
+DankModal {
+    id: root
+
+    property int selectedIndex: 0
+    property int optionCount: SessionService.hibernateSupported ? 5 : 4
+    property rect parentBounds: Qt.rect(0, 0, 0, 0)
+    property var parentScreen: null
+
+    signal powerActionRequested(string action, string title, string message)
+
+    function openCentered() {
+        parentBounds = Qt.rect(0, 0, 0, 0)
+        parentScreen = null
+        backgroundOpacity = 0.5
+        open()
+    }
+
+    function openFromControlCenter(bounds, targetScreen) {
+        parentBounds = bounds
+        parentScreen = targetScreen
+        backgroundOpacity = 0
+        open()
+    }
+
+    function selectOption(action) {
+        close();
+        const actions = {
+            "logout": {
+                "title": I18n.tr("Log Out"),
+                "message": I18n.tr("Are you sure you want to log out?")
+            },
+            "suspend": {
+                "title": I18n.tr("Suspend"),
+                "message": I18n.tr("Are you sure you want to suspend the system?")
+            },
+            "hibernate": {
+                "title": I18n.tr("Hibernate"),
+                "message": I18n.tr("Are you sure you want to hibernate the system?")
+            },
+            "reboot": {
+                "title": I18n.tr("Reboot"),
+                "message": I18n.tr("Are you sure you want to reboot the system?")
+            },
+            "poweroff": {
+                "title": I18n.tr("Power Off"),
+                "message": I18n.tr("Are you sure you want to power off the system?")
+            }
+        }
+        const selected = actions[action]
+        if (selected) {
+            root.powerActionRequested(action, selected.title, selected.message);
+        }
+
+    }
+
+    shouldBeVisible: false
+    width: 320
+    height: contentLoader.item ? contentLoader.item.implicitHeight : 300
+    enableShadow: true
+    screen: parentScreen
+    positioning: parentBounds.width > 0 ? "custom" : "center"
+    customPosition: {
+        if (parentBounds.width > 0) {
+            const centerX = parentBounds.x + (parentBounds.width - width) / 2
+            const centerY = parentBounds.y + (parentBounds.height - height) / 2
+            return Qt.point(centerX, centerY)
+        }
+        return Qt.point(0, 0)
+    }
+    onBackgroundClicked: () => {
+        return close();
+    }
+    onOpened: () => {
+        selectedIndex = 0;
+        Qt.callLater(() => modalFocusScope.forceActiveFocus());
+    }
+    modalFocusScope.Keys.onPressed: (event) => {
+        switch (event.key) {
+        case Qt.Key_Up:
+        case Qt.Key_Backtab:
+            selectedIndex = (selectedIndex - 1 + optionCount) % optionCount;
+            event.accepted = true;
+            break;
+        case Qt.Key_Down:
+        case Qt.Key_Tab:
+            selectedIndex = (selectedIndex + 1) % optionCount;
+            event.accepted = true;
+            break;
+        case Qt.Key_Return:
+        case Qt.Key_Enter:
+            const actions = ["logout", "suspend"];
+            if (SessionService.hibernateSupported) actions.push("hibernate");
+            actions.push("reboot", "poweroff");
+            if (selectedIndex < actions.length) {
+                selectOption(actions[selectedIndex]);
+            }
+            event.accepted = true;
+            break;
+        case Qt.Key_N:
+            if (event.modifiers & Qt.ControlModifier) {
+                selectedIndex = (selectedIndex + 1) % optionCount;
+                event.accepted = true;
+            }
+            break;
+        case Qt.Key_P:
+            if (event.modifiers & Qt.ControlModifier) {
+                selectedIndex = (selectedIndex - 1 + optionCount) % optionCount;
+                event.accepted = true;
+            }
+            break;
+        case Qt.Key_J:
+            if (event.modifiers & Qt.ControlModifier) {
+                selectedIndex = (selectedIndex + 1) % optionCount;
+                event.accepted = true;
+            }
+            break;
+        case Qt.Key_K:
+            if (event.modifiers & Qt.ControlModifier) {
+                selectedIndex = (selectedIndex - 1 + optionCount) % optionCount;
+                event.accepted = true;
+            }
+            break;
+        }
+    }
+
+    content: Component {
+        Item {
+            anchors.fill: parent
+            implicitHeight: mainColumn.implicitHeight + Theme.spacingL * 2
+
+            Column {
+                id: mainColumn
+                anchors.fill: parent
+                anchors.margins: Theme.spacingL
+                spacing: Theme.spacingM
+
+                Row {
+                    width: parent.width
+
+                    StyledText {
+                        text: I18n.tr("Power Options")
+                        font.pixelSize: Theme.fontSizeLarge
+                        color: Theme.surfaceText
+                        font.weight: Font.Medium
+                        anchors.verticalCenter: parent.verticalCenter
+                    }
+
+                    Item {
+                        width: parent.width - 150
+                        height: 1
+                    }
+
+                    DankActionButton {
+                        iconName: "close"
+                        iconSize: Theme.iconSize - 4
+                        iconColor: Theme.surfaceText
+                        onClicked: () => {
+                            return close();
+                        }
+                    }
+
+                }
+
+                Column {
+                    width: parent.width
+                    spacing: Theme.spacingS
+
+                    Rectangle {
+                        width: parent.width
+                        height: 50
+                        radius: Theme.cornerRadius
+                        color: {
+                            if (selectedIndex === 0) {
+                                return Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12);
+                            } else if (logoutArea.containsMouse) {
+                                return Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08);
+                            } else {
+                                return Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.08);
+                            }
+                        }
+                        border.color: selectedIndex === 0 ? Theme.primary : "transparent"
+                        border.width: selectedIndex === 0 ? 1 : 0
+
+                        Row {
+                            anchors.left: parent.left
+                            anchors.leftMargin: Theme.spacingM
+                            anchors.verticalCenter: parent.verticalCenter
+                            spacing: Theme.spacingM
+
+                            DankIcon {
+                                name: "logout"
+                                size: Theme.iconSize
+                                color: Theme.surfaceText
+                                anchors.verticalCenter: parent.verticalCenter
+                            }
+
+                            StyledText {
+                                text: I18n.tr("Log Out")
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: Theme.surfaceText
+                                font.weight: Font.Medium
+                                anchors.verticalCenter: parent.verticalCenter
+                            }
+
+                        }
+
+                        MouseArea {
+                            id: logoutArea
+
+                            anchors.fill: parent
+                            hoverEnabled: true
+                            cursorShape: Qt.PointingHandCursor
+                            onClicked: () => {
+                                selectedIndex = 0;
+                                selectOption("logout");
+                            }
+                        }
+
+                    }
+
+                    Rectangle {
+                        width: parent.width
+                        height: 50
+                        radius: Theme.cornerRadius
+                        color: {
+                            if (selectedIndex === 1) {
+                                return Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12);
+                            } else if (suspendArea.containsMouse) {
+                                return Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08);
+                            } else {
+                                return Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.08);
+                            }
+                        }
+                        border.color: selectedIndex === 1 ? Theme.primary : "transparent"
+                        border.width: selectedIndex === 1 ? 1 : 0
+
+                        Row {
+                            anchors.left: parent.left
+                            anchors.leftMargin: Theme.spacingM
+                            anchors.verticalCenter: parent.verticalCenter
+                            spacing: Theme.spacingM
+
+                            DankIcon {
+                                name: "bedtime"
+                                size: Theme.iconSize
+                                color: Theme.surfaceText
+                                anchors.verticalCenter: parent.verticalCenter
+                            }
+
+                            StyledText {
+                                text: I18n.tr("Suspend")
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: Theme.surfaceText
+                                font.weight: Font.Medium
+                                anchors.verticalCenter: parent.verticalCenter
+                            }
+
+                        }
+
+                        MouseArea {
+                            id: suspendArea
+
+                            anchors.fill: parent
+                            hoverEnabled: true
+                            cursorShape: Qt.PointingHandCursor
+                            onClicked: () => {
+                                selectedIndex = 1;
+                                selectOption("suspend");
+                            }
+                        }
+
+                    }
+
+                    Rectangle {
+                        width: parent.width
+                        height: 50
+                        radius: Theme.cornerRadius
+                        color: {
+                            if (selectedIndex === 2) {
+                                return Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12);
+                            } else if (hibernateArea.containsMouse) {
+                                return Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08);
+                            } else {
+                                return Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.08);
+                            }
+                        }
+                        border.color: selectedIndex === 2 ? Theme.primary : "transparent"
+                        border.width: selectedIndex === 2 ? 1 : 0
+                        visible: SessionService.hibernateSupported
+
+                        Row {
+                            anchors.left: parent.left
+                            anchors.leftMargin: Theme.spacingM
+                            anchors.verticalCenter: parent.verticalCenter
+                            spacing: Theme.spacingM
+
+                            DankIcon {
+                                name: "ac_unit"
+                                size: Theme.iconSize
+                                color: Theme.surfaceText
+                                anchors.verticalCenter: parent.verticalCenter
+                            }
+
+                            StyledText {
+                                text: I18n.tr("Hibernate")
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: Theme.surfaceText
+                                font.weight: Font.Medium
+                                anchors.verticalCenter: parent.verticalCenter
+                            }
+
+                        }
+
+                        MouseArea {
+                            id: hibernateArea
+
+                            anchors.fill: parent
+                            hoverEnabled: true
+                            cursorShape: Qt.PointingHandCursor
+                            onClicked: () => {
+                                selectedIndex = 2;
+                                selectOption("hibernate");
+                            }
+                        }
+
+                    }
+
+                    Rectangle {
+                        width: parent.width
+                        height: 50
+                        radius: Theme.cornerRadius
+                        color: {
+                            const rebootIndex = SessionService.hibernateSupported ? 3 : 2;
+                            if (selectedIndex === rebootIndex) {
+                                return Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12);
+                            } else if (rebootArea.containsMouse) {
+                                return Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08);
+                            } else {
+                                return Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.08);
+                            }
+                        }
+                        border.color: selectedIndex === (SessionService.hibernateSupported ? 3 : 2) ? Theme.primary : "transparent"
+                        border.width: selectedIndex === (SessionService.hibernateSupported ? 3 : 2) ? 1 : 0
+
+                        Row {
+                            anchors.left: parent.left
+                            anchors.leftMargin: Theme.spacingM
+                            anchors.verticalCenter: parent.verticalCenter
+                            spacing: Theme.spacingM
+
+                            DankIcon {
+                                name: "restart_alt"
+                                size: Theme.iconSize
+                                color: rebootArea.containsMouse ? Theme.warning : Theme.surfaceText
+                                anchors.verticalCenter: parent.verticalCenter
+                            }
+
+                            StyledText {
+                                text: I18n.tr("Reboot")
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: rebootArea.containsMouse ? Theme.warning : Theme.surfaceText
+                                font.weight: Font.Medium
+                                anchors.verticalCenter: parent.verticalCenter
+                            }
+
+                        }
+
+                        MouseArea {
+                            id: rebootArea
+
+                            anchors.fill: parent
+                            hoverEnabled: true
+                            cursorShape: Qt.PointingHandCursor
+                            onClicked: () => {
+                                selectedIndex = SessionService.hibernateSupported ? 3 : 2;
+                                selectOption("reboot");
+                            }
+                        }
+
+                    }
+
+                    Rectangle {
+                        width: parent.width
+                        height: 50
+                        radius: Theme.cornerRadius
+                        color: {
+                            const powerOffIndex = SessionService.hibernateSupported ? 4 : 3;
+                            if (selectedIndex === powerOffIndex) {
+                                return Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12);
+                            } else if (powerOffArea.containsMouse) {
+                                return Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08);
+                            } else {
+                                return Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.08);
+                            }
+                        }
+                        border.color: selectedIndex === (SessionService.hibernateSupported ? 4 : 3) ? Theme.primary : "transparent"
+                        border.width: selectedIndex === (SessionService.hibernateSupported ? 4 : 3) ? 1 : 0
+
+                        Row {
+                            anchors.left: parent.left
+                            anchors.leftMargin: Theme.spacingM
+                            anchors.verticalCenter: parent.verticalCenter
+                            spacing: Theme.spacingM
+
+                            DankIcon {
+                                name: "power_settings_new"
+                                size: Theme.iconSize
+                                color: powerOffArea.containsMouse ? Theme.error : Theme.surfaceText
+                                anchors.verticalCenter: parent.verticalCenter
+                            }
+
+                            StyledText {
+                                text: I18n.tr("Power Off")
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: powerOffArea.containsMouse ? Theme.error : Theme.surfaceText
+                                font.weight: Font.Medium
+                                anchors.verticalCenter: parent.verticalCenter
+                            }
+
+                        }
+
+                        MouseArea {
+                            id: powerOffArea
+
+                            anchors.fill: parent
+                            hoverEnabled: true
+                            cursorShape: Qt.PointingHandCursor
+                            onClicked: () => {
+                                selectedIndex = SessionService.hibernateSupported ? 4 : 3;
+                                selectOption("poweroff");
+                            }
+                        }
+
+                    }
+
+                }
+
+                Item {
+                    height: Theme.spacingS
+                }
+
+            }
+
+        }
+
+    }
+
+}

Modals/ProcessListModal.qml

@@ -0,0 +1,356 @@
+import QtQuick
+import QtQuick.Layouts
+import qs.Common
+import qs.Modals.Common
+import qs.Modules.ProcessList
+import qs.Services
+import qs.Widgets
+
+DankModal {
+    id: processListModal
+
+    property int currentTab: 0
+    property var tabNames: ["Processes", "Performance", "System"]
+
+    function show() {
+        if (!DgopService.dgopAvailable) {
+            console.warn("ProcessListModal: dgop is not available");
+            return ;
+        }
+        open();
+        UserInfoService.getUptime();
+    }
+
+    function hide() {
+        close();
+        if (processContextMenu.visible) {
+            processContextMenu.close();
+        }
+
+    }
+
+    function toggle() {
+        if (!DgopService.dgopAvailable) {
+            console.warn("ProcessListModal: dgop is not available");
+            return ;
+        }
+        if (shouldBeVisible) {
+            hide();
+        } else {
+            show();
+        }
+    }
+
+    width: 900
+    height: 680
+    visible: false
+    backgroundColor: Theme.popupBackground()
+    cornerRadius: Theme.cornerRadius
+    enableShadow: true
+    onBackgroundClicked: () => {
+        return hide();
+    }
+
+    Component {
+        id: processesTabComponent
+
+        ProcessesTab {
+            contextMenu: processContextMenu
+        }
+
+    }
+
+    Component {
+        id: performanceTabComponent
+
+        PerformanceTab {
+        }
+
+    }
+
+    Component {
+        id: systemTabComponent
+
+        SystemTab {
+        }
+
+    }
+
+    ProcessContextMenu {
+        id: processContextMenu
+    }
+
+    content: Component {
+        Item {
+            anchors.fill: parent
+            focus: true
+            Keys.onPressed: (event) => {
+                if (event.key === Qt.Key_Escape) {
+                    processListModal.hide();
+                    event.accepted = true;
+                } else if (event.key === Qt.Key_1) {
+                    currentTab = 0;
+                    event.accepted = true;
+                } else if (event.key === Qt.Key_2) {
+                    currentTab = 1;
+                    event.accepted = true;
+                } else if (event.key === Qt.Key_3) {
+                    currentTab = 2;
+                    event.accepted = true;
+                }
+            }
+
+            // Show error message when dgop is not available
+            Rectangle {
+                anchors.centerIn: parent
+                width: 400
+                height: 200
+                radius: Theme.cornerRadius
+                color: Qt.rgba(Theme.error.r, Theme.error.g, Theme.error.b, 0.1)
+                border.color: Theme.error
+                border.width: 2
+                visible: !DgopService.dgopAvailable
+
+                Column {
+                    anchors.centerIn: parent
+                    spacing: Theme.spacingL
+
+                    DankIcon {
+                        name: "error"
+                        size: 48
+                        color: Theme.error
+                        anchors.horizontalCenter: parent.horizontalCenter
+                    }
+
+                    StyledText {
+                        text: I18n.tr("System Monitor Unavailable")
+                        font.pixelSize: Theme.fontSizeLarge
+                        font.weight: Font.Bold
+                        color: Theme.error
+                        anchors.horizontalCenter: parent.horizontalCenter
+                    }
+
+                    StyledText {
+                        text: I18n.tr("The 'dgop' tool is required for system monitoring.\nPlease install dgop to use this feature.")
+                        font.pixelSize: Theme.fontSizeMedium
+                        color: Theme.surfaceText
+                        anchors.horizontalCenter: parent.horizontalCenter
+                        horizontalAlignment: Text.AlignHCenter
+                        wrapMode: Text.WordWrap
+                    }
+
+                }
+
+            }
+
+            ColumnLayout {
+                anchors.fill: parent
+                anchors.margins: Theme.spacingL
+                spacing: Theme.spacingL
+                visible: DgopService.dgopAvailable
+
+                RowLayout {
+                    Layout.fillWidth: true
+                    height: 40
+
+                    StyledText {
+                        text: I18n.tr("System Monitor")
+                        font.pixelSize: Theme.fontSizeLarge + 4
+                        font.weight: Font.Bold
+                        color: Theme.surfaceText
+                        Layout.alignment: Qt.AlignVCenter
+                    }
+
+                    Item {
+                        Layout.fillWidth: true
+                    }
+
+                    DankActionButton {
+                        circular: false
+                        iconName: "close"
+                        iconSize: Theme.iconSize - 4
+                        iconColor: Theme.surfaceText
+                        onClicked: () => {
+                            return processListModal.hide();
+                        }
+                        Layout.alignment: Qt.AlignVCenter
+                    }
+
+                }
+
+                Rectangle {
+                    Layout.fillWidth: true
+                    height: 52
+                    color: Theme.surfaceContainerHigh
+                    radius: Theme.cornerRadius
+                    border.color: Theme.outlineLight
+                    border.width: 1
+
+                    Row {
+                        anchors.fill: parent
+                        anchors.margins: 4
+                        spacing: 2
+
+                        Repeater {
+                            model: tabNames
+
+                            Rectangle {
+                                width: (parent.width - (tabNames.length - 1) * 2) / tabNames.length
+                                height: 44
+                                radius: Theme.cornerRadius
+                                color: currentTab === index ? Theme.primaryPressed : (tabMouseArea.containsMouse ? Theme.primaryHoverLight : "transparent")
+                                border.color: currentTab === index ? Theme.primary : "transparent"
+                                border.width: currentTab === index ? 1 : 0
+
+                                Row {
+                                    anchors.centerIn: parent
+                                    spacing: Theme.spacingXS
+
+                                    DankIcon {
+                                        name: {
+                                            const tabIcons = ["list_alt", "analytics", "settings"];
+                                            return tabIcons[index] || "tab";
+                                        }
+                                        size: Theme.iconSize - 2
+                                        color: currentTab === index ? Theme.primary : Theme.surfaceText
+                                        opacity: currentTab === index ? 1 : 0.7
+                                        anchors.verticalCenter: parent.verticalCenter
+
+                                        Behavior on color {
+                                            ColorAnimation {
+                                                duration: Theme.shortDuration
+                                            }
+
+                                        }
+
+                                    }
+
+                                    StyledText {
+                                        text: modelData
+                                        font.pixelSize: Theme.fontSizeLarge
+                                        font.weight: Font.Medium
+                                        color: currentTab === index ? Theme.primary : Theme.surfaceText
+                                        anchors.verticalCenter: parent.verticalCenter
+                                        anchors.verticalCenterOffset: -1
+
+                                        Behavior on color {
+                                            ColorAnimation {
+                                                duration: Theme.shortDuration
+                                            }
+
+                                        }
+
+                                    }
+
+                                }
+
+                                MouseArea {
+                                    id: tabMouseArea
+
+                                    anchors.fill: parent
+                                    hoverEnabled: true
+                                    cursorShape: Qt.PointingHandCursor
+                                    onClicked: () => {
+                                        currentTab = index;
+                                    }
+                                }
+
+                                Behavior on color {
+                                    ColorAnimation {
+                                        duration: Theme.shortDuration
+                                    }
+
+                                }
+
+                                Behavior on border.color {
+                                    ColorAnimation {
+                                        duration: Theme.shortDuration
+                                    }
+
+                                }
+
+                            }
+
+                        }
+
+                    }
+
+                }
+
+                Rectangle {
+                    Layout.fillWidth: true
+                    Layout.fillHeight: true
+                    radius: Theme.cornerRadius
+                    color: Theme.surfaceContainerHigh
+                    border.color: Theme.outlineLight
+                    border.width: 1
+
+                    Loader {
+                        id: processesTab
+
+                        anchors.fill: parent
+                        anchors.margins: Theme.spacingS
+                        active: processListModal.visible && currentTab === 0
+                        visible: currentTab === 0
+                        opacity: currentTab === 0 ? 1 : 0
+                        sourceComponent: processesTabComponent
+
+                        Behavior on opacity {
+                            NumberAnimation {
+                                duration: Theme.mediumDuration
+                                easing.type: Theme.emphasizedEasing
+                            }
+
+                        }
+
+                    }
+
+                    Loader {
+                        id: performanceTab
+
+                        anchors.fill: parent
+                        anchors.margins: Theme.spacingS
+                        active: processListModal.visible && currentTab === 1
+                        visible: currentTab === 1
+                        opacity: currentTab === 1 ? 1 : 0
+                        sourceComponent: performanceTabComponent
+
+                        Behavior on opacity {
+                            NumberAnimation {
+                                duration: Theme.mediumDuration
+                                easing.type: Theme.emphasizedEasing
+                            }
+
+                        }
+
+                    }
+
+                    Loader {
+                        id: systemTab
+
+                        anchors.fill: parent
+                        anchors.margins: Theme.spacingS
+                        active: processListModal.visible && currentTab === 2
+                        visible: currentTab === 2
+                        opacity: currentTab === 2 ? 1 : 0
+                        sourceComponent: systemTabComponent
+
+                        Behavior on opacity {
+                            NumberAnimation {
+                                duration: Theme.mediumDuration
+                                easing.type: Theme.emphasizedEasing
+                            }
+
+                        }
+
+                    }
+
+                }
+
+            }
+
+        }
+
+    }
+
+}

Modals/Settings/PowerSettings.qml

@@ -10,20 +10,26 @@ Item {
         anchors.fill: parent
         anchors.topMargin: Theme.spacingL
         clip: true
-        contentHeight: mainColumn.height + Theme.spacingXL
+        contentHeight: mainColumn.height
         contentWidth: width
 
         Column {
             id: mainColumn
-            width: Math.min(550, parent.width - Theme.spacingL * 2)
-            anchors.horizontalCenter: parent.horizontalCenter
+            width: parent.width
             spacing: Theme.spacingXL
 
+            StyledText {
+                text: I18n.tr("Battery not detected - only AC power settings available")
+                font.pixelSize: Theme.fontSizeMedium
+                color: Theme.surfaceVariantText
+                visible: !BatteryService.batteryAvailable
+            }
+
             StyledRect {
                 width: parent.width
                 height: lockScreenSection.implicitHeight + Theme.spacingL * 2
                 radius: Theme.cornerRadius
-                color: Theme.surfaceContainerHigh
+                color: Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.3)
                 border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
                 border.width: 0
 
@@ -58,7 +64,7 @@ Item {
                         text: I18n.tr("Show Power Actions")
                         description: I18n.tr("Show power, restart, and logout buttons on the lock screen")
                         checked: SettingsData.lockScreenShowPowerActions
-                        onToggled: checked => SettingsData.set("lockScreenShowPowerActions", checked)
+                        onToggled: checked => SettingsData.setLockScreenShowPowerActions(checked)
                     }
 
                     StyledText {
@@ -78,7 +84,7 @@ Item {
                         enabled: SessionService.loginctlAvailable
                         onToggled: checked => {
                             if (SessionService.loginctlAvailable) {
-                                SettingsData.set("loginctlLockIntegration", checked);
+                                SettingsData.setLoginctlLockIntegration(checked)
                             }
                         }
                     }
@@ -89,7 +95,7 @@ Item {
                         description: I18n.tr("Automatically lock the screen when the system prepares to suspend")
                         checked: SettingsData.lockBeforeSuspend
                         visible: SessionService.loginctlAvailable && SettingsData.loginctlLockIntegration
-                        onToggled: checked => SettingsData.set("lockBeforeSuspend", checked)
+                        onToggled: checked => SettingsData.setLockBeforeSuspend(checked)
                     }
 
                     DankToggle {
@@ -98,7 +104,7 @@ Item {
                         description: I18n.tr("Use fingerprint reader for lock screen authentication (requires enrolled fingerprints)")
                         checked: SettingsData.enableFprint
                         visible: SettingsData.fprintdAvailable
-                        onToggled: checked => SettingsData.set("enableFprint", checked)
+                        onToggled: checked => SettingsData.setEnableFprint(checked)
                     }
                 }
             }
@@ -107,7 +113,7 @@ Item {
                 width: parent.width
                 height: timeoutSection.implicitHeight + Theme.spacingL * 2
                 radius: Theme.cornerRadius
-                color: Theme.surfaceContainerHigh
+                color: Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.3)
                 border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
                 border.width: 0
 
@@ -152,81 +158,37 @@ Item {
                         }
                     }
 
-                    DankToggle {
-                        width: parent.width
-                        text: I18n.tr("Prevent idle for media")
-                        description: I18n.tr("Inhibit idle timeout when audio or video is playing")
-                        checked: SettingsData.preventIdleForMedia
-                        visible: IdleService.idleMonitorAvailable
-                        onToggled: checked => SettingsData.set("preventIdleForMedia", checked)
-                    }
-
-                    DankToggle {
-                        width: parent.width
-                        text: I18n.tr("Fade to lock screen")
-                        description: I18n.tr("Gradually fade the screen before locking with a configurable grace period")
-                        checked: SettingsData.fadeToLockEnabled
-                        onToggled: checked => SettingsData.set("fadeToLockEnabled", checked)
-                    }
-
-                    DankDropdown {
-                        id: fadeGracePeriodDropdown
-                        property var periodOptions: ["1 second", "2 seconds", "3 seconds", "4 seconds", "5 seconds", "10 seconds", "15 seconds", "20 seconds", "30 seconds"]
-                        property var periodValues: [1, 2, 3, 4, 5, 10, 15, 20, 30]
-
-                        width: parent.width
-                        addHorizontalPadding: true
-                        text: I18n.tr("Fade grace period")
-                        options: periodOptions
-                        visible: SettingsData.fadeToLockEnabled
-                        enabled: SettingsData.fadeToLockEnabled
-
-                        Component.onCompleted: {
-                            const currentPeriod = SettingsData.fadeToLockGracePeriod;
-                            const index = periodValues.indexOf(currentPeriod);
-                            currentValue = index >= 0 ? periodOptions[index] : "5 seconds";
-                        }
-
-                        onValueChanged: value => {
-                            const index = periodOptions.indexOf(value);
-                            if (index >= 0) {
-                                SettingsData.set("fadeToLockGracePeriod", periodValues[index]);
-                            }
-                        }
-                    }
-
                     DankDropdown {
                         id: lockDropdown
                         property var timeoutOptions: ["Never", "1 minute", "2 minutes", "3 minutes", "5 minutes", "10 minutes", "15 minutes", "20 minutes", "30 minutes", "1 hour", "1 hour 30 minutes", "2 hours", "3 hours"]
                         property var timeoutValues: [0, 60, 120, 180, 300, 600, 900, 1200, 1800, 3600, 5400, 7200, 10800]
 
-                        addHorizontalPadding: true
                         text: I18n.tr("Automatically lock after")
                         options: timeoutOptions
 
                         Connections {
                             target: powerCategory
                             function onCurrentIndexChanged() {
-                                const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acLockTimeout : SettingsData.batteryLockTimeout;
-                                const index = lockDropdown.timeoutValues.indexOf(currentTimeout);
-                                lockDropdown.currentValue = index >= 0 ? lockDropdown.timeoutOptions[index] : "Never";
+                                const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acLockTimeout : SettingsData.batteryLockTimeout
+                                const index = lockDropdown.timeoutValues.indexOf(currentTimeout)
+                                lockDropdown.currentValue = index >= 0 ? lockDropdown.timeoutOptions[index] : "Never"
                             }
                         }
 
                         Component.onCompleted: {
-                            const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acLockTimeout : SettingsData.batteryLockTimeout;
-                            const index = timeoutValues.indexOf(currentTimeout);
-                            currentValue = index >= 0 ? timeoutOptions[index] : "Never";
+                            const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acLockTimeout : SettingsData.batteryLockTimeout
+                            const index = timeoutValues.indexOf(currentTimeout)
+                            currentValue = index >= 0 ? timeoutOptions[index] : "Never"
                         }
 
                         onValueChanged: value => {
-                            const index = timeoutOptions.indexOf(value);
+                            const index = timeoutOptions.indexOf(value)
                             if (index >= 0) {
-                                const timeout = timeoutValues[index];
+                                const timeout = timeoutValues[index]
                                 if (powerCategory.currentIndex === 0) {
-                                    SettingsData.set("acLockTimeout", timeout);
+                                    SettingsData.setAcLockTimeout(timeout)
                                 } else {
-                                    SettingsData.set("batteryLockTimeout", timeout);
+                                    SettingsData.setBatteryLockTimeout(timeout)
                                 }
                             }
                         }
@@ -237,33 +199,32 @@ Item {
                         property var timeoutOptions: ["Never", "1 minute", "2 minutes", "3 minutes", "5 minutes", "10 minutes", "15 minutes", "20 minutes", "30 minutes", "1 hour", "1 hour 30 minutes", "2 hours", "3 hours"]
                         property var timeoutValues: [0, 60, 120, 180, 300, 600, 900, 1200, 1800, 3600, 5400, 7200, 10800]
 
-                        addHorizontalPadding: true
                         text: I18n.tr("Turn off monitors after")
                         options: timeoutOptions
 
                         Connections {
                             target: powerCategory
                             function onCurrentIndexChanged() {
-                                const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acMonitorTimeout : SettingsData.batteryMonitorTimeout;
-                                const index = monitorDropdown.timeoutValues.indexOf(currentTimeout);
-                                monitorDropdown.currentValue = index >= 0 ? monitorDropdown.timeoutOptions[index] : "Never";
+                                const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acMonitorTimeout : SettingsData.batteryMonitorTimeout
+                                const index = monitorDropdown.timeoutValues.indexOf(currentTimeout)
+                                monitorDropdown.currentValue = index >= 0 ? monitorDropdown.timeoutOptions[index] : "Never"
                             }
                         }
 
                         Component.onCompleted: {
-                            const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acMonitorTimeout : SettingsData.batteryMonitorTimeout;
-                            const index = timeoutValues.indexOf(currentTimeout);
-                            currentValue = index >= 0 ? timeoutOptions[index] : "Never";
+                            const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acMonitorTimeout : SettingsData.batteryMonitorTimeout
+                            const index = timeoutValues.indexOf(currentTimeout)
+                            currentValue = index >= 0 ? timeoutOptions[index] : "Never"
                         }
 
                         onValueChanged: value => {
-                            const index = timeoutOptions.indexOf(value);
+                            const index = timeoutOptions.indexOf(value)
                             if (index >= 0) {
-                                const timeout = timeoutValues[index];
+                                const timeout = timeoutValues[index]
                                 if (powerCategory.currentIndex === 0) {
-                                    SettingsData.set("acMonitorTimeout", timeout);
+                                    SettingsData.setAcMonitorTimeout(timeout)
                                 } else {
-                                    SettingsData.set("batteryMonitorTimeout", timeout);
+                                    SettingsData.setBatteryMonitorTimeout(timeout)
                                 }
                             }
                         }
@@ -274,77 +235,69 @@ Item {
                         property var timeoutOptions: ["Never", "1 minute", "2 minutes", "3 minutes", "5 minutes", "10 minutes", "15 minutes", "20 minutes", "30 minutes", "1 hour", "1 hour 30 minutes", "2 hours", "3 hours"]
                         property var timeoutValues: [0, 60, 120, 180, 300, 600, 900, 1200, 1800, 3600, 5400, 7200, 10800]
 
-                        addHorizontalPadding: true
                         text: I18n.tr("Suspend system after")
                         options: timeoutOptions
 
                         Connections {
                             target: powerCategory
                             function onCurrentIndexChanged() {
-                                const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acSuspendTimeout : SettingsData.batterySuspendTimeout;
-                                const index = suspendDropdown.timeoutValues.indexOf(currentTimeout);
-                                suspendDropdown.currentValue = index >= 0 ? suspendDropdown.timeoutOptions[index] : "Never";
+                                const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acSuspendTimeout : SettingsData.batterySuspendTimeout
+                                const index = suspendDropdown.timeoutValues.indexOf(currentTimeout)
+                                suspendDropdown.currentValue = index >= 0 ? suspendDropdown.timeoutOptions[index] : "Never"
                             }
                         }
 
                         Component.onCompleted: {
-                            const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acSuspendTimeout : SettingsData.batterySuspendTimeout;
-                            const index = timeoutValues.indexOf(currentTimeout);
-                            currentValue = index >= 0 ? timeoutOptions[index] : "Never";
+                            const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acSuspendTimeout : SettingsData.batterySuspendTimeout
+                            const index = timeoutValues.indexOf(currentTimeout)
+                            currentValue = index >= 0 ? timeoutOptions[index] : "Never"
                         }
 
                         onValueChanged: value => {
-                            const index = timeoutOptions.indexOf(value);
+                            const index = timeoutOptions.indexOf(value)
                             if (index >= 0) {
-                                const timeout = timeoutValues[index];
+                                const timeout = timeoutValues[index]
                                 if (powerCategory.currentIndex === 0) {
-                                    SettingsData.set("acSuspendTimeout", timeout);
+                                    SettingsData.setAcSuspendTimeout(timeout)
                                 } else {
-                                    SettingsData.set("batterySuspendTimeout", timeout);
+                                    SettingsData.setBatterySuspendTimeout(timeout)
                                 }
                             }
                         }
                     }
 
-                    Column {
-                        width: parent.width
-                        spacing: Theme.spacingS
+                    DankDropdown {
+                        id: hibernateDropdown
+                        property var timeoutOptions: ["Never", "1 minute", "2 minutes", "3 minutes", "5 minutes", "10 minutes", "15 minutes", "20 minutes", "30 minutes", "1 hour", "1 hour 30 minutes", "2 hours", "3 hours"]
+                        property var timeoutValues: [0, 60, 120, 180, 300, 600, 900, 1200, 1800, 3600, 5400, 7200, 10800]
+
+                        text: I18n.tr("Hibernate system after")
+                        options: timeoutOptions
                         visible: SessionService.hibernateSupported
 
-                        StyledText {
-                            text: I18n.tr("Suspend behavior")
-                            font.pixelSize: Theme.fontSizeMedium
-                            color: Theme.surfaceText
-                            leftPadding: Theme.spacingM
+                        Connections {
+                            target: powerCategory
+                            function onCurrentIndexChanged() {
+                                const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acHibernateTimeout : SettingsData.batteryHibernateTimeout
+                                const index = hibernateDropdown.timeoutValues.indexOf(currentTimeout)
+                                hibernateDropdown.currentValue = index >= 0 ? hibernateDropdown.timeoutOptions[index] : "Never"
+                            }
                         }
 
-                        DankButtonGroup {
-                            id: suspendBehaviorSelector
-                            anchors.horizontalCenter: parent.horizontalCenter
-                            model: ["Suspend", "Hibernate", "Suspend then Hibernate"]
-                            selectionMode: "single"
-                            checkEnabled: false
+                        Component.onCompleted: {
+                            const currentTimeout = powerCategory.currentIndex === 0 ? SettingsData.acHibernateTimeout : SettingsData.batteryHibernateTimeout
+                            const index = timeoutValues.indexOf(currentTimeout)
+                            currentValue = index >= 0 ? timeoutOptions[index] : "Never"
+                        }
 
-                            Connections {
-                                target: powerCategory
-                                function onCurrentIndexChanged() {
-                                    const behavior = powerCategory.currentIndex === 0 ? SettingsData.acSuspendBehavior : SettingsData.batterySuspendBehavior;
-                                    suspendBehaviorSelector.currentIndex = behavior;
-                                }
-                            }
-
-                            Component.onCompleted: {
-                                const behavior = powerCategory.currentIndex === 0 ? SettingsData.acSuspendBehavior : SettingsData.batterySuspendBehavior;
-                                currentIndex = behavior;
-                            }
-
-                            onSelectionChanged: (index, selected) => {
-                                if (selected) {
-                                    if (powerCategory.currentIndex === 0) {
-                                        SettingsData.set("acSuspendBehavior", index);
-                                    } else {
-                                        SettingsData.set("batterySuspendBehavior", index);
-                                    }
+                        onValueChanged: value => {
+                            const index = timeoutOptions.indexOf(value)
+                            if (index >= 0) {
+                                const timeout = timeoutValues[index]
+                                if (powerCategory.currentIndex === 0) {
+                                    SettingsData.setAcHibernateTimeout(timeout)
+                                } else {
+                                    SettingsData.setBatteryHibernateTimeout(timeout)
                                 }
                             }
                         }
@@ -360,198 +313,11 @@ Item {
                 }
             }
 
-            StyledRect {
-                width: parent.width
-                height: powerMenuCustomSection.implicitHeight + Theme.spacingL * 2
-                radius: Theme.cornerRadius
-                color: Theme.surfaceContainerHigh
-                border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
-                border.width: 0
-
-                Column {
-                    id: powerMenuCustomSection
-                    anchors.fill: parent
-                    anchors.margins: Theme.spacingL
-                    spacing: Theme.spacingM
-
-                    Row {
-                        width: parent.width
-                        spacing: Theme.spacingM
-
-                        DankIcon {
-                            name: "tune"
-                            size: Theme.iconSize
-                            color: Theme.primary
-                            anchors.verticalCenter: parent.verticalCenter
-                        }
-
-                        StyledText {
-                            text: I18n.tr("Power Menu Customization")
-                            font.pixelSize: Theme.fontSizeLarge
-                            font.weight: Font.Medium
-                            color: Theme.surfaceText
-                            anchors.verticalCenter: parent.verticalCenter
-                        }
-                    }
-
-                    StyledText {
-                        text: I18n.tr("Customize which actions appear in the power menu")
-                        font.pixelSize: Theme.fontSizeSmall
-                        color: Theme.surfaceVariantText
-                        width: parent.width
-                        wrapMode: Text.Wrap
-                    }
-
-                    DankToggle {
-                        width: parent.width
-                        text: I18n.tr("Use Grid Layout")
-                        description: I18n.tr("Display power menu actions in a grid instead of a list")
-                        checked: SettingsData.powerMenuGridLayout
-                        onToggled: checked => SettingsData.set("powerMenuGridLayout", checked)
-                    }
-
-                    DankDropdown {
-                        id: defaultActionDropdown
-                        width: parent.width
-                        addHorizontalPadding: true
-                        text: I18n.tr("Default selected action")
-                        options: ["Reboot", "Log Out", "Power Off", "Lock", "Suspend", "Restart DMS", "Hibernate"]
-                        property var actionValues: ["reboot", "logout", "poweroff", "lock", "suspend", "restart", "hibernate"]
-
-                        Component.onCompleted: {
-                            const currentAction = SettingsData.powerMenuDefaultAction || "logout";
-                            const index = actionValues.indexOf(currentAction);
-                            currentValue = index >= 0 ? options[index] : "Log Out";
-                        }
-
-                        onValueChanged: value => {
-                            const index = options.indexOf(value);
-                            if (index >= 0) {
-                                SettingsData.set("powerMenuDefaultAction", actionValues[index]);
-                            }
-                        }
-                    }
-
-                    Column {
-                        width: parent.width
-                        spacing: Theme.spacingS
-
-                        DankToggle {
-                            width: parent.width
-                            text: I18n.tr("Show Reboot")
-                            checked: SettingsData.powerMenuActions.includes("reboot")
-                            onToggled: checked => {
-                                let actions = [...SettingsData.powerMenuActions];
-                                if (checked && !actions.includes("reboot")) {
-                                    actions.push("reboot");
-                                } else if (!checked) {
-                                    actions = actions.filter(a => a !== "reboot");
-                                }
-                                SettingsData.set("powerMenuActions", actions);
-                            }
-                        }
-
-                        DankToggle {
-                            width: parent.width
-                            text: I18n.tr("Show Log Out")
-                            checked: SettingsData.powerMenuActions.includes("logout")
-                            onToggled: checked => {
-                                let actions = [...SettingsData.powerMenuActions];
-                                if (checked && !actions.includes("logout")) {
-                                    actions.push("logout");
-                                } else if (!checked) {
-                                    actions = actions.filter(a => a !== "logout");
-                                }
-                                SettingsData.set("powerMenuActions", actions);
-                            }
-                        }
-
-                        DankToggle {
-                            width: parent.width
-                            text: I18n.tr("Show Power Off")
-                            checked: SettingsData.powerMenuActions.includes("poweroff")
-                            onToggled: checked => {
-                                let actions = [...SettingsData.powerMenuActions];
-                                if (checked && !actions.includes("poweroff")) {
-                                    actions.push("poweroff");
-                                } else if (!checked) {
-                                    actions = actions.filter(a => a !== "poweroff");
-                                }
-                                SettingsData.set("powerMenuActions", actions);
-                            }
-                        }
-
-                        DankToggle {
-                            width: parent.width
-                            text: I18n.tr("Show Lock")
-                            checked: SettingsData.powerMenuActions.includes("lock")
-                            onToggled: checked => {
-                                let actions = [...SettingsData.powerMenuActions];
-                                if (checked && !actions.includes("lock")) {
-                                    actions.push("lock");
-                                } else if (!checked) {
-                                    actions = actions.filter(a => a !== "lock");
-                                }
-                                SettingsData.set("powerMenuActions", actions);
-                            }
-                        }
-
-                        DankToggle {
-                            width: parent.width
-                            text: I18n.tr("Show Suspend")
-                            checked: SettingsData.powerMenuActions.includes("suspend")
-                            onToggled: checked => {
-                                let actions = [...SettingsData.powerMenuActions];
-                                if (checked && !actions.includes("suspend")) {
-                                    actions.push("suspend");
-                                } else if (!checked) {
-                                    actions = actions.filter(a => a !== "suspend");
-                                }
-                                SettingsData.set("powerMenuActions", actions);
-                            }
-                        }
-
-                        DankToggle {
-                            width: parent.width
-                            text: I18n.tr("Show Restart DMS")
-                            description: I18n.tr("Restart the DankMaterialShell")
-                            checked: SettingsData.powerMenuActions.includes("restart")
-                            onToggled: checked => {
-                                let actions = [...SettingsData.powerMenuActions];
-                                if (checked && !actions.includes("restart")) {
-                                    actions.push("restart");
-                                } else if (!checked) {
-                                    actions = actions.filter(a => a !== "restart");
-                                }
-                                SettingsData.set("powerMenuActions", actions);
-                            }
-                        }
-
-                        DankToggle {
-                            width: parent.width
-                            text: I18n.tr("Show Hibernate")
-                            description: I18n.tr("Only visible if hibernate is supported by your system")
-                            checked: SettingsData.powerMenuActions.includes("hibernate")
-                            visible: SessionService.hibernateSupported
-                            onToggled: checked => {
-                                let actions = [...SettingsData.powerMenuActions];
-                                if (checked && !actions.includes("hibernate")) {
-                                    actions.push("hibernate");
-                                } else if (!checked) {
-                                    actions = actions.filter(a => a !== "hibernate");
-                                }
-                                SettingsData.set("powerMenuActions", actions);
-                            }
-                        }
-                    }
-                }
-            }
-
             StyledRect {
                 width: parent.width
                 height: powerCommandConfirmSection.implicitHeight + Theme.spacingL * 2
                 radius: Theme.cornerRadius
-                color: Theme.surfaceContainerHigh
+                color: Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.3)
                 border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
                 border.width: 0
 
@@ -583,53 +349,10 @@ Item {
 
                     DankToggle {
                         width: parent.width
-                        text: I18n.tr("Hold to Confirm Power Actions")
-                        description: I18n.tr("Require holding button/key to confirm power off, restart, suspend, hibernate and logout")
+                        text: I18n.tr("Show Confirmation on Power Actions")
+                        description: I18n.tr("Request confirmation on power off, restart, suspend, hibernate and logout actions")
                         checked: SettingsData.powerActionConfirm
-                        onToggled: checked => SettingsData.set("powerActionConfirm", checked)
-                    }
-
-                    Column {
-                        width: parent.width
-                        spacing: Theme.spacingS
-                        visible: SettingsData.powerActionConfirm
-
-                        Item {
-                            width: parent.width - Theme.spacingM * 2
-                            anchors.horizontalCenter: parent.horizontalCenter
-                            height: holdDurationLabel.height
-
-                            StyledText {
-                                id: holdDurationLabel
-                                text: I18n.tr("Hold Duration")
-                                font.pixelSize: Appearance.fontSize.normal
-                                font.weight: Font.Medium
-                                anchors.left: parent.left
-                                anchors.verticalCenter: parent.verticalCenter
-                            }
-
-                            StyledText {
-                                text: SettingsData.powerActionHoldDuration + "s"
-                                font.pixelSize: Appearance.fontSize.normal
-                                font.weight: Font.Medium
-                                color: Theme.primary
-                                anchors.right: parent.right
-                                anchors.verticalCenter: parent.verticalCenter
-                            }
-                        }
-
-                        DankSlider {
-                            width: parent.width - Theme.spacingM * 2
-                            anchors.horizontalCenter: parent.horizontalCenter
-                            minimum: 1
-                            maximum: 10
-                            unit: "s"
-                            wheelEnabled: false
-                            showValue: false
-                            thumbOutlineColor: Theme.surfaceContainerHigh
-                            value: SettingsData.powerActionHoldDuration
-                            onSliderValueChanged: newValue => SettingsData.set("powerActionHoldDuration", newValue)
-                        }
+                        onToggled: checked => SettingsData.setPowerActionConfirm(checked)
                     }
                 }
             }
@@ -638,7 +361,7 @@ Item {
                 width: parent.width
                 height: powerCommandCustomization.implicitHeight + Theme.spacingL * 2
                 radius: Theme.cornerRadius
-                color: Theme.surfaceContainerHigh
+                color: Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, 0.3)
                 border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
                 border.width: 0
 
@@ -684,8 +407,8 @@ Item {
                             width: parent.width
                             height: 48
                             placeholderText: "/usr/bin/myLock.sh"
-                            backgroundColor: Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
-                            normalBorderColor: Theme.outlineMedium
+                            backgroundColor: Theme.surfaceVariant
+                            normalBorderColor: Theme.primarySelected
                             focusedBorderColor: Theme.primary
 
                             Component.onCompleted: {
@@ -695,7 +418,7 @@ Item {
                             }
 
                             onTextEdited: {
-                                SettingsData.set("customPowerActionLock", text.trim());
+                                SettingsData.setCustomPowerActionLock(text.trim());
                             }
                         }
                     }
@@ -716,8 +439,8 @@ Item {
                             width: parent.width
                             height: 48
                             placeholderText: "/usr/bin/myLogout.sh"
-                            backgroundColor: Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
-                            normalBorderColor: Theme.outlineMedium
+                            backgroundColor: Theme.surfaceVariant
+                            normalBorderColor: Theme.primarySelected
                             focusedBorderColor: Theme.primary
 
                             Component.onCompleted: {
@@ -727,7 +450,7 @@ Item {
                             }
 
                             onTextEdited: {
-                                SettingsData.set("customPowerActionLogout", text.trim());
+                                SettingsData.setCustomPowerActionLogout(text.trim());
                             }
                         }
                     }
@@ -748,8 +471,8 @@ Item {
                             width: parent.width
                             height: 48
                             placeholderText: "/usr/bin/mySuspend.sh"
-                            backgroundColor: Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
-                            normalBorderColor: Theme.outlineMedium
+                            backgroundColor: Theme.surfaceVariant
+                            normalBorderColor: Theme.primarySelected
                             focusedBorderColor: Theme.primary
 
                             Component.onCompleted: {
@@ -759,7 +482,7 @@ Item {
                             }
 
                             onTextEdited: {
-                                SettingsData.set("customPowerActionSuspend", text.trim());
+                                SettingsData.setCustomPowerActionSuspend(text.trim());
                             }
                         }
                     }
@@ -780,8 +503,8 @@ Item {
                             width: parent.width
                             height: 48
                             placeholderText: "/usr/bin/myHibernate.sh"
-                            backgroundColor: Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
-                            normalBorderColor: Theme.outlineMedium
+                            backgroundColor: Theme.surfaceVariant
+                            normalBorderColor: Theme.primarySelected
                             focusedBorderColor: Theme.primary
 
                             Component.onCompleted: {
@@ -791,7 +514,7 @@ Item {
                             }
 
                             onTextEdited: {
-                                SettingsData.set("customPowerActionHibernate", text.trim());
+                                SettingsData.setCustomPowerActionHibernate(text.trim());
                             }
                         }
                     }
@@ -812,8 +535,8 @@ Item {
                             width: parent.width
                             height: 48
                             placeholderText: "/usr/bin/myReboot.sh"
-                            backgroundColor: Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
-                            normalBorderColor: Theme.outlineMedium
+                            backgroundColor: Theme.surfaceVariant
+                            normalBorderColor: Theme.primarySelected
                             focusedBorderColor: Theme.primary
 
                             Component.onCompleted: {
@@ -823,7 +546,7 @@ Item {
                             }
 
                             onTextEdited: {
-                                SettingsData.set("customPowerActionReboot", text.trim());
+                                SettingsData.setCustomPowerActionReboot(text.trim());
                             }
                         }
                     }
@@ -844,8 +567,8 @@ Item {
                             width: parent.width
                             height: 48
                             placeholderText: "/usr/bin/myPowerOff.sh"
-                            backgroundColor: Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
-                            normalBorderColor: Theme.outlineMedium
+                            backgroundColor: Theme.surfaceVariant
+                            normalBorderColor: Theme.primarySelected
                             focusedBorderColor: Theme.primary
 
                             Component.onCompleted: {
@@ -855,7 +578,7 @@ Item {
                             }
 
                             onTextEdited: {
-                                SettingsData.set("customPowerActionPowerOff", text.trim());
+                                SettingsData.setCustomPowerActionPowerOff(text.trim());
                             }
                         }
                     }

Modals/Settings/ProfileSection.qml

@@ -1,4 +1,5 @@
 import QtQuick
+import QtQuick.Effects
 import qs.Common
 import qs.Services
 import qs.Widgets
@@ -80,6 +81,7 @@ Rectangle {
                                 }
                             }
                         }
+
                     }
 
                     Rectangle {
@@ -103,8 +105,11 @@ Rectangle {
                                 return PortalService.setProfileImage("");
                             }
                         }
+
                     }
+
                 }
+
             }
 
             MouseArea {
@@ -116,6 +121,7 @@ Rectangle {
                 propagateComposedEvents: true
                 acceptedButtons: Qt.NoButton
             }
+
         }
 
         Column {
@@ -133,12 +139,15 @@ Rectangle {
             }
 
             StyledText {
-                text: DgopService.hostname || "DMS"
+                text: DgopService.distribution || "Linux"
                 font.pixelSize: Theme.fontSizeMedium
                 color: Theme.surfaceVariantText
                 elide: Text.ElideRight
                 width: parent.width
             }
+
         }
+
     }
+
 }

Modals/Settings/SettingsContent.qml

@@ -0,0 +1,174 @@
+import QtQuick
+import qs.Common
+import qs.Modules.Settings
+
+FocusScope {
+    id: root
+
+    property int currentIndex: 0
+    property var parentModal: null
+    focus: true
+
+    Rectangle {
+        anchors.fill: parent
+        anchors.leftMargin: 0
+        anchors.rightMargin: Theme.spacingS
+        anchors.bottomMargin: Theme.spacingM
+        anchors.topMargin: 0
+        color: "transparent"
+
+        Loader {
+            id: personalizationLoader
+
+            anchors.fill: parent
+            active: root.currentIndex === 0
+            visible: active
+            asynchronous: true
+
+            sourceComponent: Component {
+                PersonalizationTab {
+                    parentModal: root.parentModal
+                }
+
+            }
+
+        }
+
+        Loader {
+            id: timeWeatherLoader
+
+            anchors.fill: parent
+            active: root.currentIndex === 1
+            visible: active
+            asynchronous: true
+
+            sourceComponent: TimeWeatherTab {
+            }
+
+        }
+
+        Loader {
+            id: topBarLoader
+
+            anchors.fill: parent
+            active: root.currentIndex === 2
+            visible: active
+            asynchronous: true
+
+            sourceComponent: DankBarTab {
+                parentModal: root.parentModal
+            }
+
+        }
+
+        Loader {
+            id: widgetsLoader
+
+            anchors.fill: parent
+            active: root.currentIndex === 3
+            visible: active
+            asynchronous: true
+
+            sourceComponent: WidgetTweaksTab {
+            }
+
+        }
+
+        Loader {
+            id: dockLoader
+
+            anchors.fill: parent
+            active: root.currentIndex === 4
+            visible: active
+            asynchronous: true
+
+            sourceComponent: Component {
+                DockTab {
+                }
+
+            }
+
+        }
+
+        Loader {
+            id: displaysLoader
+
+            anchors.fill: parent
+            active: root.currentIndex === 5
+            visible: active
+            asynchronous: true
+
+            sourceComponent: DisplaysTab {
+            }
+
+        }
+
+        Loader {
+            id: launcherLoader
+
+            anchors.fill: parent
+            active: root.currentIndex === 6
+            visible: active
+            asynchronous: true
+
+            sourceComponent: LauncherTab {
+            }
+
+        }
+
+        Loader {
+            id: themeColorsLoader
+
+            anchors.fill: parent
+            active: root.currentIndex === 7
+            visible: active
+            asynchronous: true
+
+            sourceComponent: ThemeColorsTab {
+            }
+
+        }
+
+        Loader {
+            id: powerLoader
+
+            anchors.fill: parent
+            active: root.currentIndex === 8
+            visible: active
+            asynchronous: true
+
+            sourceComponent: PowerSettings {
+            }
+
+        }
+
+        Loader {
+            id: pluginsLoader
+
+            anchors.fill: parent
+            active: root.currentIndex === 9
+            visible: active
+            asynchronous: true
+
+            sourceComponent: PluginsTab {
+                parentModal: root.parentModal
+            }
+
+        }
+
+        Loader {
+            id: aboutLoader
+
+            anchors.fill: parent
+            active: root.currentIndex === 10
+            visible: active
+            asynchronous: true
+
+            sourceComponent: AboutTab {
+            }
+
+        }
+
+    }
+
+}

Modals/Settings/SettingsModal.qml

@@ -0,0 +1,195 @@
+import QtQuick
+import QtQuick.Effects
+import Quickshell.Io
+import qs.Common
+import qs.Modals.Common
+import qs.Modals.FileBrowser
+import qs.Modules.Settings
+import qs.Services
+import qs.Widgets
+
+DankModal {
+    id: settingsModal
+
+    property Component settingsContent
+    property alias profileBrowser: profileBrowser
+
+    signal closingModal()
+
+    function show() {
+        open();
+    }
+
+    function hide() {
+        close();
+    }
+
+    function toggle() {
+        if (shouldBeVisible) {
+            hide();
+        } else {
+            show();
+        }
+    }
+
+    objectName: "settingsModal"
+    width: 800
+    height: 800
+    visible: false
+    onBackgroundClicked: () => {
+        return hide();
+    }
+    content: settingsContent
+
+    IpcHandler {
+        function open(): string {
+            settingsModal.show();
+            return "SETTINGS_OPEN_SUCCESS";
+        }
+
+        function close(): string {
+            settingsModal.hide();
+            return "SETTINGS_CLOSE_SUCCESS";
+        }
+
+        function toggle(): string {
+            settingsModal.toggle();
+            return "SETTINGS_TOGGLE_SUCCESS";
+        }
+
+        target: "settings"
+    }
+
+    IpcHandler {
+        function browse(type: string) {
+            if (type === "wallpaper") {
+                wallpaperBrowser.allowStacking = false;
+                wallpaperBrowser.open();
+            } else if (type === "profile") {
+                profileBrowser.allowStacking = false;
+                profileBrowser.open();
+            }
+        }
+
+        target: "file"
+    }
+
+    FileBrowserModal {
+        id: profileBrowser
+
+        allowStacking: true
+        parentModal: settingsModal
+        browserTitle: "Select Profile Image"
+        browserIcon: "person"
+        browserType: "profile"
+        fileExtensions: ["*.jpg", "*.jpeg", "*.png", "*.bmp", "*.gif", "*.webp"]
+        onFileSelected: (path) => {
+            PortalService.setProfileImage(path);
+            close();
+        }
+        onDialogClosed: () => {
+            allowStacking = true;
+        }
+    }
+
+    FileBrowserModal {
+        id: wallpaperBrowser
+
+        allowStacking: true
+        parentModal: settingsModal
+        browserTitle: "Select Wallpaper"
+        browserIcon: "wallpaper"
+        browserType: "wallpaper"
+        fileExtensions: ["*.jpg", "*.jpeg", "*.png", "*.bmp", "*.gif", "*.webp"]
+        onFileSelected: (path) => {
+            SessionData.setWallpaper(path);
+            close();
+        }
+        onDialogClosed: () => {
+            allowStacking = true;
+        }
+    }
+
+    settingsContent: Component {
+        FocusScope {
+            anchors.fill: parent
+            focus: true
+
+            Column {
+                anchors.fill: parent
+                anchors.leftMargin: Theme.spacingL
+                anchors.rightMargin: Theme.spacingL
+                anchors.topMargin: Theme.spacingM
+                anchors.bottomMargin: Theme.spacingL
+                spacing: 0
+
+                Item {
+                    width: parent.width
+                    height: 35
+
+                    Row {
+                        anchors.left: parent.left
+                        anchors.verticalCenter: parent.verticalCenter
+                        spacing: Theme.spacingM
+
+                        DankIcon {
+                            name: "settings"
+                            size: Theme.iconSize
+                            color: Theme.primary
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+
+                        StyledText {
+                            text: I18n.tr("Settings")
+                            font.pixelSize: Theme.fontSizeXLarge
+                            color: Theme.surfaceText
+                            font.weight: Font.Medium
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+
+                    }
+
+                    DankActionButton {
+                        anchors.right: parent.right
+                        anchors.verticalCenter: parent.verticalCenter
+                        circular: false
+                        iconName: "close"
+                        iconSize: Theme.iconSize - 4
+                        iconColor: Theme.surfaceText
+                        onClicked: () => {
+                            return settingsModal.hide();
+                        }
+                    }
+
+                }
+
+                Row {
+                    width: parent.width
+                    height: parent.height - 35
+                    spacing: 0
+
+                    SettingsSidebar {
+                        id: sidebar
+
+                        parentModal: settingsModal
+                        onCurrentIndexChanged: content.currentIndex = currentIndex
+                    }
+
+                    SettingsContent {
+                        id: content
+
+                        width: parent.width - sidebar.width
+                        height: parent.height
+                        parentModal: settingsModal
+                        currentIndex: sidebar.currentIndex
+                    }
+
+                }
+
+            }
+
+        }
+
+    }
+
+}

Modals/Settings/SettingsSidebar.qml

@@ -0,0 +1,136 @@
+import QtQuick
+import qs.Common
+import qs.Modals.Settings
+import qs.Widgets
+
+Rectangle {
+    id: sidebarContainer
+
+    property int currentIndex: 0
+    property var parentModal: null
+    readonly property var sidebarItems: [{
+        "text": I18n.tr("Personalization"),
+        "icon": "person"
+    }, {
+        "text": I18n.tr("Time & Weather"),
+        "icon": "schedule"
+    }, {
+        "text": I18n.tr("Dank Bar"),
+        "icon": "toolbar"
+    }, {
+        "text": I18n.tr("Widgets"),
+        "icon": "widgets"
+    }, {
+        "text": I18n.tr("Dock"),
+        "icon": "dock_to_bottom"
+    }, {
+        "text": I18n.tr("Displays"),
+        "icon": "monitor"
+    }, {
+        "text": I18n.tr("Launcher"),
+        "icon": "apps"
+    }, {
+        "text": I18n.tr("Theme & Colors"),
+        "icon": "palette"
+    }, {
+        "text": I18n.tr("Power & Security"),
+        "icon": "power"
+    }, {
+        "text": I18n.tr("Plugins"),
+        "icon": "extension"
+    }, {
+        "text": I18n.tr("About"),
+        "icon": "info"
+    }]
+
+    width: 270
+    height: parent.height
+    color: Theme.surfaceContainer
+    radius: Theme.cornerRadius
+
+    Column {
+        anchors.fill: parent
+        anchors.leftMargin: Theme.spacingS
+        anchors.rightMargin: Theme.spacingS
+        anchors.bottomMargin: Theme.spacingS
+        anchors.topMargin: Theme.spacingM + 2
+        spacing: Theme.spacingXS
+
+        ProfileSection {
+            parentModal: sidebarContainer.parentModal
+        }
+
+        Rectangle {
+            width: parent.width - Theme.spacingS * 2
+            height: 1
+            color: Theme.outline
+            opacity: 0.2
+        }
+
+        Item {
+            width: parent.width
+            height: Theme.spacingL
+        }
+
+        Repeater {
+            id: sidebarRepeater
+
+            model: sidebarContainer.sidebarItems
+
+            Rectangle {
+                property bool isActive: sidebarContainer.currentIndex === index
+
+                width: parent.width - Theme.spacingS * 2
+                height: 44
+                radius: Theme.cornerRadius
+                color: isActive ? Theme.primary : tabMouseArea.containsMouse ? Theme.surfaceHover : "transparent"
+
+                Row {
+                    anchors.left: parent.left
+                    anchors.leftMargin: Theme.spacingM
+                    anchors.verticalCenter: parent.verticalCenter
+                    spacing: Theme.spacingM
+
+                    DankIcon {
+                        name: modelData.icon || ""
+                        size: Theme.iconSize - 2
+                        color: parent.parent.isActive ? Theme.primaryText : Theme.surfaceText
+                        anchors.verticalCenter: parent.verticalCenter
+                    }
+
+                    StyledText {
+                        text: modelData.text || ""
+                        font.pixelSize: Theme.fontSizeMedium
+                        color: parent.parent.isActive ? Theme.primaryText : Theme.surfaceText
+                        font.weight: parent.parent.isActive ? Font.Medium : Font.Normal
+                        anchors.verticalCenter: parent.verticalCenter
+                    }
+
+                }
+
+                MouseArea {
+                    id: tabMouseArea
+
+                    anchors.fill: parent
+                    hoverEnabled: true
+                    cursorShape: Qt.PointingHandCursor
+                    onClicked: () => {
+                        sidebarContainer.currentIndex = index;
+                    }
+                }
+
+                Behavior on color {
+                    ColorAnimation {
+                        duration: Theme.shortDuration
+                        easing.type: Theme.standardEasing
+                    }
+
+                }
+
+            }
+
+        }
+
+    }
+
+}

Modals/Spotlight/SpotlightContent.qml

@@ -0,0 +1,244 @@
+import QtQuick
+import QtQuick.Controls
+import qs.Common
+import qs.Modals.Spotlight
+import qs.Modules.AppDrawer
+import qs.Services
+import qs.Widgets
+
+Item {
+    id: spotlightKeyHandler
+
+    property alias appLauncher: appLauncher
+    property alias searchField: searchField
+    property var parentModal: null
+
+    function resetScroll() {
+        resultsView.resetScroll()
+    }
+
+    anchors.fill: parent
+    focus: true
+    clip: false
+    Keys.onPressed: event => {
+                        if (event.key === Qt.Key_Escape) {
+                            if (parentModal)
+                            parentModal.hide()
+
+                            event.accepted = true
+                        } else if (event.key === Qt.Key_Down) {
+                            appLauncher.selectNext()
+                            event.accepted = true
+                        } else if (event.key === Qt.Key_Up) {
+                            appLauncher.selectPrevious()
+                            event.accepted = true
+                        } else if (event.key === Qt.Key_Right && appLauncher.viewMode === "grid") {
+                            appLauncher.selectNextInRow()
+                            event.accepted = true
+                        } else if (event.key === Qt.Key_Left && appLauncher.viewMode === "grid") {
+                            appLauncher.selectPreviousInRow()
+                            event.accepted = true
+                        } else if (event.key == Qt.Key_J && event.modifiers & Qt.ControlModifier) {
+                            appLauncher.selectNext()
+                            event.accepted = true
+                        } else if (event.key == Qt.Key_K && event.modifiers & Qt.ControlModifier) {
+                            appLauncher.selectPrevious()
+                            event.accepted = true
+                        } else if (event.key == Qt.Key_L && event.modifiers & Qt.ControlModifier && appLauncher.viewMode === "grid") {
+                            appLauncher.selectNextInRow()
+                            event.accepted = true
+                        } else if (event.key == Qt.Key_H && event.modifiers & Qt.ControlModifier && appLauncher.viewMode === "grid") {
+                            appLauncher.selectPreviousInRow()
+                            event.accepted = true
+                        } else if (event.key === Qt.Key_Tab) {
+                            if (appLauncher.viewMode === "grid") {
+                                appLauncher.selectNextInRow()
+                            } else {
+                                appLauncher.selectNext()
+                            }
+                            event.accepted = true
+                        } else if (event.key === Qt.Key_Backtab) {
+                            if (appLauncher.viewMode === "grid") {
+                                appLauncher.selectPreviousInRow()
+                            } else {
+                                appLauncher.selectPrevious()
+                            }
+                            event.accepted = true
+                        } else if (event.key === Qt.Key_N && event.modifiers & Qt.ControlModifier) {
+                            if (appLauncher.viewMode === "grid") {
+                                appLauncher.selectNextInRow()
+                            } else {
+                                appLauncher.selectNext()
+                            }
+                            event.accepted = true
+                        } else if (event.key === Qt.Key_P && event.modifiers & Qt.ControlModifier) {
+                            if (appLauncher.viewMode === "grid") {
+                                appLauncher.selectPreviousInRow()
+                            } else {
+                                appLauncher.selectPrevious()
+                            }
+                            event.accepted = true
+                        } else if (event.key === Qt.Key_Return || event.key === Qt.Key_Enter) {
+                            appLauncher.launchSelected()
+                            event.accepted = true
+                        }
+                    }
+
+    AppLauncher {
+        id: appLauncher
+
+        viewMode: SettingsData.spotlightModalViewMode
+        gridColumns: 4
+        onAppLaunched: () => {
+                           if (parentModal)
+                           parentModal.hide()
+                       }
+        onViewModeSelected: mode => {
+                                SettingsData.setSpotlightModalViewMode(mode)
+                            }
+    }
+
+    Column {
+        anchors.fill: parent
+        anchors.margins: Theme.spacingM
+        spacing: Theme.spacingM
+        clip: false
+
+        Row {
+            width: parent.width
+            spacing: Theme.spacingM
+            leftPadding: Theme.spacingS
+
+            DankTextField {
+                id: searchField
+
+                width: parent.width - 80 - Theme.spacingL
+                height: 56
+                cornerRadius: Theme.cornerRadius
+                backgroundColor: Theme.surfaceContainerHigh
+                normalBorderColor: Theme.outlineMedium
+                focusedBorderColor: Theme.primary
+                leftIconName: "search"
+                leftIconSize: Theme.iconSize
+                leftIconColor: Theme.surfaceVariantText
+                leftIconFocusedColor: Theme.primary
+                showClearButton: true
+                textColor: Theme.surfaceText
+                font.pixelSize: Theme.fontSizeLarge
+                enabled: parentModal ? parentModal.spotlightOpen : true
+                placeholderText: ""
+                ignoreLeftRightKeys: appLauncher.viewMode !== "list"
+                ignoreTabKeys: true
+                keyForwardTargets: [spotlightKeyHandler]
+                text: appLauncher.searchQuery
+                onTextEdited: () => {
+                                  appLauncher.searchQuery = text
+                              }
+                Keys.onPressed: event => {
+                                    if (event.key === Qt.Key_Escape) {
+                                        if (parentModal)
+                                        parentModal.hide()
+
+                                        event.accepted = true
+                                    } else if ((event.key === Qt.Key_Return || event.key === Qt.Key_Enter) && text.length > 0) {
+                                        if (appLauncher.keyboardNavigationActive && appLauncher.model.count > 0)
+                                        appLauncher.launchSelected()
+                                        else if (appLauncher.model.count > 0)
+                                        appLauncher.launchApp(appLauncher.model.get(0))
+                                        event.accepted = true
+                                    } else if (event.key === Qt.Key_Down || event.key === Qt.Key_Up || event.key === Qt.Key_Left || event.key === Qt.Key_Right || event.key === Qt.Key_Tab || event.key === Qt.Key_Backtab || ((event.key === Qt.Key_Return || event.key === Qt.Key_Enter) && text.length === 0)) {
+                                        event.accepted = false
+                                    }
+                                }
+            }
+
+            Row {
+                spacing: Theme.spacingXS
+                visible: appLauncher.model.count > 0
+                anchors.verticalCenter: parent.verticalCenter
+
+                Rectangle {
+                    width: 36
+                    height: 36
+                    radius: Theme.cornerRadius
+                    color: appLauncher.viewMode === "list" ? Theme.primaryHover : listViewArea.containsMouse ? Theme.surfaceHover : "transparent"
+
+                    DankIcon {
+                        anchors.centerIn: parent
+                        name: "view_list"
+                        size: 18
+                        color: appLauncher.viewMode === "list" ? Theme.primary : Theme.surfaceText
+                    }
+
+                    MouseArea {
+                        id: listViewArea
+
+                        anchors.fill: parent
+                        hoverEnabled: true
+                        cursorShape: Qt.PointingHandCursor
+                        onClicked: () => {
+                                       appLauncher.setViewMode("list")
+                                   }
+                    }
+                }
+
+                Rectangle {
+                    width: 36
+                    height: 36
+                    radius: Theme.cornerRadius
+                    color: appLauncher.viewMode === "grid" ? Theme.primaryHover : gridViewArea.containsMouse ? Theme.surfaceHover : "transparent"
+
+                    DankIcon {
+                        anchors.centerIn: parent
+                        name: "grid_view"
+                        size: 18
+                        color: appLauncher.viewMode === "grid" ? Theme.primary : Theme.surfaceText
+                    }
+
+                    MouseArea {
+                        id: gridViewArea
+
+                        anchors.fill: parent
+                        hoverEnabled: true
+                        cursorShape: Qt.PointingHandCursor
+                        onClicked: () => {
+                                       appLauncher.setViewMode("grid")
+                                   }
+                    }
+                }
+            }
+        }
+
+        SpotlightResults {
+            id: resultsView
+            appLauncher: spotlightKeyHandler.appLauncher
+            contextMenu: contextMenu
+        }
+    }
+
+    SpotlightContextMenu {
+        id: contextMenu
+
+        appLauncher: spotlightKeyHandler.appLauncher
+        parentHandler: spotlightKeyHandler
+    }
+
+    MouseArea {
+        anchors.fill: parent
+        visible: contextMenu.visible
+        z: 999
+        onClicked: () => {
+                       contextMenu.hide()
+                   }
+
+        MouseArea {
+
+            // Prevent closing when clicking on the menu itself
+            x: contextMenu.x
+            y: contextMenu.y
+            width: contextMenu.width
+            height: contextMenu.height
+            onClicked: () => {}
+        }
+    }
+}

Modals/Spotlight/SpotlightContextMenu.qml

@@ -0,0 +1,338 @@
+import QtQuick
+import QtQuick.Controls
+import Quickshell
+import Quickshell.Widgets
+import qs.Common
+import qs.Services
+import qs.Widgets
+
+Popup {
+    id: contextMenu
+
+    property var currentApp: null
+    property var appLauncher: null
+    property var parentHandler: null
+    readonly property var desktopEntry: (currentApp && !currentApp.isPlugin && appLauncher && appLauncher._uniqueApps && currentApp.appIndex >= 0 && currentApp.appIndex < appLauncher._uniqueApps.length) ? appLauncher._uniqueApps[currentApp.appIndex] : null
+
+    function show(x, y, app) {
+        currentApp = app
+        contextMenu.x = x + 4
+        contextMenu.y = y + 4
+        contextMenu.open()
+    }
+
+    function hide() {
+        contextMenu.close()
+    }
+
+    width: Math.max(180, menuColumn.implicitWidth + Theme.spacingS * 2)
+    height: menuColumn.implicitHeight + Theme.spacingS * 2
+    padding: 0
+    closePolicy: Popup.CloseOnPressOutside
+    modal: false
+    dim: false
+
+    background: Rectangle {
+        radius: Theme.cornerRadius
+        color: Theme.popupBackground()
+        border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
+        border.width: 1
+
+        Rectangle {
+            anchors.fill: parent
+            anchors.topMargin: 4
+            anchors.leftMargin: 2
+            anchors.rightMargin: -2
+            anchors.bottomMargin: -4
+            radius: parent.radius
+            color: Qt.rgba(0, 0, 0, 0.15)
+            z: -1
+        }
+    }
+
+    enter: Transition {
+        NumberAnimation {
+            property: "opacity"
+            from: 0
+            to: 1
+            duration: Theme.shortDuration
+            easing.type: Theme.emphasizedEasing
+        }
+    }
+
+    exit: Transition {
+        NumberAnimation {
+            property: "opacity"
+            from: 1
+            to: 0
+            duration: Theme.shortDuration
+            easing.type: Theme.emphasizedEasing
+        }
+    }
+
+    Column {
+        id: menuColumn
+
+        anchors.fill: parent
+        anchors.margins: Theme.spacingS
+        spacing: 1
+
+        Rectangle {
+            width: parent.width
+            height: 32
+            radius: Theme.cornerRadius
+            color: pinMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
+
+            Row {
+                id: pinRow
+                anchors.left: parent.left
+                anchors.leftMargin: Theme.spacingS
+                anchors.verticalCenter: parent.verticalCenter
+                spacing: Theme.spacingS
+
+                DankIcon {
+                    name: {
+                        if (!desktopEntry)
+                            return "push_pin"
+
+                        const appId = desktopEntry.id || desktopEntry.execString || ""
+                        return SessionData.isPinnedApp(appId) ? "keep_off" : "push_pin"
+                    }
+                    size: Theme.iconSize - 2
+                    color: Theme.surfaceText
+                    opacity: 0.7
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+
+                StyledText {
+                    text: {
+                        if (!desktopEntry)
+                            return I18n.tr("Pin to Dock")
+
+                        const appId = desktopEntry.id || desktopEntry.execString || ""
+                        return SessionData.isPinnedApp(appId) ? I18n.tr("Unpin from Dock") : I18n.tr("Pin to Dock")
+                    }
+                    font.pixelSize: Theme.fontSizeSmall
+                    color: Theme.surfaceText
+                    font.weight: Font.Normal
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+            }
+
+            MouseArea {
+                id: pinMouseArea
+
+                anchors.fill: parent
+                hoverEnabled: true
+                cursorShape: Qt.PointingHandCursor
+                onClicked: () => {
+                               if (!desktopEntry)
+                               return
+
+                               const appId = desktopEntry.id || desktopEntry.execString || ""
+                               if (SessionData.isPinnedApp(appId))
+                               SessionData.removePinnedApp(appId)
+                               else
+                               SessionData.addPinnedApp(appId)
+                               contextMenu.hide()
+                           }
+            }
+        }
+
+        Rectangle {
+            width: parent.width - Theme.spacingS * 2
+            height: 5
+            anchors.horizontalCenter: parent.horizontalCenter
+            color: "transparent"
+
+            Rectangle {
+                anchors.centerIn: parent
+                width: parent.width
+                height: 1
+                color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
+            }
+        }
+
+        Repeater {
+            model: desktopEntry && desktopEntry.actions ? desktopEntry.actions : []
+
+            Rectangle {
+                width: parent.width
+                height: 32
+                radius: Theme.cornerRadius
+                color: actionMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
+
+                Row {
+                    id: actionRow
+                    anchors.left: parent.left
+                    anchors.leftMargin: Theme.spacingS
+                    anchors.verticalCenter: parent.verticalCenter
+                    spacing: Theme.spacingS
+
+                    Item {
+                        anchors.verticalCenter: parent.verticalCenter
+                        width: Theme.iconSize - 2
+                        height: Theme.iconSize - 2
+                        visible: modelData.icon && modelData.icon !== ""
+
+                        IconImage {
+                            anchors.fill: parent
+                            source: modelData.icon ? Quickshell.iconPath(modelData.icon, true) : ""
+                            smooth: true
+                            asynchronous: true
+                            visible: status === Image.Ready
+                        }
+                    }
+
+                    StyledText {
+                        text: modelData.name || ""
+                        font.pixelSize: Theme.fontSizeSmall
+                        color: Theme.surfaceText
+                        font.weight: Font.Normal
+                        anchors.verticalCenter: parent.verticalCenter
+                    }
+                }
+
+                MouseArea {
+                    id: actionMouseArea
+                    anchors.fill: parent
+                    hoverEnabled: true
+                    cursorShape: Qt.PointingHandCursor
+                    onClicked: {
+                        if (modelData && desktopEntry) {
+                            SessionService.launchDesktopAction(desktopEntry, modelData)
+                            if (appLauncher && contextMenu.currentApp) {
+                                appLauncher.appLaunched(contextMenu.currentApp)
+                            }
+                        }
+                        contextMenu.hide()
+                    }
+                }
+            }
+        }
+
+        Rectangle {
+            visible: desktopEntry && desktopEntry.actions && desktopEntry.actions.length > 0
+            width: parent.width - Theme.spacingS * 2
+            height: 5
+            anchors.horizontalCenter: parent.horizontalCenter
+            color: "transparent"
+
+            Rectangle {
+                anchors.centerIn: parent
+                width: parent.width
+                height: 1
+                color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
+            }
+        }
+
+        Rectangle {
+            width: parent.width
+            height: 32
+            radius: Theme.cornerRadius
+            color: launchMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
+
+            Row {
+                id: launchRow
+                anchors.left: parent.left
+                anchors.leftMargin: Theme.spacingS
+                anchors.verticalCenter: parent.verticalCenter
+                spacing: Theme.spacingS
+
+                DankIcon {
+                    name: "launch"
+                    size: Theme.iconSize - 2
+                    color: Theme.surfaceText
+                    opacity: 0.7
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+
+                StyledText {
+                    text: I18n.tr("Launch")
+                    font.pixelSize: Theme.fontSizeSmall
+                    color: Theme.surfaceText
+                    font.weight: Font.Normal
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+            }
+
+            MouseArea {
+                id: launchMouseArea
+
+                anchors.fill: parent
+                hoverEnabled: true
+                cursorShape: Qt.PointingHandCursor
+                onClicked: () => {
+                               if (contextMenu.currentApp && appLauncher)
+                               appLauncher.launchApp(contextMenu.currentApp)
+
+                               contextMenu.hide()
+                           }
+            }
+        }
+
+        Rectangle {
+            visible: SessionService.hasPrimeRun
+            width: parent.width - Theme.spacingS * 2
+            height: 5
+            anchors.horizontalCenter: parent.horizontalCenter
+            color: "transparent"
+
+            Rectangle {
+                anchors.centerIn: parent
+                width: parent.width
+                height: 1
+                color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
+            }
+        }
+
+        Rectangle {
+            visible: SessionService.hasPrimeRun
+            width: parent.width
+            height: 32
+            radius: Theme.cornerRadius
+            color: primeRunMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
+
+            Row {
+                id: primeRunRow
+                anchors.left: parent.left
+                anchors.leftMargin: Theme.spacingS
+                anchors.verticalCenter: parent.verticalCenter
+                spacing: Theme.spacingS
+
+                DankIcon {
+                    name: "memory"
+                    size: Theme.iconSize - 2
+                    color: Theme.surfaceText
+                    opacity: 0.7
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+
+                StyledText {
+                    text: I18n.tr("Launch on dGPU")
+                    font.pixelSize: Theme.fontSizeSmall
+                    color: Theme.surfaceText
+                    font.weight: Font.Normal
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+            }
+
+            MouseArea {
+                id: primeRunMouseArea
+
+                anchors.fill: parent
+                hoverEnabled: true
+                cursorShape: Qt.PointingHandCursor
+                onClicked: () => {
+                               if (desktopEntry) {
+                                   SessionService.launchDesktopEntry(desktopEntry, true)
+                                   if (appLauncher && contextMenu.currentApp) {
+                                       appLauncher.appLaunched(contextMenu.currentApp)
+                                   }
+                               }
+                               contextMenu.hide()
+                           }
+            }
+        }
+    }
+}

Modals/Spotlight/SpotlightModal.qml

@@ -0,0 +1,153 @@
+import QtQuick
+import QtQuick.Controls
+import Quickshell
+import Quickshell.Io
+import Quickshell.Widgets
+import qs.Common
+import qs.Modals.Common
+import qs.Modules.AppDrawer
+import qs.Services
+import qs.Widgets
+
+DankModal {
+    id: spotlightModal
+
+    property bool spotlightOpen: false
+    property alias spotlightContent: spotlightContentInstance
+
+    function show() {
+        spotlightOpen = true
+        open()
+
+        Qt.callLater(() => {
+            if (spotlightContent && spotlightContent.searchField) {
+                spotlightContent.searchField.forceActiveFocus()
+            }
+        })
+    }
+
+    function showWithQuery(query) {
+        if (spotlightContent) {
+            if (spotlightContent.appLauncher) {
+                spotlightContent.appLauncher.searchQuery = query
+            }
+            if (spotlightContent.searchField) {
+                spotlightContent.searchField.text = query
+            }
+        }
+
+        spotlightOpen = true
+        open()
+
+        Qt.callLater(() => {
+            if (spotlightContent && spotlightContent.searchField) {
+                spotlightContent.searchField.forceActiveFocus()
+            }
+        })
+    }
+
+    function hide() {
+        spotlightOpen = false
+        close()
+    }
+
+    onDialogClosed: {
+        if (spotlightContent) {
+            if (spotlightContent.appLauncher) {
+                spotlightContent.appLauncher.searchQuery = ""
+                spotlightContent.appLauncher.selectedIndex = 0
+                spotlightContent.appLauncher.setCategory(I18n.tr("All"))
+            }
+            if (spotlightContent.resetScroll) {
+                spotlightContent.resetScroll()
+            }
+            if (spotlightContent.searchField) {
+                spotlightContent.searchField.text = ""
+            }
+        }
+    }
+
+    function toggle() {
+        if (spotlightOpen) {
+            hide()
+        } else {
+            show()
+        }
+    }
+
+    shouldBeVisible: spotlightOpen
+    width: 550
+    height: 700
+    backgroundColor: Theme.popupBackground()
+    cornerRadius: Theme.cornerRadius
+    borderColor: Theme.outlineMedium
+    borderWidth: 1
+    enableShadow: true
+    keepContentLoaded: true
+    onVisibleChanged: () => {
+                          if (visible && !spotlightOpen) {
+                              show()
+                          }
+                          if (visible && spotlightContent) {
+                              Qt.callLater(() => {
+                                               if (spotlightContent.searchField) {
+                                                   spotlightContent.searchField.forceActiveFocus()
+                                               }
+                                           })
+                          }
+                      }
+    onBackgroundClicked: () => {
+                             return hide()
+                         }
+
+    Connections {
+        function onCloseAllModalsExcept(excludedModal) {
+            if (excludedModal !== spotlightModal && !allowStacking && spotlightOpen) {
+                spotlightOpen = false
+            }
+        }
+
+        target: ModalManager
+    }
+
+    IpcHandler {
+        function open(): string  {
+            spotlightModal.show()
+            return "SPOTLIGHT_OPEN_SUCCESS"
+        }
+
+        function close(): string  {
+            spotlightModal.hide()
+            return "SPOTLIGHT_CLOSE_SUCCESS"
+        }
+
+        function toggle(): string  {
+            spotlightModal.toggle()
+            return "SPOTLIGHT_TOGGLE_SUCCESS"
+        }
+
+        function openQuery(query: string): string {
+            spotlightModal.showWithQuery(query)
+            return "SPOTLIGHT_OPEN_QUERY_SUCCESS"
+        }
+
+        function toggleQuery(query: string): string {
+            if (spotlightModal.spotlightOpen) {
+                spotlightModal.hide()
+            } else {
+                spotlightModal.showWithQuery(query)
+            }
+            return "SPOTLIGHT_TOGGLE_QUERY_SUCCESS"
+        }
+
+        target: "spotlight"
+    }
+
+    SpotlightContent {
+        id: spotlightContentInstance
+
+        parentModal: spotlightModal
+    }
+
+    directContent: spotlightContentInstance
+}

Modals/Spotlight/SpotlightResults.qml

@@ -0,0 +1,328 @@
+import QtQuick
+import Quickshell
+import Quickshell.Widgets
+import qs.Common
+import qs.Widgets
+
+Rectangle {
+    id: resultsContainer
+
+    property var appLauncher: null
+    property var contextMenu: null
+
+    function resetScroll() {
+        resultsList.contentY = 0
+        resultsGrid.contentY = 0
+    }
+
+    width: parent.width
+    height: parent.height - y
+    radius: Theme.cornerRadius
+    color: "transparent"
+    clip: true
+
+    DankListView {
+        id: resultsList
+
+        property int itemHeight: 60
+        property int iconSize: 40
+        property bool showDescription: true
+        property int itemSpacing: Theme.spacingS
+        property bool hoverUpdatesSelection: false
+        property bool keyboardNavigationActive: appLauncher ? appLauncher.keyboardNavigationActive : false
+
+        signal keyboardNavigationReset
+        signal itemClicked(int index, var modelData)
+        signal itemRightClicked(int index, var modelData, real mouseX, real mouseY)
+
+        function ensureVisible(index) {
+            if (index < 0 || index >= count)
+                return
+
+            const itemY = index * (itemHeight + itemSpacing)
+            const itemBottom = itemY + itemHeight
+            if (itemY < contentY)
+                contentY = itemY
+            else if (itemBottom > contentY + height)
+                contentY = itemBottom - height
+        }
+
+        anchors.fill: parent
+        anchors.margins: Theme.spacingS
+        visible: appLauncher && appLauncher.viewMode === "list"
+        model: appLauncher ? appLauncher.model : null
+        currentIndex: appLauncher ? appLauncher.selectedIndex : -1
+        clip: true
+        spacing: itemSpacing
+        focus: true
+        interactive: true
+        cacheBuffer: Math.max(0, Math.min(height * 2, 1000))
+        reuseItems: true
+        onCurrentIndexChanged: {
+            if (keyboardNavigationActive)
+                ensureVisible(currentIndex)
+        }
+        onItemClicked: (index, modelData) => {
+                           if (appLauncher)
+                           appLauncher.launchApp(modelData)
+                       }
+        onItemRightClicked: (index, modelData, mouseX, mouseY) => {
+                                if (contextMenu)
+                                contextMenu.show(mouseX, mouseY, modelData)
+                            }
+        onKeyboardNavigationReset: () => {
+                                       if (appLauncher)
+                                       appLauncher.keyboardNavigationActive = false
+                                   }
+
+        delegate: Rectangle {
+            width: ListView.view.width
+            height: resultsList.itemHeight
+            radius: Theme.cornerRadius
+            color: ListView.isCurrentItem ? Theme.primaryPressed : listMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.surfaceContainerHigh
+
+            Row {
+                anchors.fill: parent
+                anchors.margins: Theme.spacingM
+                spacing: Theme.spacingL
+
+                Item {
+                    width: resultsList.iconSize
+                    height: resultsList.iconSize
+                    anchors.verticalCenter: parent.verticalCenter
+
+                    IconImage {
+                        id: listIconImg
+
+                        anchors.fill: parent
+                        source: Quickshell.iconPath(model.icon, true)
+                        asynchronous: true
+                        visible: status === Image.Ready
+                    }
+
+                    Rectangle {
+                        anchors.fill: parent
+                        visible: !listIconImg.visible
+                        color: Theme.surfaceLight
+                        radius: Theme.cornerRadius
+                        border.width: 1
+                        border.color: Theme.primarySelected
+
+                        StyledText {
+                            anchors.centerIn: parent
+                            text: (model.name && model.name.length > 0) ? model.name.charAt(0).toUpperCase() : "A"
+                            font.pixelSize: resultsList.iconSize * 0.4
+                            color: Theme.primary
+                            font.weight: Font.Bold
+                        }
+                    }
+                }
+
+                Column {
+                    anchors.verticalCenter: parent.verticalCenter
+                    width: parent.width - resultsList.iconSize - Theme.spacingL
+                    spacing: Theme.spacingXS
+
+                    StyledText {
+                        width: parent.width
+                        text: model.name || ""
+                        font.pixelSize: Theme.fontSizeLarge
+                        color: Theme.surfaceText
+                        font.weight: Font.Medium
+                        elide: Text.ElideRight
+                        wrapMode: Text.NoWrap
+                        maximumLineCount: 1
+                    }
+
+                    StyledText {
+                        width: parent.width
+                        text: model.comment || "Application"
+                        font.pixelSize: Theme.fontSizeMedium
+                        color: Theme.surfaceVariantText
+                        elide: Text.ElideRight
+                        maximumLineCount: 1
+                        visible: resultsList.showDescription && model.comment && model.comment.length > 0
+                    }
+                }
+            }
+
+            MouseArea {
+                id: listMouseArea
+
+                anchors.fill: parent
+                hoverEnabled: true
+                cursorShape: Qt.PointingHandCursor
+                acceptedButtons: Qt.LeftButton | Qt.RightButton
+                z: 10
+                onEntered: () => {
+                               if (resultsList.hoverUpdatesSelection && !resultsList.keyboardNavigationActive)
+                               resultsList.currentIndex = index
+                           }
+                onPositionChanged: () => {
+                                       resultsList.keyboardNavigationReset()
+                                   }
+                onClicked: mouse => {
+                               if (mouse.button === Qt.LeftButton) {
+                                   resultsList.itemClicked(index, model)
+                               } else if (mouse.button === Qt.RightButton && !model.isPlugin) {
+                                   const globalPos = mapToItem(null, mouse.x, mouse.y)
+                                   const modalPos = resultsContainer.parent.mapFromItem(null, globalPos.x, globalPos.y)
+                                   resultsList.itemRightClicked(index, model, modalPos.x, modalPos.y)
+                               }
+                           }
+            }
+        }
+    }
+
+    DankGridView {
+        id: resultsGrid
+
+        property int currentIndex: appLauncher ? appLauncher.selectedIndex : -1
+        property int columns: 4
+        property bool adaptiveColumns: false
+        property int minCellWidth: 120
+        property int maxCellWidth: 160
+        property int cellPadding: 8
+        property real iconSizeRatio: 0.55
+        property int maxIconSize: 48
+        property int minIconSize: 32
+        property bool hoverUpdatesSelection: false
+        property bool keyboardNavigationActive: appLauncher ? appLauncher.keyboardNavigationActive : false
+        property int baseCellWidth: adaptiveColumns ? Math.max(minCellWidth, Math.min(maxCellWidth, width / columns)) : (width - Theme.spacingS * 2) / columns
+        property int baseCellHeight: baseCellWidth + 20
+        property int actualColumns: adaptiveColumns ? Math.floor(width / cellWidth) : columns
+        property int remainingSpace: width - (actualColumns * cellWidth)
+
+        signal keyboardNavigationReset
+        signal itemClicked(int index, var modelData)
+        signal itemRightClicked(int index, var modelData, real mouseX, real mouseY)
+
+        function ensureVisible(index) {
+            if (index < 0 || index >= count)
+                return
+
+            const itemY = Math.floor(index / actualColumns) * cellHeight
+            const itemBottom = itemY + cellHeight
+            if (itemY < contentY)
+                contentY = itemY
+            else if (itemBottom > contentY + height)
+                contentY = itemBottom - height
+        }
+
+        anchors.fill: parent
+        anchors.margins: Theme.spacingS
+        visible: appLauncher && appLauncher.viewMode === "grid"
+        model: appLauncher ? appLauncher.model : null
+        clip: true
+        cellWidth: baseCellWidth
+        cellHeight: baseCellHeight
+        leftMargin: Math.max(Theme.spacingS, remainingSpace / 2)
+        rightMargin: leftMargin
+        focus: true
+        interactive: true
+        cacheBuffer: Math.max(0, Math.min(height * 2, 1000))
+        reuseItems: true
+        onCurrentIndexChanged: {
+            if (keyboardNavigationActive)
+                ensureVisible(currentIndex)
+        }
+        onItemClicked: (index, modelData) => {
+                           if (appLauncher)
+                           appLauncher.launchApp(modelData)
+                       }
+        onItemRightClicked: (index, modelData, mouseX, mouseY) => {
+                                if (contextMenu)
+                                contextMenu.show(mouseX, mouseY, modelData)
+                            }
+        onKeyboardNavigationReset: () => {
+                                       if (appLauncher)
+                                       appLauncher.keyboardNavigationActive = false
+                                   }
+
+        delegate: Rectangle {
+            width: resultsGrid.cellWidth - resultsGrid.cellPadding
+            height: resultsGrid.cellHeight - resultsGrid.cellPadding
+            radius: Theme.cornerRadius
+            color: resultsGrid.currentIndex === index ? Theme.primaryPressed : gridMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.surfaceContainerHigh
+
+            Column {
+                anchors.centerIn: parent
+                spacing: Theme.spacingS
+
+                Item {
+                    property int iconSize: Math.min(resultsGrid.maxIconSize, Math.max(resultsGrid.minIconSize, resultsGrid.cellWidth * resultsGrid.iconSizeRatio))
+
+                    width: iconSize
+                    height: iconSize
+                    anchors.horizontalCenter: parent.horizontalCenter
+
+                    IconImage {
+                        id: gridIconImg
+
+                        anchors.fill: parent
+                        source: Quickshell.iconPath(model.icon, true)
+                        smooth: true
+                        asynchronous: true
+                        visible: status === Image.Ready
+                    }
+
+                    Rectangle {
+                        anchors.fill: parent
+                        visible: !gridIconImg.visible
+                        color: Theme.surfaceLight
+                        radius: Theme.cornerRadius
+                        border.width: 1
+                        border.color: Theme.primarySelected
+
+                        StyledText {
+                            anchors.centerIn: parent
+                            text: (model.name && model.name.length > 0) ? model.name.charAt(0).toUpperCase() : "A"
+                            font.pixelSize: Math.min(28, parent.width * 0.5)
+                            color: Theme.primary
+                            font.weight: Font.Bold
+                        }
+                    }
+                }
+
+                StyledText {
+                    anchors.horizontalCenter: parent.horizontalCenter
+                    width: resultsGrid.cellWidth - 12
+                    text: model.name || ""
+                    font.pixelSize: Theme.fontSizeSmall
+                    color: Theme.surfaceText
+                    font.weight: Font.Medium
+                    elide: Text.ElideRight
+                    horizontalAlignment: Text.AlignHCenter
+                    maximumLineCount: 1
+                    wrapMode: Text.NoWrap
+                }
+            }
+
+            MouseArea {
+                id: gridMouseArea
+
+                anchors.fill: parent
+                hoverEnabled: true
+                cursorShape: Qt.PointingHandCursor
+                acceptedButtons: Qt.LeftButton | Qt.RightButton
+                z: 10
+                onEntered: () => {
+                               if (resultsGrid.hoverUpdatesSelection && !resultsGrid.keyboardNavigationActive)
+                               resultsGrid.currentIndex = index
+                           }
+                onPositionChanged: () => {
+                                       resultsGrid.keyboardNavigationReset()
+                                   }
+                onClicked: mouse => {
+                               if (mouse.button === Qt.LeftButton) {
+                                   resultsGrid.itemClicked(index, model)
+                               } else if (mouse.button === Qt.RightButton && !model.isPlugin) {
+                                   const globalPos = mapToItem(null, mouse.x, mouse.y)
+                                   const modalPos = resultsContainer.parent.mapFromItem(null, globalPos.x, globalPos.y)
+                                   resultsGrid.itemRightClicked(index, model, modalPos.x, modalPos.y)
+                               }
+                           }
+            }
+        }
+    }
+}

Modals/WifiPasswordModal.qml

@@ -0,0 +1,463 @@
+import QtQuick
+import qs.Common
+import qs.Modals.Common
+import qs.Services
+import qs.Widgets
+
+DankModal {
+    id: root
+
+    property string wifiPasswordSSID: ""
+    property string wifiPasswordInput: ""
+    property string wifiUsernameInput: ""
+    property bool requiresEnterprise: false
+
+    property string wifiAnonymousIdentityInput: ""
+    property string wifiDomainInput: ""
+
+    function show(ssid) {
+        wifiPasswordSSID = ssid
+        wifiPasswordInput = ""
+        wifiUsernameInput = ""
+        wifiAnonymousIdentityInput = ""
+        wifiDomainInput = ""
+
+        const network = NetworkService.wifiNetworks.find(n => n.ssid === ssid)
+        requiresEnterprise = network?.enterprise || false
+
+        open()
+        Qt.callLater(() => {
+                         if (contentLoader.item) {
+                             if (requiresEnterprise && contentLoader.item.usernameInput) {
+                                 contentLoader.item.usernameInput.forceActiveFocus()
+                             } else if (contentLoader.item.passwordInput) {
+                                 contentLoader.item.passwordInput.forceActiveFocus()
+                             }
+                         }
+                     })
+    }
+
+    shouldBeVisible: false
+    width: 420
+    height: requiresEnterprise ? 430 : 230
+    onShouldBeVisibleChanged: () => {
+                                  if (!shouldBeVisible) {
+                                      wifiPasswordInput = ""
+                                      wifiUsernameInput = ""
+                                      wifiAnonymousIdentityInput = ""
+                                      wifiDomainInput = ""
+                                  }
+                              }
+    onOpened: {
+        Qt.callLater(() => {
+                         if (contentLoader.item) {
+                             if (requiresEnterprise && contentLoader.item.usernameInput) {
+                                 contentLoader.item.usernameInput.forceActiveFocus()
+                             } else if (contentLoader.item.passwordInput) {
+                                 contentLoader.item.passwordInput.forceActiveFocus()
+                             }
+                         }
+                     })
+    }
+    onBackgroundClicked: () => {
+                             close()
+                             wifiPasswordInput = ""
+                             wifiUsernameInput = ""
+                             wifiAnonymousIdentityInput = ""
+                             wifiDomainInput = ""
+                         }
+
+    Connections {
+        target: NetworkService
+
+        function onPasswordDialogShouldReopenChanged() {
+            if (NetworkService.passwordDialogShouldReopen && NetworkService.connectingSSID !== "") {
+                wifiPasswordSSID = NetworkService.connectingSSID
+                wifiPasswordInput = ""
+                open()
+                NetworkService.passwordDialogShouldReopen = false
+            }
+        }
+    }
+
+    content: Component {
+        FocusScope {
+            id: wifiContent
+
+            property alias usernameInput: usernameInput
+            property alias passwordInput: passwordInput
+
+            anchors.fill: parent
+            focus: true
+            Keys.onEscapePressed: event => {
+                                      close()
+                                      wifiPasswordInput = ""
+                                      wifiUsernameInput = ""
+                                      wifiAnonymousIdentityInput = ""
+                                      wifiDomainInput = ""
+                                      event.accepted = true
+                                  }
+
+            Column {
+                anchors.centerIn: parent
+                width: parent.width - Theme.spacingM * 2
+                spacing: Theme.spacingM
+
+                Row {
+                    width: parent.width
+
+                    Column {
+                        width: parent.width - 40
+                        spacing: Theme.spacingXS
+
+                        StyledText {
+                            text: I18n.tr("Connect to Wi-Fi")
+                            font.pixelSize: Theme.fontSizeLarge
+                            color: Theme.surfaceText
+                            font.weight: Font.Medium
+                        }
+
+                        StyledText {
+                            text: requiresEnterprise ? I18n.tr("Enter credentials for ") + wifiPasswordSSID : I18n.tr("Enter password for ") + wifiPasswordSSID
+                            font.pixelSize: Theme.fontSizeMedium
+                            color: Theme.surfaceTextMedium
+                            width: parent.width
+                            elide: Text.ElideRight
+                        }
+                    }
+
+                    DankActionButton {
+                        iconName: "close"
+                        iconSize: Theme.iconSize - 4
+                        iconColor: Theme.surfaceText
+                        onClicked: () => {
+                                       close()
+                                       wifiPasswordInput = ""
+                                       wifiUsernameInput = ""
+                                       wifiAnonymousIdentityInput = ""
+                                       wifiDomainInput = ""
+                                   }
+                    }
+                }
+
+                Rectangle {
+                    width: parent.width
+                    height: 50
+                    radius: Theme.cornerRadius
+                    color: Theme.surfaceHover
+                    border.color: usernameInput.activeFocus ? Theme.primary : Theme.outlineStrong
+                    border.width: usernameInput.activeFocus ? 2 : 1
+                    visible: requiresEnterprise
+
+                    MouseArea {
+                        anchors.fill: parent
+                        onClicked: () => {
+                                       usernameInput.forceActiveFocus()
+                                   }
+                    }
+
+                    DankTextField {
+                        id: usernameInput
+
+                        anchors.fill: parent
+                        font.pixelSize: Theme.fontSizeMedium
+                        textColor: Theme.surfaceText
+                        text: wifiUsernameInput
+                        placeholderText: I18n.tr("Username")
+                        backgroundColor: "transparent"
+                        enabled: root.shouldBeVisible
+                        onTextEdited: () => {
+                                          wifiUsernameInput = text
+                                      }
+                        onAccepted: () => {
+                                        if (passwordInput) {
+                                            passwordInput.forceActiveFocus()
+                                        }
+                                    }
+                    }
+                }
+
+                Rectangle {
+                    width: parent.width
+                    height: 50
+                    radius: Theme.cornerRadius
+                    color: Theme.surfaceHover
+                    border.color: passwordInput.activeFocus ? Theme.primary : Theme.outlineStrong
+                    border.width: passwordInput.activeFocus ? 2 : 1
+
+                    MouseArea {
+                        anchors.fill: parent
+                        onClicked: () => {
+                                       passwordInput.forceActiveFocus()
+                                   }
+                    }
+
+                    DankTextField {
+                        id: passwordInput
+
+                        anchors.fill: parent
+                        font.pixelSize: Theme.fontSizeMedium
+                        textColor: Theme.surfaceText
+                        text: wifiPasswordInput
+                        echoMode: showPasswordCheckbox.checked ? TextInput.Normal : TextInput.Password
+                        placeholderText: requiresEnterprise ? I18n.tr("Password") : ""
+                        backgroundColor: "transparent"
+                        focus: !requiresEnterprise
+                        enabled: root.shouldBeVisible
+                        onTextEdited: () => {
+                                          wifiPasswordInput = text
+                                      }
+                        onAccepted: () => {
+                                        const username = requiresEnterprise ? usernameInput.text : ""
+                                        NetworkService.connectToWifi(
+                                            wifiPasswordSSID,
+                                            passwordInput.text,
+                                            username,
+                                            wifiAnonymousIdentityInput,
+                                            wifiDomainInput
+                                        )
+                                        close()
+                                        wifiPasswordInput = ""
+                                        wifiUsernameInput = ""
+                                        wifiAnonymousIdentityInput = ""
+                                        wifiDomainInput = ""
+                                        passwordInput.text = ""
+                                        if (requiresEnterprise) usernameInput.text = ""
+                                    }
+                        Component.onCompleted: () => {
+                                                   if (root.shouldBeVisible && !requiresEnterprise)
+                                                   focusDelayTimer.start()
+                                               }
+
+                        Timer {
+                            id: focusDelayTimer
+
+                            interval: 100
+                            repeat: false
+                            onTriggered: () => {
+                                             if (root.shouldBeVisible) {
+                                                 if (requiresEnterprise && usernameInput) {
+                                                     usernameInput.forceActiveFocus()
+                                                 } else {
+                                                     passwordInput.forceActiveFocus()
+                                                 }
+                                             }
+                                         }
+                        }
+
+                        Connections {
+                            target: root
+
+                            function onShouldBeVisibleChanged() {
+                                if (root.shouldBeVisible)
+                                    focusDelayTimer.start()
+                            }
+                        }
+                    }
+                }
+
+                Rectangle {
+                    visible: requiresEnterprise
+                    width: parent.width
+                    height: 50
+                    radius: Theme.cornerRadius
+                    color: Theme.surfaceHover
+                    border.color: anonInput.activeFocus ? Theme.primary : Theme.outlineStrong
+                    border.width: anonInput.activeFocus ? 2 : 1
+
+                    MouseArea {
+                        anchors.fill: parent
+                        onClicked: () => {
+                                       anonInput.forceActiveFocus()
+                                   }
+                    }
+
+                    DankTextField {
+                        id: anonInput
+
+                        anchors.fill: parent
+                        font.pixelSize: Theme.fontSizeMedium
+                        textColor: Theme.surfaceText
+                        text: wifiAnonymousIdentityInput
+                        placeholderText: I18n.tr("Anonymous Identity (optional)")
+                        backgroundColor: "transparent"
+                        enabled: root.shouldBeVisible
+                        onTextEdited: () => {
+                                          wifiAnonymousIdentityInput = text
+                                      }
+                    }
+                }
+
+                Rectangle {
+                    visible: requiresEnterprise
+                    width: parent.width
+                    height: 50
+                    radius: Theme.cornerRadius
+                    color: Theme.surfaceHover
+                    border.color: domainMatchInput.activeFocus ? Theme.primary : Theme.outlineStrong
+                    border.width: domainMatchInput.activeFocus ? 2 : 1
+
+                    MouseArea {
+                        anchors.fill: parent
+                        onClicked: () => {
+                                       domainMatchInput.forceActiveFocus()
+                                   }
+                    }
+
+                    DankTextField {
+                        id: domainMatchInput
+
+                        anchors.fill: parent
+                        font.pixelSize: Theme.fontSizeMedium
+                        textColor: Theme.surfaceText
+                        text: wifiDomainInput
+                        placeholderText: I18n.tr("Domain (optional)")
+                        backgroundColor: "transparent"
+                        enabled: root.shouldBeVisible
+                        onTextEdited: () => {
+                                          wifiDomainInput = text
+                                      }
+                    }
+                }
+
+                Row {
+                    spacing: Theme.spacingS
+
+                    Rectangle {
+                        id: showPasswordCheckbox
+
+                        property bool checked: false
+
+                        width: 20
+                        height: 20
+                        radius: 4
+                        color: checked ? Theme.primary : "transparent"
+                        border.color: checked ? Theme.primary : Theme.outlineButton
+                        border.width: 2
+
+                        DankIcon {
+                            anchors.centerIn: parent
+                            name: "check"
+                            size: 12
+                            color: Theme.background
+                            visible: parent.checked
+                        }
+
+                        MouseArea {
+                            anchors.fill: parent
+                            hoverEnabled: true
+                            cursorShape: Qt.PointingHandCursor
+                            onClicked: () => {
+                                           showPasswordCheckbox.checked = !showPasswordCheckbox.checked
+                                       }
+                        }
+                    }
+
+                    StyledText {
+                        text: I18n.tr("Show password")
+                        font.pixelSize: Theme.fontSizeMedium
+                        color: Theme.surfaceText
+                        anchors.verticalCenter: parent.verticalCenter
+                    }
+                }
+
+                Item {
+                    width: parent.width
+                    height: 40
+
+                    Row {
+                        anchors.right: parent.right
+                        anchors.verticalCenter: parent.verticalCenter
+                        spacing: Theme.spacingM
+
+                        Rectangle {
+                            width: Math.max(70, cancelText.contentWidth + Theme.spacingM * 2)
+                            height: 36
+                            radius: Theme.cornerRadius
+                            color: cancelArea.containsMouse ? Theme.surfaceTextHover : "transparent"
+                            border.color: Theme.surfaceVariantAlpha
+                            border.width: 1
+
+                            StyledText {
+                                id: cancelText
+
+                                anchors.centerIn: parent
+                                text: I18n.tr("Cancel")
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: Theme.surfaceText
+                                font.weight: Font.Medium
+                            }
+
+                            MouseArea {
+                                id: cancelArea
+
+                                anchors.fill: parent
+                                hoverEnabled: true
+                                cursorShape: Qt.PointingHandCursor
+                                onClicked: () => {
+                                               close()
+                                               wifiPasswordInput = ""
+                                               wifiUsernameInput = ""
+                                               wifiAnonymousIdentityInput = ""
+                                               wifiDomainInput = ""
+                                           }
+                            }
+                        }
+
+                        Rectangle {
+                            width: Math.max(80, connectText.contentWidth + Theme.spacingM * 2)
+                            height: 36
+                            radius: Theme.cornerRadius
+                            color: connectArea.containsMouse ? Qt.darker(Theme.primary, 1.1) : Theme.primary
+                            enabled: requiresEnterprise ? (usernameInput.text.length > 0 && passwordInput.text.length > 0) : passwordInput.text.length > 0
+                            opacity: enabled ? 1 : 0.5
+
+                            StyledText {
+                                id: connectText
+
+                                anchors.centerIn: parent
+                                text: I18n.tr("Connect")
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: Theme.background
+                                font.weight: Font.Medium
+                            }
+
+                            MouseArea {
+                                id: connectArea
+
+                                anchors.fill: parent
+                                hoverEnabled: true
+                                cursorShape: Qt.PointingHandCursor
+                                enabled: parent.enabled
+                                onClicked: () => {
+                                               const username = requiresEnterprise ? usernameInput.text : ""
+                                               NetworkService.connectToWifi(
+                                                   wifiPasswordSSID,
+                                                   passwordInput.text,
+                                                   username,
+                                                   wifiAnonymousIdentityInput,
+                                                   wifiDomainInput
+                                               )
+                                               close()
+                                               wifiPasswordInput = ""
+                                               wifiUsernameInput = ""
+                                               wifiAnonymousIdentityInput = ""
+                                               wifiDomainInput = ""
+                                               passwordInput.text = ""
+                                               if (requiresEnterprise) usernameInput.text = ""
+                                           }
+                            }
+
+                            Behavior on color {
+                                ColorAnimation {
+                                    duration: Theme.shortDuration
+                                    easing.type: Theme.standardEasing
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

Modules/AppDrawer/AppDrawerPopout.qml

@@ -1,6 +1,9 @@
 import QtQuick
 import QtQuick.Controls
+import QtQuick.Effects
 import Quickshell
+import Quickshell.Io
+import Quickshell.Wayland
 import Quickshell.Widgets
 import qs.Common
 import qs.Modules.AppDrawer
@@ -10,43 +13,53 @@ import qs.Widgets
 DankPopout {
     id: appDrawerPopout
 
-    layerNamespace: "dms:app-launcher"
+    property var triggerScreen: null
+
+    // Setting to Exclusive, so virtual keyboards can send input to app drawer
+    WlrLayershell.keyboardFocus: shouldBeVisible ? WlrKeyboardFocus.Exclusive : WlrKeyboardFocus.None 
 
     function show() {
-        open();
+        open()
+    }
+
+    function setTriggerPosition(x, y, width, section, screen) {
+        triggerX = x
+        triggerY = y
+        triggerWidth = width
+        triggerSection = section
+        triggerScreen = screen
     }
 
     popupWidth: 520
     popupHeight: 600
+    triggerX: Theme.spacingL
+    triggerY: Math.max(26 + SettingsData.dankBarInnerPadding + 4, Theme.barHeight - 4 - (8 - SettingsData.dankBarInnerPadding)) + SettingsData.dankBarSpacing + SettingsData.dankBarBottomGap - 2
     triggerWidth: 40
     positioning: ""
+    screen: triggerScreen
 
-    onBackgroundClicked: {
-        if (contextMenu.visible) {
-            contextMenu.close();
+    onShouldBeVisibleChanged: {
+        if (shouldBeVisible) {
+            appLauncher.searchQuery = ""
+            appLauncher.selectedIndex = 0
+            appLauncher.setCategory(I18n.tr("All"))
+            Qt.callLater(() => {
+                             if (contentLoader.item && contentLoader.item.searchField) {
+                                 contentLoader.item.searchField.text = ""
+                                 contentLoader.item.searchField.forceActiveFocus()
+                             }
+                         })
         }
-        close();
-    }
-
-    onOpened: {
-        appLauncher.searchQuery = "";
-        appLauncher.selectedIndex = 0;
-        appLauncher.setCategory(I18n.tr("All"));
-        if (contentLoader.item?.searchField) {
-            contentLoader.item.searchField.text = "";
-            contentLoader.item.searchField.forceActiveFocus();
-        }
-        contextMenu.parent = contentLoader.item;
     }
 
     AppLauncher {
         id: appLauncher
 
         viewMode: SettingsData.appLauncherViewMode
-        gridColumns: SettingsData.appLauncherGridColumns
+        gridColumns: 4
         onAppLaunched: appDrawerPopout.close()
         onViewModeSelected: function (mode) {
-            SettingsData.set("appLauncherViewMode", mode);
+            SettingsData.setAppLauncherViewMode(mode)
         }
     }
 
@@ -56,30 +69,26 @@ DankPopout {
 
             property alias searchField: searchField
 
-            color: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
+            color: Theme.popupBackground()
             radius: Theme.cornerRadius
             antialiasing: true
             smooth: true
 
             // Multi-layer border effect
             Repeater {
-                model: [
-                    {
+                model: [{
                         "margin": -3,
                         "color": Qt.rgba(0, 0, 0, 0.05),
                         "z": -3
-                    },
-                    {
+                    }, {
                         "margin": -2,
                         "color": Qt.rgba(0, 0, 0, 0.08),
                         "z": -2
-                    },
-                    {
+                    }, {
                         "margin": 0,
                         "color": Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12),
                         "z": -1
-                    }
-                ]
+                    }]
                 Rectangle {
                     anchors.fill: parent
                     anchors.margins: modelData.margin
@@ -97,67 +106,68 @@ DankPopout {
                 anchors.fill: parent
                 focus: true
                 readonly property var keyMappings: {
-                    const mappings = {};
-                    mappings[Qt.Key_Escape] = () => appDrawerPopout.close();
-                    mappings[Qt.Key_Down] = () => appLauncher.selectNext();
-                    mappings[Qt.Key_Up] = () => appLauncher.selectPrevious();
-                    mappings[Qt.Key_Return] = () => appLauncher.launchSelected();
-                    mappings[Qt.Key_Enter] = () => appLauncher.launchSelected();
-                    mappings[Qt.Key_Tab] = () => appLauncher.viewMode === "grid" ? appLauncher.selectNextInRow() : appLauncher.selectNext();
-                    mappings[Qt.Key_Backtab] = () => appLauncher.viewMode === "grid" ? appLauncher.selectPreviousInRow() : appLauncher.selectPrevious();
+                    const mappings = {}
+                    mappings[Qt.Key_Escape] = () => appDrawerPopout.close()
+                    mappings[Qt.Key_Down] = () => appLauncher.selectNext()
+                    mappings[Qt.Key_Up] = () => appLauncher.selectPrevious()
+                    mappings[Qt.Key_Return] = () => appLauncher.launchSelected()
+                    mappings[Qt.Key_Enter] = () => appLauncher.launchSelected()
+                    mappings[Qt.Key_Tab] = () => appLauncher.viewMode === "grid" ? appLauncher.selectNextInRow() : appLauncher.selectNext()
+                    mappings[Qt.Key_Backtab] = () => appLauncher.viewMode === "grid" ? appLauncher.selectPreviousInRow() : appLauncher.selectPrevious()
 
                     if (appLauncher.viewMode === "grid") {
-                        mappings[Qt.Key_Right] = () => appLauncher.selectNextInRow();
-                        mappings[Qt.Key_Left] = () => appLauncher.selectPreviousInRow();
+                        mappings[Qt.Key_Right] = () => appLauncher.selectNextInRow()
+                        mappings[Qt.Key_Left] = () => appLauncher.selectPreviousInRow()
                     }
 
-                    return mappings;
+                    return mappings
                 }
 
                 Keys.onPressed: function (event) {
                     if (keyMappings[event.key]) {
-                        keyMappings[event.key]();
-                        event.accepted = true;
-                        return;
+                        keyMappings[event.key]()
+                        event.accepted = true
+                        return
                     }
 
                     if (event.key === Qt.Key_N && event.modifiers & Qt.ControlModifier) {
-                        appLauncher.selectNext();
-                        event.accepted = true;
-                        return;
+                        appLauncher.selectNext()
+                        event.accepted = true
+                        return
                     }
 
                     if (event.key === Qt.Key_P && event.modifiers & Qt.ControlModifier) {
-                        appLauncher.selectPrevious();
-                        event.accepted = true;
-                        return;
+                        appLauncher.selectPrevious()
+                        event.accepted = true
+                        return
                     }
 
                     if (event.key === Qt.Key_J && event.modifiers & Qt.ControlModifier) {
-                        appLauncher.selectNext();
-                        event.accepted = true;
-                        return;
+                        appLauncher.selectNext()
+                        event.accepted = true
+                        return
                     }
 
                     if (event.key === Qt.Key_K && event.modifiers & Qt.ControlModifier) {
-                        appLauncher.selectPrevious();
-                        event.accepted = true;
-                        return;
+                        appLauncher.selectPrevious()
+                        event.accepted = true
+                        return
                     }
 
                     if (appLauncher.viewMode === "grid") {
                         if (event.key === Qt.Key_L && event.modifiers & Qt.ControlModifier) {
-                            appLauncher.selectNextInRow();
-                            event.accepted = true;
-                            return;
+                            appLauncher.selectNextInRow()
+                            event.accepted = true
+                            return
                         }
 
                         if (event.key === Qt.Key_H && event.modifiers & Qt.ControlModifier) {
-                            appLauncher.selectPreviousInRow();
-                            event.accepted = true;
-                            return;
+                            appLauncher.selectPreviousInRow()
+                            event.accepted = true
+                            return
                         }
                     }
+
                 }
 
                 Column {
@@ -198,8 +208,8 @@ DankPopout {
                         anchors.horizontalCenter: parent.horizontalCenter
                         height: 52
                         cornerRadius: Theme.cornerRadius
-                        backgroundColor: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
-                        normalBorderColor: Theme.outlineMedium
+                        backgroundColor: Qt.rgba(Theme.surfaceVariant.r, Theme.surfaceVariant.g, Theme.surfaceVariant.b, Theme.getContentBackgroundAlpha() * 0.7)
+                        normalBorderColor: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.3)
                         focusedBorderColor: Theme.primary
                         leftIconName: "search"
                         leftIconSize: Theme.iconSize
@@ -212,39 +222,39 @@ DankPopout {
                         ignoreTabKeys: true
                         keyForwardTargets: [keyHandler]
                         onTextEdited: {
-                            appLauncher.searchQuery = text;
+                            appLauncher.searchQuery = text
                         }
                         Keys.onPressed: function (event) {
                             if (event.key === Qt.Key_Escape) {
-                                appDrawerPopout.close();
-                                event.accepted = true;
-                                return;
+                                appDrawerPopout.close()
+                                event.accepted = true
+                                return
                             }
 
-                            const isEnterKey = [Qt.Key_Return, Qt.Key_Enter].includes(event.key);
-                            const hasText = text.length > 0;
+                            const isEnterKey = [Qt.Key_Return, Qt.Key_Enter].includes(event.key)
+                            const hasText = text.length > 0
 
                             if (isEnterKey && hasText) {
                                 if (appLauncher.keyboardNavigationActive && appLauncher.model.count > 0) {
-                                    appLauncher.launchSelected();
+                                    appLauncher.launchSelected()
                                 } else if (appLauncher.model.count > 0) {
-                                    appLauncher.launchApp(appLauncher.model.get(0));
+                                    appLauncher.launchApp(appLauncher.model.get(0))
                                 }
-                                event.accepted = true;
-                                return;
+                                event.accepted = true
+                                return
                             }
 
-                            const navigationKeys = [Qt.Key_Down, Qt.Key_Up, Qt.Key_Left, Qt.Key_Right, Qt.Key_Tab, Qt.Key_Backtab];
-                            const isNavigationKey = navigationKeys.includes(event.key);
-                            const isEmptyEnter = isEnterKey && !hasText;
+                            const navigationKeys = [Qt.Key_Down, Qt.Key_Up, Qt.Key_Left, Qt.Key_Right, Qt.Key_Tab, Qt.Key_Backtab]
+                            const isNavigationKey = navigationKeys.includes(event.key)
+                            const isEmptyEnter = isEnterKey && !hasText
 
-                            event.accepted = !(isNavigationKey || isEmptyEnter);
+                            event.accepted = !(isNavigationKey || isEmptyEnter)
                         }
 
                         Connections {
                             function onShouldBeVisibleChanged() {
                                 if (!appDrawerPopout.shouldBeVisible) {
-                                    searchField.focus = false;
+                                    searchField.focus = false
                                 }
                             }
 
@@ -252,19 +262,18 @@ DankPopout {
                         }
                     }
 
-                    Item {
-                        width: parent.width - Theme.spacingS * 2
+                    Row {
+                        width: parent.width
                         height: 40
-                        anchors.horizontalCenter: parent.horizontalCenter
+                        spacing: Theme.spacingM
                         visible: searchField.text.length === 0
+                        leftPadding: Theme.spacingS
 
                         Rectangle {
                             width: 180
                             height: 40
                             radius: Theme.cornerRadius
                             color: "transparent"
-                            anchors.left: parent.left
-                            anchors.verticalCenter: parent.verticalCenter
 
                             DankDropdown {
                                 anchors.fill: parent
@@ -274,14 +283,18 @@ DankPopout {
                                 options: appLauncher.categories
                                 optionIcons: appLauncher.categoryIcons
                                 onValueChanged: function (value) {
-                                    appLauncher.setCategory(value);
+                                    appLauncher.setCategory(value)
                                 }
                             }
                         }
 
+                        Item {
+                            width: parent.width - 290
+                            height: 1
+                        }
+
                         Row {
                             spacing: 4
-                            anchors.right: parent.right
                             anchors.verticalCenter: parent.verticalCenter
 
                             DankActionButton {
@@ -292,7 +305,7 @@ DankPopout {
                                 iconColor: appLauncher.viewMode === "list" ? Theme.primary : Theme.surfaceText
                                 backgroundColor: appLauncher.viewMode === "list" ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
                                 onClicked: {
-                                    appLauncher.setViewMode("list");
+                                    appLauncher.setViewMode("list")
                                 }
                             }
 
@@ -304,20 +317,19 @@ DankPopout {
                                 iconColor: appLauncher.viewMode === "grid" ? Theme.primary : Theme.surfaceText
                                 backgroundColor: appLauncher.viewMode === "grid" ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
                                 onClicked: {
-                                    appLauncher.setViewMode("grid");
+                                    appLauncher.setViewMode("grid")
                                 }
                             }
                         }
                     }
 
                     Rectangle {
-                        width: searchField.width
-                        x: searchField.x
+                        width: parent.width
                         height: {
-                            let usedHeight = 40 + Theme.spacingS;
-                            usedHeight += 52 + Theme.spacingS;
-                            usedHeight += (searchField.text.length === 0 ? 40 : 0);
-                            return parent.height - usedHeight;
+                            let usedHeight = 40 + Theme.spacingS
+                            usedHeight += 52 + Theme.spacingS
+                            usedHeight += (searchField.text.length === 0 ? 40 : 0)
+                            return parent.height - usedHeight
                         }
                         radius: Theme.cornerRadius
                         color: "transparent"
@@ -338,16 +350,19 @@ DankPopout {
 
                             function ensureVisible(index) {
                                 if (index < 0 || index >= count)
-                                    return;
-                                var itemY = index * (itemHeight + itemSpacing);
-                                var itemBottom = itemY + itemHeight;
+                                    return
+
+                                var itemY = index * (itemHeight + itemSpacing)
+                                var itemBottom = itemY + itemHeight
                                 if (itemY < contentY)
-                                    contentY = itemY;
+                                    contentY = itemY
                                 else if (itemBottom > contentY + height)
-                                    contentY = itemBottom - height;
+                                    contentY = itemBottom - height
                             }
 
                             anchors.fill: parent
+                            anchors.leftMargin: Theme.spacingS
+                            anchors.rightMargin: Theme.spacingS
                             anchors.bottomMargin: Theme.spacingS
                             visible: appLauncher.viewMode === "list"
                             model: appLauncher.model
@@ -361,40 +376,123 @@ DankPopout {
 
                             onCurrentIndexChanged: {
                                 if (keyboardNavigationActive)
-                                    ensureVisible(currentIndex);
+                                    ensureVisible(currentIndex)
                             }
 
                             onItemClicked: function (index, modelData) {
-                                appLauncher.launchApp(modelData);
+                                appLauncher.launchApp(modelData)
                             }
                             onItemRightClicked: function (index, modelData, mouseX, mouseY) {
-                                contextMenu.show(mouseX, mouseY, modelData);
+                                contextMenu.show(mouseX, mouseY, modelData)
                             }
                             onKeyboardNavigationReset: {
-                                appLauncher.keyboardNavigationActive = false;
+                                appLauncher.keyboardNavigationActive = false
                             }
 
-                            delegate: AppLauncherListDelegate {
-                                listView: appList
-                                itemHeight: appList.itemHeight
-                                iconSize: appList.iconSize
-                                showDescription: appList.showDescription
-                                hoverUpdatesSelection: appList.hoverUpdatesSelection
-                                keyboardNavigationActive: appList.keyboardNavigationActive
-                                isCurrentItem: ListView.isCurrentItem
-                                mouseAreaLeftMargin: Theme.spacingS
-                                mouseAreaRightMargin: Theme.spacingS
-                                mouseAreaBottomMargin: Theme.spacingM
-                                iconMargins: Theme.spacingXS
-                                iconFallbackLeftMargin: Theme.spacingS
-                                iconFallbackRightMargin: Theme.spacingS
-                                iconFallbackBottomMargin: Theme.spacingM
-                                onItemClicked: (idx, modelData) => appList.itemClicked(idx, modelData)
-                                onItemRightClicked: (idx, modelData, mouseX, mouseY) => {
-                                    const panelPos = contextMenu.parent.mapFromItem(null, mouseX, mouseY);
-                                    appList.itemRightClicked(idx, modelData, panelPos.x, panelPos.y);
+                            delegate: Rectangle {
+                                width: ListView.view.width
+                                height: appList.itemHeight
+                                radius: Theme.cornerRadius
+                                color: ListView.isCurrentItem ? Theme.primaryPressed : listMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.surfaceContainerHigh
+
+                                Row {
+                                    anchors.fill: parent
+                                    anchors.margins: Theme.spacingM
+                                    spacing: Theme.spacingL
+
+                                    Item {
+                                        width: appList.iconSize
+                                        height: appList.iconSize
+                                        anchors.verticalCenter: parent.verticalCenter
+
+                                        IconImage {
+                                            id: listIconImg
+
+                                            anchors.fill: parent
+                                            anchors.margins: Theme.spacingXS
+                                            source: Quickshell.iconPath(model.icon, true)
+                                            smooth: true
+                                            asynchronous: true
+                                            visible: status === Image.Ready
+                                        }
+
+                                        Rectangle {
+                                            anchors.fill: parent
+                                            anchors.leftMargin: Theme.spacingS
+                                            anchors.rightMargin: Theme.spacingS
+                                            anchors.bottomMargin: Theme.spacingM
+                                            visible: !listIconImg.visible
+                                            color: Theme.surfaceLight
+                                            radius: Theme.cornerRadius
+                                            border.width: 0
+                                            border.color: Theme.primarySelected
+
+                                            StyledText {
+                                                anchors.centerIn: parent
+                                                text: (model.name && model.name.length > 0) ? model.name.charAt(0).toUpperCase() : "A"
+                                                font.pixelSize: appList.iconSize * 0.4
+                                                color: Theme.primary
+                                                font.weight: Font.Bold
+                                            }
+                                        }
+                                    }
+
+                                    Column {
+                                        anchors.verticalCenter: parent.verticalCenter
+                                        width: parent.width - appList.iconSize - Theme.spacingL
+                                        spacing: Theme.spacingXS
+
+                                        StyledText {
+                                            width: parent.width
+                                            text: model.name || ""
+                                            font.pixelSize: Theme.fontSizeLarge
+                                            color: Theme.surfaceText
+                                            font.weight: Font.Medium
+                                            elide: Text.ElideRight
+                                            wrapMode: Text.NoWrap
+                                            maximumLineCount: 1
+                                        }
+
+                                        StyledText {
+                                            width: parent.width
+                                            text: model.comment || "Application"
+                                            font.pixelSize: Theme.fontSizeMedium
+                                            color: Theme.surfaceVariantText
+                                            elide: Text.ElideRight
+                                            maximumLineCount: 1
+                                            visible: appList.showDescription && model.comment && model.comment.length > 0
+                                        }
+                                    }
+                                }
+
+                                MouseArea {
+                                    id: listMouseArea
+
+                                    anchors.fill: parent
+                                    anchors.leftMargin: Theme.spacingS
+                                    anchors.rightMargin: Theme.spacingS
+                                    anchors.bottomMargin: Theme.spacingM
+                                    hoverEnabled: true
+                                    cursorShape: Qt.PointingHandCursor
+                                    acceptedButtons: Qt.LeftButton | Qt.RightButton
+                                    z: 10
+                                    onEntered: {
+                                        if (appList.hoverUpdatesSelection && !appList.keyboardNavigationActive)
+                                            appList.currentIndex = index
+                                    }
+                                    onPositionChanged: {
+                                        appList.keyboardNavigationReset()
+                                    }
+                                    onClicked: mouse => {
+                                                   if (mouse.button === Qt.LeftButton) {
+                                                       appList.itemClicked(index, model)
+                                                   } else if (mouse.button === Qt.RightButton) {
+                                                       var globalPos = mapToItem(null, mouse.x, mouse.y)
+                                                       var panelPos = contextMenu.parent.mapFromItem(null, globalPos.x, globalPos.y)
+                                                       appList.itemRightClicked(index, model, panelPos.x, panelPos.y)
+                                                   }
+                                               }
                                 }
-                                onKeyboardNavigationReset: appList.keyboardNavigationReset
                             }
                         }
 
@@ -402,19 +500,19 @@ DankPopout {
                             id: appGrid
 
                             property int currentIndex: appLauncher.selectedIndex
-                            property int columns: appLauncher.gridColumns
+                            property int columns: 4
                             property bool adaptiveColumns: false
                             property int minCellWidth: 120
                             property int maxCellWidth: 160
+                            property int cellPadding: 8
                             property real iconSizeRatio: 0.6
                             property int maxIconSize: 56
                             property int minIconSize: 32
                             property bool hoverUpdatesSelection: false
                             property bool keyboardNavigationActive: appLauncher.keyboardNavigationActive
-                            property real baseCellWidth: adaptiveColumns ? Math.max(minCellWidth, Math.min(maxCellWidth, width / columns)) : width / columns
-                            property real baseCellHeight: baseCellWidth + 20
+                            property int baseCellWidth: adaptiveColumns ? Math.max(minCellWidth, Math.min(maxCellWidth, width / columns)) : (width - Theme.spacingS * 2) / columns
+                            property int baseCellHeight: baseCellWidth + 20
                             property int actualColumns: adaptiveColumns ? Math.floor(width / cellWidth) : columns
-
                             property int remainingSpace: width - (actualColumns * cellWidth)
 
                             signal keyboardNavigationReset
@@ -423,22 +521,27 @@ DankPopout {
 
                             function ensureVisible(index) {
                                 if (index < 0 || index >= count)
-                                    return;
-                                var itemY = Math.floor(index / actualColumns) * cellHeight;
-                                var itemBottom = itemY + cellHeight;
+                                    return
+
+                                var itemY = Math.floor(index / actualColumns) * cellHeight
+                                var itemBottom = itemY + cellHeight
                                 if (itemY < contentY)
-                                    contentY = itemY;
+                                    contentY = itemY
                                 else if (itemBottom > contentY + height)
-                                    contentY = itemBottom - height;
+                                    contentY = itemBottom - height
                             }
 
                             anchors.fill: parent
+                            anchors.leftMargin: Theme.spacingS
+                            anchors.rightMargin: Theme.spacingS
                             anchors.bottomMargin: Theme.spacingS
                             visible: appLauncher.viewMode === "grid"
                             model: appLauncher.model
                             clip: true
                             cellWidth: baseCellWidth
                             cellHeight: baseCellHeight
+                            leftMargin: Math.max(Theme.spacingS, remainingSpace / 2)
+                            rightMargin: leftMargin
                             focus: true
                             interactive: true
                             cacheBuffer: Math.max(0, Math.min(height * 2, 1000))
@@ -446,54 +549,117 @@ DankPopout {
 
                             onCurrentIndexChanged: {
                                 if (keyboardNavigationActive)
-                                    ensureVisible(currentIndex);
+                                    ensureVisible(currentIndex)
                             }
 
                             onItemClicked: function (index, modelData) {
-                                appLauncher.launchApp(modelData);
+                                appLauncher.launchApp(modelData)
                             }
                             onItemRightClicked: function (index, modelData, mouseX, mouseY) {
-                                contextMenu.show(mouseX, mouseY, modelData);
+                                contextMenu.show(mouseX, mouseY, modelData)
                             }
                             onKeyboardNavigationReset: {
-                                appLauncher.keyboardNavigationActive = false;
+                                appLauncher.keyboardNavigationActive = false
                             }
 
-                            delegate: AppLauncherGridDelegate {
-                                gridView: appGrid
-                                cellWidth: appGrid.cellWidth
-                                cellHeight: appGrid.cellHeight
-                                minIconSize: appGrid.minIconSize
-                                maxIconSize: appGrid.maxIconSize
-                                iconSizeRatio: appGrid.iconSizeRatio
-                                hoverUpdatesSelection: appGrid.hoverUpdatesSelection
-                                keyboardNavigationActive: appGrid.keyboardNavigationActive
-                                currentIndex: appGrid.currentIndex
-                                mouseAreaLeftMargin: Theme.spacingS
-                                mouseAreaRightMargin: Theme.spacingS
-                                mouseAreaBottomMargin: Theme.spacingS
-                                iconFallbackLeftMargin: Theme.spacingS
-                                iconFallbackRightMargin: Theme.spacingS
-                                iconFallbackBottomMargin: Theme.spacingS
-                                iconMaterialSizeAdjustment: Theme.spacingL
-                                onItemClicked: (idx, modelData) => appGrid.itemClicked(idx, modelData)
-                                onItemRightClicked: (idx, modelData, mouseX, mouseY) => {
-                                    const panelPos = contextMenu.parent.mapFromItem(null, mouseX, mouseY);
-                                    appGrid.itemRightClicked(idx, modelData, panelPos.x, panelPos.y);
+                            delegate: Rectangle {
+                                width: appGrid.cellWidth - appGrid.cellPadding
+                                height: appGrid.cellHeight - appGrid.cellPadding
+                                radius: Theme.cornerRadius
+                                color: appGrid.currentIndex === index ? Theme.primaryPressed : gridMouseArea.containsMouse ? Theme.primaryHoverLight : Theme.surfaceContainerHigh
+
+                                Column {
+                                    anchors.centerIn: parent
+                                    spacing: Theme.spacingS
+
+                                    Item {
+                                        property int iconSize: Math.min(appGrid.maxIconSize, Math.max(appGrid.minIconSize, appGrid.cellWidth * appGrid.iconSizeRatio))
+
+                                        width: iconSize
+                                        height: iconSize
+                                        anchors.horizontalCenter: parent.horizontalCenter
+
+                                        IconImage {
+                                            id: gridIconImg
+
+                                            anchors.fill: parent
+                            anchors.leftMargin: Theme.spacingS
+                            anchors.rightMargin: Theme.spacingS
+                            anchors.bottomMargin: Theme.spacingS
+                                            source: Quickshell.iconPath(model.icon, true)
+                                            smooth: true
+                                            asynchronous: true
+                                            visible: status === Image.Ready
+                                        }
+
+                                        Rectangle {
+                                            anchors.fill: parent
+                            anchors.leftMargin: Theme.spacingS
+                            anchors.rightMargin: Theme.spacingS
+                            anchors.bottomMargin: Theme.spacingS
+                                            visible: !gridIconImg.visible
+                                            color: Theme.surfaceLight
+                                            radius: Theme.cornerRadius
+                                            border.width: 0
+                                            border.color: Theme.primarySelected
+
+                                            StyledText {
+                                                anchors.centerIn: parent
+                                                text: (model.name && model.name.length > 0) ? model.name.charAt(0).toUpperCase() : "A"
+                                                font.pixelSize: Math.min(28, parent.width * 0.5)
+                                                color: Theme.primary
+                                                font.weight: Font.Bold
+                                            }
+                                        }
+                                    }
+
+                                    StyledText {
+                                        anchors.horizontalCenter: parent.horizontalCenter
+                                        width: appGrid.cellWidth - 12
+                                        text: model.name || ""
+                                        font.pixelSize: Theme.fontSizeSmall
+                                        color: Theme.surfaceText
+                                        font.weight: Font.Medium
+                                        elide: Text.ElideRight
+                                        horizontalAlignment: Text.AlignHCenter
+                                        maximumLineCount: 1
+                                        wrapMode: Text.NoWrap
+                                    }
+                                }
+
+                                MouseArea {
+                                    id: gridMouseArea
+
+                                    anchors.fill: parent
+                            anchors.leftMargin: Theme.spacingS
+                            anchors.rightMargin: Theme.spacingS
+                            anchors.bottomMargin: Theme.spacingS
+                                    hoverEnabled: true
+                                    cursorShape: Qt.PointingHandCursor
+                                    acceptedButtons: Qt.LeftButton | Qt.RightButton
+                                    z: 10
+                                    onEntered: {
+                                        if (appGrid.hoverUpdatesSelection && !appGrid.keyboardNavigationActive)
+                                            appGrid.currentIndex = index
+                                    }
+                                    onPositionChanged: {
+                                        appGrid.keyboardNavigationReset()
+                                    }
+                                    onClicked: mouse => {
+                                                   if (mouse.button === Qt.LeftButton) {
+                                                       appGrid.itemClicked(index, model)
+                                                   } else if (mouse.button === Qt.RightButton) {
+                                                       var globalPos = mapToItem(null, mouse.x, mouse.y)
+                                                       var panelPos = contextMenu.parent.mapFromItem(null, globalPos.x, globalPos.y)
+                                                       appGrid.itemRightClicked(index, model, panelPos.x, panelPos.y)
+                                                   }
+                                               }
                                 }
-                                onKeyboardNavigationReset: appGrid.keyboardNavigationReset
                             }
                         }
                     }
                 }
             }
-
-            MouseArea {
-                anchors.fill: parent
-                visible: contextMenu.visible
-                z: 998
-                onClicked: contextMenu.hide()
-            }
         }
     }
 
@@ -506,32 +672,14 @@ DankPopout {
         readonly property bool isPinned: appId && SessionData.isPinnedApp(appId)
 
         function show(x, y, app) {
-            currentApp = app;
-            let finalX = x + 4;
-            let finalY = y + 4;
-
-            if (contextMenu.parent) {
-                const parentWidth = contextMenu.parent.width;
-                const parentHeight = contextMenu.parent.height;
-                const menuWidth = contextMenu.width;
-                const menuHeight = contextMenu.height;
-
-                if (finalX + menuWidth > parentWidth) {
-                    finalX = Math.max(0, parentWidth - menuWidth);
-                }
-
-                if (finalY + menuHeight > parentHeight) {
-                    finalY = Math.max(0, parentHeight - menuHeight);
-                }
-            }
-
-            contextMenu.x = finalX;
-            contextMenu.y = finalY;
-            contextMenu.open();
+            currentApp = app
+            contextMenu.x = x + 4
+            contextMenu.y = y + 4
+            contextMenu.open()
         }
 
         function hide() {
-            contextMenu.close();
+            contextMenu.close()
         }
 
         width: Math.max(180, menuColumn.implicitWidth + Theme.spacingS * 2)
@@ -543,7 +691,7 @@ DankPopout {
 
         background: Rectangle {
             radius: Theme.cornerRadius
-            color: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
+            color: Theme.popupBackground()
             border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
             border.width: 1
 
@@ -623,15 +771,15 @@ DankPopout {
                     cursorShape: Qt.PointingHandCursor
                     onClicked: {
                         if (!contextMenu.desktopEntry) {
-                            return;
+                            return
                         }
 
                         if (contextMenu.isPinned) {
-                            SessionData.removePinnedApp(contextMenu.appId);
+                            SessionData.removePinnedApp(contextMenu.appId)
                         } else {
-                            SessionData.addPinnedApp(contextMenu.appId);
+                            SessionData.addPinnedApp(contextMenu.appId)
                         }
-                        contextMenu.hide();
+                        contextMenu.hide()
                     }
                 }
             }
@@ -697,12 +845,12 @@ DankPopout {
                         cursorShape: Qt.PointingHandCursor
                         onClicked: {
                             if (modelData && contextMenu.desktopEntry) {
-                                SessionService.launchDesktopAction(contextMenu.desktopEntry, modelData);
+                                SessionService.launchDesktopAction(contextMenu.desktopEntry, modelData)
                                 if (contextMenu.currentApp) {
-                                    appLauncher.appLaunched(contextMenu.currentApp);
+                                    appLauncher.appLaunched(contextMenu.currentApp)
                                 }
                             }
-                            contextMenu.hide();
+                            contextMenu.hide()
                         }
                     }
                 }
@@ -760,15 +908,15 @@ DankPopout {
                     cursorShape: Qt.PointingHandCursor
                     onClicked: {
                         if (contextMenu.currentApp)
-                            appLauncher.launchApp(contextMenu.currentApp);
+                            appLauncher.launchApp(contextMenu.currentApp)
 
-                        contextMenu.hide();
+                        contextMenu.hide()
                     }
                 }
             }
 
             Rectangle {
-                visible: SessionService.nvidiaCommand
+                visible: SessionService.hasPrimeRun
                 width: parent.width - Theme.spacingS * 2
                 height: 5
                 anchors.horizontalCenter: parent.horizontalCenter
@@ -783,11 +931,11 @@ DankPopout {
             }
 
             Rectangle {
-                visible: SessionService.nvidiaCommand
+                visible: SessionService.hasPrimeRun
                 width: parent.width
                 height: 32
                 radius: Theme.cornerRadius
-                color: nvidiaMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
+                color: primeRunMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
 
                 Row {
                     anchors.left: parent.left
@@ -813,22 +961,42 @@ DankPopout {
                 }
 
                 MouseArea {
-                    id: nvidiaMouseArea
+                    id: primeRunMouseArea
 
                     anchors.fill: parent
                     hoverEnabled: true
                     cursorShape: Qt.PointingHandCursor
                     onClicked: {
                         if (contextMenu.desktopEntry) {
-                            SessionService.launchDesktopEntry(contextMenu.desktopEntry, true);
+                            SessionService.launchDesktopEntry(contextMenu.desktopEntry, true)
                             if (contextMenu.currentApp) {
-                                appLauncher.appLaunched(contextMenu.currentApp);
+                                appLauncher.appLaunched(contextMenu.currentApp)
                             }
                         }
-                        contextMenu.hide();
+                        contextMenu.hide()
                     }
                 }
             }
         }
     }
+
+    MouseArea {
+        anchors.fill: parent
+        visible: contextMenu.visible
+        z: 999
+        onClicked: {
+            contextMenu.hide()
+        }
+
+        MouseArea {
+            x: contextMenu.x
+            y: contextMenu.y
+            width: contextMenu.width
+            height: contextMenu.height
+            onClicked: {
+
+                // Prevent closing when clicking on the menu itself
+            }
+        }
+    }
 }

Modules/AppDrawer/AppLauncher.qml

@@ -8,10 +8,6 @@ import qs.Widgets
 Item {
     id: root
 
-    // DEVELOPER NOTE: This component manages the AppDrawer launcher (accessed via DankBar icon).
-    // Changes to launcher behavior, especially item rendering, filtering, or model structure,
-    // likely require corresponding updates in Modals/Spotlight/SpotlightResults.qml and vice versa.
-
     property string searchQuery: ""
     property string selectedCategory: I18n.tr("All")
     property string viewMode: "list" // "list" or "grid"
@@ -167,7 +163,7 @@ Item {
                              filteredModel.append({
                                                       "name": app.name || "",
                                                       "exec": app.execString || app.exec || app.action || "",
-                                                      "icon": app.icon !== undefined ? app.icon : (isPluginItem ? "" : "application-x-executable"),
+                                                      "icon": app.icon || "application-x-executable",
                                                       "comment": app.comment || "",
                                                       "categories": app.categories || [],
                                                       "isPlugin": isPluginItem,
@@ -289,12 +285,12 @@ Item {
         }
 
         const triggers = PluginService.getAllPluginTriggers()
-
+        
         for (const trigger in triggers) {
             if (query.startsWith(trigger)) {
                 const pluginId = triggers[trigger]
                 const plugin = PluginService.getLauncherPlugin(pluginId)
-
+                
                 if (plugin) {
                     const remainingQuery = query.substring(trigger.length).trim()
                     const result = {
@@ -308,7 +304,7 @@ Item {
                 }
             }
         }
-
+        
         return { triggered: false, pluginCategory: "", query: "" }
     }
 

Modules/AppDrawer/CategorySelector.qml

@@ -42,7 +42,7 @@ Item {
                 height: root.itemHeight
                 width: root.getButtonWidth(itemCount, parent.width)
                 radius: Theme.cornerRadius
-                color: selectedCategory === modelData ? Theme.primary : Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
+                color: selectedCategory === modelData ? Theme.primary : Theme.surfaceContainerHigh
 
                 StyledText {
                     anchors.centerIn: parent
@@ -81,7 +81,7 @@ Item {
                     height: root.itemHeight
                     width: root.getButtonWidth(itemCount, parent.width)
                     radius: Theme.cornerRadius
-                    color: selectedCategory === modelData ? Theme.primary : Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
+                    color: selectedCategory === modelData ? Theme.primary : Theme.surfaceContainerHigh
                     border.color: selectedCategory === modelData ? selectedBorderColor : unselectedBorderColor
 
                     StyledText {
@@ -117,7 +117,7 @@ Item {
                     height: root.itemHeight
                     width: root.getButtonWidth(itemCount, parent.width)
                     radius: Theme.cornerRadius
-                    color: selectedCategory === modelData ? Theme.primary : Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
+                    color: selectedCategory === modelData ? Theme.primary : Theme.surfaceContainerHigh
                     border.color: selectedCategory === modelData ? selectedBorderColor : unselectedBorderColor
 
                     StyledText {

Modules/ControlCenter/BuiltinPlugins/VpnWidget.qml

@@ -0,0 +1,246 @@
+import QtQuick
+import QtQuick.Layouts
+import Quickshell
+import qs.Common
+import qs.Services
+import qs.Widgets
+import qs.Modules.Plugins
+
+PluginComponent {
+    id: root
+
+    Ref {
+        service: VpnService
+    }
+
+    ccWidgetIcon: VpnService.isBusy ? "sync" : (VpnService.connected ? "vpn_lock" : "vpn_key_off")
+    ccWidgetPrimaryText: "VPN"
+    ccWidgetSecondaryText: {
+        if (!VpnService.connected)
+            return "Disconnected"
+        const names = VpnService.activeNames || []
+        if (names.length <= 1)
+            return names[0] || "Connected"
+        return names[0] + " +" + (names.length - 1)
+    }
+    ccWidgetIsActive: VpnService.connected
+
+    onCcWidgetToggled: {
+        if (VpnService.connected) {
+            VpnService.disconnectAllActive()
+        } else if (VpnService.profiles.length > 0) {
+            VpnService.connect(VpnService.profiles[0].uuid)
+        }
+    }
+
+    ccDetailContent: Component {
+        Rectangle {
+            id: detailRoot
+            implicitHeight: detailColumn.implicitHeight + Theme.spacingM * 2
+            radius: Theme.cornerRadius
+            color: Theme.surfaceContainerHigh
+
+            Column {
+                id: detailColumn
+                anchors.fill: parent
+                anchors.margins: Theme.spacingM
+                spacing: Theme.spacingS
+
+                RowLayout {
+                    spacing: Theme.spacingS
+                    width: parent.width
+
+                    StyledText {
+                        text: {
+                            if (!VpnService.connected)
+                                return "Active: None"
+                            const names = VpnService.activeNames || []
+                            if (names.length <= 1)
+                                return "Active: " + (names[0] || "VPN")
+                            return "Active: " + names[0] + " +" + (names.length - 1)
+                        }
+                        font.pixelSize: Theme.fontSizeMedium
+                        color: Theme.surfaceText
+                        font.weight: Font.Medium
+                    }
+
+                    Item {
+                        Layout.fillWidth: true
+                    }
+
+                    Rectangle {
+                        height: 28
+                        radius: 14
+                        color: discAllArea.containsMouse ? Theme.errorHover : Theme.surfaceLight
+                        visible: VpnService.connected
+                        width: 110
+                        Layout.alignment: Qt.AlignVCenter | Qt.AlignRight
+
+                        Row {
+                            anchors.centerIn: parent
+                            spacing: Theme.spacingXS
+
+                            DankIcon {
+                                name: "link_off"
+                                size: Theme.fontSizeSmall
+                                color: Theme.surfaceText
+                            }
+
+                            StyledText {
+                                text: I18n.tr("Disconnect")
+                                font.pixelSize: Theme.fontSizeSmall
+                                color: Theme.surfaceText
+                                font.weight: Font.Medium
+                            }
+                        }
+
+                        MouseArea {
+                            id: discAllArea
+                            anchors.fill: parent
+                            hoverEnabled: true
+                            cursorShape: Qt.PointingHandCursor
+                            onClicked: VpnService.disconnectAllActive()
+                        }
+                    }
+                }
+
+                Rectangle {
+                    height: 1
+                    width: parent.width
+                    color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
+                }
+
+                DankFlickable {
+                    width: parent.width
+                    height: 160
+                    contentHeight: listCol.height
+                    clip: true
+
+                    Column {
+                        id: listCol
+                        width: parent.width
+                        spacing: Theme.spacingXS
+
+                        Item {
+                            width: parent.width
+                            height: VpnService.profiles.length === 0 ? 120 : 0
+                            visible: height > 0
+
+                            Column {
+                                anchors.centerIn: parent
+                                spacing: Theme.spacingS
+
+                                DankIcon {
+                                    name: "playlist_remove"
+                                    size: 36
+                                    color: Theme.surfaceVariantText
+                                    anchors.horizontalCenter: parent.horizontalCenter
+                                }
+
+                                StyledText {
+                                    text: I18n.tr("No VPN profiles found")
+                                    font.pixelSize: Theme.fontSizeMedium
+                                    color: Theme.surfaceVariantText
+                                    anchors.horizontalCenter: parent.horizontalCenter
+                                }
+
+                                StyledText {
+                                    text: I18n.tr("Add a VPN in NetworkManager")
+                                    font.pixelSize: Theme.fontSizeSmall
+                                    color: Theme.surfaceVariantText
+                                    anchors.horizontalCenter: parent.horizontalCenter
+                                }
+                            }
+                        }
+
+                        Repeater {
+                            model: VpnService.profiles
+
+                            delegate: Rectangle {
+                                required property var modelData
+
+                                width: parent ? parent.width : 300
+                                height: 50
+                                radius: Theme.cornerRadius
+                                color: rowArea.containsMouse ? Theme.primaryHoverLight : (VpnService.isActiveUuid(modelData.uuid) ? Theme.primaryPressed : Theme.surfaceLight)
+                                border.width: VpnService.isActiveUuid(modelData.uuid) ? 2 : 1
+                                border.color: VpnService.isActiveUuid(modelData.uuid) ? Theme.primary : Theme.outlineLight
+
+                                RowLayout {
+                                    anchors.left: parent.left
+                                    anchors.right: parent.right
+                                    anchors.verticalCenter: parent.verticalCenter
+                                    anchors.margins: Theme.spacingM
+                                    spacing: Theme.spacingS
+
+                                    DankIcon {
+                                        name: VpnService.isActiveUuid(modelData.uuid) ? "vpn_lock" : "vpn_key_off"
+                                        size: Theme.iconSize - 4
+                                        color: VpnService.isActiveUuid(modelData.uuid) ? Theme.primary : Theme.surfaceText
+                                        Layout.alignment: Qt.AlignVCenter
+                                    }
+
+                                    Column {
+                                        spacing: 2
+                                        Layout.alignment: Qt.AlignVCenter
+
+                                        StyledText {
+                                            text: modelData.name
+                                            font.pixelSize: Theme.fontSizeMedium
+                                            color: VpnService.isActiveUuid(modelData.uuid) ? Theme.primary : Theme.surfaceText
+                                        }
+
+                                        StyledText {
+                                            text: {
+                                                if (modelData.type === "wireguard")
+                                                    return "WireGuard"
+                                                const svc = modelData.serviceType || ""
+                                                if (svc.indexOf("openvpn") !== -1)
+                                                    return "OpenVPN"
+                                                if (svc.indexOf("wireguard") !== -1)
+                                                    return "WireGuard (plugin)"
+                                                if (svc.indexOf("openconnect") !== -1)
+                                                    return "OpenConnect"
+                                                if (svc.indexOf("fortissl") !== -1 || svc.indexOf("forti") !== -1)
+                                                    return "Fortinet"
+                                                if (svc.indexOf("strongswan") !== -1)
+                                                    return "IPsec (strongSwan)"
+                                                if (svc.indexOf("libreswan") !== -1)
+                                                    return "IPsec (Libreswan)"
+                                                if (svc.indexOf("l2tp") !== -1)
+                                                    return "L2TP/IPsec"
+                                                if (svc.indexOf("pptp") !== -1)
+                                                    return "PPTP"
+                                                if (svc.indexOf("vpnc") !== -1)
+                                                    return "Cisco (vpnc)"
+                                                if (svc.indexOf("sstp") !== -1)
+                                                    return "SSTP"
+                                                if (svc)
+                                                    return svc.split('.').pop()
+                                                return "VPN"
+                                            }
+                                            font.pixelSize: Theme.fontSizeSmall
+                                            color: Theme.surfaceTextMedium
+                                        }
+                                    }
+
+                                    Item {
+                                        Layout.fillWidth: true
+                                    }
+                                }
+
+                                MouseArea {
+                                    id: rowArea
+                                    anchors.fill: parent
+                                    hoverEnabled: true
+                                    cursorShape: Qt.PointingHandCursor
+                                    onClicked: VpnService.toggle(modelData.uuid)
+                                }
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

Modules/ControlCenter/Components/ActionTile.qml

@@ -25,7 +25,7 @@ Rectangle {
 
     readonly property color _tileBgActive: Theme.primary
     readonly property color _tileBgInactive:
-        Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
+        Theme.surfaceContainerHigh
     readonly property color _tileRingActive:
         Qt.rgba(Theme.primaryText.r, Theme.primaryText.g, Theme.primaryText.b, 0.22)
 

Modules/ControlCenter/Components/DetailHost.qml

@@ -2,6 +2,7 @@ import QtQuick
 import qs.Common
 import qs.Services
 import qs.Modules.ControlCenter.Details
+import qs.Modules.ControlCenter.Models
 
 Item {
     id: root
@@ -9,28 +10,15 @@ Item {
     property string expandedSection: ""
     property var expandedWidgetData: null
     property var bluetoothCodecSelector: null
-    property string screenName: ""
-    property string screenModel: ""
 
     property var pluginDetailInstance: null
     property var widgetModel: null
     property var collapseCallback: null
 
-    function getDetailHeight(section) {
-        const maxAvailable = parent ? parent.height - Theme.spacingS : 9999;
-        if (section === "wifi")
-            return Math.min(350, maxAvailable);
-        if (section === "bluetooth")
-            return Math.min(350, maxAvailable);
-        if (section.startsWith("brightnessSlider_"))
-            return Math.min(400, maxAvailable);
-        return Math.min(250, maxAvailable);
-    }
-
     Loader {
         id: pluginDetailLoader
         width: parent.width
-        height: parent.height - Theme.spacingS
+        height: 250
         y: Theme.spacingS
         active: false
         sourceComponent: null
@@ -39,7 +27,7 @@ Item {
     Loader {
         id: coreDetailLoader
         width: parent.width
-        height: parent.height - Theme.spacingS
+        height: 250
         y: Theme.spacingS
         active: false
         sourceComponent: null
@@ -52,18 +40,18 @@ Item {
 
         function onDeviceNameChanged(newDeviceName) {
             if (root.expandedWidgetData && root.expandedWidgetData.id === "brightnessSlider") {
-                const widgets = SettingsData.controlCenterWidgets || [];
+                const widgets = SettingsData.controlCenterWidgets || []
                 const newWidgets = widgets.map(w => {
                     if (w.id === "brightnessSlider" && w.instanceId === root.expandedWidgetData.instanceId) {
-                        const updatedWidget = Object.assign({}, w);
-                        updatedWidget.deviceName = newDeviceName;
-                        return updatedWidget;
+                        const updatedWidget = Object.assign({}, w)
+                        updatedWidget.deviceName = newDeviceName
+                        return updatedWidget
                     }
-                    return w;
-                });
-                SettingsData.set("controlCenterWidgets", newWidgets);
+                    return w
+                })
+                SettingsData.setControlCenterWidgets(newWidgets)
                 if (root.collapseCallback) {
-                    root.collapseCallback();
+                    root.collapseCallback()
                 }
             }
         }
@@ -76,18 +64,18 @@ Item {
 
         function onMountPathChanged(newMountPath) {
             if (root.expandedWidgetData && root.expandedWidgetData.id === "diskUsage") {
-                const widgets = SettingsData.controlCenterWidgets || [];
+                const widgets = SettingsData.controlCenterWidgets || []
                 const newWidgets = widgets.map(w => {
                     if (w.id === "diskUsage" && w.instanceId === root.expandedWidgetData.instanceId) {
-                        const updatedWidget = Object.assign({}, w);
-                        updatedWidget.mountPath = newMountPath;
-                        return updatedWidget;
+                        const updatedWidget = Object.assign({}, w)
+                        updatedWidget.mountPath = newMountPath
+                        return updatedWidget
                     }
-                    return w;
-                });
-                SettingsData.set("controlCenterWidgets", newWidgets);
+                    return w
+                })
+                SettingsData.setControlCenterWidgets(newWidgets)
                 if (root.collapseCallback) {
-                    root.collapseCallback();
+                    root.collapseCallback()
                 }
             }
         }
@@ -95,97 +83,80 @@ Item {
 
     onExpandedSectionChanged: {
         if (pluginDetailInstance) {
-            pluginDetailInstance.destroy();
-            pluginDetailInstance = null;
+            pluginDetailInstance.destroy()
+            pluginDetailInstance = null
         }
-        pluginDetailLoader.active = false;
-        coreDetailLoader.active = false;
+        pluginDetailLoader.active = false
+        coreDetailLoader.active = false
 
         if (!root.expandedSection) {
-            return;
+            return
         }
 
         if (root.expandedSection.startsWith("builtin_")) {
-            const builtinId = root.expandedSection;
-            let builtinInstance = null;
+            const builtinId = root.expandedSection
+            let builtinInstance = null
 
             if (builtinId === "builtin_vpn") {
                 if (widgetModel?.vpnLoader) {
-                    widgetModel.vpnLoader.active = true;
+                    widgetModel.vpnLoader.active = true
                 }
-                builtinInstance = widgetModel.vpnBuiltinInstance;
-            }
-            if (builtinId === "builtin_cups") {
-                if (widgetModel?.cupsLoader) {
-                    widgetModel.cupsLoader.active = true;
-                }
-                builtinInstance = widgetModel.cupsBuiltinInstance;
+                builtinInstance = widgetModel.vpnBuiltinInstance
             }
 
             if (!builtinInstance || !builtinInstance.ccDetailContent) {
-                return;
+                return
             }
 
-            pluginDetailLoader.sourceComponent = builtinInstance.ccDetailContent;
-            pluginDetailLoader.active = parent.height > 0;
-            return;
+            pluginDetailLoader.sourceComponent = builtinInstance.ccDetailContent
+            pluginDetailLoader.active = parent.height > 0
+            return
         }
 
         if (root.expandedSection.startsWith("plugin_")) {
-            const pluginId = root.expandedSection.replace("plugin_", "");
-            const pluginComponent = PluginService.pluginWidgetComponents[pluginId];
+            const pluginId = root.expandedSection.replace("plugin_", "")
+            const pluginComponent = PluginService.pluginWidgetComponents[pluginId]
             if (!pluginComponent) {
-                return;
+                return
             }
 
-            pluginDetailInstance = pluginComponent.createObject(null);
+            pluginDetailInstance = pluginComponent.createObject(null)
             if (!pluginDetailInstance || !pluginDetailInstance.ccDetailContent) {
                 if (pluginDetailInstance) {
-                    pluginDetailInstance.destroy();
-                    pluginDetailInstance = null;
+                    pluginDetailInstance.destroy()
+                    pluginDetailInstance = null
                 }
-                return;
+                return
             }
 
-            pluginDetailLoader.sourceComponent = pluginDetailInstance.ccDetailContent;
-            pluginDetailLoader.active = parent.height > 0;
-            return;
+            pluginDetailLoader.sourceComponent = pluginDetailInstance.ccDetailContent
+            pluginDetailLoader.active = parent.height > 0
+            return
         }
 
         if (root.expandedSection.startsWith("diskUsage_")) {
-            coreDetailLoader.sourceComponent = diskUsageDetailComponent;
-            coreDetailLoader.active = parent.height > 0;
-            return;
+            coreDetailLoader.sourceComponent = diskUsageDetailComponent
+            coreDetailLoader.active = parent.height > 0
+            return
         }
 
         if (root.expandedSection.startsWith("brightnessSlider_")) {
-            coreDetailLoader.sourceComponent = brightnessDetailComponent;
-            coreDetailLoader.active = parent.height > 0;
-            return;
+            coreDetailLoader.sourceComponent = brightnessDetailComponent
+            coreDetailLoader.active = parent.height > 0
+            return
         }
 
         switch (root.expandedSection) {
         case "network":
-        case "wifi":
-            coreDetailLoader.sourceComponent = networkDetailComponent;
-            break;
-        case "bluetooth":
-            coreDetailLoader.sourceComponent = bluetoothDetailComponent;
-            break;
-        case "audioOutput":
-            coreDetailLoader.sourceComponent = audioOutputDetailComponent;
-            break;
-        case "audioInput":
-            coreDetailLoader.sourceComponent = audioInputDetailComponent;
-            break;
-        case "battery":
-            coreDetailLoader.sourceComponent = batteryDetailComponent;
-            break;
-        default:
-            return;
+        case "wifi": coreDetailLoader.sourceComponent = networkDetailComponent; break
+        case "bluetooth": coreDetailLoader.sourceComponent = bluetoothDetailComponent; break
+        case "audioOutput": coreDetailLoader.sourceComponent = audioOutputDetailComponent; break
+        case "audioInput": coreDetailLoader.sourceComponent = audioInputDetailComponent; break
+        case "battery": coreDetailLoader.sourceComponent = batteryDetailComponent; break
+        default: return
         }
 
-        coreDetailLoader.active = parent.height > 0;
+        coreDetailLoader.active = parent.height > 0
     }
 
     Component {
@@ -197,12 +168,12 @@ Item {
         id: bluetoothDetailComponent
         BluetoothDetail {
             id: bluetoothDetail
-            onShowCodecSelector: function (device) {
+            onShowCodecSelector: function(device) {
                 if (root.bluetoothCodecSelector) {
-                    root.bluetoothCodecSelector.show(device);
-                    root.bluetoothCodecSelector.codecSelected.connect(function (deviceAddress, codecName) {
-                        bluetoothDetail.updateDeviceCodecDisplay(deviceAddress, codecName);
-                    });
+                    root.bluetoothCodecSelector.show(device)
+                    root.bluetoothCodecSelector.codecSelected.connect(function(deviceAddress, codecName) {
+                        bluetoothDetail.updateDeviceCodecDisplay(deviceAddress, codecName)
+                    })
                 }
             }
         }
@@ -234,10 +205,8 @@ Item {
     Component {
         id: brightnessDetailComponent
         BrightnessDetail {
-            initialDeviceName: root.expandedWidgetData?.deviceName || ""
+            currentDeviceName: root.expandedWidgetData?.deviceName || ""
             instanceId: root.expandedWidgetData?.instanceId || ""
-            screenName: root.screenName
-            screenModel: root.screenModel
         }
     }
-}
+}

Modules/ControlCenter/Components/DragDropDetailHost.qml

@@ -83,7 +83,7 @@ Item {
                         }
                         return w
                     })
-                    SettingsData.set("controlCenterWidgets", newWidgets)
+                    SettingsData.setControlCenterWidgets(newWidgets)
                 }
             }
         }

Modules/ControlCenter/Components/DragDropWidgetWrapper.qml

@@ -110,7 +110,7 @@ Item {
         copy[i] = copy[j];
         copy[j] = tmp;
 
-        SettingsData.set("controlCenterWidgets", copy);
+        SettingsData.setControlCenterWidgets(copy);
     }
 
     function snapToGrid() {
@@ -244,7 +244,7 @@ Item {
             var widgets = SettingsData.controlCenterWidgets.slice()
             if (widgetIndex >= 0 && widgetIndex < widgets.length) {
                 widgets[widgetIndex].width = newSize
-                SettingsData.set("controlCenterWidgets", widgets)
+                SettingsData.setControlCenterWidgets(widgets)
             }
         }
     }

Modules/ControlCenter/Components/EditControls.qml

@@ -76,7 +76,7 @@ Row {
                     width: 400 - Theme.spacingL * 2
                     height: 50
                     radius: Theme.cornerRadius
-                    color: widgetMouseArea.containsMouse ? Theme.primaryHover : Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
+                    color: widgetMouseArea.containsMouse ? Theme.primaryHover : Theme.surfaceContainerHigh
                     border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.2)
                     border.width: 0
 

Modules/ControlCenter/Components/HeaderPane.qml

@@ -8,18 +8,16 @@ Rectangle {
 
     property bool editMode: false
 
-    signal powerButtonClicked
-    signal lockRequested
-    signal editModeToggled
-    signal settingsButtonClicked
-
-    Component.onCompleted: DgopService.addRef("system")
-    Component.onDestruction: DgopService.removeRef("system")
+    signal powerButtonClicked()
+    signal lockRequested()
+    signal editModeToggled()
+    signal settingsButtonClicked()
 
     implicitHeight: 70
     radius: Theme.cornerRadius
-    color: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
-    border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
+    color: Theme.surfaceContainerHigh
+    border.color: Qt.rgba(Theme.outline.r, Theme.outline.g,
+                          Theme.outline.b, 0.08)
     border.width: 0
 
     Row {
@@ -36,12 +34,12 @@ Rectangle {
             height: 60
             imageSource: {
                 if (PortalService.profileImage === "")
-                    return "";
+                    return ""
 
                 if (PortalService.profileImage.startsWith("/"))
-                    return "file://" + PortalService.profileImage;
+                    return "file://" + PortalService.profileImage
 
-                return PortalService.profileImage;
+                return PortalService.profileImage
             }
             fallbackIcon: "person"
         }
@@ -51,13 +49,14 @@ Rectangle {
             spacing: 2
 
             Typography {
-                text: UserInfoService.fullName || UserInfoService.username || "User"
+                text: UserInfoService.fullName
+                      || UserInfoService.username || "User"
                 style: Typography.Style.Subtitle
                 color: Theme.surfaceText
             }
 
             Typography {
-                text: DgopService.uptime || "Unknown"
+                text: (UserInfoService.uptime || "Unknown")
                 style: Typography.Style.Caption
                 color: Theme.surfaceVariantText
             }
@@ -78,7 +77,7 @@ Rectangle {
             iconColor: Theme.surfaceText
             backgroundColor: "transparent"
             onClicked: {
-                root.lockRequested();
+                root.lockRequested()
             }
         }
 
@@ -98,8 +97,8 @@ Rectangle {
             iconColor: Theme.surfaceText
             backgroundColor: "transparent"
             onClicked: {
-                root.settingsButtonClicked();
-                PopoutService.focusOrToggleSettings();
+                root.settingsButtonClicked()
+                settingsModal.show()
             }
         }
 
@@ -112,4 +111,4 @@ Rectangle {
             onClicked: root.editModeToggled()
         }
     }
-}
+}

Modules/ControlCenter/ControlCenterPopout.qml

@@ -1,7 +1,16 @@
 import QtQuick
+import QtQuick.Controls
+import QtQuick.Effects
+import QtQuick.Layouts
+import Quickshell
+import Quickshell.Io
 import Quickshell.Wayland
+import Quickshell.Widgets
 import qs.Common
+import qs.Modules.ControlCenter
+import qs.Modules.ControlCenter.Widgets
 import qs.Modules.ControlCenter.Details
+import qs.Modules.DankBar
 import qs.Services
 import qs.Widgets
 import qs.Modules.ControlCenter.Components
@@ -11,94 +20,74 @@ import "./utils/state.js" as StateUtils
 DankPopout {
     id: root
 
-    layerNamespace: "dms:control-center"
-
     property string expandedSection: ""
     property var triggerScreen: null
     property bool editMode: false
     property int expandedWidgetIndex: -1
     property var expandedWidgetData: null
-    property bool powerMenuOpen: powerMenuModalLoader?.item?.shouldBeVisible ?? false
 
     signal lockRequested
 
     function collapseAll() {
-        expandedSection = "";
-        expandedWidgetIndex = -1;
-        expandedWidgetData = null;
+        expandedSection = ""
+        expandedWidgetIndex = -1
+        expandedWidgetData = null
     }
 
     onEditModeChanged: {
         if (editMode) {
-            collapseAll();
+            collapseAll()
         }
     }
 
     onVisibleChanged: {
         if (!visible) {
-            collapseAll();
+            collapseAll()
         }
     }
 
-    readonly property color _containerBg: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
+    readonly property color _containerBg: Theme.surfaceContainerHigh
+
+    function setTriggerPosition(x, y, width, section, screen) {
+        StateUtils.setTriggerPosition(root, x, y, width, section, screen)
+    }
 
     function openWithSection(section) {
-        StateUtils.openWithSection(root, section);
+        StateUtils.openWithSection(root, section)
     }
 
     function toggleSection(section) {
-        StateUtils.toggleSection(root, section);
+        StateUtils.toggleSection(root, section)
     }
 
     popupWidth: 550
-    popupHeight: {
-        const screenHeight = (triggerScreen?.height ?? 1080);
-        const maxHeight = screenHeight - 100;
-        const contentHeight = contentLoader.item && contentLoader.item.implicitHeight > 0 ? contentLoader.item.implicitHeight + 20 : 400;
-        return Math.min(maxHeight, contentHeight);
-    }
-    triggerX: 0
-    triggerY: 0
+    popupHeight: Math.min((triggerScreen?.height ?? 1080) - 100, contentLoader.item && contentLoader.item.implicitHeight > 0 ? contentLoader.item.implicitHeight + 20 : 400)
+    triggerX: (triggerScreen?.width ?? 1920) - 600 - Theme.spacingL
+    triggerY: Theme.barHeight - 4 + SettingsData.dankBarSpacing
     triggerWidth: 80
     positioning: ""
     screen: triggerScreen
     shouldBeVisible: false
-
-    property bool credentialsPromptOpen: NetworkService.credentialsRequested
-    property bool wifiPasswordModalOpen: PopoutService.wifiPasswordModal?.visible ?? false
-    property bool polkitModalOpen: PopoutService.polkitAuthModal?.visible ?? false
-    property bool anyModalOpen: credentialsPromptOpen || wifiPasswordModalOpen || polkitModalOpen || powerMenuOpen
-
-    backgroundInteractive: !anyModalOpen
-
-    customKeyboardFocus: {
-        if (!shouldBeVisible)
-            return WlrKeyboardFocus.None;
-        if (anyModalOpen)
-            return WlrKeyboardFocus.None;
-        if (CompositorService.isHyprland)
-            return WlrKeyboardFocus.OnDemand;
-        return WlrKeyboardFocus.Exclusive;
-    }
-
-    onBackgroundClicked: close()
+    visible: shouldBeVisible
 
     onShouldBeVisibleChanged: {
         if (shouldBeVisible) {
-            collapseAll();
             Qt.callLater(() => {
-                if (NetworkService.activeService)
-                    NetworkService.activeService.autoRefreshEnabled = NetworkService.wifiEnabled;
-            });
+                             if (NetworkService.activeService) {
+                                 NetworkService.activeService.autoRefreshEnabled = NetworkService.wifiEnabled
+                             }
+                             if (UserInfoService)
+                             UserInfoService.getUptime()
+                         })
         } else {
             Qt.callLater(() => {
-                if (NetworkService.activeService) {
-                    NetworkService.activeService.autoRefreshEnabled = false;
-                }
-                if (BluetoothService.adapter && BluetoothService.adapter.discovering)
-                    BluetoothService.adapter.discovering = false;
-                editMode = false;
-            });
+                             if (NetworkService.activeService) {
+                                 NetworkService.activeService.autoRefreshEnabled = false
+                             }
+                             if (BluetoothService.adapter && BluetoothService.adapter.discovering)
+                             BluetoothService.adapter.discovering = false
+                             editMode = false
+                         })
         }
     }
 
@@ -114,9 +103,9 @@ DankPopout {
             property alias bluetoothCodecSelector: bluetoothCodecSelector
 
             color: {
-                const transparency = Theme.popupTransparency;
-                const surface = Theme.surfaceContainer || Qt.rgba(0.1, 0.1, 0.1, 1);
-                return Qt.rgba(surface.r, surface.g, surface.b, transparency);
+                const transparency = Theme.popupTransparency
+                const surface = Theme.surfaceContainer || Qt.rgba(0.1, 0.1, 0.1, 1)
+                return Qt.rgba(surface.r, surface.g, surface.b, transparency)
             }
             radius: Theme.cornerRadius
             border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
@@ -124,21 +113,6 @@ DankPopout {
             antialiasing: true
             smooth: true
 
-            Rectangle {
-                anchors.fill: parent
-                color: Qt.rgba(0, 0, 0, 0.6)
-                radius: parent.radius
-                visible: root.powerMenuOpen
-                z: 5000
-
-                Behavior on opacity {
-                    NumberAnimation {
-                        duration: 200
-                        easing.type: Easing.OutCubic
-                    }
-                }
-            }
-
             Column {
                 id: mainColumn
                 width: parent.width - Theme.spacingL * 2
@@ -153,19 +127,20 @@ DankPopout {
                     onEditModeToggled: root.editMode = !root.editMode
                     onPowerButtonClicked: {
                         if (powerMenuModalLoader) {
-                            powerMenuModalLoader.active = true;
+                            powerMenuModalLoader.active = true
                             if (powerMenuModalLoader.item) {
-                                const bounds = Qt.rect(root.alignedX, root.alignedY, root.popupWidth, root.popupHeight);
-                                powerMenuModalLoader.item.openFromControlCenter(bounds, root.screen);
+                                const popoutPos = controlContent.mapToItem(null, 0, 0)
+                                const bounds = Qt.rect(popoutPos.x, popoutPos.y, controlContent.width, controlContent.height)
+                                powerMenuModalLoader.item.openFromControlCenter(bounds, root.triggerScreen)
                             }
                         }
                     }
                     onLockRequested: {
-                        root.close();
-                        root.lockRequested();
+                        root.close()
+                        root.lockRequested()
                     }
                     onSettingsButtonClicked: {
-                        root.close();
+                        root.close()
                     }
                 }
 
@@ -179,20 +154,17 @@ DankPopout {
                     model: widgetModel
                     bluetoothCodecSelector: bluetoothCodecSelector
                     colorPickerModal: root.colorPickerModal
-                    screenName: root.triggerScreen?.name || ""
-                    screenModel: root.triggerScreen?.model || ""
-                    parentScreen: root.triggerScreen
                     onExpandClicked: (widgetData, globalIndex) => {
-                        root.expandedWidgetIndex = globalIndex;
-                        root.expandedWidgetData = widgetData;
-                        if (widgetData.id === "diskUsage") {
-                            root.toggleSection("diskUsage_" + (widgetData.instanceId || "default"));
-                        } else if (widgetData.id === "brightnessSlider") {
-                            root.toggleSection("brightnessSlider_" + (widgetData.instanceId || "default"));
-                        } else {
-                            root.toggleSection(widgetData.id);
-                        }
-                    }
+                                         root.expandedWidgetIndex = globalIndex
+                                         root.expandedWidgetData = widgetData
+                                         if (widgetData.id === "diskUsage") {
+                                             root.toggleSection("diskUsage_" + (widgetData.instanceId || "default"))
+                                         } else if (widgetData.id === "brightnessSlider") {
+                                             root.toggleSection("brightnessSlider_" + (widgetData.instanceId || "default"))
+                                         } else {
+                                             root.toggleSection(widgetData.id)
+                                         }
+                                     }
                     onRemoveWidget: index => widgetModel.removeWidget(index)
                     onMoveWidget: (fromIndex, toIndex) => widgetModel.moveWidget(fromIndex, toIndex)
                     onToggleWidgetSize: index => widgetModel.toggleWidgetSize(index)
@@ -205,10 +177,10 @@ DankPopout {
                     popoutContent: controlContent
                     availableWidgets: {
                         if (!editMode)
-                            return [];
-                        const existingIds = (SettingsData.controlCenterWidgets || []).map(w => w.id);
-                        const allWidgets = widgetModel.baseWidgetDefinitions.concat(widgetModel.getPluginWidgets());
-                        return allWidgets.filter(w => w.allowMultiple || !existingIds.includes(w.id));
+                            return []
+                        const existingIds = (SettingsData.controlCenterWidgets || []).map(w => w.id)
+                        const allWidgets = widgetModel.baseWidgetDefinitions.concat(widgetModel.getPluginWidgets())
+                        return allWidgets.filter(w => w.allowMultiple || !existingIds.includes(w.id))
                     }
                     onAddWidget: widgetId => widgetModel.addWidget(widgetId)
                     onResetToDefault: () => widgetModel.resetToDefault()
@@ -235,10 +207,10 @@ DankPopout {
             id: bluetoothDetail
             onShowCodecSelector: function (device) {
                 if (contentLoader.item && contentLoader.item.bluetoothCodecSelector) {
-                    contentLoader.item.bluetoothCodecSelector.show(device);
+                    contentLoader.item.bluetoothCodecSelector.show(device)
                     contentLoader.item.bluetoothCodecSelector.codecSelected.connect(function (deviceAddress, codecName) {
-                        bluetoothDetail.updateDeviceCodecDisplay(deviceAddress, codecName);
-                    });
+                        bluetoothDetail.updateDeviceCodecDisplay(deviceAddress, codecName)
+                    })
                 }
             }
         }

Modules/ControlCenter/Details/AudioInputDetail.qml

@@ -1,4 +1,5 @@
 import QtQuick
+import QtQuick.Controls
 import Quickshell
 import Quickshell.Services.Pipewire
 import qs.Common
@@ -6,19 +7,17 @@ import qs.Services
 import qs.Widgets
 
 Rectangle {
-    id: root
-
     property bool hasInputVolumeSliderInCC: {
-        const widgets = SettingsData.controlCenterWidgets || [];
-        return widgets.some(widget => widget.id === "inputVolumeSlider");
+        const widgets = SettingsData.controlCenterWidgets || []
+        return widgets.some(widget => widget.id === "inputVolumeSlider")
     }
 
     implicitHeight: headerRow.height + (hasInputVolumeSliderInCC ? 0 : volumeSlider.height) + audioContent.height + Theme.spacingM
     radius: Theme.cornerRadius
-    color: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
+    color: Theme.surfaceContainerHigh
     border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
     border.width: 0
-
+    
     Row {
         id: headerRow
         anchors.left: parent.left
@@ -28,7 +27,7 @@ Rectangle {
         anchors.rightMargin: Theme.spacingM
         anchors.topMargin: Theme.spacingS
         height: 40
-
+        
         StyledText {
             id: headerText
             text: I18n.tr("Input Devices")
@@ -38,7 +37,7 @@ Rectangle {
             anchors.verticalCenter: parent.verticalCenter
         }
     }
-
+    
     Row {
         id: volumeSlider
         anchors.left: parent.left
@@ -65,7 +64,7 @@ Rectangle {
                 cursorShape: Qt.PointingHandCursor
                 onClicked: {
                     if (AudioService.source && AudioService.source.audio) {
-                        AudioService.source.audio.muted = !AudioService.source.audio.muted;
+                        AudioService.source.audio.muted = !AudioService.source.audio.muted
                     }
                 }
             }
@@ -73,10 +72,9 @@ Rectangle {
             DankIcon {
                 anchors.centerIn: parent
                 name: {
-                    if (!AudioService.source || !AudioService.source.audio)
-                        return "mic_off";
-                    let muted = AudioService.source.audio.muted;
-                    return muted ? "mic_off" : "mic";
+                    if (!AudioService.source || !AudioService.source.audio) return "mic_off"
+                    let muted = AudioService.source.audio.muted
+                    return muted ? "mic_off" : "mic"
                 }
                 size: Theme.iconSize
                 color: AudioService.source && AudioService.source.audio && !AudioService.source.audio.muted && AudioService.source.audio.volume > 0 ? Theme.primary : Theme.surfaceText
@@ -97,17 +95,17 @@ Rectangle {
             valueOverride: actualVolumePercent
             thumbOutlineColor: Theme.surfaceVariant
 
-            onSliderValueChanged: function (newValue) {
+            onSliderValueChanged: function(newValue) {
                 if (AudioService.source && AudioService.source.audio) {
-                    AudioService.source.audio.volume = newValue / 100;
+                    AudioService.source.audio.volume = newValue / 100
                     if (newValue > 0 && AudioService.source.audio.muted) {
-                        AudioService.source.audio.muted = false;
+                        AudioService.source.audio.muted = false
                     }
                 }
             }
         }
     }
-
+    
     DankFlickable {
         id: audioContent
         anchors.top: hasInputVolumeSliderInCC ? headerRow.bottom : volumeSlider.bottom
@@ -118,78 +116,52 @@ Rectangle {
         anchors.topMargin: hasInputVolumeSliderInCC ? Theme.spacingM : Theme.spacingS
         contentHeight: audioColumn.height
         clip: true
-
+        
         Column {
             id: audioColumn
             width: parent.width
             spacing: Theme.spacingS
-
+            
             Repeater {
-                model: ScriptModel {
-                    values: {
-                        const nodes = Pipewire.nodes.values.filter(node => {
-                            return node.audio && !node.isSink && !node.isStream;
-                        });
-                        const pins = SettingsData.audioInputDevicePins || {};
-                        const pinnedName = pins["preferredInput"];
-
-                        let sorted = [...nodes];
-                        sorted.sort((a, b) => {
-                            // Pinned device first
-                            if (a.name === pinnedName && b.name !== pinnedName)
-                                return -1;
-                            if (b.name === pinnedName && a.name !== pinnedName)
-                                return 1;
-                            // Then active device
-                            if (a === AudioService.source && b !== AudioService.source)
-                                return -1;
-                            if (b === AudioService.source && a !== AudioService.source)
-                                return 1;
-                            return 0;
-                        });
-                        return sorted;
-                    }
-                }
-
+                model: Pipewire.nodes.values.filter(node => {
+                    return node.audio && !node.isSink && !node.isStream
+                })
+                
                 delegate: Rectangle {
                     required property var modelData
                     required property int index
-
+                    
                     width: parent.width
                     height: 50
                     radius: Theme.cornerRadius
-                    color: deviceMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
+                    color: deviceMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : Theme.surfaceContainerHighest
                     border.color: modelData === AudioService.source ? Theme.primary : Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
                     border.width: 0
-
+                    
                     Row {
                         anchors.left: parent.left
                         anchors.verticalCenter: parent.verticalCenter
                         anchors.leftMargin: Theme.spacingM
                         spacing: Theme.spacingS
-
+                        
                         DankIcon {
                             name: {
                                 if (modelData.name.includes("bluez"))
-                                    return "headset";
+                                    return "headset"
                                 else if (modelData.name.includes("usb"))
-                                    return "headset";
+                                    return "headset"
                                 else
-                                    return "mic";
+                                    return "mic"
                             }
                             size: Theme.iconSize - 4
                             color: modelData === AudioService.source ? Theme.primary : Theme.surfaceText
                             anchors.verticalCenter: parent.verticalCenter
                         }
-
+                        
                         Column {
                             anchors.verticalCenter: parent.verticalCenter
-                            width: {
-                                const iconWidth = Theme.iconSize;
-                                const pinButtonWidth = pinInputRow.width + Theme.spacingS * 4 + Theme.spacingM;
-                                return parent.parent.width - iconWidth - parent.spacing - pinButtonWidth - Theme.spacingM * 2;
-                            }
-
+                            width: parent.parent.width - parent.parent.anchors.leftMargin - parent.spacing - Theme.iconSize - Theme.spacingM
+                            
                             StyledText {
                                 text: AudioService.displayName(modelData)
                                 font.pixelSize: Theme.fontSizeMedium
@@ -199,7 +171,7 @@ Rectangle {
                                 width: parent.width
                                 wrapMode: Text.NoWrap
                             }
-
+                            
                             StyledText {
                                 text: modelData === AudioService.source ? "Active" : "Available"
                                 font.pixelSize: Theme.fontSizeSmall
@@ -210,75 +182,15 @@ Rectangle {
                             }
                         }
                     }
-
-                    Rectangle {
-                        anchors.right: parent.right
-                        anchors.rightMargin: Theme.spacingM
-                        anchors.verticalCenter: parent.verticalCenter
-                        width: pinInputRow.width + Theme.spacingS * 2
-                        height: 28
-                        radius: height / 2
-                        color: {
-                            const isThisDevicePinned = (SettingsData.audioInputDevicePins || {})["preferredInput"] === modelData.name;
-                            return isThisDevicePinned ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : Theme.withAlpha(Theme.surfaceText, 0.05);
-                        }
-
-                        Row {
-                            id: pinInputRow
-                            anchors.centerIn: parent
-                            spacing: 4
-
-                            DankIcon {
-                                name: "push_pin"
-                                size: 16
-                                color: {
-                                    const isThisDevicePinned = (SettingsData.audioInputDevicePins || {})["preferredInput"] === modelData.name;
-                                    return isThisDevicePinned ? Theme.primary : Theme.surfaceText;
-                                }
-                                anchors.verticalCenter: parent.verticalCenter
-                            }
-
-                            StyledText {
-                                text: {
-                                    const isThisDevicePinned = (SettingsData.audioInputDevicePins || {})["preferredInput"] === modelData.name;
-                                    return isThisDevicePinned ? "Pinned" : "Pin";
-                                }
-                                font.pixelSize: Theme.fontSizeSmall
-                                color: {
-                                    const isThisDevicePinned = (SettingsData.audioInputDevicePins || {})["preferredInput"] === modelData.name;
-                                    return isThisDevicePinned ? Theme.primary : Theme.surfaceText;
-                                }
-                                anchors.verticalCenter: parent.verticalCenter
-                            }
-                        }
-
-                        MouseArea {
-                            anchors.fill: parent
-                            cursorShape: Qt.PointingHandCursor
-                            onClicked: {
-                                const pins = JSON.parse(JSON.stringify(SettingsData.audioInputDevicePins || {}));
-                                const isCurrentlyPinned = pins["preferredInput"] === modelData.name;
-
-                                if (isCurrentlyPinned) {
-                                    delete pins["preferredInput"];
-                                } else {
-                                    pins["preferredInput"] = modelData.name;
-                                }
-
-                                SettingsData.set("audioInputDevicePins", pins);
-                            }
-                        }
-                    }
-
+                    
                     MouseArea {
                         id: deviceMouseArea
                         anchors.fill: parent
-                        anchors.rightMargin: pinInputRow.width + Theme.spacingS * 4
                         hoverEnabled: true
                         cursorShape: Qt.PointingHandCursor
                         onClicked: {
                             if (modelData) {
-                                Pipewire.preferredDefaultAudioSource = modelData;
+                                Pipewire.preferredDefaultAudioSource = modelData
                             }
                         }
                     }
@@ -286,4 +198,4 @@ Rectangle {
             }
         }
     }
-}
+}

Modules/ControlCenter/Details/AudioOutputDetail.qml

@@ -0,0 +1,208 @@
+import QtQuick
+import QtQuick.Controls
+import Quickshell
+import Quickshell.Services.Pipewire
+import qs.Common
+import qs.Services
+import qs.Widgets
+
+Rectangle {
+    property bool hasVolumeSliderInCC: {
+        const widgets = SettingsData.controlCenterWidgets || []
+        return widgets.some(widget => widget.id === "volumeSlider")
+    }
+
+    implicitHeight: headerRow.height + (!hasVolumeSliderInCC ? volumeSlider.height : 0) + audioContent.height + Theme.spacingM
+    radius: Theme.cornerRadius
+    color: Theme.surfaceContainerHigh
+    border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
+    border.width: 0
+    
+    Row {
+        id: headerRow
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.top: parent.top
+        anchors.leftMargin: Theme.spacingM
+        anchors.rightMargin: Theme.spacingM
+        anchors.topMargin: Theme.spacingS
+        height: 40
+        
+        StyledText {
+            id: headerText
+            text: I18n.tr("Audio Devices")
+            font.pixelSize: Theme.fontSizeLarge
+            color: Theme.surfaceText
+            font.weight: Font.Medium
+            anchors.verticalCenter: parent.verticalCenter
+        }
+    }
+
+    Row {
+        id: volumeSlider
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.top: headerRow.bottom
+        anchors.leftMargin: Theme.spacingM
+        anchors.rightMargin: Theme.spacingM
+        anchors.topMargin: Theme.spacingXS
+        height: 35
+        spacing: 0
+        visible: !hasVolumeSliderInCC
+
+        Rectangle {
+            width: Theme.iconSize + Theme.spacingS * 2
+            height: Theme.iconSize + Theme.spacingS * 2
+            anchors.verticalCenter: parent.verticalCenter
+            radius: (Theme.iconSize + Theme.spacingS * 2) / 2
+            color: iconArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : "transparent"
+
+            MouseArea {
+                id: iconArea
+                anchors.fill: parent
+                hoverEnabled: true
+                cursorShape: Qt.PointingHandCursor
+                onClicked: {
+                    if (AudioService.sink && AudioService.sink.audio) {
+                        AudioService.sink.audio.muted = !AudioService.sink.audio.muted
+                    }
+                }
+            }
+
+            DankIcon {
+                anchors.centerIn: parent
+                name: {
+                    if (!AudioService.sink || !AudioService.sink.audio) return "volume_off"
+                    let muted = AudioService.sink.audio.muted
+                    let volume = AudioService.sink.audio.volume
+                    if (muted || volume === 0.0) return "volume_off"
+                    if (volume <= 0.33) return "volume_down"
+                    if (volume <= 0.66) return "volume_up"
+                    return "volume_up"
+                }
+                size: Theme.iconSize
+                color: AudioService.sink && AudioService.sink.audio && !AudioService.sink.audio.muted && AudioService.sink.audio.volume > 0 ? Theme.primary : Theme.surfaceText
+            }
+        }
+
+        DankSlider {
+            readonly property real actualVolumePercent: AudioService.sink && AudioService.sink.audio ? Math.round(AudioService.sink.audio.volume * 100) : 0
+
+            anchors.verticalCenter: parent.verticalCenter
+            width: parent.width - (Theme.iconSize + Theme.spacingS * 2)
+            enabled: AudioService.sink && AudioService.sink.audio
+            minimum: 0
+            maximum: 100
+            value: AudioService.sink && AudioService.sink.audio ? Math.min(100, Math.round(AudioService.sink.audio.volume * 100)) : 0
+            showValue: true
+            unit: "%"
+            valueOverride: actualVolumePercent
+            thumbOutlineColor: Theme.surfaceVariant
+
+            onSliderValueChanged: function(newValue) {
+                if (AudioService.sink && AudioService.sink.audio) {
+                    AudioService.sink.audio.volume = newValue / 100
+                    if (newValue > 0 && AudioService.sink.audio.muted) {
+                        AudioService.sink.audio.muted = false
+                    }
+                    AudioService.volumeChanged()
+                }
+            }
+        }
+    }
+
+    DankFlickable {
+        id: audioContent
+        anchors.top: volumeSlider.visible ? volumeSlider.bottom : headerRow.bottom
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.bottom: parent.bottom
+        anchors.margins: Theme.spacingM
+        anchors.topMargin: volumeSlider.visible ? Theme.spacingS : Theme.spacingM
+        contentHeight: audioColumn.height
+        clip: true
+        
+        Column {
+            id: audioColumn
+            width: parent.width
+            spacing: Theme.spacingS
+            
+            Repeater {
+                model: Pipewire.nodes.values.filter(node => {
+                    return node.audio && node.isSink && !node.isStream
+                })
+                
+                delegate: Rectangle {
+                    required property var modelData
+                    required property int index
+                    
+                    width: parent.width
+                    height: 50
+                    radius: Theme.cornerRadius
+                    color: deviceMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : Theme.surfaceContainerHighest
+                    border.color: modelData === AudioService.sink ? Theme.primary : Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
+                    border.width: 0
+                    
+                    Row {
+                        anchors.left: parent.left
+                        anchors.verticalCenter: parent.verticalCenter
+                        anchors.leftMargin: Theme.spacingM
+                        spacing: Theme.spacingS
+                        
+                        DankIcon {
+                            name: {
+                                if (modelData.name.includes("bluez"))
+                                    return "headset"
+                                else if (modelData.name.includes("hdmi"))
+                                    return "tv"
+                                else if (modelData.name.includes("usb"))
+                                    return "headset"
+                                else
+                                    return "speaker"
+                            }
+                            size: Theme.iconSize - 4
+                            color: modelData === AudioService.sink ? Theme.primary : Theme.surfaceText
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+                        
+                        Column {
+                            anchors.verticalCenter: parent.verticalCenter
+                            width: parent.parent.width - parent.parent.anchors.leftMargin - parent.spacing - Theme.iconSize - Theme.spacingM
+                            
+                            StyledText {
+                                text: AudioService.displayName(modelData)
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: Theme.surfaceText
+                                font.weight: modelData === AudioService.sink ? Font.Medium : Font.Normal
+                                elide: Text.ElideRight
+                                width: parent.width
+                                wrapMode: Text.NoWrap
+                            }
+                            
+                            StyledText {
+                                text: modelData === AudioService.sink ? "Active" : "Available"
+                                font.pixelSize: Theme.fontSizeSmall
+                                color: Theme.surfaceVariantText
+                                elide: Text.ElideRight
+                                width: parent.width
+                                wrapMode: Text.NoWrap
+                            }
+                        }
+                    }
+                    
+                    MouseArea {
+                        id: deviceMouseArea
+                        anchors.fill: parent
+                        hoverEnabled: true
+                        cursorShape: Qt.PointingHandCursor
+                        onClicked: {
+                            if (modelData) {
+                                Pipewire.preferredDefaultAudioSink = modelData
+                            }
+                        }
+                    }
+                }
+            }
+        }
+    }
+}

Modules/ControlCenter/Details/BatteryDetail.qml

@@ -9,7 +9,7 @@ import qs.Widgets
 Rectangle {
     implicitHeight: contentColumn.implicitHeight + Theme.spacingL * 2
     radius: Theme.cornerRadius
-    color: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
+    color: Theme.surfaceContainerHigh
     border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
     border.width: 0
 
@@ -125,7 +125,7 @@ Rectangle {
                 width: (parent.width - Theme.spacingM) / 2
                 height: 64
                 radius: Theme.cornerRadius
-                color: Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
+                color: Theme.surfaceContainerHighest
                 border.width: 0
 
                 Column {
@@ -160,7 +160,7 @@ Rectangle {
                 width: (parent.width - Theme.spacingM) / 2
                 height: 64
                 radius: Theme.cornerRadius
-                color: Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
+                color: Theme.surfaceContainerHighest
                 border.width: 0
 
                 Column {

Modules/ControlCenter/Details/BluetoothCodecSelector.qml

@@ -83,12 +83,12 @@ Item {
         hoverEnabled: true
         preventStealing: true
         propagateComposedEvents: false
-
+        
         onClicked: root.hide()
         onWheel: (wheel) => { wheel.accepted = true }
         onPositionChanged: (mouse) => { mouse.accepted = true }
     }
-
+    
     Rectangle {
         id: modalBackground
         anchors.fill: parent
@@ -206,7 +206,7 @@ Item {
                         radius: Theme.cornerRadius
                         color: {
                             if (modelData.name === currentCodec)
-                                return Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency);
+                                return Theme.surfaceContainerHighest;
                             else if (codecMouseArea.containsMouse)
                                 return Theme.surfaceHover;
                             else

Modules/ControlCenter/Details/BluetoothDetail.qml

@@ -5,52 +5,18 @@ import Quickshell.Bluetooth
 import qs.Common
 import qs.Services
 import qs.Widgets
-import qs.Modals
 
 Rectangle {
-    id: root
-
-    implicitHeight: {
-        if (height > 0) {
-            return height
-        }
-        return BluetoothService.adapter && BluetoothService.adapter.enabled ? headerRow.height + bluetoothContent.height + Theme.spacingM : headerRow.height
-    }
+    implicitHeight: BluetoothService.adapter && BluetoothService.adapter.enabled ? headerRow.height + bluetoothContent.height + Theme.spacingM : headerRow.height
     radius: Theme.cornerRadius
-    color: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
+    color: Theme.surfaceContainerHigh
     border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
     border.width: 0
-
+    
     property var bluetoothCodecModalRef: null
-    property var devicesBeingPaired: new Set()
-
+    
     signal showCodecSelector(var device)
-
-    function isDeviceBeingPaired(deviceAddress) {
-        return devicesBeingPaired.has(deviceAddress)
-    }
-
-    function handlePairDevice(device) {
-        if (!device) return
-
-        const deviceAddr = device.address
-        const pairingSet = devicesBeingPaired
-
-        pairingSet.add(deviceAddr)
-        devicesBeingPairedChanged()
-
-        BluetoothService.pairDevice(device, function(response) {
-            pairingSet.delete(deviceAddr)
-            devicesBeingPairedChanged()
-
-            if (response.error) {
-                ToastService.showError(I18n.tr("Pairing failed"), response.error)
-            } else if (!BluetoothService.enhancedPairingAvailable) {
-                ToastService.showSuccess(I18n.tr("Device paired"))
-            }
-        })
-    }
-
+    
     function updateDeviceCodecDisplay(deviceAddress, codecName) {
         for (let i = 0; i < pairedRepeater.count; i++) {
             let item = pairedRepeater.itemAt(i)
@@ -60,9 +26,7 @@ Rectangle {
             }
         }
     }
-
-
-
+    
     Row {
         id: headerRow
         anchors.left: parent.left
@@ -72,7 +36,7 @@ Rectangle {
         anchors.rightMargin: Theme.spacingM
         anchors.topMargin: Theme.spacingS
         height: 40
-
+        
         StyledText {
             id: headerText
             text: I18n.tr("Bluetooth Settings")
@@ -81,12 +45,12 @@ Rectangle {
             font.weight: Font.Medium
             anchors.verticalCenter: parent.verticalCenter
         }
-
+        
         Item {
             width: Math.max(0, parent.width - headerText.implicitWidth - scanButton.width - Theme.spacingM)
             height: parent.height
         }
-
+        
         Rectangle {
             id: scanButton
             width: 100
@@ -94,24 +58,24 @@ Rectangle {
             radius: 18
             color: {
                 if (!BluetoothService.adapter || !BluetoothService.adapter.enabled)
-                    return Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
-                return scanMouseArea.containsMouse ? Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency) : "transparent"
+                    return Theme.surfaceContainerHigh
+                return scanMouseArea.containsMouse ? Theme.surfaceContainerHigh : "transparent"
             }
             border.color: BluetoothService.adapter && BluetoothService.adapter.enabled ? Theme.primary : Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
             border.width: 0
             visible: BluetoothService.adapter && BluetoothService.adapter.enabled
-
+            
             Row {
                 anchors.centerIn: parent
                 spacing: Theme.spacingXS
-
+                
                 DankIcon {
                     name: BluetoothService.adapter && BluetoothService.adapter.discovering ? "stop" : "bluetooth_searching"
                     size: 18
                     color: BluetoothService.adapter && BluetoothService.adapter.enabled ? Theme.primary : Theme.surfaceVariantText
                     anchors.verticalCenter: parent.verticalCenter
                 }
-
+                
                 StyledText {
                     text: BluetoothService.adapter && BluetoothService.adapter.discovering ? "Scanning" : "Scan"
                     color: BluetoothService.adapter && BluetoothService.adapter.enabled ? Theme.primary : Theme.surfaceVariantText
@@ -120,7 +84,7 @@ Rectangle {
                     anchors.verticalCenter: parent.verticalCenter
                 }
             }
-
+            
             MouseArea {
                 id: scanMouseArea
                 anchors.fill: parent
@@ -134,7 +98,7 @@ Rectangle {
             }
         }
     }
-
+    
     DankFlickable {
         id: bluetoothContent
         anchors.top: headerRow.bottom
@@ -146,46 +110,38 @@ Rectangle {
         visible: BluetoothService.adapter && BluetoothService.adapter.enabled
         contentHeight: bluetoothColumn.height
         clip: true
-
+        
         Column {
             id: bluetoothColumn
             width: parent.width
             spacing: Theme.spacingS
-
-
+            
+            
             Repeater {
                 id: pairedRepeater
                 model: {
                     if (!BluetoothService.adapter || !BluetoothService.adapter.devices)
                         return []
-
-                    const pins = SettingsData.bluetoothDevicePins || {}
-                    const pinnedAddr = pins["preferredDevice"]
                     
                     let devices = [...BluetoothService.adapter.devices.values.filter(dev => dev && (dev.paired || dev.trusted))]
                     devices.sort((a, b) => {
-                        // Pinned device first
-                        if (a.address === pinnedAddr && b.address !== pinnedAddr) return -1
-                        if (b.address === pinnedAddr && a.address !== pinnedAddr) return 1
-                        // Then connected devices
                         if (a.connected && !b.connected) return -1
                         if (!a.connected && b.connected) return 1
-                        // Then by signal strength
                         return (b.signalStrength || 0) - (a.signalStrength || 0)
                     })
                     return devices
                 }
-
+                
                 delegate: Rectangle {
                     required property var modelData
                     required property int index
-
+                    
                     property string currentCodec: BluetoothService.deviceCodecs[modelData.address] || ""
-
+                    
                     width: parent.width
                     height: 50
                     radius: Theme.cornerRadius
-
+                    
                     Component.onCompleted: {
                         if (modelData.connected && BluetoothService.isAudioDevice(modelData)) {
                             BluetoothService.refreshDeviceCodec(modelData)
@@ -196,7 +152,7 @@ Rectangle {
                             return Qt.rgba(Theme.warning.r, Theme.warning.g, Theme.warning.b, 0.12)
                         if (deviceMouseArea.containsMouse)
                             return Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08)
-                        return Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
+                        return Theme.surfaceContainerHighest
                     }
                     border.color: {
                         if (modelData.state === BluetoothDeviceState.Connecting)
@@ -206,13 +162,13 @@ Rectangle {
                         return Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
                     }
                     border.width: 0
-
+                    
                     Row {
                         anchors.left: parent.left
                         anchors.verticalCenter: parent.verticalCenter
                         anchors.leftMargin: Theme.spacingM
                         spacing: Theme.spacingS
-
+                        
                         DankIcon {
                             name: BluetoothService.getDeviceIcon(modelData)
                             size: Theme.iconSize - 4
@@ -225,11 +181,11 @@ Rectangle {
                             }
                             anchors.verticalCenter: parent.verticalCenter
                         }
-
+                        
                         Column {
                             anchors.verticalCenter: parent.verticalCenter
                             width: 200
-
+                            
                             StyledText {
                                 text: modelData.name || modelData.deviceName || "Unknown Device"
                                 font.pixelSize: Theme.fontSizeMedium
@@ -238,10 +194,10 @@ Rectangle {
                                 elide: Text.ElideRight
                                 width: parent.width
                             }
-
+                            
                             Row {
                                 spacing: Theme.spacingXS
-
+                                
                                 StyledText {
                                     text: {
                                         if (modelData.state === BluetoothDeviceState.Connecting)
@@ -262,12 +218,12 @@ Rectangle {
                                         return Theme.surfaceVariantText
                                     }
                                 }
-
+                                
                                 StyledText {
                                     text: {
                                         if (modelData.batteryAvailable && modelData.battery > 0)
                                             return "• " + Math.round(modelData.battery * 100) + "%"
-
+                                        
                                         var btBattery = BatteryService.bluetoothDevices.find(dev => {
                                             return dev.name === (modelData.name || modelData.deviceName) ||
                                                    dev.name.toLowerCase().includes((modelData.name || modelData.deviceName).toLowerCase()) ||
@@ -279,7 +235,7 @@ Rectangle {
                                     color: Theme.surfaceVariantText
                                     visible: text.length > 0
                                 }
-
+                                
                                 StyledText {
                                     text: modelData.signalStrength !== undefined && modelData.signalStrength > 0 ? "• " + modelData.signalStrength + "%" : ""
                                     font.pixelSize: Theme.fontSizeSmall
@@ -289,66 +245,7 @@ Rectangle {
                             }
                         }
                     }
-
-                    Rectangle {
-                        anchors.right: pairedOptionsButton.left
-                        anchors.rightMargin: Theme.spacingS
-                        anchors.verticalCenter: parent.verticalCenter
-                        width: pinBluetoothRow.width + Theme.spacingS * 2
-                        height: 28
-                        radius: height / 2
-                        color: {
-                            const isThisDevicePinned = (SettingsData.bluetoothDevicePins || {})["preferredDevice"] === modelData.address
-                            return isThisDevicePinned ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : Theme.withAlpha(Theme.surfaceText, 0.05)
-                        }
-
-                        Row {
-                            id: pinBluetoothRow
-                            anchors.centerIn: parent
-                            spacing: 4
-
-                            DankIcon {
-                                name: "push_pin"
-                                size: 16
-                                color: {
-                                    const isThisDevicePinned = (SettingsData.bluetoothDevicePins || {})["preferredDevice"] === modelData.address
-                                    return isThisDevicePinned ? Theme.primary : Theme.surfaceText
-                                }
-                                anchors.verticalCenter: parent.verticalCenter
-                            }
-
-                            StyledText {
-                                text: {
-                                    const isThisDevicePinned = (SettingsData.bluetoothDevicePins || {})["preferredDevice"] === modelData.address
-                                    return isThisDevicePinned ? "Pinned" : "Pin"
-                                }
-                                font.pixelSize: Theme.fontSizeSmall
-                                color: {
-                                    const isThisDevicePinned = (SettingsData.bluetoothDevicePins || {})["preferredDevice"] === modelData.address
-                                    return isThisDevicePinned ? Theme.primary : Theme.surfaceText
-                                }
-                                anchors.verticalCenter: parent.verticalCenter
-                            }
-                        }
-
-                        MouseArea {
-                            anchors.fill: parent
-                            cursorShape: Qt.PointingHandCursor
-                            onClicked: {
-                                const pins = JSON.parse(JSON.stringify(SettingsData.bluetoothDevicePins || {}))
-                                const isCurrentlyPinned = pins["preferredDevice"] === modelData.address
-                                
-                                if (isCurrentlyPinned) {
-                                    delete pins["preferredDevice"]
-                                } else {
-                                    pins["preferredDevice"] = modelData.address
-                                }
-                                
-                                SettingsData.set("bluetoothDevicePins", pins)
-                            }
-                        }
-                    }
-
+                    
                     DankActionButton {
                         id: pairedOptionsButton
                         anchors.right: parent.right
@@ -365,11 +262,11 @@ Rectangle {
                             }
                         }
                     }
-
+                    
                     MouseArea {
                         id: deviceMouseArea
                         anchors.fill: parent
-                        anchors.rightMargin: pairedOptionsButton.width + Theme.spacingM + pinBluetoothRow.width + Theme.spacingS * 4
+                        anchors.rightMargin: pairedOptionsButton.width + Theme.spacingS
                         hoverEnabled: true
                         cursorShape: Qt.PointingHandCursor
                         onClicked: {
@@ -382,26 +279,26 @@ Rectangle {
                     }
                 }
             }
-
+            
             Rectangle {
                 width: parent.width
                 height: 1
                 color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
                 visible: pairedRepeater.count > 0 && availableRepeater.count > 0
             }
-
-
+            
+            
             Item {
                 width: parent.width
                 height: 80
                 visible: BluetoothService.adapter && BluetoothService.adapter.discovering && availableRepeater.count === 0
-
+                
                 DankIcon {
                     anchors.centerIn: parent
                     name: "sync"
                     size: 24
                     color: Qt.rgba(Theme.surfaceText.r || 0.8, Theme.surfaceText.g || 0.8, Theme.surfaceText.b || 0.8, 0.4)
-
+                    
                     RotationAnimation on rotation {
                         running: parent.visible && BluetoothService.adapter && BluetoothService.adapter.discovering && availableRepeater.count === 0
                         loops: Animation.Infinite
@@ -411,52 +308,52 @@ Rectangle {
                     }
                 }
             }
-
+            
             Repeater {
                 id: availableRepeater
                 model: {
                     if (!BluetoothService.adapter || !BluetoothService.adapter.discovering || !Bluetooth.devices)
                         return []
-
+                    
                     var filtered = Bluetooth.devices.values.filter(dev => {
                         return dev && !dev.paired && !dev.pairing && !dev.blocked &&
                                (dev.signalStrength === undefined || dev.signalStrength > 0)
                     })
                     return BluetoothService.sortDevices(filtered)
                 }
-
+                
                 delegate: Rectangle {
                     required property var modelData
                     required property int index
-
+                    
                     property bool canConnect: BluetoothService.canConnect(modelData)
-                    property bool isBusy: BluetoothService.isDeviceBusy(modelData) || isDeviceBeingPaired(modelData.address)
-
+                    property bool isBusy: BluetoothService.isDeviceBusy(modelData)
+                    
                     width: parent.width
                     height: 50
                     radius: Theme.cornerRadius
-                    color: availableMouseArea.containsMouse && !isBusy ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
+                    color: availableMouseArea.containsMouse && !isBusy ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : Theme.surfaceContainerHighest
                     border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
                     border.width: 0
-                    opacity: (canConnect && !isBusy) ? 1 : 0.6
-
+                    opacity: canConnect ? 1 : 0.6
+                    
                     Row {
                         anchors.left: parent.left
                         anchors.verticalCenter: parent.verticalCenter
                         anchors.leftMargin: Theme.spacingM
                         spacing: Theme.spacingS
-
+                        
                         DankIcon {
                             name: BluetoothService.getDeviceIcon(modelData)
                             size: Theme.iconSize - 4
                             color: Theme.surfaceText
                             anchors.verticalCenter: parent.verticalCenter
                         }
-
+                        
                         Column {
                             anchors.verticalCenter: parent.verticalCenter
                             width: 200
-
+                            
                             StyledText {
                                 text: modelData.name || modelData.deviceName || "Unknown Device"
                                 font.pixelSize: Theme.fontSizeMedium
@@ -464,20 +361,20 @@ Rectangle {
                                 elide: Text.ElideRight
                                 width: parent.width
                             }
-
+                            
                             Row {
                                 spacing: Theme.spacingXS
-
+                                
                                 StyledText {
                                     text: {
-                                        if (modelData.pairing || isBusy) return "Pairing..."
+                                        if (modelData.pairing) return "Pairing..."
                                         if (modelData.blocked) return "Blocked"
                                         return BluetoothService.getSignalStrength(modelData)
                                     }
                                     font.pixelSize: Theme.fontSizeSmall
                                     color: Theme.surfaceVariantText
                                 }
-
+                                
                                 StyledText {
                                     text: modelData.signalStrength !== undefined && modelData.signalStrength > 0 ? "• " + modelData.signalStrength + "%" : ""
                                     font.pixelSize: Theme.fontSizeSmall
@@ -487,21 +384,21 @@ Rectangle {
                             }
                         }
                     }
-
+                    
                     StyledText {
                         anchors.right: parent.right
                         anchors.rightMargin: Theme.spacingM
                         anchors.verticalCenter: parent.verticalCenter
                         text: {
-                            if (isBusy) return "Pairing..."
+                            if (modelData.pairing) return "Pairing..."
                             if (!canConnect) return "Cannot pair"
                             return "Pair"
                         }
                         font.pixelSize: Theme.fontSizeSmall
-                        color: (canConnect && !isBusy) ? Theme.primary : Theme.surfaceVariantText
+                        color: canConnect ? Theme.primary : Theme.surfaceVariantText
                         font.weight: Font.Medium
                     }
-
+                    
                     MouseArea {
                         id: availableMouseArea
                         anchors.fill: parent
@@ -509,18 +406,20 @@ Rectangle {
                         cursorShape: canConnect && !isBusy ? Qt.PointingHandCursor : Qt.ArrowCursor
                         enabled: canConnect && !isBusy
                         onClicked: {
-                            root.handlePairDevice(modelData)
+                            if (modelData) {
+                                BluetoothService.connectDeviceWithTrust(modelData)
+                            }
                         }
                     }
-
+                    
                 }
             }
-
+            
             Item {
                 width: parent.width
                 height: 60
                 visible: !BluetoothService.adapter
-
+                
                 StyledText {
                     anchors.centerIn: parent
                     text: I18n.tr("No Bluetooth adapter found")
@@ -530,25 +429,25 @@ Rectangle {
             }
         }
     }
-
+    
     Menu {
         id: bluetoothContextMenu
         width: 150
         closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent
-
+        
         property var currentDevice: null
-
+        
         background: Rectangle {
-            color: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
+            color: Theme.popupBackground()
             radius: Theme.cornerRadius
             border.width: 0
             border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
         }
-
+        
         MenuItem {
             text: bluetoothContextMenu.currentDevice && bluetoothContextMenu.currentDevice.connected ? "Disconnect" : "Connect"
             height: 32
-
+            
             contentItem: StyledText {
                 text: parent.text
                 font.pixelSize: Theme.fontSizeSmall
@@ -556,12 +455,12 @@ Rectangle {
                 leftPadding: Theme.spacingS
                 verticalAlignment: Text.AlignVCenter
             }
-
+            
             background: Rectangle {
                 color: parent.hovered ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : "transparent"
                 radius: Theme.cornerRadius / 2
             }
-
+            
             onTriggered: {
                 if (bluetoothContextMenu.currentDevice) {
                     if (bluetoothContextMenu.currentDevice.connected) {
@@ -572,12 +471,12 @@ Rectangle {
                 }
             }
         }
-
+        
         MenuItem {
             text: I18n.tr("Audio Codec")
             height: bluetoothContextMenu.currentDevice && BluetoothService.isAudioDevice(bluetoothContextMenu.currentDevice) && bluetoothContextMenu.currentDevice.connected ? 32 : 0
             visible: bluetoothContextMenu.currentDevice && BluetoothService.isAudioDevice(bluetoothContextMenu.currentDevice) && bluetoothContextMenu.currentDevice.connected
-
+            
             contentItem: StyledText {
                 text: parent.text
                 font.pixelSize: Theme.fontSizeSmall
@@ -585,23 +484,23 @@ Rectangle {
                 leftPadding: Theme.spacingS
                 verticalAlignment: Text.AlignVCenter
             }
-
+            
             background: Rectangle {
                 color: parent.hovered ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : "transparent"
                 radius: Theme.cornerRadius / 2
             }
-
+            
             onTriggered: {
                 if (bluetoothContextMenu.currentDevice) {
                     showCodecSelector(bluetoothContextMenu.currentDevice)
                 }
             }
         }
-
+        
         MenuItem {
             text: I18n.tr("Forget Device")
             height: 32
-
+            
             contentItem: StyledText {
                 text: parent.text
                 font.pixelSize: Theme.fontSizeSmall
@@ -609,37 +508,18 @@ Rectangle {
                 leftPadding: Theme.spacingS
                 verticalAlignment: Text.AlignVCenter
             }
-
+            
             background: Rectangle {
                 color: parent.hovered ? Qt.rgba(Theme.error.r, Theme.error.g, Theme.error.b, 0.08) : "transparent"
                 radius: Theme.cornerRadius / 2
             }
-
+            
             onTriggered: {
                 if (bluetoothContextMenu.currentDevice) {
-                    if (BluetoothService.enhancedPairingAvailable) {
-                        const devicePath = BluetoothService.getDevicePath(bluetoothContextMenu.currentDevice)
-                        DMSService.bluetoothRemove(devicePath, response => {
-                            if (response.error) {
-                                ToastService.showError(I18n.tr("Failed to remove device"), response.error)
-                            }
-                        })
-                    } else {
-                        bluetoothContextMenu.currentDevice.forget()
-                    }
+                    bluetoothContextMenu.currentDevice.forget()
                 }
             }
         }
     }
-
-    Connections {
-        target: DMSService
-
-        function onBluetoothPairingRequest(data) {
-            const modal = PopoutService.bluetoothPairingModal
-            if (modal && modal.token !== data.token) {
-                modal.show(data)
-            }
-        }
-    }
+    
 }

Modules/ControlCenter/Details/BrightnessDetail.qml

@@ -0,0 +1,174 @@
+import QtQuick
+import QtQuick.Controls
+import Quickshell
+import qs.Common
+import qs.Services
+import qs.Widgets
+
+Rectangle {
+    id: root
+
+    property string currentDeviceName: ""
+    property string instanceId: ""
+
+    signal deviceNameChanged(string newDeviceName)
+
+    implicitHeight: brightnessContent.height + Theme.spacingM
+    radius: Theme.cornerRadius
+    color: Theme.surfaceContainerHigh
+    border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
+    border.width: 0
+
+    DankFlickable {
+        id: brightnessContent
+        anchors.top: parent.top
+        anchors.left: parent.left
+        anchors.right: parent.right
+        anchors.bottom: parent.bottom
+        anchors.margins: Theme.spacingM
+        anchors.topMargin: Theme.spacingM
+        contentHeight: brightnessColumn.height
+        clip: true
+
+        Column {
+            id: brightnessColumn
+            width: parent.width
+            spacing: Theme.spacingS
+
+            Item {
+                width: parent.width
+                height: 100
+                visible: !DisplayService.brightnessAvailable || !DisplayService.devices || DisplayService.devices.length === 0
+
+                Column {
+                    anchors.centerIn: parent
+                    spacing: Theme.spacingM
+
+                    DankIcon {
+                        anchors.horizontalCenter: parent.horizontalCenter
+                        name: DisplayService.brightnessAvailable ? "brightness_6" : "error"
+                        size: 32
+                        color: DisplayService.brightnessAvailable ? Theme.primary : Theme.error
+                    }
+
+                    StyledText {
+                        anchors.horizontalCenter: parent.horizontalCenter
+                        text: DisplayService.brightnessAvailable ? "No brightness devices available" : "Brightness control not available"
+                        font.pixelSize: Theme.fontSizeMedium
+                        color: Theme.surfaceText
+                        horizontalAlignment: Text.AlignHCenter
+                    }
+                }
+            }
+
+            Repeater {
+                model: DisplayService.devices || []
+                delegate: Rectangle {
+                    required property var modelData
+                    required property int index
+
+                    width: parent.width
+                    height: 80
+                    radius: Theme.cornerRadius
+                    color: Theme.surfaceContainerHighest
+                    border.color: modelData.name === currentDeviceName ? Theme.primary : Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
+                    border.width: modelData.name === currentDeviceName ? 2 : 0
+
+                    Row {
+                        anchors.left: parent.left
+                        anchors.verticalCenter: parent.verticalCenter
+                        anchors.leftMargin: Theme.spacingM
+                        spacing: Theme.spacingM
+
+                        Column {
+                            anchors.verticalCenter: parent.verticalCenter
+                            spacing: 2
+
+                            DankIcon {
+                                name: {
+                                    const deviceClass = modelData.class || ""
+                                    const deviceName = modelData.name || ""
+
+                                    if (deviceClass === "backlight" || deviceClass === "ddc") {
+                                        const brightness = modelData.percentage || 50
+                                        if (brightness <= 33) return "brightness_low"
+                                        if (brightness <= 66) return "brightness_medium"
+                                        return "brightness_high"
+                                    } else if (deviceName.includes("kbd")) {
+                                        return "keyboard"
+                                    } else {
+                                        return "lightbulb"
+                                    }
+                                }
+                                size: Theme.iconSize
+                                color: modelData.name === currentDeviceName ? Theme.primary : Theme.surfaceText
+                                anchors.horizontalCenter: parent.horizontalCenter
+                            }
+
+                            StyledText {
+                                text: (modelData.percentage || 50) + "%"
+                                font.pixelSize: Theme.fontSizeSmall
+                                color: Theme.surfaceText
+                                anchors.horizontalCenter: parent.horizontalCenter
+                            }
+                        }
+
+                        Column {
+                            anchors.verticalCenter: parent.verticalCenter
+                            width: parent.parent.width - parent.parent.anchors.leftMargin - parent.spacing - 50 - Theme.spacingM
+
+                            StyledText {
+                                text: {
+                                    const name = modelData.name || ""
+                                    const deviceClass = modelData.class || ""
+                                    if (deviceClass === "backlight") {
+                                        return name.replace("_", " ").replace(/\b\w/g, c => c.toUpperCase())
+                                    }
+                                    return name
+                                }
+                                font.pixelSize: Theme.fontSizeMedium
+                                color: Theme.surfaceText
+                                font.weight: modelData.name === currentDeviceName ? Font.Medium : Font.Normal
+                                elide: Text.ElideRight
+                                width: parent.width
+                            }
+
+                            StyledText {
+                                text: modelData.name
+                                font.pixelSize: Theme.fontSizeSmall
+                                color: Theme.surfaceVariantText
+                                elide: Text.ElideRight
+                                width: parent.width
+                            }
+
+                            StyledText {
+                                text: {
+                                    const deviceClass = modelData.class || ""
+                                    if (deviceClass === "backlight") return "Backlight device"
+                                    if (deviceClass === "ddc") return "DDC/CI monitor"
+                                    if (deviceClass === "leds") return "LED device"
+                                    return deviceClass
+                                }
+                                font.pixelSize: Theme.fontSizeSmall
+                                color: Theme.surfaceVariantText
+                                elide: Text.ElideRight
+                                width: parent.width
+                            }
+                        }
+                    }
+
+                    MouseArea {
+                        anchors.fill: parent
+                        hoverEnabled: true
+                        cursorShape: Qt.PointingHandCursor
+                        onClicked: {
+                            currentDeviceName = modelData.name
+                            deviceNameChanged(modelData.name)
+                        }
+                    }
+
+                }
+            }
+        }
+    }
+}

Modules/ControlCenter/Details/DiskUsageDetail.qml

@@ -15,7 +15,7 @@ Rectangle {
 
     implicitHeight: diskContent.height + Theme.spacingM
     radius: Theme.cornerRadius
-    color: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
+    color: Theme.surfaceContainerHigh
     border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
     border.width: 0
 
@@ -78,7 +78,7 @@ Rectangle {
                     width: parent.width
                     height: 80
                     radius: Theme.cornerRadius
-                    color: Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
+                    color: Theme.surfaceContainerHighest
                     border.color: modelData.mount === currentMountPath ? Theme.primary : Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
                     border.width: modelData.mount === currentMountPath ? 2 : 0
 

Modules/ControlCenter/Details/NetworkDetail.qml

@@ -7,55 +7,46 @@ import qs.Widgets
 import qs.Modals
 
 Rectangle {
-    id: root
-
     implicitHeight: {
-        if (height > 0) {
-            return height;
-        }
         if (NetworkService.wifiToggling) {
-            return headerRow.height + wifiToggleContent.height + Theme.spacingM;
+            return headerRow.height + wifiToggleContent.height + Theme.spacingM
         }
         if (NetworkService.wifiEnabled) {
-            return headerRow.height + wifiContent.height + Theme.spacingM;
+            return headerRow.height + wifiContent.height + Theme.spacingM
         }
-        return headerRow.height + wifiOffContent.height + Theme.spacingM;
+        return headerRow.height + wifiOffContent.height + Theme.spacingM
     }
     radius: Theme.cornerRadius
-    color: Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
+    color: Theme.surfaceContainerHigh
     border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.08)
     border.width: 0
 
     Component.onCompleted: {
-        NetworkService.addRef();
+        NetworkService.addRef()
     }
 
     Component.onDestruction: {
-        NetworkService.removeRef();
+        NetworkService.removeRef()
     }
-
+    
     property int currentPreferenceIndex: {
         if (DMSService.apiVersion < 5) {
-            return 1;
+            return 1
         }
 
-        if (NetworkService.backend !== "networkmanager" || DMSService.apiVersion <= 10) {
-            return 1;
-        }
-
-        const pref = NetworkService.userPreference;
-        const status = NetworkService.networkStatus;
-        let index = 1;
+        const pref = NetworkService.userPreference
+        const status = NetworkService.networkStatus
+        let index = 1
 
         if (pref === "ethernet") {
-            index = 0;
+            index = 0
         } else if (pref === "wifi") {
-            index = 1;
+            index = 1
         } else {
-            index = status === "ethernet" ? 0 : 1;
+            index = status === "ethernet" ? 0 : 1
         }
 
-        return index;
+        return index
     }
 
     Row {
@@ -78,56 +69,26 @@ Rectangle {
         }
 
         Item {
-            height: 1
-            width: parent.width - headerText.width - rightControls.width
+            width: Math.max(0, parent.width - headerText.implicitWidth - preferenceControls.width - Theme.spacingM)
+            height: parent.height
         }
 
-        Row {
-            id: rightControls
+        DankButtonGroup {
+            id: preferenceControls
             anchors.verticalCenter: parent.verticalCenter
-            spacing: Theme.spacingS
+            visible: DMSService.apiVersion >= 5
 
-            DankDropdown {
-                id: wifiDeviceDropdown
-                anchors.verticalCenter: parent.verticalCenter
-                visible: currentPreferenceIndex === 1 && (NetworkService.wifiDevices?.length ?? 0) > 1
-                compactMode: true
-                dropdownWidth: 120
-                popupWidth: 160
-                alignPopupRight: true
-
-                options: {
-                    const devices = NetworkService.wifiDevices;
-                    if (!devices || devices.length === 0)
-                        return [I18n.tr("Auto")];
-                    return [I18n.tr("Auto")].concat(devices.map(d => d.name));
-                }
-
-                currentValue: NetworkService.wifiDeviceOverride || I18n.tr("Auto")
-
-                onValueChanged: value => {
-                    const deviceName = value === I18n.tr("Auto") ? "" : value;
-                    NetworkService.setWifiDeviceOverride(deviceName);
-                }
-            }
-
-            DankButtonGroup {
-                id: preferenceControls
-                anchors.verticalCenter: parent.verticalCenter
-                visible: NetworkService.backend === "networkmanager" && DMSService.apiVersion > 10
-
-                model: ["Ethernet", "WiFi"]
-                currentIndex: currentPreferenceIndex
-                selectionMode: "single"
-                onSelectionChanged: (index, selected) => {
-                    if (!selected)
-                        return;
-                    NetworkService.setNetworkPreference(index === 0 ? "ethernet" : "wifi");
-                }
+            model: ["Ethernet", "WiFi"]
+            currentIndex: currentPreferenceIndex
+            selectionMode: "single"
+            onSelectionChanged: (index, selected) => {
+                if (!selected) return
+                console.log("NetworkDetail: Setting preference to", index === 0 ? "ethernet" : "wifi")
+                NetworkService.setNetworkPreference(index === 0 ? "ethernet" : "wifi")
             }
         }
     }
-
+    
     Item {
         id: wifiToggleContent
         anchors.top: headerRow.bottom
@@ -166,7 +127,7 @@ Rectangle {
             }
         }
     }
-
+    
     Item {
         id: wifiOffContent
         anchors.top: headerRow.bottom
@@ -176,19 +137,19 @@ Rectangle {
         anchors.topMargin: Theme.spacingM
         visible: currentPreferenceIndex === 1 && !NetworkService.wifiEnabled && !NetworkService.wifiToggling
         height: visible ? 120 : 0
-
+        
         Column {
             anchors.centerIn: parent
             spacing: Theme.spacingL
             width: parent.width
-
+            
             DankIcon {
                 anchors.horizontalCenter: parent.horizontalCenter
                 name: "wifi_off"
                 size: 48
                 color: Qt.rgba(Theme.surfaceText.r, Theme.surfaceText.g, Theme.surfaceText.b, 0.5)
             }
-
+            
             StyledText {
                 anchors.horizontalCenter: parent.horizontalCenter
                 text: I18n.tr("WiFi is off")
@@ -197,7 +158,7 @@ Rectangle {
                 font.weight: Font.Medium
                 horizontalAlignment: Text.AlignHCenter
             }
-
+            
             Rectangle {
                 anchors.horizontalCenter: parent.horizontalCenter
                 width: 120
@@ -206,7 +167,7 @@ Rectangle {
                 color: enableWifiButton.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08)
                 border.width: 0
                 border.color: Theme.primary
-
+                
                 StyledText {
                     anchors.centerIn: parent
                     text: I18n.tr("Enable WiFi")
@@ -214,7 +175,7 @@ Rectangle {
                     font.pixelSize: Theme.fontSizeMedium
                     font.weight: Font.Medium
                 }
-
+                
                 MouseArea {
                     id: enableWifiButton
                     anchors.fill: parent
@@ -222,6 +183,7 @@ Rectangle {
                     cursorShape: Qt.PointingHandCursor
                     onClicked: NetworkService.toggleWifiRadio()
                 }
+
             }
         }
     }
@@ -234,7 +196,7 @@ Rectangle {
         anchors.bottom: parent.bottom
         anchors.margins: Theme.spacingM
         anchors.topMargin: Theme.spacingM
-        visible: currentPreferenceIndex === 0 && NetworkService.backend === "networkmanager" && DMSService.apiVersion > 10
+        visible: currentPreferenceIndex === 0 && DMSService.apiVersion >= 5
         contentHeight: wiredColumn.height
         clip: true
 
@@ -244,22 +206,19 @@ Rectangle {
             spacing: Theme.spacingS
 
             Repeater {
-                model: ScriptModel {
-                    values: {
-                        const currentUuid = NetworkService.ethernetConnectionUuid;
-                        const networks = NetworkService.wiredConnections;
-                        let sorted = [...networks];
-                        sorted.sort((a, b) => {
-                            if (a.isActive && !b.isActive)
-                                return -1;
-                            if (!a.isActive && b.isActive)
-                                return 1;
-                            return a.id.localeCompare(b.id);
-                        });
-                        return sorted;
-                    }
-                }
+                model: sortedNetworks
 
+                property var sortedNetworks: {
+                    const currentUuid = NetworkService.ethernetConnectionUuid
+                    const networks = NetworkService.wiredConnections
+                    let sorted = [...networks]
+                    sorted.sort((a, b) => {
+                        if (a.isActive && !b.isActive) return -1
+                        if (!a.isActive && b.isActive) return 1
+                        return a.id.localeCompare(b.id)
+                    })
+                    return sorted
+                }
                 delegate: Rectangle {
                     required property var modelData
                     required property int index
@@ -267,7 +226,7 @@ Rectangle {
                     width: parent.width
                     height: 50
                     radius: Theme.cornerRadius
-                    color: wiredNetworkMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
+                    color: wiredNetworkMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : Theme.surfaceContainerHighest
                     border.color: Theme.primary
                     border.width: 0
 
@@ -298,7 +257,7 @@ Rectangle {
                             }
                         }
                     }
-
+                    
                     DankActionButton {
                         id: wiredOptionsButton
                         anchors.right: parent.right
@@ -308,12 +267,12 @@ Rectangle {
                         buttonSize: 28
                         onClicked: {
                             if (wiredNetworkContextMenu.visible) {
-                                wiredNetworkContextMenu.close();
+                                wiredNetworkContextMenu.close()
                             } else {
-                                wiredNetworkContextMenu.currentID = modelData.id;
-                                wiredNetworkContextMenu.currentUUID = modelData.uuid;
-                                wiredNetworkContextMenu.currentConnected = modelData.isActive;
-                                wiredNetworkContextMenu.popup(wiredOptionsButton, -wiredNetworkContextMenu.width + wiredOptionsButton.width, wiredOptionsButton.height + Theme.spacingXS);
+                                wiredNetworkContextMenu.currentID = modelData.id
+                                wiredNetworkContextMenu.currentUUID = modelData.uuid                               
+                                wiredNetworkContextMenu.currentConnected = modelData.isActive
+                                wiredNetworkContextMenu.popup(wiredOptionsButton, -wiredNetworkContextMenu.width + wiredOptionsButton.width, wiredOptionsButton.height + Theme.spacingXS)
                             }
                         }
                     }
@@ -324,18 +283,19 @@ Rectangle {
                         anchors.rightMargin: wiredOptionsButton.width + Theme.spacingS
                         hoverEnabled: true
                         cursorShape: Qt.PointingHandCursor
-                        onClicked: function (event) {
+                        onClicked: function(event) {
                             if (modelData.uuid !== NetworkService.ethernetConnectionUuid) {
-                                NetworkService.connectToSpecificWiredConfig(modelData.uuid);
+                                NetworkService.connectToSpecificWiredConfig(modelData.uuid)
                             }
-                            event.accepted = true;
+                            event.accepted = true
                         }
                     }
+
                 }
             }
         }
     }
-
+    
     Menu {
         id: wiredNetworkContextMenu
         width: 150
@@ -346,16 +306,15 @@ Rectangle {
         property bool currentConnected: false
 
         background: Rectangle {
-            color: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
+            color: Theme.popupBackground()
             radius: Theme.cornerRadius
             border.width: 0
             border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
         }
 
         MenuItem {
-            text: I18n.tr("Activate")
+            text: "Activate"
             height: !wiredNetworkContextMenu.currentConnected ? 32 : 0
-            visible: !wiredNetworkContextMenu.currentConnected
 
             contentItem: StyledText {
                 text: parent.text
@@ -371,39 +330,15 @@ Rectangle {
             }
 
             onTriggered: {
-                if (!wiredNetworkContextMenu.currentConnected) {
-                    NetworkService.connectToSpecificWiredConfig(wiredNetworkContextMenu.currentUUID);
+                if (!networkContextMenu.currentConnected) {
+                    NetworkService.connectToSpecificWiredConfig(wiredNetworkContextMenu.currentUUID)
                 }
             }
         }
 
-        MenuItem {
-            text: I18n.tr("Disconnect")
-            height: wiredNetworkContextMenu.currentConnected ? 32 : 0
-            visible: wiredNetworkContextMenu.currentConnected
-
-            contentItem: StyledText {
-                text: parent.text
-                font.pixelSize: Theme.fontSizeSmall
-                color: Theme.error
-                leftPadding: Theme.spacingS
-                verticalAlignment: Text.AlignVCenter
-            }
-
-            background: Rectangle {
-                color: parent.hovered ? Qt.rgba(Theme.error.r, Theme.error.g, Theme.error.b, 0.08) : "transparent"
-                radius: Theme.cornerRadius / 2
-            }
-
-            onTriggered: {
-                NetworkService.toggleNetworkConnection("ethernet");
-            }
-        }
-
         MenuItem {
             text: I18n.tr("Network Info")
             height: wiredNetworkContextMenu.currentConnected ? 32 : 0
-            visible: wiredNetworkContextMenu.currentConnected
 
             contentItem: StyledText {
                 text: parent.text
@@ -419,8 +354,8 @@ Rectangle {
             }
 
             onTriggered: {
-                let networkData = NetworkService.getWiredNetworkInfo(wiredNetworkContextMenu.currentUUID);
-                networkWiredInfoModal.showNetworkInfo(wiredNetworkContextMenu.currentID, networkData);
+                let networkData = NetworkService.getWiredNetworkInfo(wiredNetworkContextMenu.currentUUID)
+                networkWiredInfoModal.showNetworkInfo(wiredNetworkContextMenu.currentID, networkData)
             }
         }
     }
@@ -437,42 +372,11 @@ Rectangle {
         contentHeight: wifiColumn.height
         clip: true
 
-        property var frozenNetworks: []
-        property bool menuOpen: false
-        property var sortedNetworks: {
-            const ssid = NetworkService.currentWifiSSID;
-            const networks = NetworkService.wifiNetworks;
-            const pins = SettingsData.wifiNetworkPins || {};
-            const pinnedSSID = pins["preferredWifi"];
-
-            let sorted = [...networks];
-            sorted.sort((a, b) => {
-                if (a.ssid === pinnedSSID && b.ssid !== pinnedSSID)
-                    return -1;
-                if (b.ssid === pinnedSSID && a.ssid !== pinnedSSID)
-                    return 1;
-                if (a.ssid === ssid)
-                    return -1;
-                if (b.ssid === ssid)
-                    return 1;
-                return b.signal - a.signal;
-            });
-            return sorted;
-        }
-        onSortedNetworksChanged: {
-            if (!menuOpen)
-                frozenNetworks = sortedNetworks;
-        }
-        onMenuOpenChanged: {
-            if (menuOpen)
-                frozenNetworks = sortedNetworks;
-        }
-
         Column {
             id: wifiColumn
             width: parent.width
             spacing: Theme.spacingS
-
+            
             Item {
                 width: parent.width
                 height: 200
@@ -493,47 +397,54 @@ Rectangle {
                     }
                 }
             }
-
+            
             Repeater {
-                model: ScriptModel {
-                    values: wifiContent.menuOpen ? wifiContent.frozenNetworks : wifiContent.sortedNetworks
-                }
+                model: sortedNetworks
 
+                property var sortedNetworks: {
+                    const ssid = NetworkService.currentWifiSSID
+                    const networks = NetworkService.wifiNetworks
+                    let sorted = [...networks]
+                    sorted.sort((a, b) => {
+                        if (a.ssid === ssid) return -1
+                        if (b.ssid === ssid) return 1
+                        return b.signal - a.signal
+                    })
+                    return sorted
+                }
                 delegate: Rectangle {
                     required property var modelData
                     required property int index
-
+                    
                     width: parent.width
                     height: 50
                     radius: Theme.cornerRadius
-                    color: networkMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : Theme.withAlpha(Theme.surfaceContainerHighest, Theme.popupTransparency)
+                    color: networkMouseArea.containsMouse ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : Theme.surfaceContainerHighest
                     border.color: modelData.ssid === NetworkService.currentWifiSSID ? Theme.primary : Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
                     border.width: 0
-
+                    
                     Row {
                         anchors.left: parent.left
                         anchors.verticalCenter: parent.verticalCenter
                         anchors.leftMargin: Theme.spacingM
                         spacing: Theme.spacingS
-
+                        
                         DankIcon {
                             name: {
-                                let strength = modelData.signal || 0;
-                                if (strength >= 50)
-                                    return "wifi";
-                                if (strength >= 25)
-                                    return "wifi_2_bar";
-                                return "wifi_1_bar";
+                                let strength = modelData.signal || 0
+                                if (strength >= 50) return "wifi"
+                                if (strength >= 25) return "wifi_2_bar"
+                                return "wifi_1_bar"
                             }
                             size: Theme.iconSize - 4
                             color: modelData.ssid === NetworkService.currentWifiSSID ? Theme.primary : Theme.surfaceText
                             anchors.verticalCenter: parent.verticalCenter
                         }
-
+                        
                         Column {
                             anchors.verticalCenter: parent.verticalCenter
                             width: 200
-
+                            
                             StyledText {
                                 text: modelData.ssid || "Unknown Network"
                                 font.pixelSize: Theme.fontSizeMedium
@@ -551,14 +462,14 @@ Rectangle {
                                     font.pixelSize: Theme.fontSizeSmall
                                     color: Theme.surfaceVariantText
                                 }
-
+                                
                                 StyledText {
                                     text: modelData.saved ? "Saved" : ""
                                     font.pixelSize: Theme.fontSizeSmall
                                     color: Theme.primary
                                     visible: text.length > 0
                                 }
-
+                                
                                 StyledText {
                                     text: (modelData.saved ? "• " : "") + modelData.signal + "%"
                                     font.pixelSize: Theme.fontSizeSmall
@@ -567,7 +478,7 @@ Rectangle {
                             }
                         }
                     }
-
+                    
                     DankActionButton {
                         id: optionsButton
                         anchors.right: parent.right
@@ -577,132 +488,63 @@ Rectangle {
                         buttonSize: 28
                         onClicked: {
                             if (networkContextMenu.visible) {
-                                networkContextMenu.close();
+                                networkContextMenu.close()
                             } else {
-                                wifiContent.menuOpen = true;
-                                networkContextMenu.currentSSID = modelData.ssid;
-                                networkContextMenu.currentSecured = modelData.secured;
-                                networkContextMenu.currentConnected = modelData.ssid === NetworkService.currentWifiSSID;
-                                networkContextMenu.currentSaved = modelData.saved;
-                                networkContextMenu.currentSignal = modelData.signal;
-                                networkContextMenu.currentAutoconnect = modelData.autoconnect || false;
-                                networkContextMenu.popup(optionsButton, -networkContextMenu.width + optionsButton.width, optionsButton.height + Theme.spacingXS);
+                                networkContextMenu.currentSSID = modelData.ssid
+                                networkContextMenu.currentSecured = modelData.secured
+                                networkContextMenu.currentConnected = modelData.ssid === NetworkService.currentWifiSSID
+                                networkContextMenu.currentSaved = modelData.saved
+                                networkContextMenu.currentSignal = modelData.signal
+                                networkContextMenu.popup(optionsButton, -networkContextMenu.width + optionsButton.width, optionsButton.height + Theme.spacingXS)
                             }
                         }
                     }
-
-                    Rectangle {
-                        anchors.right: parent.right
-                        anchors.rightMargin: optionsButton.width + Theme.spacingM + Theme.spacingS
-                        anchors.verticalCenter: parent.verticalCenter
-                        width: pinWifiRow.width + Theme.spacingS * 2
-                        height: 28
-                        radius: height / 2
-                        color: {
-                            const isThisNetworkPinned = (SettingsData.wifiNetworkPins || {})["preferredWifi"] === modelData.ssid;
-                            return isThisNetworkPinned ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12) : Theme.withAlpha(Theme.surfaceText, 0.05);
-                        }
-
-                        Row {
-                            id: pinWifiRow
-                            anchors.centerIn: parent
-                            spacing: 4
-
-                            DankIcon {
-                                name: "push_pin"
-                                size: 16
-                                color: {
-                                    const isThisNetworkPinned = (SettingsData.wifiNetworkPins || {})["preferredWifi"] === modelData.ssid;
-                                    return isThisNetworkPinned ? Theme.primary : Theme.surfaceText;
-                                }
-                                anchors.verticalCenter: parent.verticalCenter
-                            }
-
-                            StyledText {
-                                text: {
-                                    const isThisNetworkPinned = (SettingsData.wifiNetworkPins || {})["preferredWifi"] === modelData.ssid;
-                                    return isThisNetworkPinned ? "Pinned" : "Pin";
-                                }
-                                font.pixelSize: Theme.fontSizeSmall
-                                color: {
-                                    const isThisNetworkPinned = (SettingsData.wifiNetworkPins || {})["preferredWifi"] === modelData.ssid;
-                                    return isThisNetworkPinned ? Theme.primary : Theme.surfaceText;
-                                }
-                                anchors.verticalCenter: parent.verticalCenter
-                            }
-                        }
-
-                        MouseArea {
-                            anchors.fill: parent
-                            cursorShape: Qt.PointingHandCursor
-                            onClicked: {
-                                const pins = JSON.parse(JSON.stringify(SettingsData.wifiNetworkPins || {}));
-                                const isCurrentlyPinned = pins["preferredWifi"] === modelData.ssid;
-
-                                if (isCurrentlyPinned) {
-                                    delete pins["preferredWifi"];
-                                } else {
-                                    pins["preferredWifi"] = modelData.ssid;
-                                }
-
-                                SettingsData.set("wifiNetworkPins", pins);
-                            }
-                        }
-                    }
-
+                    
                     MouseArea {
                         id: networkMouseArea
                         anchors.fill: parent
-                        anchors.rightMargin: optionsButton.width + Theme.spacingM + Theme.spacingS + pinWifiRow.width + Theme.spacingS * 4
+                        anchors.rightMargin: optionsButton.width + Theme.spacingS
                         hoverEnabled: true
                         cursorShape: Qt.PointingHandCursor
-                        onClicked: function (event) {
+                        onClicked: function(event) {
                             if (modelData.ssid !== NetworkService.currentWifiSSID) {
                                 if (modelData.secured && !modelData.saved) {
-                                    if (DMSService.apiVersion >= 7) {
-                                        NetworkService.connectToWifi(modelData.ssid);
-                                    } else if (PopoutService.wifiPasswordModal) {
-                                        PopoutService.wifiPasswordModal.show(modelData.ssid);
-                                    }
+                                    wifiPasswordModal.show(modelData.ssid)
                                 } else {
-                                    NetworkService.connectToWifi(modelData.ssid);
+                                    NetworkService.connectToWifi(modelData.ssid)
                                 }
                             }
-                            event.accepted = true;
+                            event.accepted = true
                         }
                     }
+                    
                 }
             }
         }
     }
-
+    
     Menu {
         id: networkContextMenu
         width: 150
         closePolicy: Popup.CloseOnEscape | Popup.CloseOnPressOutsideParent
-
+        
         property string currentSSID: ""
         property bool currentSecured: false
         property bool currentConnected: false
         property bool currentSaved: false
         property int currentSignal: 0
-        property bool currentAutoconnect: false
-
-        onClosed: {
-            wifiContent.menuOpen = false;
-        }
-
+        
         background: Rectangle {
-            color: Theme.withAlpha(Theme.surfaceContainer, Theme.popupTransparency)
+            color: Theme.popupBackground()
             radius: Theme.cornerRadius
             border.width: 0
             border.color: Qt.rgba(Theme.outline.r, Theme.outline.g, Theme.outline.b, 0.12)
         }
-
+        
         MenuItem {
             text: networkContextMenu.currentConnected ? "Disconnect" : "Connect"
             height: 32
-
+            
             contentItem: StyledText {
                 text: parent.text
                 font.pixelSize: Theme.fontSizeSmall
@@ -710,33 +552,29 @@ Rectangle {
                 leftPadding: Theme.spacingS
                 verticalAlignment: Text.AlignVCenter
             }
-
+            
             background: Rectangle {
                 color: parent.hovered ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : "transparent"
                 radius: Theme.cornerRadius / 2
             }
-
+            
             onTriggered: {
                 if (networkContextMenu.currentConnected) {
-                    NetworkService.disconnectWifi();
+                    NetworkService.disconnectWifi()
                 } else {
                     if (networkContextMenu.currentSecured && !networkContextMenu.currentSaved) {
-                        if (DMSService.apiVersion >= 7) {
-                            NetworkService.connectToWifi(networkContextMenu.currentSSID);
-                        } else if (PopoutService.wifiPasswordModal) {
-                            PopoutService.wifiPasswordModal.show(networkContextMenu.currentSSID);
-                        }
+                        wifiPasswordModal.show(networkContextMenu.currentSSID)
                     } else {
-                        NetworkService.connectToWifi(networkContextMenu.currentSSID);
+                        NetworkService.connectToWifi(networkContextMenu.currentSSID)
                     }
                 }
             }
         }
-
+        
         MenuItem {
             text: I18n.tr("Network Info")
             height: 32
-
+            
             contentItem: StyledText {
                 text: parent.text
                 font.pixelSize: Theme.fontSizeSmall
@@ -744,46 +582,23 @@ Rectangle {
                 leftPadding: Theme.spacingS
                 verticalAlignment: Text.AlignVCenter
             }
-
+            
             background: Rectangle {
                 color: parent.hovered ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : "transparent"
                 radius: Theme.cornerRadius / 2
             }
-
+            
             onTriggered: {
-                let networkData = NetworkService.getNetworkInfo(networkContextMenu.currentSSID);
-                networkInfoModal.showNetworkInfo(networkContextMenu.currentSSID, networkData);
+                let networkData = NetworkService.getNetworkInfo(networkContextMenu.currentSSID)
+                networkInfoModal.showNetworkInfo(networkContextMenu.currentSSID, networkData)
             }
         }
-
-        MenuItem {
-            text: networkContextMenu.currentAutoconnect ? I18n.tr("Disable Autoconnect") : I18n.tr("Enable Autoconnect")
-            height: (networkContextMenu.currentSaved || networkContextMenu.currentConnected) && DMSService.apiVersion > 13 ? 32 : 0
-            visible: (networkContextMenu.currentSaved || networkContextMenu.currentConnected) && DMSService.apiVersion > 13
-
-            contentItem: StyledText {
-                text: parent.text
-                font.pixelSize: Theme.fontSizeSmall
-                color: Theme.surfaceText
-                leftPadding: Theme.spacingS
-                verticalAlignment: Text.AlignVCenter
-            }
-
-            background: Rectangle {
-                color: parent.hovered ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.08) : "transparent"
-                radius: Theme.cornerRadius / 2
-            }
-
-            onTriggered: {
-                NetworkService.setWifiAutoconnect(networkContextMenu.currentSSID, !networkContextMenu.currentAutoconnect);
-            }
-        }
-
+        
         MenuItem {
             text: I18n.tr("Forget Network")
             height: networkContextMenu.currentSaved || networkContextMenu.currentConnected ? 32 : 0
             visible: networkContextMenu.currentSaved || networkContextMenu.currentConnected
-
+            
             contentItem: StyledText {
                 text: parent.text
                 font.pixelSize: Theme.fontSizeSmall
@@ -791,23 +606,27 @@ Rectangle {
                 leftPadding: Theme.spacingS
                 verticalAlignment: Text.AlignVCenter
             }
-
+            
             background: Rectangle {
                 color: parent.hovered ? Qt.rgba(Theme.error.r, Theme.error.g, Theme.error.b, 0.08) : "transparent"
                 radius: Theme.cornerRadius / 2
             }
-
+            
             onTriggered: {
-                NetworkService.forgetWifiNetwork(networkContextMenu.currentSSID);
+                NetworkService.forgetWifiNetwork(networkContextMenu.currentSSID)
             }
         }
     }
+    
+    WifiPasswordModal {
+        id: wifiPasswordModal
+    }
 
     NetworkInfoModal {
         id: networkInfoModal
     }
-
+    
     NetworkWiredInfoModal {
         id: networkWiredInfoModal
     }
-}
+}

Modules/ControlCenter/Models/WidgetModel.qml

@@ -8,7 +8,6 @@ QtObject {
     id: root
 
     property var vpnBuiltinInstance: null
-    property var cupsBuiltinInstance: null
 
     property var vpnLoader: Loader {
         active: false
@@ -17,53 +16,23 @@ QtObject {
         }
 
         onItemChanged: {
-            root.vpnBuiltinInstance = item;
+            root.vpnBuiltinInstance = item
         }
 
         Connections {
             target: SettingsData
             function onControlCenterWidgetsChanged() {
-                const widgets = SettingsData.controlCenterWidgets || [];
-                const hasVpnWidget = widgets.some(w => w.id === "builtin_vpn");
+                const widgets = SettingsData.controlCenterWidgets || []
+                const hasVpnWidget = widgets.some(w => w.id === "builtin_vpn")
                 if (!hasVpnWidget && vpnLoader.active) {
-                    console.log("VpnWidget: No VPN widget in control center, deactivating loader");
-                    vpnLoader.active = false;
+                    console.log("VpnWidget: No VPN widget in control center, deactivating loader")
+                    vpnLoader.active = false
                 }
             }
         }
     }
 
-    property var cupsLoader: Loader {
-        active: false
-        sourceComponent: Component {
-            CupsWidget {}
-        }
-
-        onItemChanged: {
-            root.cupsBuiltinInstance = item;
-        }
-
-        onActiveChanged: {
-            if (!active) {
-                root.cupsBuiltinInstance = null;
-            }
-        }
-
-        Connections {
-            target: SettingsData
-            function onControlCenterWidgetsChanged() {
-                const widgets = SettingsData.controlCenterWidgets || [];
-                const hasCupsWidget = widgets.some(w => w.id === "builtin_cups");
-                if (!hasCupsWidget && cupsLoader.active) {
-                    console.log("CupsWidget: No CUPS widget in control center, deactivating loader");
-                    cupsLoader.active = false;
-                }
-            }
-        }
-    }
-
-    readonly property var coreWidgetDefinitions: [
-        {
+    readonly property var coreWidgetDefinitions: [{
             "id": "nightMode",
             "text": "Night Mode",
             "description": "Blue light filter",
@@ -71,32 +40,28 @@ QtObject {
             "type": "toggle",
             "enabled": DisplayService.automationAvailable,
             "warning": !DisplayService.automationAvailable ? "Requires night mode support" : undefined
-        },
-        {
+        }, {
             "id": "darkMode",
             "text": "Dark Mode",
             "description": "System theme toggle",
             "icon": "contrast",
             "type": "toggle",
             "enabled": true
-        },
-        {
+        }, {
             "id": "doNotDisturb",
             "text": "Do Not Disturb",
             "description": "Block notifications",
             "icon": "do_not_disturb_on",
             "type": "toggle",
             "enabled": true
-        },
-        {
+        }, {
             "id": "idleInhibitor",
             "text": "Keep Awake",
             "description": "Prevent screen timeout",
             "icon": "motion_sensor_active",
             "type": "toggle",
             "enabled": true
-        },
-        {
+        }, {
             "id": "wifi",
             "text": "Network",
             "description": "Wi-Fi and Ethernet connection",
@@ -104,8 +69,7 @@ QtObject {
             "type": "connection",
             "enabled": NetworkService.wifiAvailable,
             "warning": !NetworkService.wifiAvailable ? "Wi-Fi not available" : undefined
-        },
-        {
+        }, {
             "id": "bluetooth",
             "text": "Bluetooth",
             "description": "Device connections",
@@ -113,32 +77,28 @@ QtObject {
             "type": "connection",
             "enabled": BluetoothService.available,
             "warning": !BluetoothService.available ? "Bluetooth not available" : undefined
-        },
-        {
+        }, {
             "id": "audioOutput",
             "text": "Audio Output",
             "description": "Speaker settings",
             "icon": "volume_up",
             "type": "connection",
             "enabled": true
-        },
-        {
+        }, {
             "id": "audioInput",
             "text": "Audio Input",
             "description": "Microphone settings",
             "icon": "mic",
             "type": "connection",
             "enabled": true
-        },
-        {
+        }, {
             "id": "volumeSlider",
             "text": "Volume Slider",
             "description": "Audio volume control",
             "icon": "volume_up",
             "type": "slider",
             "enabled": true
-        },
-        {
+        }, {
             "id": "brightnessSlider",
             "text": "Brightness Slider",
             "description": "Display brightness control",
@@ -147,24 +107,21 @@ QtObject {
             "enabled": DisplayService.brightnessAvailable,
             "warning": !DisplayService.brightnessAvailable ? "Brightness control not available" : undefined,
             "allowMultiple": true
-        },
-        {
+        }, {
             "id": "inputVolumeSlider",
             "text": "Input Volume Slider",
             "description": "Microphone volume control",
             "icon": "mic",
             "type": "slider",
             "enabled": true
-        },
-        {
+        }, {
             "id": "battery",
             "text": "Battery",
             "description": "Battery and power management",
             "icon": "battery_std",
             "type": "action",
             "enabled": true
-        },
-        {
+        }, {
             "id": "diskUsage",
             "text": "Disk Usage",
             "description": "Filesystem usage monitoring",
@@ -173,107 +130,94 @@ QtObject {
             "enabled": DgopService.dgopAvailable,
             "warning": !DgopService.dgopAvailable ? "Requires 'dgop' tool" : undefined,
             "allowMultiple": true
-        },
-        {
+        }, {
             "id": "colorPicker",
             "text": "Color Picker",
             "description": "Choose colors from palette",
             "icon": "palette",
             "type": "action",
             "enabled": true
-        },
-        {
+        }, {
             "id": "builtin_vpn",
             "text": "VPN",
             "description": "VPN connections",
             "icon": "vpn_key",
             "type": "builtin_plugin",
-            "enabled": DMSNetworkService.available,
-            "warning": !DMSNetworkService.available ? "VPN not available" : undefined,
+            "enabled": VpnService.available,
+            "warning": !VpnService.available ? "VPN not available" : undefined,
             "isBuiltinPlugin": true
-        },
-        {
-            "id": "builtin_cups",
-            "text": "Printers",
-            "description": "Print Server Management",
-            "icon": "Print",
-            "type": "builtin_plugin",
-            "enabled": CupsService.available,
-            "warning": !CupsService.available ? "CUPS not available" : undefined,
-            "isBuiltinPlugin": true
-        }
-    ]
+        }]
 
     function getPluginWidgets() {
-        const plugins = [];
-        const loadedPlugins = PluginService.getLoadedPlugins();
+        const plugins = []
+        const loadedPlugins = PluginService.getLoadedPlugins()
 
         for (var i = 0; i < loadedPlugins.length; i++) {
-            const plugin = loadedPlugins[i];
+            const plugin = loadedPlugins[i]
 
             if (plugin.type === "daemon") {
-                continue;
+                continue
             }
 
-            const pluginComponent = PluginService.pluginWidgetComponents[plugin.id];
-            if (!pluginComponent || typeof pluginComponent.createObject !== 'function') {
-                continue;
+            const pluginComponent = PluginService.pluginWidgetComponents[plugin.id]
+            if (!pluginComponent) {
+                continue
             }
 
-            const tempInstance = pluginComponent.createObject(null);
+            const tempInstance = pluginComponent.createObject(null)
             if (!tempInstance) {
-                continue;
+                continue
             }
 
-            const hasCCWidget = tempInstance.ccWidgetIcon && tempInstance.ccWidgetIcon.length > 0;
-            tempInstance.destroy();
+            const hasCCWidget = tempInstance.ccWidgetIcon && tempInstance.ccWidgetIcon.length > 0
+            tempInstance.destroy()
 
             if (!hasCCWidget) {
-                continue;
+                continue
             }
 
             plugins.push({
-                "id": "plugin_" + plugin.id,
-                "pluginId": plugin.id,
-                "text": plugin.name || "Plugin",
-                "description": plugin.description || "",
-                "icon": plugin.icon || "extension",
-                "type": "plugin",
-                "enabled": true,
-                "isPlugin": true
-            });
+                             "id": "plugin_" + plugin.id,
+                             "pluginId": plugin.id,
+                             "text": plugin.name || "Plugin",
+                             "description": plugin.description || "",
+                             "icon": plugin.icon || "extension",
+                             "type": "plugin",
+                             "enabled": true,
+                             "isPlugin": true
+                         })
         }
 
-        return plugins;
+        return plugins
     }
 
     readonly property var baseWidgetDefinitions: coreWidgetDefinitions
 
     function getWidgetForId(widgetId) {
-        return WidgetUtils.getWidgetForId(baseWidgetDefinitions, widgetId);
+        return WidgetUtils.getWidgetForId(baseWidgetDefinitions, widgetId)
     }
 
     function addWidget(widgetId) {
-        WidgetUtils.addWidget(widgetId);
+        WidgetUtils.addWidget(widgetId)
     }
 
     function removeWidget(index) {
-        WidgetUtils.removeWidget(index);
+        WidgetUtils.removeWidget(index)
     }
 
     function toggleWidgetSize(index) {
-        WidgetUtils.toggleWidgetSize(index);
+        WidgetUtils.toggleWidgetSize(index)
     }
 
     function moveWidget(fromIndex, toIndex) {
-        WidgetUtils.moveWidget(fromIndex, toIndex);
+        WidgetUtils.moveWidget(fromIndex, toIndex)
     }
 
     function resetToDefault() {
-        WidgetUtils.resetToDefault();
+        WidgetUtils.resetToDefault()
     }
 
     function clearAll() {
-        WidgetUtils.clearAll();
+        WidgetUtils.clearAll()
     }
 }

Modules/ControlCenter/PowerMenu.qml

@@ -0,0 +1,316 @@
+import QtQuick
+import QtQuick.Controls
+import Quickshell
+import Quickshell.Io
+import Quickshell.Wayland
+import Quickshell.Widgets
+import qs.Common
+import qs.Widgets
+
+PanelWindow {
+    id: root
+
+    readonly property string powerOptionsText: I18n.tr("Power Options")
+    readonly property string logOutText: I18n.tr("Log Out")
+    readonly property string suspendText: I18n.tr("Suspend")
+    readonly property string rebootText: I18n.tr("Reboot")
+    readonly property string powerOffText: I18n.tr("Power Off")
+
+    property bool powerMenuVisible: false
+    signal powerActionRequested(string action, string title, string message)
+
+    visible: powerMenuVisible
+    implicitWidth: 400
+    implicitHeight: 320
+    WlrLayershell.layer: WlrLayershell.Overlay
+    WlrLayershell.exclusiveZone: -1
+    WlrLayershell.keyboardFocus: WlrKeyboardFocus.None
+    color: "transparent"
+
+    anchors {
+        top: true
+        left: true
+        right: true
+        bottom: true
+    }
+
+    MouseArea {
+        anchors.fill: parent
+        onClicked: {
+            powerMenuVisible = false
+        }
+    }
+
+    Rectangle {
+        width: Math.min(320, parent.width - Theme.spacingL * 2)
+        height: 320 // Fixed height to prevent cropping
+        x: Math.max(Theme.spacingL, parent.width - width - Theme.spacingL)
+        y: Theme.barHeight + Theme.spacingXS
+        color: Theme.popupBackground()
+        radius: Theme.cornerRadius
+        border.color: Qt.rgba(Theme.outline.r, Theme.outline.g,
+                              Theme.outline.b, 0.08)
+        border.width: 0
+        opacity: powerMenuVisible ? 1 : 0
+        scale: powerMenuVisible ? 1 : 0.85
+
+        MouseArea {
+
+            anchors.fill: parent
+            onClicked: {
+
+            }
+        }
+
+        Column {
+            anchors.fill: parent
+            anchors.margins: Theme.spacingL
+            spacing: Theme.spacingM
+
+            Row {
+                width: parent.width
+
+                StyledText {
+                    text: root.powerOptionsText
+                    font.pixelSize: Theme.fontSizeLarge
+                    color: Theme.surfaceText
+                    font.weight: Font.Medium
+                    anchors.verticalCenter: parent.verticalCenter
+                }
+
+                Item {
+                    width: parent.width - 150
+                    height: 1
+                }
+
+                DankActionButton {
+                    iconName: "close"
+                    iconSize: Theme.iconSize - 4
+                    iconColor: Theme.surfaceText
+                    onClicked: {
+                        powerMenuVisible = false
+                    }
+                }
+            }
+
+            Column {
+                width: parent.width
+                spacing: Theme.spacingS
+
+                Rectangle {
+                    width: parent.width
+                    height: 50
+                    radius: Theme.cornerRadius
+                    color: logoutArea.containsMouse ? Qt.rgba(Theme.primary.r,
+                                                              Theme.primary.g,
+                                                              Theme.primary.b,
+                                                              0.08) : Qt.rgba(
+                                                          Theme.surfaceVariant.r,
+                                                          Theme.surfaceVariant.g,
+                                                          Theme.surfaceVariant.b,
+                                                          0.08)
+
+                    Row {
+                        anchors.left: parent.left
+                        anchors.leftMargin: Theme.spacingM
+                        anchors.verticalCenter: parent.verticalCenter
+                        spacing: Theme.spacingM
+
+                        DankIcon {
+                            name: "logout"
+                            size: Theme.iconSize
+                            color: Theme.surfaceText
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+
+                        StyledText {
+                            text: root.logOutText
+                            font.pixelSize: Theme.fontSizeMedium
+                            color: Theme.surfaceText
+                            font.weight: Font.Medium
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+                    }
+
+                    MouseArea {
+                        id: logoutArea
+
+                        anchors.fill: parent
+                        hoverEnabled: true
+                        cursorShape: Qt.PointingHandCursor
+                        onClicked: {
+                            powerMenuVisible = false
+                            root.powerActionRequested(
+                                        "logout", "Log Out",
+                                        "Are you sure you want to log out?")
+                        }
+                    }
+                }
+
+                Rectangle {
+                    width: parent.width
+                    height: 50
+                    radius: Theme.cornerRadius
+                    color: suspendArea.containsMouse ? Qt.rgba(Theme.primary.r,
+                                                               Theme.primary.g,
+                                                               Theme.primary.b,
+                                                               0.08) : Qt.rgba(
+                                                           Theme.surfaceVariant.r,
+                                                           Theme.surfaceVariant.g,
+                                                           Theme.surfaceVariant.b,
+                                                           0.08)
+
+                    Row {
+                        anchors.left: parent.left
+                        anchors.leftMargin: Theme.spacingM
+                        anchors.verticalCenter: parent.verticalCenter
+                        spacing: Theme.spacingM
+
+                        DankIcon {
+                            name: "bedtime"
+                            size: Theme.iconSize
+                            color: Theme.surfaceText
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+
+                        StyledText {
+                            text: root.suspendText
+                            font.pixelSize: Theme.fontSizeMedium
+                            color: Theme.surfaceText
+                            font.weight: Font.Medium
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+                    }
+
+                    MouseArea {
+                        id: suspendArea
+
+                        anchors.fill: parent
+                        hoverEnabled: true
+                        cursorShape: Qt.PointingHandCursor
+                        onClicked: {
+                            powerMenuVisible = false
+                            root.powerActionRequested(
+                                        "suspend", "Suspend",
+                                        "Are you sure you want to suspend the system?")
+                        }
+                    }
+                }
+
+                Rectangle {
+                    width: parent.width
+                    height: 50
+                    radius: Theme.cornerRadius
+                    color: rebootArea.containsMouse ? Qt.rgba(Theme.warning.r,
+                                                              Theme.warning.g,
+                                                              Theme.warning.b,
+                                                              0.08) : Qt.rgba(
+                                                          Theme.surfaceVariant.r,
+                                                          Theme.surfaceVariant.g,
+                                                          Theme.surfaceVariant.b,
+                                                          0.08)
+
+                    Row {
+                        anchors.left: parent.left
+                        anchors.leftMargin: Theme.spacingM
+                        anchors.verticalCenter: parent.verticalCenter
+                        spacing: Theme.spacingM
+
+                        DankIcon {
+                            name: "restart_alt"
+                            size: Theme.iconSize
+                            color: rebootArea.containsMouse ? Theme.warning : Theme.surfaceText
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+
+                        StyledText {
+                            text: root.rebootText
+                            font.pixelSize: Theme.fontSizeMedium
+                            color: rebootArea.containsMouse ? Theme.warning : Theme.surfaceText
+                            font.weight: Font.Medium
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+                    }
+
+                    MouseArea {
+                        id: rebootArea
+
+                        anchors.fill: parent
+                        hoverEnabled: true
+                        cursorShape: Qt.PointingHandCursor
+                        onClicked: {
+                            powerMenuVisible = false
+                            root.powerActionRequested(
+                                        "reboot", "Reboot",
+                                        "Are you sure you want to reboot the system?")
+                        }
+                    }
+                }
+
+                Rectangle {
+                    width: parent.width
+                    height: 50
+                    radius: Theme.cornerRadius
+                    color: powerOffArea.containsMouse ? Qt.rgba(Theme.error.r,
+                                                                Theme.error.g,
+                                                                Theme.error.b,
+                                                                0.08) : Qt.rgba(
+                                                            Theme.surfaceVariant.r,
+                                                            Theme.surfaceVariant.g,
+                                                            Theme.surfaceVariant.b,
+                                                            0.08)
+
+                    Row {
+                        anchors.left: parent.left
+                        anchors.leftMargin: Theme.spacingM
+                        anchors.verticalCenter: parent.verticalCenter
+                        spacing: Theme.spacingM
+
+                        DankIcon {
+                            name: "power_settings_new"
+                            size: Theme.iconSize
+                            color: powerOffArea.containsMouse ? Theme.error : Theme.surfaceText
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+
+                        StyledText {
+                            text: root.powerOffText
+                            font.pixelSize: Theme.fontSizeMedium
+                            color: powerOffArea.containsMouse ? Theme.error : Theme.surfaceText
+                            font.weight: Font.Medium
+                            anchors.verticalCenter: parent.verticalCenter
+                        }
+                    }
+
+                    MouseArea {
+                        id: powerOffArea
+
+                        anchors.fill: parent
+                        hoverEnabled: true
+                        cursorShape: Qt.PointingHandCursor
+                        onClicked: {
+                            powerMenuVisible = false
+                            root.powerActionRequested(
+                                        "poweroff", "Power Off",
+                                        "Are you sure you want to power off the system?")
+                        }
+                    }
+                }
+            }
+        }
+
+        Behavior on opacity {
+            NumberAnimation {
+                duration: Theme.mediumDuration
+                easing.type: Theme.emphasizedEasing
+            }
+        }
+
+        Behavior on scale {
+            NumberAnimation {
+                duration: Theme.mediumDuration
+                easing.type: Theme.emphasizedEasing
+            }
+        }
+    }
+}

Modules/ControlCenter/Widgets/AudioInputPill.qml

@@ -0,0 +1,63 @@
+import QtQuick
+import QtQuick.Controls
+import Quickshell
+import Quickshell.Services.Pipewire
+import qs.Common
+import qs.Services
+import qs.Widgets
+import qs.Modules.ControlCenter.Widgets
+
+CompoundPill {
+    id: root
+
+    property var defaultSource: AudioService.source
+
+    iconName: {
+        if (!defaultSource) return "mic_off"
+
+        let volume = defaultSource.audio.volume
+        let muted = defaultSource.audio.muted
+
+        if (muted || volume === 0.0) return "mic_off"
+        return "mic"
+    }
+
+    isActive: defaultSource && !defaultSource.audio.muted
+
+    primaryText: {
+        if (!defaultSource) {
+            return "No input device"
+        }
+        return defaultSource.description || "Audio Input"
+    }
+
+    secondaryText: {
+        if (!defaultSource) {
+            return "Select device"
+        }
+        if (defaultSource.audio.muted) {
+            return "Muted"
+        }
+        return Math.round(defaultSource.audio.volume * 100) + "%"
+    }
+
+    onToggled: {
+        if (defaultSource && defaultSource.audio) {
+            defaultSource.audio.muted = !defaultSource.audio.muted
+        }
+    }
+
+    onWheelEvent: function (wheelEvent) {
+        if (!defaultSource || !defaultSource.audio) return
+        let delta = wheelEvent.angleDelta.y
+        let currentVolume = defaultSource.audio.volume * 100
+        let newVolume
+        if (delta > 0)
+            newVolume = Math.min(100, currentVolume + 5)
+        else
+            newVolume = Math.max(0, currentVolume - 5)
+        defaultSource.audio.muted = false
+        defaultSource.audio.volume = newVolume / 100
+        wheelEvent.accepted = true
+    }
+}

Modules/ControlCenter/Widgets/AudioOutputPill.qml

@@ -0,0 +1,66 @@
+import QtQuick
+import QtQuick.Controls
+import Quickshell
+import Quickshell.Services.Pipewire
+import qs.Common
+import qs.Services
+import qs.Widgets
+import qs.Modules.ControlCenter.Widgets
+
+CompoundPill {
+    id: root
+
+    property var defaultSink: AudioService.sink
+
+    iconName: {
+        if (!defaultSink) return "volume_off"
+
+        let volume = defaultSink.audio.volume
+        let muted = defaultSink.audio.muted
+
+        if (muted || volume === 0.0) return "volume_off"
+        if (volume <= 0.33) return "volume_down"
+        if (volume <= 0.66) return "volume_up"
+        return "volume_up"
+    }
+
+    isActive: defaultSink && !defaultSink.audio.muted
+
+    primaryText: {
+        if (!defaultSink) {
+            return "No output device"
+        }
+        return defaultSink.description || "Audio Output"
+    }
+
+    secondaryText: {
+        if (!defaultSink) {
+            return "Select device"
+        }
+        if (defaultSink.audio.muted) {
+            return "Muted"
+        }
+        return Math.round(defaultSink.audio.volume * 100) + "%"
+    }
+
+    onToggled: {
+        if (defaultSink && defaultSink.audio) {
+            defaultSink.audio.muted = !defaultSink.audio.muted
+        }
+    }
+
+    onWheelEvent: function (wheelEvent) {
+        if (!defaultSink || !defaultSink.audio) return
+        let delta = wheelEvent.angleDelta.y
+        let currentVolume = defaultSink.audio.volume * 100
+        let newVolume
+        if (delta > 0)
+            newVolume = Math.min(100, currentVolume + 5)
+        else
+            newVolume = Math.max(0, currentVolume - 5)
+        defaultSink.audio.muted = false
+        defaultSink.audio.volume = newVolume / 100
+        AudioService.volumeChanged()
+        wheelEvent.accepted = true
+    }
+}

Modules/ControlCenter/Widgets/AudioSliderRow.qml

@@ -1,4 +1,7 @@
 import QtQuick
+import QtQuick.Controls
+import Quickshell
+import Quickshell.Services.Pipewire
 import qs.Common
 import qs.Services
 import qs.Widgets
@@ -27,8 +30,9 @@ Row {
             cursorShape: Qt.PointingHandCursor
             onClicked: {
                 if (defaultSink) {
-                    SessionData.suppressOSDTemporarily();
-                    defaultSink.audio.muted = !defaultSink.audio.muted;
+                    AudioService.suppressOSD = true
+                    defaultSink.audio.muted = !defaultSink.audio.muted
+                    AudioService.suppressOSD = false
                 }
             }
         }
@@ -36,19 +40,15 @@ Row {
         DankIcon {
             anchors.centerIn: parent
             name: {
-                if (!defaultSink)
-                    return "volume_off";
+                if (!defaultSink) return "volume_off"
 
-                let volume = defaultSink.audio.volume;
-                let muted = defaultSink.audio.muted;
+                let volume = defaultSink.audio.volume
+                let muted = defaultSink.audio.muted
 
-                if (muted || volume === 0.0)
-                    return "volume_off";
-                if (volume <= 0.33)
-                    return "volume_down";
-                if (volume <= 0.66)
-                    return "volume_up";
-                return "volume_up";
+                if (muted || volume === 0.0) return "volume_off"
+                if (volume <= 0.33) return "volume_down"
+                if (volume <= 0.66) return "volume_up"
+                return "volume_up"
             }
             size: Theme.iconSize
             color: defaultSink && !defaultSink.audio.muted && defaultSink.audio.volume > 0 ? Theme.primary : Theme.surfaceText
@@ -68,17 +68,14 @@ Row {
         unit: "%"
         valueOverride: actualVolumePercent
         thumbOutlineColor: Theme.surfaceContainer
-        trackColor: root.sliderTrackColor.a > 0 ? root.sliderTrackColor : Theme.withAlpha(Theme.surfaceContainerHigh, Theme.popupTransparency)
-
-        onSliderValueChanged: function (newValue) {
+        trackColor: root.sliderTrackColor.a > 0 ? root.sliderTrackColor : Theme.surfaceContainerHigh
+        onSliderValueChanged: function(newValue) {
             if (defaultSink) {
-                SessionData.suppressOSDTemporarily();
-                defaultSink.audio.volume = newValue / 100.0;
+                defaultSink.audio.volume = newValue / 100.0
                 if (newValue > 0 && defaultSink.audio.muted) {
-                    defaultSink.audio.muted = false;
+                    defaultSink.audio.muted = false
                 }
-                AudioService.playVolumeChangeSoundIfEnabled();
             }
         }
     }
-}
+}

Modules/ControlCenter/Widgets/BluetoothPill.qml

@@ -0,0 +1,70 @@
+import QtQuick
+import QtQuick.Controls
+import Quickshell
+import qs.Common
+import qs.Services
+import qs.Widgets
+import qs.Modules.ControlCenter.Widgets
+
+CompoundPill {
+    id: root
+
+    property var primaryDevice: {
+        if (!BluetoothService.adapter || !BluetoothService.adapter.devices) {
+            return null
+        }
+
+        let devices = [...BluetoothService.adapter.devices.values.filter(dev => dev && (dev.paired || dev.trusted))]
+        for (let device of devices) {
+            if (device && device.connected) {
+                return device
+            }
+        }
+        return null
+    }
+
+    iconName: {
+        if (!BluetoothService.available) {
+            return "bluetooth_disabled"
+        }
+        if (!BluetoothService.adapter || !BluetoothService.adapter.enabled) {
+            return "bluetooth_disabled"
+        }
+        return "bluetooth"
+    }
+
+    isActive: !!(BluetoothService.available && BluetoothService.adapter && BluetoothService.adapter.enabled)
+    showExpandArea: BluetoothService.available
+
+    primaryText: {
+        if (!BluetoothService.available) {
+            return "Bluetooth"
+        }
+        if (!BluetoothService.adapter) {
+            return "No adapter"
+        }
+        if (!BluetoothService.adapter.enabled) {
+            return "Disabled"
+        }
+        return "Enabled"
+    }
+
+    secondaryText: {
+        if (!BluetoothService.available) {
+            return "No adapters"
+        }
+        if (!BluetoothService.adapter || !BluetoothService.adapter.enabled) {
+            return "Off"
+        }
+        if (primaryDevice) {
+            return primaryDevice.name || primaryDevice.alias || primaryDevice.deviceName || "Connected Device"
+        }
+        return "No devices"
+    }
+
+    onToggled: {
+        if (BluetoothService.available && BluetoothService.adapter) {
+            BluetoothService.adapter.enabled = !BluetoothService.adapter.enabled
+        }
+    }
+}

Modules/ControlCenter/Widgets/BrightnessSliderRow.qml

@@ -0,0 +1,136 @@
+import QtQuick
+import QtQuick.Controls
+import Quickshell
+import qs.Common
+import qs.Services
+import qs.Widgets
+
+Row {
+    id: root
+
+    property string deviceName: ""
+    property string instanceId: ""
+
+    signal iconClicked()
+
+    height: 40
+    spacing: 0
+
+    property string targetDeviceName: {
+        if (!DisplayService.brightnessAvailable || !DisplayService.devices || DisplayService.devices.length === 0) {
+            return ""
+        }
+
+        if (deviceName && deviceName.length > 0) {
+            const found = DisplayService.devices.find(dev => dev.name === deviceName)
+            return found ? found.name : ""
+        }
+
+        const currentDeviceName = DisplayService.currentDevice
+        if (currentDeviceName) {
+            const found = DisplayService.devices.find(dev => dev.name === currentDeviceName)
+            return found ? found.name : ""
+        }
+
+        return DisplayService.devices.length > 0 ? DisplayService.devices[0].name : ""
+    }
+
+    property var targetDevice: {
+        if (!targetDeviceName || !DisplayService.devices) {
+            return null
+        }
+
+        return DisplayService.devices.find(dev => dev.name === targetDeviceName) || null
+    }
+
+    property real targetBrightness: {
+        if (!targetDeviceName) {
+            return 0
+        }
+
+        return DisplayService.getDeviceBrightness(targetDeviceName)
+    }
+
+    Rectangle {
+        width: Theme.iconSize + Theme.spacingS * 2
+        height: Theme.iconSize + Theme.spacingS * 2
+        anchors.verticalCenter: parent.verticalCenter
+        radius: (Theme.iconSize + Theme.spacingS * 2) / 2
+        color: iconArea.containsMouse
+               ? Qt.rgba(Theme.primary.r, Theme.primary.g, Theme.primary.b, 0.12)
+               : Theme.withAlpha(Theme.primary, 0)
+
+        MouseArea {
+            id: iconArea
+            anchors.fill: parent
+            hoverEnabled: true
+            cursorShape: DisplayService.devices && DisplayService.devices.length > 1 ? Qt.PointingHandCursor : Qt.ArrowCursor
+
+            onClicked: {
+                if (DisplayService.devices && DisplayService.devices.length > 1) {
+                    root.iconClicked()
+                }
+            }
+
+            onEntered: {
+                tooltipLoader.active = true
+                if (tooltipLoader.item) {
+                    const tooltipText = targetDevice ? "bl device: " + targetDevice.name : "Backlight Control"
+                    const p = iconArea.mapToItem(null, iconArea.width / 2, 0)
+                    tooltipLoader.item.show(tooltipText, p.x, p.y - 40, null)
+                }
+            }
+
+            onExited: {
+                if (tooltipLoader.item) {
+                    tooltipLoader.item.hide()
+                }
+                tooltipLoader.active = false
+            }
+
+            DankIcon {
+                anchors.centerIn: parent
+                name: {
+                    if (!DisplayService.brightnessAvailable || !targetDevice) {
+                        return "brightness_low"
+                    }
+
+                    if (targetDevice.class === "backlight" || targetDevice.class === "ddc") {
+                        const brightness = targetBrightness
+                        if (brightness <= 33) return "brightness_low"
+                        if (brightness <= 66) return "brightness_medium"
+                        return "brightness_high"
+                    } else if (targetDevice.name.includes("kbd")) {
+                        return "keyboard"
+                    } else {
+                        return "lightbulb"
+                    }
+                }
+                size: Theme.iconSize
+                color: DisplayService.brightnessAvailable && targetDevice && targetBrightness > 0 ? Theme.primary : Theme.surfaceText
+            }
+        }
+    }
+
+    DankSlider {
+        anchors.verticalCenter: parent.verticalCenter
+        width: parent.width - (Theme.iconSize + Theme.spacingS * 2)
+        enabled: DisplayService.brightnessAvailable && targetDeviceName.length > 0
+        minimum: 1
+        maximum: 100
+        value: targetBrightness
+        onSliderValueChanged: function(newValue) {
+            if (DisplayService.brightnessAvailable && targetDeviceName) {
+                DisplayService.setBrightness(newValue, targetDeviceName)
+            }
+        }
+        thumbOutlineColor: Theme.surfaceContainer
+        trackColor: Theme.surfaceContainerHigh
+    }
+
+    Loader {
+        id: tooltipLoader
+        active: false
+        sourceComponent: DankTooltip {}
+    }
+}